@bspk/ui 1.3.24 → 1.3.26
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/components/AvatarGroup/Overflow.js +2 -2
- package/dist/components/AvatarGroup/Overflow.js.map +1 -1
- package/dist/components/Modal/modal.css +1 -1
- package/dist/components/Modal/modal.css.js +1 -1
- package/dist/components/RadioGroup/RadioGroupExample.js +27 -1
- package/dist/components/RadioGroup/RadioGroupExample.js.map +1 -1
- package/package.json +1 -1
- package/src/components/AvatarGroup/Overflow.tsx +1 -1
- package/src/components/Modal/modal.scss +1 -1
- package/src/components/RadioGroup/RadioGroupExample.tsx +29 -1
|
@@ -27,11 +27,11 @@ export function AvatarGroupOverflow({ items: itemsProp, overflow, size }) {
|
|
|
27
27
|
callback: () => closeMenu(),
|
|
28
28
|
disabled: !open,
|
|
29
29
|
});
|
|
30
|
-
return (_jsxs(_Fragment, { children: [_jsx("button", { "aria-activedescendant": activeElementId || undefined, "aria-controls": open ? menuId : undefined, "aria-expanded": open, "aria-haspopup": "menu", "aria-
|
|
30
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { "aria-activedescendant": activeElementId || undefined, "aria-controls": open ? menuId : undefined, "aria-expanded": open, "aria-haspopup": "menu", "aria-label": `Show ${overflow} more avatar${overflow > 1 ? 's' : ''}`, "data-bspk": "avatar", "data-bspk-owner": "avatar-overflow", "data-size": size, onBlur: () => closeMenu(), onClick: () => setActiveElementId(activeElementId === null ? items[0]?.id : null), onKeyDown: handleKeyDown(arrowKeyCallbacks), ref: elements.setReference, role: "combobox", children: _jsxs("span", { "data-overflow-count": true, children: ["+", overflow] }) }), open && (_jsx(Portal, { children: _jsx(Menu, { id: menuId, innerRef: elements.setFloating, role: "menu", style: {
|
|
31
31
|
...floatingStyles,
|
|
32
32
|
...scrollListItemsStyle(5, items.length),
|
|
33
33
|
'--list-item-height': `var(--spacing-sizing-12)`,
|
|
34
34
|
paddingRight: 'var(--spacing-sizing-04)',
|
|
35
|
-
}, width: "fit-content", children: items.map((item, index) => (_jsx(ListItem, { active: activeElementId === item.id, label: item.name, leading: _jsx(Avatar, { ...item, hideTooltip: true, size: "small" }) }, index))) }) }))] }));
|
|
35
|
+
}, width: "fit-content", children: items.map((item, index) => (_jsx(ListItem, { active: activeElementId === item.id, label: item.name, leading: _jsx(Avatar, { ...item, hideTooltip: true, size: "small" }), role: "menuitem" }, index))) }) }))] }));
|
|
36
36
|
}
|
|
37
37
|
//# sourceMappingURL=Overflow.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Overflow.js","sourceRoot":"","sources":["../../../src/components/AvatarGroup/Overflow.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAA4B,MAAM,qBAAqB,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAWxC,MAAM,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAA4B;IAC9F,MAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,EAAE,SAAS,CAAC,CAAC;IACnD,MAAM,MAAM,GAAG,wBAAwB,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC;IAEtD,MAAM,EAAE,eAAe,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,GAAG,kBAAkB,CAAC;QAClF,GAAG,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAC9B,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,IAAI,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC;IAEtC,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,WAAW,CAAC;QAC7C,IAAI,EAAE,CAAC,IAAI;QACX,aAAa,EAAE,CAAC;QAChB,QAAQ,EAAE,KAAK;KAClB,CAAC,CAAC;IAEH,eAAe,CAAC;QACZ,QAAQ,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,SAAS,CAAC;QACjD,QAAQ,EAAE,GAAG,EAAE,CAAC,SAAS,EAAE;QAC3B,QAAQ,EAAE,CAAC,IAAI;KAClB,CAAC,CAAC;IAEH,OAAO,CACH,8BACI,0CAC2B,eAAe,IAAI,SAAS,mBACpC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,mBACzB,IAAI,mBACL,MAAM,
|
|
1
|
+
{"version":3,"file":"Overflow.js","sourceRoot":"","sources":["../../../src/components/AvatarGroup/Overflow.tsx"],"names":[],"mappings":"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"}
|
|
@@ -21,7 +21,7 @@ style.appendChild(document.createTextNode(`[data-bspk=modal] {
|
|
|
21
21
|
gap: var(--spacing-sizing-04);
|
|
22
22
|
}
|
|
23
23
|
[data-bspk=modal] > [data-modal-header] [data-modal-title] {
|
|
24
|
-
font: var(--heading-
|
|
24
|
+
font: var(--heading-h5);
|
|
25
25
|
flex: 1;
|
|
26
26
|
}
|
|
27
27
|
[data-bspk=modal] [data-modal-main] {
|
|
@@ -45,13 +45,39 @@ export const presets = [
|
|
|
45
45
|
disabled: false,
|
|
46
46
|
options: [
|
|
47
47
|
{ label: 'This is a very long label for option 1 that never seems to end', value: 'option1' },
|
|
48
|
-
{ label: 'This is a very long label for option 2 that never seems to end', value: 'option2' },
|
|
48
|
+
{ label: 'This is a very long label for option 2 that never seems to end.', value: 'option2' },
|
|
49
49
|
{ label: 'This is a very long label for option 3', value: 'option3' },
|
|
50
50
|
],
|
|
51
51
|
['aria-label']: 'Radio group',
|
|
52
52
|
name: 'Radio group',
|
|
53
53
|
},
|
|
54
54
|
},
|
|
55
|
+
{
|
|
56
|
+
label: 'Long labels + long descriptions',
|
|
57
|
+
propState: {
|
|
58
|
+
value: 'option2',
|
|
59
|
+
disabled: false,
|
|
60
|
+
options: [
|
|
61
|
+
{
|
|
62
|
+
label: 'This is a very long label for option 1 that never seems to end',
|
|
63
|
+
description: 'This is a very long label for option 1 that never seems to end.',
|
|
64
|
+
value: 'option1',
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
label: 'This is a very long label for option 2 that never seems to end',
|
|
68
|
+
description: 'This is a very long label for option 1 that never seems to end. This is a very long label for option 2 that never seems to end. This is a very long label for option 2 that never seems to end',
|
|
69
|
+
value: 'option2',
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
label: 'This is a very long label for option 3',
|
|
73
|
+
description: 'This is a very long label for option 1 that never seems to end. This is a very long label for option 2 that never seems to end. This is a very long label for option 2 that never seems to end',
|
|
74
|
+
value: 'option3',
|
|
75
|
+
},
|
|
76
|
+
],
|
|
77
|
+
['aria-label']: 'Radio group',
|
|
78
|
+
name: 'Radio group',
|
|
79
|
+
},
|
|
80
|
+
},
|
|
55
81
|
];
|
|
56
82
|
export const RadioGroupExample = {
|
|
57
83
|
presets,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroupExample.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupExample.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,OAAO,GAA8B;IAC9C;QACI,KAAK,EAAE,mBAAmB;QAC1B,SAAS,EAAE;YACP,KAAK,EAAE,SAAS;YAChB,QAAQ,EAAE,KAAK;YACf,OAAO,EAAE;gBACL,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;gBAChF;oBACI,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,SAAS;oBAChB,WAAW,EAAE,qCAAqC;oBAClD,QAAQ,EAAE,IAAI;iBACjB;gBACD,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;aACnF;YACD,CAAC,YAAY,CAAC,EAAE,aAAa;YAC7B,IAAI,EAAE,aAAa;SACtB;KACJ;IACD;QACI,KAAK,EAAE,gBAAgB;QACvB,SAAS,EAAE;YACP,KAAK,EAAE,SAAS;YAChB,QAAQ,EAAE,IAAI;YACd,OAAO,EAAE;gBACL,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;gBAChF;oBACI,KAAK,EAAE,UAAU;oBACjB,KAAK,EAAE,SAAS;oBAChB,WAAW,EAAE,qCAAqC;iBACrD;gBACD,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;aACnF;YACD,CAAC,YAAY,CAAC,EAAE,aAAa;YAC7B,IAAI,EAAE,aAAa;SACtB;KACJ;IACD;QACI,KAAK,EAAE,aAAa;QACpB,SAAS,EAAE;YACP,KAAK,EAAE,SAAS;YAChB,QAAQ,EAAE,KAAK;YACf,OAAO,EAAE;gBACL,EAAE,KAAK,EAAE,gEAAgE,EAAE,KAAK,EAAE,SAAS,EAAE;gBAC7F,EAAE,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"RadioGroupExample.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupExample.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -48,7 +48,6 @@ export function AvatarGroupOverflow({ items: itemsProp, overflow, size }: Avatar
|
|
|
48
48
|
aria-controls={open ? menuId : undefined}
|
|
49
49
|
aria-expanded={open}
|
|
50
50
|
aria-haspopup="menu"
|
|
51
|
-
aria-hidden
|
|
52
51
|
aria-label={`Show ${overflow} more avatar${overflow > 1 ? 's' : ''}`}
|
|
53
52
|
data-bspk="avatar"
|
|
54
53
|
data-bspk-owner="avatar-overflow"
|
|
@@ -81,6 +80,7 @@ export function AvatarGroupOverflow({ items: itemsProp, overflow, size }: Avatar
|
|
|
81
80
|
key={index}
|
|
82
81
|
label={item.name}
|
|
83
82
|
leading={<Avatar {...item} hideTooltip size="small" />}
|
|
83
|
+
role="menuitem"
|
|
84
84
|
/>
|
|
85
85
|
))}
|
|
86
86
|
</Menu>
|
|
@@ -47,13 +47,41 @@ export const presets: Preset<RadioGroupProps>[] = [
|
|
|
47
47
|
disabled: false,
|
|
48
48
|
options: [
|
|
49
49
|
{ label: 'This is a very long label for option 1 that never seems to end', value: 'option1' },
|
|
50
|
-
{ label: 'This is a very long label for option 2 that never seems to end', value: 'option2' },
|
|
50
|
+
{ label: 'This is a very long label for option 2 that never seems to end.', value: 'option2' },
|
|
51
51
|
{ label: 'This is a very long label for option 3', value: 'option3' },
|
|
52
52
|
],
|
|
53
53
|
['aria-label']: 'Radio group',
|
|
54
54
|
name: 'Radio group',
|
|
55
55
|
},
|
|
56
56
|
},
|
|
57
|
+
{
|
|
58
|
+
label: 'Long labels + long descriptions',
|
|
59
|
+
propState: {
|
|
60
|
+
value: 'option2',
|
|
61
|
+
disabled: false,
|
|
62
|
+
options: [
|
|
63
|
+
{
|
|
64
|
+
label: 'This is a very long label for option 1 that never seems to end',
|
|
65
|
+
description: 'This is a very long label for option 1 that never seems to end.',
|
|
66
|
+
value: 'option1',
|
|
67
|
+
},
|
|
68
|
+
{
|
|
69
|
+
label: 'This is a very long label for option 2 that never seems to end',
|
|
70
|
+
description:
|
|
71
|
+
'This is a very long label for option 1 that never seems to end. This is a very long label for option 2 that never seems to end. This is a very long label for option 2 that never seems to end',
|
|
72
|
+
value: 'option2',
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
label: 'This is a very long label for option 3',
|
|
76
|
+
description:
|
|
77
|
+
'This is a very long label for option 1 that never seems to end. This is a very long label for option 2 that never seems to end. This is a very long label for option 2 that never seems to end',
|
|
78
|
+
value: 'option3',
|
|
79
|
+
},
|
|
80
|
+
],
|
|
81
|
+
['aria-label']: 'Radio group',
|
|
82
|
+
name: 'Radio group',
|
|
83
|
+
},
|
|
84
|
+
},
|
|
57
85
|
];
|
|
58
86
|
|
|
59
87
|
export const RadioGroupExample: ComponentExample<RadioGroupProps> = {
|