@gnireeg/accordion 0.1.8 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -9
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/jsx.d.ts +23 -0
- package/dist/types.d.ts +116 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +5 -0
- package/dist/types.js.map +1 -0
- package/package.json +6 -3
- package/dist/global.d.ts +0 -42
package/README.md
CHANGED
|
@@ -29,17 +29,40 @@ npm install @gnireeg/accordion
|
|
|
29
29
|
</script>
|
|
30
30
|
|
|
31
31
|
<accordion-item>
|
|
32
|
-
<button slot="trigger">Click to expand</button>
|
|
32
|
+
<button slot="trigger-container">Click to expand</button>
|
|
33
33
|
<div>Your content here</div>
|
|
34
34
|
</accordion-item>
|
|
35
35
|
|
|
36
36
|
<!-- Start expanded -->
|
|
37
37
|
<accordion-item open>
|
|
38
|
-
<button slot="trigger">Already open</button>
|
|
38
|
+
<button slot="trigger-container">Already open</button>
|
|
39
39
|
<div>This content is visible by default</div>
|
|
40
40
|
</accordion-item>
|
|
41
41
|
```
|
|
42
42
|
|
|
43
|
+
### Selective Trigger (Advanced)
|
|
44
|
+
|
|
45
|
+
Use the `accordion-trigger` attribute to specify which element should toggle the accordion. This allows you to place additional interactive elements alongside the trigger:
|
|
46
|
+
|
|
47
|
+
```html
|
|
48
|
+
<accordion-item>
|
|
49
|
+
<div slot="trigger-container" class="flex gap-2">
|
|
50
|
+
<!-- Only this button toggles the accordion -->
|
|
51
|
+
<button accordion-trigger class="flex-1">
|
|
52
|
+
Expand details
|
|
53
|
+
</button>
|
|
54
|
+
|
|
55
|
+
<!-- These buttons won't toggle the accordion -->
|
|
56
|
+
<button onclick="edit()">Edit</button>
|
|
57
|
+
<button onclick="delete()">Delete</button>
|
|
58
|
+
</div>
|
|
59
|
+
|
|
60
|
+
<div>Your content here</div>
|
|
61
|
+
</accordion-item>
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
> **Note:** If no element with the `accordion-trigger` attribute is found, the entire trigger container will toggle the accordion (backward compatible behavior).
|
|
65
|
+
|
|
43
66
|
### Accordion Group (Mutual Exclusion)
|
|
44
67
|
|
|
45
68
|
Wrap multiple accordion items in an `accordion-group` to ensure only one can be open at a time:
|
|
@@ -47,17 +70,17 @@ Wrap multiple accordion items in an `accordion-group` to ensure only one can be
|
|
|
47
70
|
```html
|
|
48
71
|
<accordion-group>
|
|
49
72
|
<accordion-item open>
|
|
50
|
-
<button slot="trigger">First Item</button>
|
|
73
|
+
<button slot="trigger-container">First Item</button>
|
|
51
74
|
<div>Only one item can be open at a time</div>
|
|
52
75
|
</accordion-item>
|
|
53
76
|
|
|
54
77
|
<accordion-item>
|
|
55
|
-
<button slot="trigger">Second Item</button>
|
|
78
|
+
<button slot="trigger-container">Second Item</button>
|
|
56
79
|
<div>Opening this will close the first</div>
|
|
57
80
|
</accordion-item>
|
|
58
81
|
|
|
59
82
|
<accordion-item>
|
|
60
|
-
<button slot="trigger">Third Item</button>
|
|
83
|
+
<button slot="trigger-container">Third Item</button>
|
|
61
84
|
<div>Same behavior here</div>
|
|
62
85
|
</accordion-item>
|
|
63
86
|
</accordion-group>
|
|
@@ -67,7 +90,7 @@ Wrap multiple accordion items in an `accordion-group` to ensure only one can be
|
|
|
67
90
|
|
|
68
91
|
```html
|
|
69
92
|
<accordion-item animation-time="500" animation-easing="ease-in-out">
|
|
70
|
-
<button slot="trigger">Slow animation</button>
|
|
93
|
+
<button slot="trigger-container">Slow animation</button>
|
|
71
94
|
<div>This opens and closes slower</div>
|
|
72
95
|
</accordion-item>
|
|
73
96
|
```
|
|
@@ -112,7 +135,7 @@ accordion.addEventListener('accordion-closed', (e) => {
|
|
|
112
135
|
|
|
113
136
|
| Slot | Description |
|
|
114
137
|
|------|-------------|
|
|
115
|
-
| `trigger` |
|
|
138
|
+
| `trigger-container` | Container for the trigger element(s). Use `accordion-trigger` attribute to specify which element toggles the accordion |
|
|
116
139
|
| (default) | The accordion content |
|
|
117
140
|
|
|
118
141
|
#### Methods
|
|
@@ -146,12 +169,12 @@ Use the `[open]` attribute selector to style accordion items when expanded:
|
|
|
146
169
|
|
|
147
170
|
```css
|
|
148
171
|
/* Rotate chevron icon when accordion is open */
|
|
149
|
-
accordion-item[open] [slot="trigger"] svg {
|
|
172
|
+
accordion-item[open] [slot="trigger-container"] svg {
|
|
150
173
|
transform: rotate(180deg);
|
|
151
174
|
}
|
|
152
175
|
|
|
153
176
|
/* Change background color when open */
|
|
154
|
-
accordion-item[open] [slot="trigger"] {
|
|
177
|
+
accordion-item[open] [slot="trigger-container"] {
|
|
155
178
|
background-color: #f1f5f9;
|
|
156
179
|
}
|
|
157
180
|
|
package/dist/index.d.ts
CHANGED
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EACV,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,uBAAuB,EACvB,wBAAwB,GACzB,MAAM,SAAS,CAAC;AAGjB,OAAO,OAAO,CAAC"}
|
package/dist/index.js
CHANGED
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/jsx.d.ts
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* JSX type definitions for accordion web components
|
|
3
|
+
*
|
|
4
|
+
* This file augments the JSX namespace to add type definitions for custom elements.
|
|
5
|
+
* Works with both React and Preact without requiring React-specific types.
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
import type {
|
|
9
|
+
AccordionItemAttributes,
|
|
10
|
+
AccordionGroupAttributes,
|
|
11
|
+
} from './types';
|
|
12
|
+
|
|
13
|
+
declare global {
|
|
14
|
+
namespace JSX {
|
|
15
|
+
interface IntrinsicElements {
|
|
16
|
+
'accordion-item': AccordionItemAttributes;
|
|
17
|
+
'accordion-group': AccordionGroupAttributes;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
// This export is required to make this file a module
|
|
23
|
+
export {};
|
package/dist/types.d.ts
ADDED
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Custom element interfaces for accordion components
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* AccordionItem custom element interface
|
|
7
|
+
*/
|
|
8
|
+
export interface AccordionItemElement extends HTMLElement {
|
|
9
|
+
/**
|
|
10
|
+
* Opens the accordion
|
|
11
|
+
* @fires accordion-opened
|
|
12
|
+
*/
|
|
13
|
+
show(): void;
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Closes the accordion
|
|
17
|
+
* @fires accordion-closed
|
|
18
|
+
*/
|
|
19
|
+
close(): void;
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* Toggles the accordion between open and closed states
|
|
23
|
+
*/
|
|
24
|
+
toggle(): void;
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Current open state of the accordion
|
|
28
|
+
*/
|
|
29
|
+
open: boolean;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* AccordionGroup custom element interface
|
|
34
|
+
*/
|
|
35
|
+
export interface AccordionGroupElement extends HTMLElement {}
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
* Event detail for accordion state change events
|
|
39
|
+
*/
|
|
40
|
+
export interface AccordionEventDetail {
|
|
41
|
+
open: boolean;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* HTML attributes for accordion-item element
|
|
46
|
+
*/
|
|
47
|
+
export interface AccordionItemAttributes {
|
|
48
|
+
/**
|
|
49
|
+
* When present, the accordion starts in an expanded state
|
|
50
|
+
*/
|
|
51
|
+
open?: boolean;
|
|
52
|
+
|
|
53
|
+
/**
|
|
54
|
+
* Animation duration in milliseconds (default: "300")
|
|
55
|
+
*/
|
|
56
|
+
'animation-time'?: string | number;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* CSS easing function (default: "ease")
|
|
60
|
+
*/
|
|
61
|
+
'animation-easing'?: string;
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Applied to child elements inside trigger-container slot to designate which element toggles the accordion
|
|
65
|
+
*/
|
|
66
|
+
'accordion-trigger'?: boolean;
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* Children and standard HTML attributes
|
|
70
|
+
*/
|
|
71
|
+
children?: any;
|
|
72
|
+
slot?: string;
|
|
73
|
+
className?: string;
|
|
74
|
+
class?: string;
|
|
75
|
+
style?: string | Record<string, any>;
|
|
76
|
+
id?: string;
|
|
77
|
+
|
|
78
|
+
/**
|
|
79
|
+
* Event handler for accordion-opened event
|
|
80
|
+
* Fired when the accordion opens
|
|
81
|
+
*/
|
|
82
|
+
onAccordionOpened?: (event: CustomEvent<AccordionEventDetail>) => void;
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* Event handler for accordion-closed event
|
|
86
|
+
* Fired when the accordion closes
|
|
87
|
+
*/
|
|
88
|
+
onAccordionClosed?: (event: CustomEvent<AccordionEventDetail>) => void;
|
|
89
|
+
|
|
90
|
+
/**
|
|
91
|
+
* Legacy event handler naming (lowercase)
|
|
92
|
+
*/
|
|
93
|
+
'onaccordion-opened'?: (event: CustomEvent<AccordionEventDetail>) => void;
|
|
94
|
+
'onaccordion-closed'?: (event: CustomEvent<AccordionEventDetail>) => void;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
/**
|
|
98
|
+
* HTML attributes for accordion-group element
|
|
99
|
+
*/
|
|
100
|
+
export interface AccordionGroupAttributes {
|
|
101
|
+
/**
|
|
102
|
+
* When present, allows multiple accordions to be open simultaneously.
|
|
103
|
+
* By default, opening one accordion closes all others in the group.
|
|
104
|
+
*/
|
|
105
|
+
'allow-multiple-open'?: boolean;
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* Children and standard HTML attributes
|
|
109
|
+
*/
|
|
110
|
+
children?: any;
|
|
111
|
+
slot?: string;
|
|
112
|
+
className?: string;
|
|
113
|
+
class?: string;
|
|
114
|
+
style?: string | Record<string, any>;
|
|
115
|
+
id?: string;
|
|
116
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,WAAW;IACvD;;;OAGG;IACH,IAAI,IAAI,IAAI,CAAC;IAEb;;;OAGG;IACH,KAAK,IAAI,IAAI,CAAC;IAEd;;OAEG;IACH,MAAM,IAAI,IAAI,CAAC;IAEf;;OAEG;IACH,IAAI,EAAE,OAAO,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,qBAAsB,SAAQ,WAAW;CAAG;AAE7D;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEnC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;IAEvE;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;IAEvE;;OAEG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;IAC1E,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,oBAAoB,CAAC,KAAK,IAAI,CAAC;CAC3E;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC;;;OAGG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACrC,EAAE,CAAC,EAAE,MAAM,CAAC;CACb"}
|
package/dist/types.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG"}
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gnireeg/accordion",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.10",
|
|
4
4
|
"description": "Accessible accordion web component with smooth animations, keyboard support, and nested accordion groups",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
8
8
|
"typesVersions": {
|
|
9
9
|
"*": {
|
|
10
|
-
"*": ["dist/
|
|
10
|
+
"*": ["dist/index.d.ts"]
|
|
11
11
|
}
|
|
12
12
|
},
|
|
13
13
|
"exports": {
|
|
@@ -15,6 +15,9 @@
|
|
|
15
15
|
"types": "./dist/index.d.ts",
|
|
16
16
|
"node": "./dist/index.js",
|
|
17
17
|
"default": "./dist/index.js"
|
|
18
|
+
},
|
|
19
|
+
"./jsx": {
|
|
20
|
+
"types": "./dist/jsx.d.ts"
|
|
18
21
|
}
|
|
19
22
|
},
|
|
20
23
|
"files": [
|
|
@@ -38,7 +41,7 @@
|
|
|
38
41
|
"directory": "packages/accordion"
|
|
39
42
|
},
|
|
40
43
|
"scripts": {
|
|
41
|
-
"build": "tsc && node -e \"require('fs').copyFileSync('src/
|
|
44
|
+
"build": "tsc && node -e \"const fs = require('fs'); fs.copyFileSync('src/jsx.d.ts', 'dist/jsx.d.ts'); fs.copyFileSync('src/types.ts', 'dist/types.d.ts');\"",
|
|
42
45
|
"dev": "tsc --watch",
|
|
43
46
|
"prepublishOnly": "npm run build"
|
|
44
47
|
},
|
package/dist/global.d.ts
DELETED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
// Global TypeScript JSX type declarations
|
|
2
|
-
// This file is automatically loaded by TypeScript
|
|
3
|
-
|
|
4
|
-
declare global {
|
|
5
|
-
namespace JSX {
|
|
6
|
-
interface IntrinsicElements {
|
|
7
|
-
'accordion-item': {
|
|
8
|
-
// Custom accordion attributes
|
|
9
|
-
open?: boolean;
|
|
10
|
-
'animation-time'?: string;
|
|
11
|
-
'animation-easing'?: string;
|
|
12
|
-
|
|
13
|
-
// Custom event handlers
|
|
14
|
-
onAccordionOpened?: (event: CustomEvent<{ open: boolean }>) => void;
|
|
15
|
-
onAccordionClosed?: (event: CustomEvent<{ open: boolean }>) => void;
|
|
16
|
-
|
|
17
|
-
// Standard HTML attributes
|
|
18
|
-
class?: string;
|
|
19
|
-
className?: string;
|
|
20
|
-
id?: string;
|
|
21
|
-
style?: string | Record<string, any>;
|
|
22
|
-
children?: any;
|
|
23
|
-
[key: string]: any;
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
'accordion-group': {
|
|
27
|
-
// Custom accordion-group attributes
|
|
28
|
-
'allow-multiple-open'?: boolean;
|
|
29
|
-
|
|
30
|
-
// Standard HTML attributes
|
|
31
|
-
class?: string;
|
|
32
|
-
className?: string;
|
|
33
|
-
id?: string;
|
|
34
|
-
style?: string | Record<string, any>;
|
|
35
|
-
children?: any;
|
|
36
|
-
[key: string]: any;
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
export {};
|