@purpurds/accordion 5.27.3 → 5.27.5
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/dist/LICENSE.txt +3 -3
- package/dist/accordion.cjs.js +5 -5
- package/dist/accordion.cjs.js.map +1 -1
- package/dist/accordion.es.js +152 -136
- package/dist/accordion.es.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +5 -5
- package/src/accordion-item.module.scss +8 -5
- package/src/accordion.stories.tsx +2 -0
- package/src/accordions-item.stories.tsx +1 -0
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._purpur-accordion_u887g_1{container:accordion/inline-size}._purpur-accordion_u887g_1 ._purpur-accordion__title_u887g_4{margin-bottom:var(--purpur-spacing-300);color:var(--purpur-color-text-default)}@container accordion (min-width: 600px){._purpur-accordion_u887g_1 ._purpur-accordion__title_u887g_4{margin-bottom:var(--purpur-spacing-400)}}._purpur-accordion--negative_u887g_13{background-color:var(--purpur-color-purple-900)}._purpur-accordion--negative_u887g_13 ._purpur-accordion__title_u887g_4{color:var(--purpur-color-text-default-negative)}._purpur-accordion-
|
|
1
|
+
._purpur-accordion_u887g_1{container:accordion/inline-size}._purpur-accordion_u887g_1 ._purpur-accordion__title_u887g_4{margin-bottom:var(--purpur-spacing-300);color:var(--purpur-color-text-default)}@container accordion (min-width: 600px){._purpur-accordion_u887g_1 ._purpur-accordion__title_u887g_4{margin-bottom:var(--purpur-spacing-400)}}._purpur-accordion--negative_u887g_13{background-color:var(--purpur-color-purple-900)}._purpur-accordion--negative_u887g_13 ._purpur-accordion__title_u887g_4{color:var(--purpur-color-text-default-negative)}._purpur-accordion-item_cwhbd_1{border-bottom:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak)}._purpur-accordion-item_cwhbd_1:has(button:hover){border-bottom-color:transparent}._purpur-accordion-item_cwhbd_1:nth-of-type(1){border-top:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak)}._purpur-accordion-item__header_cwhbd_10{display:flex}._purpur-accordion-item__trigger_cwhbd_13{border:none;padding:0;width:100%;text-align:left;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;background-color:transparent;transition:background-color var(--purpur-motion-duration-150) ease;display:flex;align-items:center;justify-content:space-between;column-gap:var(--purpur-spacing-100);padding:var(--purpur-spacing-200) var(--purpur-spacing-200) var(--purpur-spacing-200) 0;cursor:pointer;outline:none}@container accordion (min-width: 600px){._purpur-accordion-item__trigger_cwhbd_13{padding:var(--purpur-spacing-300) var(--purpur-spacing-300) var(--purpur-spacing-300) 0}}@container accordion (min-width: 1024px){._purpur-accordion-item__trigger_cwhbd_13{padding:var(--purpur-spacing-400) var(--purpur-spacing-300) var(--purpur-spacing-400) 0}}._purpur-accordion-item__trigger_cwhbd_13[data-state=open]>._purpur-accordion-item__trigger__icon_cwhbd_43{transform:rotate(180deg)}._purpur-accordion-item__trigger_cwhbd_13:hover{background-color:var(--purpur-color-background-interactive-transparent-hover)}._purpur-accordion-item__trigger_cwhbd_13:hover ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item__trigger_cwhbd_13:hover__icon{color:var(--purpur-color-text-interactive-primary-hover)}._purpur-accordion-item__trigger_cwhbd_13:active{background-color:var(--purpur-color-background-interactive-transparent-active)}._purpur-accordion-item__trigger_cwhbd_13:active ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item__trigger_cwhbd_13:active__icon{color:var(--purpur-color-text-interactive-primary-active)}._purpur-accordion-item__trigger_cwhbd_13:focus-visible{outline:none;box-shadow:0 0 0 var(--purpur-border-width-sm) var(--purpur-color-border-interactive-focus);box-sizing:content-box}._purpur-accordion-item__rotate_cwhbd_63>._purpur-accordion-item__icon_cwhbd_63{transform:rotate(180deg)}._purpur-accordion-item__content_cwhbd_66{display:grid;grid-template-rows:1fr;padding:var(--purpur-spacing-200) 0;transition:padding var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out),grid-template-rows var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)}._purpur-accordion-item__content_cwhbd_66[aria-hidden=true]{grid-template-rows:0fr;padding:0;visibility:hidden}._purpur-accordion-item__contentText_cwhbd_77{max-width:calc(var(--purpur-spacing-1200) / .16)}._purpur-accordion-item__contentText_cwhbd_77:not(:has(:focus)){overflow:hidden}._purpur-accordion-item__icon_cwhbd_63{flex-shrink:0;height:var(--purpur-spacing-300);width:var(--purpur-spacing-300);transition:transform var(--purpur-motion-duration-150) ease-in-out}._purpur-accordion-item_cwhbd_1 ._purpur-accordion-item__title_cwhbd_49{max-width:100%}._purpur-accordion-item_cwhbd_1 ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item__icon_cwhbd_63{color:var(--purpur-color-text-interactive-primary)}._purpur-accordion-item__contentText_cwhbd_77 p{color:var(--purpur-color-text-default)}._purpur-accordion-item--negative_cwhbd_98{border-bottom:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak-negative)}._purpur-accordion-item--negative_cwhbd_98:nth-of-type(1){border-top:var(--purpur-border-width-xs) solid var(--purpur-color-border-weak-negative)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__icon_cwhbd_63{color:var(--purpur-color-text-interactive-primary-negative)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:hover{background-color:var(--purpur-color-background-interactive-transparent-negative-hover)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:hover ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:hover ._purpur-accordion-item__icon_cwhbd_63{color:var(--purpur-color-border-interactive-primary-negative-hover)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:active{background-color:var(--purpur-color-background-interactive-transparent-negative-active)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:active ._purpur-accordion-item__title_cwhbd_49,._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__trigger_cwhbd_13:active ._purpur-accordion-item__icon_cwhbd_63{color:var(--purpur-color-border-interactive-primary-negative-active)}._purpur-accordion-item--negative_cwhbd_98 ._purpur-accordion-item__contentText_cwhbd_77 p{color:var(--purpur-color-text-default-negative)}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@purpurds/accordion",
|
|
3
|
-
"version": "5.27.
|
|
3
|
+
"version": "5.27.5",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"main": "./dist/accordion.cjs.js",
|
|
6
6
|
"types": "./dist/accordion.d.ts",
|
|
@@ -15,10 +15,10 @@
|
|
|
15
15
|
"source": "src/accordion.tsx",
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"classnames": "~2.5.0",
|
|
18
|
-
"@purpurds/tokens": "5.27.
|
|
19
|
-
"@purpurds/heading": "5.27.
|
|
20
|
-
"@purpurds/paragraph": "5.27.
|
|
21
|
-
"@purpurds/icon": "5.27.
|
|
18
|
+
"@purpurds/tokens": "5.27.5",
|
|
19
|
+
"@purpurds/heading": "5.27.5",
|
|
20
|
+
"@purpurds/paragraph": "5.27.5",
|
|
21
|
+
"@purpurds/icon": "5.27.5"
|
|
22
22
|
},
|
|
23
23
|
"devDependencies": {
|
|
24
24
|
"@rushstack/eslint-patch": "~1.10.0",
|
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
&:has(button:hover) {
|
|
8
8
|
border-bottom-color: transparent;
|
|
9
9
|
}
|
|
10
|
+
|
|
10
11
|
&:nth-of-type(1) {
|
|
11
12
|
border-top: var(--purpur-border-width-xs) solid var(--purpur-color-border-weak);
|
|
12
13
|
}
|
|
@@ -46,6 +47,7 @@
|
|
|
46
47
|
&[data-state="open"] > &__icon {
|
|
47
48
|
transform: rotate(180deg);
|
|
48
49
|
}
|
|
50
|
+
|
|
49
51
|
&:hover {
|
|
50
52
|
background-color: var(--purpur-color-background-interactive-transparent-hover);
|
|
51
53
|
|
|
@@ -75,13 +77,11 @@
|
|
|
75
77
|
}
|
|
76
78
|
|
|
77
79
|
&__content {
|
|
78
|
-
overflow: hidden;
|
|
79
80
|
display: grid;
|
|
80
81
|
grid-template-rows: 1fr;
|
|
81
82
|
padding: var(--purpur-spacing-200) 0;
|
|
82
|
-
transition: var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out)
|
|
83
|
-
|
|
84
|
-
transition-property: grid-template-rows, padding;
|
|
83
|
+
transition: padding var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out),
|
|
84
|
+
grid-template-rows var(--purpur-motion-duration-200) var(--purpur-motion-easing-ease-in-out);
|
|
85
85
|
|
|
86
86
|
&[aria-hidden="true"] {
|
|
87
87
|
grid-template-rows: 0fr;
|
|
@@ -91,8 +91,11 @@
|
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
&__contentText {
|
|
94
|
-
overflow: hidden;
|
|
95
94
|
max-width: calc(var(--purpur-spacing-1200) / 0.16);
|
|
95
|
+
|
|
96
|
+
&:not(:has(:focus)) {
|
|
97
|
+
overflow: hidden;
|
|
98
|
+
}
|
|
96
99
|
}
|
|
97
100
|
|
|
98
101
|
&__icon {
|