@bspk/ui 1.3.25 → 1.3.27

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.
Files changed (10) hide show
  1. package/dist/components/ListItem/list-item.css +2 -1
  2. package/dist/components/ListItem/list-item.css.js +2 -1
  3. package/dist/components/Modal/modal.css +1 -1
  4. package/dist/components/Modal/modal.css.js +1 -1
  5. package/dist/components/RadioGroup/RadioGroupExample.js +27 -1
  6. package/dist/components/RadioGroup/RadioGroupExample.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/components/ListItem/list-item.scss +4 -1
  9. package/src/components/Modal/modal.scss +1 -1
  10. package/src/components/RadioGroup/RadioGroupExample.tsx +29 -1
package/dist/components/ListItem/list-item.css CHANGED
@@ -11,6 +11,7 @@
11
11
  padding: var(--spacing-sizing-02);
12
12
  justify-items: stretch;
13
13
  border: unset;
14
+ border-radius: var(--radius-sm);
14
15
  margin: unset;
15
16
  text-decoration: unset;
16
17
  width: 100%;
@@ -62,7 +63,7 @@
62
63
  }
63
64
  [data-bspk=list-item] [data-item-label] [data-text] {
64
65
  width: 100%;
65
- font: var(--labels-base);
66
+ font: var(--labels-small);
66
67
  color: var(--foreground-neutral-on-surface);
67
68
  }
68
69
  [data-bspk=list-item] [data-item-label] [data-sub-text] {
package/dist/components/ListItem/list-item.css.js CHANGED
@@ -14,6 +14,7 @@ style.appendChild(document.createTextNode(`[data-bspk=list-item] {
14
14
  padding: var(--spacing-sizing-02);
15
15
  justify-items: stretch;
16
16
  border: unset;
17
+ border-radius: var(--radius-sm);
17
18
  margin: unset;
18
19
  text-decoration: unset;
19
20
  width: 100%;
@@ -65,7 +66,7 @@ style.appendChild(document.createTextNode(`[data-bspk=list-item] {
65
66
  }
66
67
  [data-bspk=list-item] [data-item-label] [data-text] {
67
68
  width: 100%;
68
- font: var(--labels-base);
69
+ font: var(--labels-small);
69
70
  color: var(--foreground-neutral-on-surface);
70
71
  }
71
72
  [data-bspk=list-item] [data-item-label] [data-sub-text] {
package/dist/components/Modal/modal.css CHANGED
@@ -18,7 +18,7 @@
18
18
  gap: var(--spacing-sizing-04);
19
19
  }
20
20
  [data-bspk=modal] > [data-modal-header] [data-modal-title] {
21
- font: var(--heading-h4);
21
+ font: var(--heading-h5);
22
22
  flex: 1;
23
23
  }
24
24
  [data-bspk=modal] [data-modal-main] {
package/dist/components/Modal/modal.css.js CHANGED
@@ -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-h4);
24
+ font: var(--heading-h5);
25
25
  flex: 1;
26
26
  }
27
27
  [data-bspk=modal] [data-modal-main] {
package/dist/components/RadioGroup/RadioGroupExample.js CHANGED
@@ -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,
package/dist/components/RadioGroup/RadioGroupExample.js.map CHANGED
@@ -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,gEAAgE,EAAE,KAAK,EAAE,SAAS,EAAE;gBAC7F,EAAE,KAAK,EAAE,wCAAwC,EAAE,KAAK,EAAE,SAAS,EAAE;aACxE;YACD,CAAC,YAAY,CAAC,EAAE,aAAa;YAC7B,IAAI,EAAE,aAAa;SACtB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAsC;IAChE,OAAO;IACP,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,MAAM,EAAE,GAAG,YAAY,EAAE,CAAC;QAC1B,OAAO,KAAC,SAAS,OAAK,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,GAAG,EAAE,GAAI,CAAC;IACnE,CAAC;IACD,YAAY,EAAE;QACV,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE;YACL,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;YAChF;gBACI,KAAK,EAAE,UAAU;gBACjB,KAAK,EAAE,SAAS;gBAChB,WAAW,EAAE,qCAAqC;gBAClD,QAAQ,EAAE,IAAI;aACjB;YACD,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,0BAA0B,EAAE;SACnF;KACJ;CACJ,CAAC"}
1
+ {"version":3,"file":"RadioGroupExample.js","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroupExample.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bspk/ui",
3
- "version": "1.3.25",
3
+ "version": "1.3.27",
4
4
  "license": "CC-BY-4.0",
5
5
  "type": "module",
6
6
  "files": [
package/src/components/ListItem/list-item.scss CHANGED
@@ -10,7 +10,10 @@
10
10
  gap: var(--spacing-sizing-03);
11
11
  padding: var(--spacing-sizing-02);
12
12
  justify-items: stretch;
13
+
14
+ // prevent inherited styles from affecting layout when the as prop is leveraged
13
15
  border: unset;
16
+ border-radius: var(--radius-sm);
14
17
  margin: unset;
15
18
  text-decoration: unset;
16
19
  width: 100%;
@@ -79,7 +82,7 @@
79
82
 
80
83
  [data-text] {
81
84
  width: 100%;
82
- font: var(--labels-base);
85
+ font: var(--labels-small);
83
86
  color: var(--foreground-neutral-on-surface);
84
87
  }
85
88
 
package/src/components/Modal/modal.scss CHANGED
@@ -17,7 +17,7 @@
17
17
  gap: var(--spacing-sizing-04);
18
18
 
19
19
  [data-modal-title] {
20
- font: var(--heading-h4);
20
+ font: var(--heading-h5);
21
21
  flex: 1;
22
22
  }
23
23
  }
package/src/components/RadioGroup/RadioGroupExample.tsx CHANGED
@@ -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> = {