Skip to content

Commit 5a9c288

Browse files
authored
Merge pull request #26 from sean-yeoh/dev
Release v0.1.18
2 parents 8a4d357 + 53f64e0 commit 5a9c288

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

60 files changed

+3279
-4225
lines changed

CHANGELOG.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1+
## [Unreleased] - YYYY-MM-DD
2+
### Added
3+
### Changed
4+
### Deprecated
5+
### Removed
6+
### Fixed
7+
### Security
8+
19
## [0.1.17] - 2025-07-08
210

311
### Fixed
Lines changed: 90 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -1,107 +1,97 @@
1-
import { Controller } from "@hotwired/stimulus";
2-
import {
3-
showContent,
4-
hideContent,
5-
getNextEnabledIndex,
6-
getPreviousEnabledIndex,
7-
} from "../utils";
1+
import { Controller } from '@hotwired/stimulus';
2+
import { showContent, hideContent, getNextEnabledIndex, getPreviousEnabledIndex, } from '../utils';
83
const AccordionController = class extends Controller {
9-
// targets
10-
static targets = ["item", "trigger", "content"];
11-
// values
12-
static values = { openItems: Array };
13-
connect() {
14-
this.multiple = this.element.dataset.multiple === "true";
15-
}
16-
contentTargetConnected(content) {
17-
setTimeout(() => {
18-
this.setContentHeight(content);
19-
}, 100);
20-
}
21-
toggle(event) {
22-
const trigger = event.currentTarget;
23-
const item = this.itemTargets.find((item) => {
24-
return item.contains(trigger);
25-
});
26-
if (!item) return;
27-
const value = item.dataset.value;
28-
const isOpen = this.openItemsValue.includes(value);
29-
if (isOpen) {
30-
this.openItemsValue = this.openItemsValue.filter((v) => v !== value);
31-
} else {
32-
if (this.multiple) {
33-
this.openItemsValue = [...this.openItemsValue, value];
34-
} else {
35-
this.openItemsValue = [value];
36-
}
4+
// targets
5+
static targets = ['item', 'trigger', 'content'];
6+
// values
7+
static values = { openItems: Array };
8+
connect() {
9+
this.multiple = this.element.dataset.multiple === 'true';
3710
}
38-
}
39-
focusTrigger(event) {
40-
const trigger = event.currentTarget;
41-
const key = event.key;
42-
const focusableTriggers = this.triggerTargets.filter(
43-
(trigger) => !trigger.disabled,
44-
);
45-
const index = focusableTriggers.indexOf(trigger);
46-
let newIndex = 0;
47-
if (key === "ArrowUp") {
48-
newIndex = getPreviousEnabledIndex({
49-
items: focusableTriggers,
50-
currentIndex: index,
51-
wrapAround: true,
52-
});
53-
} else {
54-
newIndex = getNextEnabledIndex({
55-
items: focusableTriggers,
56-
currentIndex: index,
57-
wrapAround: true,
58-
});
11+
contentTargetConnected(content) {
12+
setTimeout(() => {
13+
this.setContentHeight(content);
14+
}, 100);
5915
}
60-
focusableTriggers[newIndex].focus();
61-
}
62-
openItemsValueChanged(openItems) {
63-
this.itemTargets.forEach((item) => {
64-
const itemValue = item.dataset.value;
65-
const trigger = this.triggerTargets.find((trigger) =>
66-
item.contains(trigger),
67-
);
68-
const content = this.contentTargets.find((content) =>
69-
item.contains(content),
70-
);
71-
if (openItems.includes(itemValue)) {
72-
showContent({
73-
trigger,
74-
content: content,
75-
contentContainer: content,
16+
toggle(event) {
17+
const trigger = event.currentTarget;
18+
const item = this.itemTargets.find((item) => {
19+
return item.contains(trigger);
7620
});
77-
} else {
78-
hideContent({
79-
trigger,
80-
content: content,
81-
contentContainer: content,
21+
if (!item)
22+
return;
23+
const value = item.dataset.value;
24+
const isOpen = this.openItemsValue.includes(value);
25+
if (isOpen) {
26+
this.openItemsValue = this.openItemsValue.filter((v) => v !== value);
27+
}
28+
else {
29+
if (this.multiple) {
30+
this.openItemsValue = [...this.openItemsValue, value];
31+
}
32+
else {
33+
this.openItemsValue = [value];
34+
}
35+
}
36+
}
37+
focusTrigger(event) {
38+
const trigger = event.currentTarget;
39+
const key = event.key;
40+
const focusableTriggers = this.triggerTargets.filter((trigger) => !trigger.disabled);
41+
const index = focusableTriggers.indexOf(trigger);
42+
let newIndex = 0;
43+
if (key === 'ArrowUp') {
44+
newIndex = getPreviousEnabledIndex({
45+
items: focusableTriggers,
46+
currentIndex: index,
47+
wrapAround: true,
48+
});
49+
}
50+
else {
51+
newIndex = getNextEnabledIndex({
52+
items: focusableTriggers,
53+
currentIndex: index,
54+
wrapAround: true,
55+
});
56+
}
57+
focusableTriggers[newIndex].focus();
58+
}
59+
openItemsValueChanged(openItems) {
60+
this.itemTargets.forEach((item) => {
61+
const itemValue = item.dataset.value;
62+
const trigger = this.triggerTargets.find((trigger) => item.contains(trigger));
63+
const content = this.contentTargets.find((content) => item.contains(content));
64+
if (openItems.includes(itemValue)) {
65+
showContent({
66+
trigger,
67+
content: content,
68+
contentContainer: content,
69+
});
70+
}
71+
else {
72+
hideContent({
73+
trigger,
74+
content: content,
75+
contentContainer: content,
76+
});
77+
}
78+
});
79+
}
80+
setContentHeight(element) {
81+
const height = this.getContentHeight(element) || element.getBoundingClientRect().height;
82+
element.style.setProperty('--radix-accordion-content-height', `${height}px`);
83+
}
84+
getContentHeight(el) {
85+
const clone = el.cloneNode(true);
86+
Object.assign(clone.style, {
87+
display: 'block',
88+
position: 'absolute',
89+
visibility: 'hidden',
8290
});
83-
}
84-
});
85-
}
86-
setContentHeight(element) {
87-
const height =
88-
this.getContentHeight(element) || element.getBoundingClientRect().height;
89-
element.style.setProperty(
90-
"--radix-accordion-content-height",
91-
`${height}px`,
92-
);
93-
}
94-
getContentHeight(el) {
95-
const clone = el.cloneNode(true);
96-
Object.assign(clone.style, {
97-
display: "block",
98-
position: "absolute",
99-
visibility: "hidden",
100-
});
101-
document.body.appendChild(clone);
102-
const height = clone.getBoundingClientRect().height;
103-
document.body.removeChild(clone);
104-
return height;
105-
}
91+
document.body.appendChild(clone);
92+
const height = clone.getBoundingClientRect().height;
93+
document.body.removeChild(clone);
94+
return height;
95+
}
10696
};
10797
export { AccordionController };
Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { DialogController } from "./dialog_controller";
1+
import { DialogController } from './dialog_controller';
22
const AlertDialogController = class extends DialogController {
3-
onDOMClick() {
4-
return;
5-
}
3+
onDOMClick() {
4+
return;
5+
}
66
};
77
export { AlertDialogController };
Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import { Controller } from "@hotwired/stimulus";
1+
import { Controller } from '@hotwired/stimulus';
22
const AvatarController = class extends Controller {
3-
// targets
4-
static targets = ["image", "fallback"];
5-
connect() {
6-
this.imageTarget.onerror = () => {
7-
if (this.hasFallbackTarget) {
8-
this.fallbackTarget.classList.remove("hidden");
9-
}
10-
this.imageTarget.classList.add("hidden");
11-
};
12-
}
3+
// targets
4+
static targets = ['image', 'fallback'];
5+
connect() {
6+
this.imageTarget.onerror = () => {
7+
if (this.hasFallbackTarget) {
8+
this.fallbackTarget.classList.remove('hidden');
9+
}
10+
this.imageTarget.classList.add('hidden');
11+
};
12+
}
1313
};
1414
export { AvatarController };
Lines changed: 26 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,30 @@
1-
import { Controller } from "@hotwired/stimulus";
1+
import { Controller } from '@hotwired/stimulus';
22
const CheckboxController = class extends Controller {
3-
// targets
4-
static targets = ["input", "indicator"];
5-
// values
6-
static values = {
7-
isChecked: Boolean,
8-
};
9-
toggle() {
10-
this.isCheckedValue = !this.isCheckedValue;
11-
}
12-
preventDefault(event) {
13-
event.preventDefault();
14-
}
15-
isCheckedValueChanged(isChecked) {
16-
if (isChecked) {
17-
this.element.ariaChecked = "true";
18-
this.element.dataset.state = "checked";
19-
this.inputTarget.checked = true;
20-
this.indicatorTarget.classList.remove("hidden");
21-
} else {
22-
this.element.ariaChecked = "false";
23-
this.element.dataset.state = "unchecked";
24-
this.inputTarget.checked = false;
25-
this.indicatorTarget.classList.add("hidden");
3+
// targets
4+
static targets = ['input', 'indicator'];
5+
// values
6+
static values = {
7+
isChecked: Boolean,
8+
};
9+
toggle() {
10+
this.isCheckedValue = !this.isCheckedValue;
11+
}
12+
preventDefault(event) {
13+
event.preventDefault();
14+
}
15+
isCheckedValueChanged(isChecked) {
16+
if (isChecked) {
17+
this.element.ariaChecked = 'true';
18+
this.element.dataset.state = 'checked';
19+
this.inputTarget.checked = true;
20+
this.indicatorTarget.classList.remove('hidden');
21+
}
22+
else {
23+
this.element.ariaChecked = 'false';
24+
this.element.dataset.state = 'unchecked';
25+
this.inputTarget.checked = false;
26+
this.indicatorTarget.classList.add('hidden');
27+
}
2628
}
27-
}
2829
};
2930
export { CheckboxController };
Lines changed: 36 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,41 @@
1-
import { Controller } from "@hotwired/stimulus";
2-
import { hideContent, showContent } from "../utils";
1+
import { Controller } from '@hotwired/stimulus';
2+
import { hideContent, showContent } from '../utils';
33
const CollapsibleController = class extends Controller {
4-
// targets
5-
static targets = ["trigger", "content"];
6-
// values
7-
static values = {
8-
isOpen: Boolean,
9-
};
10-
toggle() {
11-
if (this.isOpenValue) {
12-
this.close();
13-
} else {
14-
this.open();
4+
// targets
5+
static targets = ['trigger', 'content'];
6+
// values
7+
static values = {
8+
isOpen: Boolean,
9+
};
10+
toggle() {
11+
if (this.isOpenValue) {
12+
this.close();
13+
}
14+
else {
15+
this.open();
16+
}
1517
}
16-
}
17-
open() {
18-
this.isOpenValue = true;
19-
}
20-
close() {
21-
this.isOpenValue = false;
22-
}
23-
isOpenValueChanged(isOpen) {
24-
if (isOpen) {
25-
showContent({
26-
trigger: this.triggerTarget,
27-
content: this.contentTarget,
28-
contentContainer: this.contentTarget,
29-
});
30-
} else {
31-
hideContent({
32-
trigger: this.triggerTarget,
33-
content: this.contentTarget,
34-
contentContainer: this.contentTarget,
35-
});
18+
open() {
19+
this.isOpenValue = true;
20+
}
21+
close() {
22+
this.isOpenValue = false;
23+
}
24+
isOpenValueChanged(isOpen) {
25+
if (isOpen) {
26+
showContent({
27+
trigger: this.triggerTarget,
28+
content: this.contentTarget,
29+
contentContainer: this.contentTarget,
30+
});
31+
}
32+
else {
33+
hideContent({
34+
trigger: this.triggerTarget,
35+
content: this.contentTarget,
36+
contentContainer: this.contentTarget,
37+
});
38+
}
3639
}
37-
}
3840
};
3941
export { CollapsibleController };

0 commit comments

Comments
 (0)