@bspk/ui 1.1.26 → 1.1.28

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 (115) hide show
  1. package/dist/Avatar.d.ts +2 -1
  2. package/dist/Avatar.js.map +1 -1
  3. package/dist/Button.js +1 -1
  4. package/dist/Button.js.map +1 -1
  5. package/dist/FormField.d.ts +2 -2
  6. package/dist/FormField.js +1 -1
  7. package/dist/Popover.d.ts +2 -3
  8. package/dist/Popover.js +3 -4
  9. package/dist/Popover.js.map +1 -1
  10. package/dist/ProgressBar.d.ts +6 -7
  11. package/dist/ProgressBar.js +6 -7
  12. package/dist/ProgressBar.js.map +1 -1
  13. package/dist/ProgressCircle.d.ts +6 -7
  14. package/dist/ProgressCircle.js +6 -7
  15. package/dist/ProgressCircle.js.map +1 -1
  16. package/dist/ProgressionStepper.d.ts +3 -8
  17. package/dist/ProgressionStepper.js +3 -8
  18. package/dist/ProgressionStepper.js.map +1 -1
  19. package/dist/RadioGroup.d.ts +9 -2
  20. package/dist/RadioGroup.js.map +1 -1
  21. package/dist/SearchBar.d.ts +1 -2
  22. package/dist/SearchBar.js +5 -6
  23. package/dist/SearchBar.js.map +1 -1
  24. package/dist/SegmentedControl.d.ts +8 -15
  25. package/dist/SegmentedControl.js +2 -4
  26. package/dist/SegmentedControl.js.map +1 -1
  27. package/dist/{Dropdown.d.ts → Select.d.ts} +15 -15
  28. package/dist/Select.js +67 -0
  29. package/dist/Select.js.map +1 -0
  30. package/dist/{DropdownField.d.ts → SelectField.d.ts} +9 -9
  31. package/dist/SelectField.js +39 -0
  32. package/dist/SelectField.js.map +1 -0
  33. package/dist/StylesProviderAnywhere.js +1 -1
  34. package/dist/StylesProviderBetterHomesGardens.js +1 -1
  35. package/dist/StylesProviderCartus.js +1 -1
  36. package/dist/StylesProviderCentury21.js +1 -1
  37. package/dist/StylesProviderColdwellBanker.js +1 -1
  38. package/dist/StylesProviderCorcoran.js +1 -1
  39. package/dist/StylesProviderDenaliBoss.js +1 -1
  40. package/dist/StylesProviderEra.js +1 -1
  41. package/dist/StylesProviderSothebys.js +1 -1
  42. package/dist/TabGroup.d.ts +5 -6
  43. package/dist/TabGroup.js.map +1 -1
  44. package/dist/Tag.d.ts +1 -2
  45. package/dist/Tag.js +1 -2
  46. package/dist/Tag.js.map +1 -1
  47. package/dist/TextField.d.ts +2 -3
  48. package/dist/TextField.js +2 -4
  49. package/dist/TextField.js.map +1 -1
  50. package/dist/TextInput.d.ts +4 -13
  51. package/dist/TextInput.js +3 -11
  52. package/dist/TextInput.js.map +1 -1
  53. package/dist/Textarea.d.ts +5 -14
  54. package/dist/Textarea.js +6 -16
  55. package/dist/Textarea.js.map +1 -1
  56. package/dist/TextareaField.d.ts +1 -2
  57. package/dist/TextareaField.js +1 -2
  58. package/dist/TextareaField.js.map +1 -1
  59. package/dist/Txt.d.ts +1 -2
  60. package/dist/Txt.js +1 -2
  61. package/dist/Txt.js.map +1 -1
  62. package/dist/base.css +1 -1
  63. package/dist/demo/ExamplePlaceholder.js.map +1 -1
  64. package/dist/demo/examples.js +84 -15
  65. package/dist/demo/examples.js.map +1 -1
  66. package/dist/hooks/useCombobox.d.ts +45 -0
  67. package/dist/hooks/{useFloatingMenu.js → useCombobox.js} +17 -8
  68. package/dist/hooks/useCombobox.js.map +1 -0
  69. package/dist/hooks/useFloating.d.ts +39 -8
  70. package/dist/hooks/useFloating.js +2 -13
  71. package/dist/hooks/useFloating.js.map +1 -1
  72. package/dist/hooks/useKeyboardNavigation.d.ts +1 -1
  73. package/dist/hooks/useKeyboardNavigation.js +1 -1
  74. package/dist/hooks/useOutsideClick.d.ts +2 -2
  75. package/dist/hooks/useOutsideClick.js +2 -2
  76. package/dist/index.d.ts +3 -1
  77. package/dist/index.js +3 -1
  78. package/dist/index.js.map +1 -1
  79. package/dist/select.css +1 -0
  80. package/package.json +3 -2
  81. package/src/Avatar.tsx +2 -1
  82. package/src/Button.tsx +2 -2
  83. package/src/FormField.tsx +2 -2
  84. package/src/Popover.tsx +5 -27
  85. package/src/ProgressBar.tsx +6 -7
  86. package/src/ProgressCircle.tsx +6 -7
  87. package/src/ProgressionStepper.tsx +3 -8
  88. package/src/RadioGroup.tsx +9 -2
  89. package/src/SearchBar.tsx +8 -20
  90. package/src/SegmentedControl.tsx +14 -37
  91. package/src/{Dropdown.tsx → Select.tsx} +30 -32
  92. package/src/{DropdownField.tsx → SelectField.tsx} +15 -15
  93. package/src/TabGroup.tsx +6 -10
  94. package/src/Tag.tsx +1 -2
  95. package/src/TextField.tsx +6 -19
  96. package/src/TextInput.tsx +6 -27
  97. package/src/Textarea.tsx +10 -31
  98. package/src/TextareaField.tsx +3 -8
  99. package/src/Txt.tsx +2 -7
  100. package/src/base.scss +53 -70
  101. package/src/demo/ExamplePlaceholder.tsx +6 -1
  102. package/src/demo/examples.tsx +99 -21
  103. package/src/hooks/{useFloatingMenu.ts → useCombobox.ts} +28 -40
  104. package/src/hooks/useFloating.ts +45 -24
  105. package/src/hooks/useKeyboardNavigation.ts +1 -1
  106. package/src/hooks/useOutsideClick.ts +2 -2
  107. package/src/index.ts +3 -1
  108. package/src/{dropdown.scss → select.scss} +36 -36
  109. package/dist/Dropdown.js +0 -68
  110. package/dist/Dropdown.js.map +0 -1
  111. package/dist/DropdownField.js +0 -39
  112. package/dist/DropdownField.js.map +0 -1
  113. package/dist/dropdown.css +0 -1
  114. package/dist/hooks/useFloatingMenu.d.ts +0 -36
  115. package/dist/hooks/useFloatingMenu.js.map +0 -1
package/dist/Avatar.d.ts CHANGED
@@ -34,12 +34,13 @@ export type AvatarProps = {
34
34
  */
35
35
  initials?: string;
36
36
  /**
37
- * The icon to display in the avatar. This needs to be an icon from the @bspk/icons library.
37
+ * The icon to display in the avatar. This needs to be an icon from the
38
38
  *
39
39
  * @example
40
40
  * <SvgPerson />;
41
41
  *
42
42
  * @type BspkIcon
43
+ * @bspk/icons library.
43
44
  */
44
45
  icon?: ReactNode;
45
46
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAa,OAAO,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,MAAM,OAAO,GAAG;IACZ,IAAI,EAAE,OAAO;IACb,KAAK,EAAE,MAAM;IACb,WAAW,EAAE,IAAI;CACX,CAAC;AAoEX;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,SAAS,MAAM,CAAC,EACZ,QAAQ,EAAE,YAAY,EACtB,KAAK,GAAG,OAAO,CAAC,KAAK,EACrB,IAAI,GAAG,OAAO,CAAC,IAAI,EACnB,IAAI,EACJ,KAAK,EACL,IAAI,EAAE,SAAS,EACf,WAAW,GAAG,OAAO,CAAC,WAAW,GACvB;IACV,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,IAAI,KAAK;YAAE,OAAO,cAAK,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,KAAK,GAAI,CAAC;QAEtD,IAAI,WAAW,CAAC,IAAI,CAAC;YAAE,OAAO,4CAAiB,IAAI,GAAQ,CAAC;QAE5D,IAAI,QAAQ,GAAG,YAAY,CAAC;QAE5B,IAAI,SAAS,IAAI,CAAC,QAAQ;YACtB,QAAQ,GAAG,SAAS;iBACf,KAAK,CAAC,GAAG,CAAC;iBACV,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;iBAC7B,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;iBACX,IAAI,CAAC,EAAE,CAAC;iBACR,WAAW,EAAE,CAAC;QAEvB,IAAI,QAAQ;YAAE,OAAO,gDAAqB,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAQ,CAAC;QAEvE,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE3C,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,MAAM,MAAM,GAAG,CACX,4BAAiB,SAAS,eAAY,QAAQ,gBAAa,KAAK,eAAa,IAAI,YAC5E,QAAQ,GACP,CACT,CAAC;IAEF,OAAO,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,SAAS,YAAG,MAAM,GAAW,CAAC,CAAC,CAAC,MAAM,CAAC;AAChF,CAAC;AAED,MAAM,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,CAAC"}
1
+ {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAa,OAAO,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,MAAM,OAAO,GAAG;IACZ,IAAI,EAAE,OAAO;IACb,KAAK,EAAE,MAAM;IACb,WAAW,EAAE,IAAI;CACX,CAAC;AAqEX;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,SAAS,MAAM,CAAC,EACZ,QAAQ,EAAE,YAAY,EACtB,KAAK,GAAG,OAAO,CAAC,KAAK,EACrB,IAAI,GAAG,OAAO,CAAC,IAAI,EACnB,IAAI,EACJ,KAAK,EACL,IAAI,EAAE,SAAS,EACf,WAAW,GAAG,OAAO,CAAC,WAAW,GACvB;IACV,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,IAAI,KAAK;YAAE,OAAO,cAAK,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,KAAK,GAAI,CAAC;QAEtD,IAAI,WAAW,CAAC,IAAI,CAAC;YAAE,OAAO,4CAAiB,IAAI,GAAQ,CAAC;QAE5D,IAAI,QAAQ,GAAG,YAAY,CAAC;QAE5B,IAAI,SAAS,IAAI,CAAC,QAAQ;YACtB,QAAQ,GAAG,SAAS;iBACf,KAAK,CAAC,GAAG,CAAC;iBACV,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;iBAC7B,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;iBACX,IAAI,CAAC,EAAE,CAAC;iBACR,WAAW,EAAE,CAAC;QAEvB,IAAI,QAAQ;YAAE,OAAO,gDAAqB,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAQ,CAAC;QAEvE,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE3C,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,MAAM,MAAM,GAAG,CACX,4BAAiB,SAAS,eAAY,QAAQ,gBAAa,KAAK,eAAa,IAAI,YAC5E,QAAQ,GACP,CACT,CAAC;IAEF,OAAO,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,SAAS,YAAG,MAAM,GAAW,CAAC,CAAC,CAAC,MAAM,CAAC;AAChF,CAAC;AAED,MAAM,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,CAAC"}
package/dist/Button.js CHANGED
@@ -32,7 +32,7 @@ function Button(props) {
32
32
  showLabel = true, toolTip: toolTipProp, children, ...containerProps } = props;
33
33
  const label = typeof children === 'string' ? children : labelProp || '';
34
34
  // ignore showLabel=false if there is no icon
35
- const hideLabel = (showLabel === false) && icon;
35
+ const hideLabel = showLabel === false && icon;
36
36
  const toolTip = toolTipProp || (hideLabel ? label : undefined);
37
37
  const { logError } = useErrorLogger();
38
38
  logError(!!icon && !isValidIcon(icon), 'Button - The icon prop must be a valid icon element.');
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAA0B,cAAc,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAoEhD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,MAAM,CAAoC,KAAwC;IACvF,MAAM,EACF,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,KAAK,EACb,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,QAAQ,GAAG,KAAK,EAChB,KAAK,EAAE,SAAS,EAChB,IAAI;IACJ,mCAAmC;IACnC,SAAS,GAAE,IAAI,EACf,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,GAAG,cAAc,EACpB,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;IAExE,6CAA6C;IAC7C,MAAM,SAAS,GAAG,CAAC,SAAS,KAAK,KAAK,CAAC,IAAI,IAAI,CAAC;IAChD,MAAM,OAAO,GAAG,WAAW,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC/D,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,sDAAsD,CAAC,CAAC;IAC/F,QAAQ,CAAC,CAAC,KAAK,EAAE,wCAAwC,CAAC,CAAC;IAE3D,MAAM,MAAM,GAAG,CACX,KAAC,EAAE,OACK,cAAc,gBACN,KAAK,eACP,QAAQ,sBACA,WAAW,IAAI,SAAS,eAC/B,IAAI,kBACD,OAAO,gBACT,KAAK,EACjB,QAAQ,EAAE,QAAQ,IAAI,SAAS,YAE9B,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,8BACI,2CAA0B,EACzB,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,mDAAwB,IAAI,GAAQ,EACtE,CAAC,SAAS,IAAI,oDAAyB,KAAK,GAAQ,IACtD,CACN,GACA,CACR,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACV,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,KAAK,YACnC,MAAM,GACD,CACb,CAAC;IACN,CAAC;IAED,OAAO,MAAM,CAAC;AAClB,CAAC;AAED,MAAM,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,CAAC"}
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAA0B,cAAc,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAoEhD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,MAAM,CAAoC,KAAwC;IACvF,MAAM,EACF,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,KAAK,EACb,EAAE,EAAE,EAAE,GAAG,QAAQ,EACjB,QAAQ,GAAG,KAAK,EAChB,KAAK,EAAE,SAAS,EAChB,IAAI;IACJ,mCAAmC;IACnC,SAAS,GAAG,IAAI,EAChB,OAAO,EAAE,WAAW,EACpB,QAAQ,EACR,GAAG,cAAc,EACpB,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC;IAExE,6CAA6C;IAC7C,MAAM,SAAS,GAAG,SAAS,KAAK,KAAK,IAAI,IAAI,CAAC;IAC9C,MAAM,OAAO,GAAG,WAAW,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC/D,MAAM,EAAE,QAAQ,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,sDAAsD,CAAC,CAAC;IAC/F,QAAQ,CAAC,CAAC,KAAK,EAAE,wCAAwC,CAAC,CAAC;IAE3D,MAAM,MAAM,GAAG,CACX,KAAC,EAAE,OACK,cAAc,gBACN,KAAK,eACP,QAAQ,sBACA,WAAW,IAAI,SAAS,eAC/B,IAAI,kBACD,OAAO,gBACT,KAAK,EACjB,QAAQ,EAAE,QAAQ,IAAI,SAAS,YAE9B,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,8BACI,2CAA0B,EACzB,CAAC,CAAC,IAAI,IAAI,cAAc,CAAC,IAAI,CAAC,IAAI,mDAAwB,IAAI,GAAQ,EACtE,CAAC,SAAS,IAAI,oDAAyB,KAAK,GAAQ,IACtD,CACN,GACA,CACR,CAAC;IAEF,IAAI,OAAO,EAAE,CAAC;QACV,OAAO,CACH,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,SAAS,EAAC,KAAK,YACnC,MAAM,GACD,CACb,CAAC;IACN,CAAC;IAED,OAAO,MAAM,CAAC;AAClB,CAAC;AAED,MAAM,CAAC,QAAQ,GAAG,QAAQ,CAAC;AAE3B,OAAO,EAAE,MAAM,EAAE,CAAC"}
@@ -22,7 +22,7 @@ export type FormFieldProps = CommonProps<'required'> & InvalidPropsLibrary & {
22
22
  /** The id of the control. */
23
23
  controlId: string;
24
24
  /**
25
- * The children of the form field. This should be a control such as TextInput, Dropdown, DatePicker, or
25
+ * The children of the form field. This should be a control such as TextInput, Select, DatePicker, or
26
26
  * TimePicker.
27
27
  *
28
28
  * @type (childProps: FieldControlProps) => JSX.Element
@@ -37,7 +37,7 @@ export type FormFieldProps = CommonProps<'required'> & InvalidPropsLibrary & {
37
37
  /**
38
38
  * Wrapper component for form controls.
39
39
  *
40
- * Children may be one of the following: TextInput, Dropdown, DatePicker, or TimePicker.
40
+ * Children may be one of the following: TextInput, Select, DatePicker, or TimePicker.
41
41
  *
42
42
  * @example
43
43
  * import { TextInput } from '@bspk/ui/TextInput';
package/dist/FormField.js CHANGED
@@ -7,7 +7,7 @@ import { Txt } from './Txt';
7
7
  /**
8
8
  * Wrapper component for form controls.
9
9
  *
10
- * Children may be one of the following: TextInput, Dropdown, DatePicker, or TimePicker.
10
+ * Children may be one of the following: TextInput, Select, DatePicker, or TimePicker.
11
11
  *
12
12
  * @example
13
13
  * import { TextInput } from '@bspk/ui/TextInput';
package/dist/Popover.d.ts CHANGED
@@ -32,8 +32,7 @@ export type PopoverProps = CommonProps<'disabled'> & {
32
32
  children: ReactElement;
33
33
  };
34
34
  /**
35
- * Brief message that provide additional guidance and helps users perform an
36
- * action if needed.
35
+ * Brief message that provide additional guidance and helps users perform an action if needed.
37
36
  *
38
37
  * @example
39
38
  * import { useState } from 'react';
@@ -63,7 +62,7 @@ export type PopoverProps = CommonProps<'disabled'> & {
63
62
  *
64
63
  * @name Popover
65
64
  */
66
- declare function Popover({ placement, header, content, callToAction, children, disabled, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
65
+ declare function Popover({ placement, header, content, callToAction, children, disabled }: PopoverProps): import("react/jsx-runtime").JSX.Element;
67
66
  declare namespace Popover {
68
67
  var bspkName: string;
69
68
  }
package/dist/Popover.js CHANGED
@@ -2,15 +2,14 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
2
2
  import { SvgClose } from '@bspk/icons/Close';
3
3
  import { styleAdd } from './utils/styleAdd';
4
4
  styleAdd(`[data-bspk=popover]{position:absolute;z-index:var(--z-index-tooltip-popover);background:var(--surface-neutral-t1-base);box-shadow:var(--drop-shadow-float);padding:var(--spacing-sizing-04);width:300px;border-radius:var(--radius-large);display:flex;flex-direction:column;--arrow-size: var(--spacing-sizing-02);--arrow-offset: calc(var(--arrow-size) * -2);--arrow-background-color: var(--surface-neutral-t1-base)}[data-bspk=popover] header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sizing-02);gap:var(--spacing-sizing-04)}[data-bspk=popover] header button{background:none;border:none;cursor:pointer;padding:0;margin:0 0 0 auto;color:var(--foreground-neutral-on-surface-variant-01);height:var(--spacing-sizing-06);width:var(--spacing-sizing-06)}[data-bspk=popover] header button svg{width:var(--spacing-sizing-06);height:var(--spacing-sizing-06)}[data-bspk=popover] [data-arrow]{z-index:1;position:absolute;width:0;height:0;border-style:solid;border-width:var(--arrow-size) var(--arrow-size) var(--arrow-size) var(--arrow-size);border-color:rgba(0,0,0,0)}[data-bspk=popover][data-placement^=top] [data-arrow]{bottom:var(--arrow-offset);border-top-color:var(--arrow-background-color);filter:drop-shadow(0 2px 1px var(--shadow-10))}[data-bspk=popover][data-placement^=right] [data-arrow]{margin-left:calc(var(--arrow-offset)*2);border-right-color:var(--arrow-background-color);filter:drop-shadow(-2px 0 1px var(--shadow-10))}[data-bspk=popover][data-placement^=bottom] [data-arrow]{top:var(--arrow-offset);border-bottom-color:var(--arrow-background-color);filter:drop-shadow(0 -2px 1px var(--shadow-10))}[data-bspk=popover][data-placement=bottom-start] [data-arrow]{margin-left:var(--arrow-offset)}[data-bspk=popover][data-placement=bottom-end] [data-arrow]{margin-left:calc(var(--arrow-offset)*-1)}[data-bspk=popover][data-placement^=left] [data-arrow]{right:var(--arrow-offset);border-left-color:var(--arrow-background-color);filter:drop-shadow(2px 0 1px var(--shadow-10))}[data-bspk=popover] [data-content]{gap:var(--spacing-sizing-04);display:flex;flex-direction:column}[data-bspk=popover] [data-call-to-action]{margin:0 0 0 auto}`);;
5
- import { cloneElement, useId, useMemo, useRef, useState, } from 'react';
5
+ import { cloneElement, useId, useMemo, useRef, useState } from 'react';
6
6
  import { Button } from './Button';
7
7
  import { Portal } from './Portal';
8
8
  import { Txt } from './Txt';
9
9
  import { useFloating } from './hooks/useFloating';
10
10
  import { useOutsideClick } from './hooks/useOutsideClick';
11
11
  /**
12
- * Brief message that provide additional guidance and helps users perform an
13
- * action if needed.
12
+ * Brief message that provide additional guidance and helps users perform an action if needed.
14
13
  *
15
14
  * @example
16
15
  * import { useState } from 'react';
@@ -40,7 +39,7 @@ import { useOutsideClick } from './hooks/useOutsideClick';
40
39
  *
41
40
  * @name Popover
42
41
  */
43
- function Popover({ placement = 'top', header, content, callToAction, children, disabled = false, }) {
42
+ function Popover({ placement = 'top', header, content, callToAction, children, disabled = false }) {
44
43
  const id = useId();
45
44
  const [show, setShow] = useState(false);
46
45
  const arrowRef = useRef(null);
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../src/Popover.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../src/Popover.tsx"],"names":[],"mappings":"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"}
@@ -32,15 +32,14 @@ export type ProgressBarProps = {
32
32
  * A progress bar is a horizontal visual indicator that let’s the user know the progression of a task or operation
33
33
  * occurring in the background.
34
34
  *
35
- * @name ProgressBar
36
35
  * @example
37
- * import { ProgressBar } from '@bspk/ui/ProgressBar';
36
+ * import { ProgressBar } from '@bspk/ui/ProgressBar';
37
+ *
38
+ * export function Example() {
39
+ * return <ProgressBar label="Example label" completion={50} />;
40
+ * }
38
41
  *
39
- * export function Example() {
40
- * return (
41
- * <ProgressBar label="Example label" completion={50} />
42
- * );
43
- * }
42
+ * @name ProgressBar
44
43
  */
45
44
  declare function ProgressBar({ size, completion, align, label }: ProgressBarProps): import("react/jsx-runtime").JSX.Element;
46
45
  declare namespace ProgressBar {
@@ -6,15 +6,14 @@ import { useId } from 'react';
6
6
  * A progress bar is a horizontal visual indicator that let’s the user know the progression of a task or operation
7
7
  * occurring in the background.
8
8
  *
9
- * @name ProgressBar
10
9
  * @example
11
- * import { ProgressBar } from '@bspk/ui/ProgressBar';
10
+ * import { ProgressBar } from '@bspk/ui/ProgressBar';
11
+ *
12
+ * export function Example() {
13
+ * return <ProgressBar label="Example label" completion={50} />;
14
+ * }
12
15
  *
13
- * export function Example() {
14
- * return (
15
- * <ProgressBar label="Example label" completion={50} />
16
- * );
17
- * }
16
+ * @name ProgressBar
18
17
  */
19
18
  function ProgressBar({ size = 'large', completion = 0, align = 'center', label }) {
20
19
  const id = useId();
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../src/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAiB,KAAK,EAAE,MAAM,OAAO,CAAC;AAgC7C;;;;;;;;;;;;;GAaG;AACH,SAAS,WAAW,CAAC,EAAE,IAAI,GAAG,OAAO,EAAE,UAAU,GAAG,CAAC,EAAE,KAAK,GAAG,QAAQ,EAAE,KAAK,EAAoB;IAC9F,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IAEnB,OAAO,CACH,6BAAiB,KAAK,eAAY,cAAc,eAAY,IAAI,aAC5D,iCACe,UAAU,GAAG,GAAG,gBAChB,sCAAsC,mBAClC,GAAG,mBACH,CAAC,mBACD,UAAU,EACzB,EAAE,EAAE,EAAE,EACN,GAAG,EAAC,KAAK,EACT,KAAK,EAAE,UAAU,aAEhB,UAAU,SACJ,EACX,qDAA0B,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,UAAU,GAAG,EAAmB,GAAI,EACrF,gBAAO,OAAO,EAAE,EAAE,YAAG,KAAK,GAAS,IACjC,CACT,CAAC;AACN,CAAC;AAED,WAAW,CAAC,QAAQ,GAAG,aAAa,CAAC;AAErC,OAAO,EAAE,WAAW,EAAE,CAAC"}
1
+ {"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../src/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAiB,KAAK,EAAE,MAAM,OAAO,CAAC;AAgC7C;;;;;;;;;;;;GAYG;AACH,SAAS,WAAW,CAAC,EAAE,IAAI,GAAG,OAAO,EAAE,UAAU,GAAG,CAAC,EAAE,KAAK,GAAG,QAAQ,EAAE,KAAK,EAAoB;IAC9F,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IAEnB,OAAO,CACH,6BAAiB,KAAK,eAAY,cAAc,eAAY,IAAI,aAC5D,iCACe,UAAU,GAAG,GAAG,gBAChB,sCAAsC,mBAClC,GAAG,mBACH,CAAC,mBACD,UAAU,EACzB,EAAE,EAAE,EAAE,EACN,GAAG,EAAC,KAAK,EACT,KAAK,EAAE,UAAU,aAEhB,UAAU,SACJ,EACX,qDAA0B,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,UAAU,GAAG,EAAmB,GAAI,EACrF,gBAAO,OAAO,EAAE,EAAE,YAAG,KAAK,GAAS,IACjC,CACT,CAAC;AACN,CAAC;AAED,WAAW,CAAC,QAAQ,GAAG,aAAa,CAAC;AAErC,OAAO,EAAE,WAAW,EAAE,CAAC"}
@@ -18,15 +18,14 @@ export type ProgressCircleProps = {
18
18
  /**
19
19
  * Rotating circle or pill that indicates the status or state of completion for a process that’s part of a user flow.
20
20
  *
21
- * @name ProgressCircle
22
21
  * @example
23
- * import { ProgressCircle } from '@bspk/ui/ProgressCircle';
22
+ * import { ProgressCircle } from '@bspk/ui/ProgressCircle';
23
+ *
24
+ * export function Example() {
25
+ * return <ProgressCircle label="Example label" />;
26
+ * }
24
27
  *
25
- * export function Example() {
26
- * return (
27
- * <ProgressCircle label="Example label"/>
28
- * );
29
- * }
28
+ * @name ProgressCircle
30
29
  */
31
30
  declare function ProgressCircle({ label, labelPosition, size }: ProgressCircleProps): import("react/jsx-runtime").JSX.Element;
32
31
  declare namespace ProgressCircle {
@@ -7,15 +7,14 @@ import { Txt } from './Txt';
7
7
  /**
8
8
  * Rotating circle or pill that indicates the status or state of completion for a process that’s part of a user flow.
9
9
  *
10
- * @name ProgressCircle
11
10
  * @example
12
- * import { ProgressCircle } from '@bspk/ui/ProgressCircle';
11
+ * import { ProgressCircle } from '@bspk/ui/ProgressCircle';
12
+ *
13
+ * export function Example() {
14
+ * return <ProgressCircle label="Example label" />;
15
+ * }
13
16
  *
14
- * export function Example() {
15
- * return (
16
- * <ProgressCircle label="Example label"/>
17
- * );
18
- * }
17
+ * @name ProgressCircle
19
18
  */
20
19
  function ProgressCircle({ label, labelPosition, size = 'medium' }) {
21
20
  let variant = 'labels-base';
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressCircle.js","sourceRoot":"","sources":["../src/ProgressCircle.tsx"],"names":[],"mappings":";AAAA,wCAAwC;AAExC,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAoB5B;;;;;;;;;;;;GAYG;AACH,SAAS,cAAc,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,GAAG,QAAQ,EAAuB;IAClF,IAAI,OAAO,GAAe,aAAa,CAAC;IAExC,IAAI,IAAI,KAAK,OAAO;QAAE,OAAO,GAAG,cAAc,CAAC;SAC1C,IAAI,IAAI,KAAK,OAAO;QAAE,OAAO,GAAG,cAAc,CAAC;IAEpD,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IAExB,OAAO,CACH,kCACqB,OAAO,eACd,iBAAiB,yBACN,aAAa,eACvB,IAAI,EACf,IAAI,EAAC,aAAa,aAElB,KAAC,cAAc,CAAC,GAAG,KAAG,EACtB,KAAC,GAAG,IAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,YAC7B,KAAK,IAAI,aAAa,GACrB,IACJ,CACT,CAAC;AACN,CAAC;AAED,cAAc,CAAC,QAAQ,GAAG,gBAAgB,CAAC;AAE3C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,iBAAiB,GAAG,CAAC,KAA+B,EAAE,EAAE;IAC1D,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,EAAE,CAAC;IAC5C,MAAM,KAAK,GAAG,GAAG,CAAC;IAClB,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IAEnB,OAAO,CACH,kBAAS,KAAK,yBAAgB,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE,aAC9E,2BACI,0BAAgB,EAAE,EAAE,GAAG,EAAE,oBAAoB,aACzC,eAAM,MAAM,EAAC,KAAK,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,GAAI,EAC9D,eAAM,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAC,OAAO,GAAG,IACtD,EACjB,0BAAgB,EAAE,EAAE,GAAG,EAAE,mBAAmB,aACxC,eAAM,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,GAAI,EAC7D,eAAM,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAC,OAAO,GAAG,IACtD,IACd,EACP,aAAG,WAAW,EAAE,WAAW,GAAG,CAAC,aAC3B,eACI,CAAC,EAAE,KAAK,WAAW,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,KAAK,GAAG,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,KAAK,EAAE,EAC9H,MAAM,EAAE,QAAQ,EAAE,qBAAqB,GACzC,EACF,eACI,CAAC,EAAE,KAAK,KAAK,GAAG,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,WAAW,IAAI,KAAK,EAAE,EAC9H,MAAM,EAAE,QAAQ,EAAE,oBAAoB,GACxC,EAEF,eACI,CAAC,EAAE,KAAK,WAAW,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,WAAW,IAAI,KAAK,GAAG,CAAC,EAAE,EAChH,MAAM,EAAC,cAAc,EACrB,aAAa,EAAC,OAAO,GACvB,IACF,IACF,CACT,CAAC;AACN,CAAC,CAAC;AAEF,cAAc,CAAC,GAAG,GAAG,iBAAiB,CAAC"}
1
+ {"version":3,"file":"ProgressCircle.js","sourceRoot":"","sources":["../src/ProgressCircle.tsx"],"names":[],"mappings":";AAAA,wCAAwC;AAExC,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAoB5B;;;;;;;;;;;GAWG;AACH,SAAS,cAAc,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,GAAG,QAAQ,EAAuB;IAClF,IAAI,OAAO,GAAe,aAAa,CAAC;IAExC,IAAI,IAAI,KAAK,OAAO;QAAE,OAAO,GAAG,cAAc,CAAC;SAC1C,IAAI,IAAI,KAAK,OAAO;QAAE,OAAO,GAAG,cAAc,CAAC;IAEpD,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IAExB,OAAO,CACH,kCACqB,OAAO,eACd,iBAAiB,yBACN,aAAa,eACvB,IAAI,EACf,IAAI,EAAC,aAAa,aAElB,KAAC,cAAc,CAAC,GAAG,KAAG,EACtB,KAAC,GAAG,IAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,YAC7B,KAAK,IAAI,aAAa,GACrB,IACJ,CACT,CAAC;AACN,CAAC;AAED,cAAc,CAAC,QAAQ,GAAG,gBAAgB,CAAC;AAE3C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,iBAAiB,GAAG,CAAC,KAA+B,EAAE,EAAE;IAC1D,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,EAAE,CAAC;IAC5C,MAAM,KAAK,GAAG,GAAG,CAAC;IAClB,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IAEnB,OAAO,CACH,kBAAS,KAAK,yBAAgB,IAAI,EAAC,MAAM,EAAC,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,EAAE,aAC9E,2BACI,0BAAgB,EAAE,EAAE,GAAG,EAAE,oBAAoB,aACzC,eAAM,MAAM,EAAC,KAAK,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,GAAI,EAC9D,eAAM,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAC,OAAO,GAAG,IACtD,EACjB,0BAAgB,EAAE,EAAE,GAAG,EAAE,mBAAmB,aACxC,eAAM,MAAM,EAAC,IAAI,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,GAAI,EAC7D,eAAM,MAAM,EAAC,MAAM,EAAC,SAAS,EAAC,cAAc,EAAC,WAAW,EAAC,OAAO,GAAG,IACtD,IACd,EACP,aAAG,WAAW,EAAE,WAAW,GAAG,CAAC,aAC3B,eACI,CAAC,EAAE,KAAK,WAAW,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,KAAK,GAAG,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,KAAK,EAAE,EAC9H,MAAM,EAAE,QAAQ,EAAE,qBAAqB,GACzC,EACF,eACI,CAAC,EAAE,KAAK,KAAK,GAAG,CAAC,KAAK,GAAG,WAAW,CAAC,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,WAAW,IAAI,KAAK,EAAE,EAC9H,MAAM,EAAE,QAAQ,EAAE,oBAAoB,GACxC,EAEF,eACI,CAAC,EAAE,KAAK,WAAW,IAAI,KAAK,MAAM,KAAK,GAAG,WAAW,IAAI,KAAK,GAAG,WAAW,UAAU,WAAW,IAAI,KAAK,GAAG,CAAC,EAAE,EAChH,MAAM,EAAC,cAAc,EACrB,aAAa,EAAC,OAAO,GACvB,IACF,IACF,CACT,CAAC;AACN,CAAC,CAAC;AAEF,cAAc,CAAC,GAAG,GAAG,iBAAiB,CAAC"}
@@ -63,19 +63,14 @@ export type ProgressionStepperProps = {
63
63
  /**
64
64
  * A progress stepper is a horizontal visual indicator that let’s the user know the progression of the current process.
65
65
  *
66
- * @name ProgressionStepper
67
66
  * @example
68
67
  * import { ProgressionStepper } from '@bspk/ui/ProgressionStepper';
69
68
  *
70
69
  * export function Example() {
71
- * return (
72
- * <ProgressionStepper steps={[
73
- * { name: 'Step 1' },
74
- * { name: 'Step 2' },
75
- * { name: 'Step 3' },
76
- * ]} />
77
- * );
70
+ * return <ProgressionStepper steps={[{ name: 'Step 1' }, { name: 'Step 2' }, { name: 'Step 3' }]} />;
78
71
  * }
72
+ *
73
+ * @name ProgressionStepper
79
74
  */
80
75
  declare function ProgressionStepper({ steps, currentStep: currentStepProp, variant, ...containerProps }: ElementProps<ProgressionStepperProps, 'div'>): import("react/jsx-runtime").JSX.Element | null;
81
76
  declare namespace ProgressionStepper {
@@ -5,19 +5,14 @@ styleAdd(`[data-bspk=progression-stepper]{width:100%;--circle-width: var(--spaci
5
5
  /**
6
6
  * A progress stepper is a horizontal visual indicator that let’s the user know the progression of the current process.
7
7
  *
8
- * @name ProgressionStepper
9
8
  * @example
10
9
  * import { ProgressionStepper } from '@bspk/ui/ProgressionStepper';
11
10
  *
12
11
  * export function Example() {
13
- * return (
14
- * <ProgressionStepper steps={[
15
- * { name: 'Step 1' },
16
- * { name: 'Step 2' },
17
- * { name: 'Step 3' },
18
- * ]} />
19
- * );
12
+ * return <ProgressionStepper steps={[{ name: 'Step 1' }, { name: 'Step 2' }, { name: 'Step 3' }]} />;
20
13
  * }
14
+ *
15
+ * @name ProgressionStepper
21
16
  */
22
17
  function ProgressionStepper({ steps = [], currentStep: currentStepProp = 0, variant = 'horizontal', ...containerProps }) {
23
18
  const currentStep = Math.max(0, Math.min(currentStepProp, steps.length + 1));
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressionStepper.js","sourceRoot":"","sources":["../src/ProgressionStepper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,4BAA4B,CAAC;AA8DpC;;;;;;;;;;;;;;;;GAgBG;AACH,SAAS,kBAAkB,CAAC,EACxB,KAAK,GAAG,EAAE,EACV,WAAW,EAAE,eAAe,GAAG,CAAC,EAChC,OAAO,GAAG,YAAY,EACtB,GAAG,cAAc,EAC0B;IAC3C,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;IAC7E,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC3B,kBAAS,cAAc,eAAY,qBAAqB,kBAAe,OAAO,aACzE,OAAO,KAAK,QAAQ,IAAI,CACrB,4BACI,6CAAkB,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,WAAW,GAAG,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAQ,EAC9F,gDACK,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAC3B,WAAW,CACd,CAAC,CAAC,CAAC,CACA,uCACU,WAAW,UAAM,KAAK,CAAC,MAAM,IACpC,CACN,GACE,IACH,CACX,EACD,uBACK,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE;oBACxC,MAAM,OAAO,GAAG,KAAK,GAAG,CAAC,CAAC;oBAC1B,IAAI,MAAM,GAA0C,YAAY,CAAC;oBACjE,IAAI,OAAO,GAAG,WAAW;wBAAE,MAAM,GAAG,UAAU,CAAC;yBAC1C,IAAI,OAAO,KAAK,WAAW;wBAAE,MAAM,GAAG,SAAS,CAAC;oBAErD,OAAO,CACH,6BAAiB,MAAM,eAAa,OAAO,aACvC,0EACI,4BAAgB,QAAQ,GAAG,EAC3B,gDACI,yBAAO,OAAO,GAAQ,EACrB,MAAM,KAAK,UAAU,IAAI,KAAC,QAAQ,KAAG,IACnC,EACP,4BAAgB,OAAO,GAAG,IACvB,EACN,OAAO,KAAK,QAAQ,IAAI,CACrB,iDACI,4CAAiB,IAAI,GAAQ,EAC5B,OAAO,IAAI,+CAAoB,OAAO,GAAQ,IAC5C,CACV,KAd6C,QAAQ,KAAK,EAAE,CAe5D,CACR,CAAC;gBACN,CAAC,CAAC,GACD,IACH,CACT,CAAC;AACN,CAAC;AAED,kBAAkB,CAAC,QAAQ,GAAG,oBAAoB,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
1
+ {"version":3,"file":"ProgressionStepper.js","sourceRoot":"","sources":["../src/ProgressionStepper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,4BAA4B,CAAC;AA8DpC;;;;;;;;;;;GAWG;AACH,SAAS,kBAAkB,CAAC,EACxB,KAAK,GAAG,EAAE,EACV,WAAW,EAAE,eAAe,GAAG,CAAC,EAChC,OAAO,GAAG,YAAY,EACtB,GAAG,cAAc,EAC0B;IAC3C,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;IAC7E,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC3B,kBAAS,cAAc,eAAY,qBAAqB,kBAAe,OAAO,aACzE,OAAO,KAAK,QAAQ,IAAI,CACrB,4BACI,6CAAkB,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,WAAW,GAAG,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAQ,EAC9F,gDACK,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAC3B,WAAW,CACd,CAAC,CAAC,CAAC,CACA,uCACU,WAAW,UAAM,KAAK,CAAC,MAAM,IACpC,CACN,GACE,IACH,CACX,EACD,uBACK,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE;oBACxC,MAAM,OAAO,GAAG,KAAK,GAAG,CAAC,CAAC;oBAC1B,IAAI,MAAM,GAA0C,YAAY,CAAC;oBACjE,IAAI,OAAO,GAAG,WAAW;wBAAE,MAAM,GAAG,UAAU,CAAC;yBAC1C,IAAI,OAAO,KAAK,WAAW;wBAAE,MAAM,GAAG,SAAS,CAAC;oBAErD,OAAO,CACH,6BAAiB,MAAM,eAAa,OAAO,aACvC,0EACI,4BAAgB,QAAQ,GAAG,EAC3B,gDACI,yBAAO,OAAO,GAAQ,EACrB,MAAM,KAAK,UAAU,IAAI,KAAC,QAAQ,KAAG,IACnC,EACP,4BAAgB,OAAO,GAAG,IACvB,EACN,OAAO,KAAK,QAAQ,IAAI,CACrB,iDACI,4CAAiB,IAAI,GAAQ,EAC5B,OAAO,IAAI,+CAAoB,OAAO,GAAQ,IAC5C,CACV,KAd6C,QAAQ,KAAK,EAAE,CAe5D,CACR,CAAC;gBACN,CAAC,CAAC,GACD,IACH,CACT,CAAC;AACN,CAAC;AAED,kBAAkB,CAAC,QAAQ,GAAG,oBAAoB,CAAC;AAEnD,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
@@ -26,8 +26,15 @@ export type RadioGroupProps = CommonProps<'name'> & {
26
26
  *
27
27
  * @example
28
28
  * [
29
- * { value: '1', label: 'Option 1' },
30
- * { value: '2', label: 'Option 2', description: 'Description here' },
29
+ * {
30
+ * value: '1',
31
+ * label: 'Option 1',
32
+ * },
33
+ * {
34
+ * value: '2',
35
+ * label: 'Option 2',
36
+ * description: 'Description here',
37
+ * },
31
38
  * { value: '3', label: 'Option 3' },
32
39
  * ];
33
40
  *
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../src/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAE9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAqB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAIjE,OAAO,oBAAoB,CAAC;AAmD5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,SAAS,UAAU,CAAC,EAChB,QAAQ,EACR,OAAO,GAAG,EAAE,EACZ,IAAI,EACJ,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,UAAU,EACjB,SAAS,GAAG,IAAI,EAChB,GAAG,KAAK,EAC2B;IACnC,MAAM,EAAE,GAAG,eAAe,KAAK,EAAE,EAAE,CAAC;IAEpC,OAAO,CACH,kBACQ,KAAK,gBACG,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,qBAC9B,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,eAC5C,aAAa,EACvB,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,aAEX,SAAS,IAAI,gBAAO,EAAE,EAAE,GAAG,EAAE,QAAQ,YAAG,UAAU,GAAS,EAC5D,cAAK,IAAI,EAAC,YAAY,YACjB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE;oBAClD,OAAO,CACH,KAAC,YAAY,IAAC,WAAW,EAAE,WAAW,EAA0C,KAAK,EAAE,KAAK,YACxF,KAAC,KAAK,kBACU,KAAK,EACjB,OAAO,EAAE,UAAU,KAAK,KAAK,EAC7B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,IAAI,QAAQ,CAAC,KAAK,CAAC,EACjD,KAAK,EAAE,KAAK,GACd,IAPuC,iBAAiB,KAAK,IAAI,KAAK,EAAE,CAQ/D,CAClB,CAAC;gBACN,CAAC,CAAC,GACA,IACJ,CACT,CAAC;AACN,CAAC;AAED,UAAU,CAAC,QAAQ,GAAG,YAAY,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,CAAC"}
1
+ {"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../src/RadioGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAE9B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,OAAO,EAAqB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAIjE,OAAO,oBAAoB,CAAC;AA0D5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,SAAS,UAAU,CAAC,EAChB,QAAQ,EACR,OAAO,GAAG,EAAE,EACZ,IAAI,EACJ,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,UAAU,EACjB,SAAS,GAAG,IAAI,EAChB,GAAG,KAAK,EAC2B;IACnC,MAAM,EAAE,GAAG,eAAe,KAAK,EAAE,EAAE,CAAC;IAEpC,OAAO,CACH,kBACQ,KAAK,gBACG,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,qBAC9B,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,eAC5C,aAAa,EACvB,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,aAEX,SAAS,IAAI,gBAAO,EAAE,EAAE,GAAG,EAAE,QAAQ,YAAG,UAAU,GAAS,EAC5D,cAAK,IAAI,EAAC,YAAY,YACjB,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE;oBAClD,OAAO,CACH,KAAC,YAAY,IAAC,WAAW,EAAE,WAAW,EAA0C,KAAK,EAAE,KAAK,YACxF,KAAC,KAAK,kBACU,KAAK,EACjB,OAAO,EAAE,UAAU,KAAK,KAAK,EAC7B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,IAAI,QAAQ,CAAC,KAAK,CAAC,EACjD,KAAK,EAAE,KAAK,GACd,IAPuC,iBAAiB,KAAK,IAAI,KAAK,EAAE,CAQ/D,CAClB,CAAC;gBACN,CAAC,CAAC,GACA,IACJ,CACT,CAAC;AACN,CAAC;AAED,UAAU,CAAC,QAAQ,GAAG,YAAY,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,CAAC"}
@@ -63,8 +63,7 @@ export type SearchBarProps<T extends MenuItem = MenuItem> = Pick<MenuProps<T>, '
63
63
  * export function Example() {
64
64
  * const [searchText, setSearchText] = useState<string>('');
65
65
  *
66
- * const handleItemSelect = (item) =>
67
- * console.log('Selected item:', item);
66
+ * const handleItemSelect = (item) => console.log('Selected item:', item);
68
67
  *
69
68
  * return (
70
69
  * <SearchBar
package/dist/SearchBar.js CHANGED
@@ -7,7 +7,7 @@ import { Menu } from './Menu';
7
7
  import { Portal } from './Portal';
8
8
  import { TextInput } from './TextInput';
9
9
  import { Txt } from './Txt';
10
- import { useFloatingMenu } from './hooks/useFloatingMenu';
10
+ import { useCombobox } from './hooks/useCombobox';
11
11
  import { useId } from './hooks/useId';
12
12
  /**
13
13
  * Component description coming soon.
@@ -19,8 +19,7 @@ import { useId } from './hooks/useId';
19
19
  * export function Example() {
20
20
  * const [searchText, setSearchText] = useState<string>('');
21
21
  *
22
- * const handleItemSelect = (item) =>
23
- * console.log('Selected item:', item);
22
+ * const handleItemSelect = (item) => console.log('Selected item:', item);
24
23
  *
25
24
  * return (
26
25
  * <SearchBar
@@ -50,16 +49,16 @@ import { useId } from './hooks/useId';
50
49
  */
51
50
  function SearchBar({ itemCount, items, noResultsMessage, placeholder = 'Search', 'aria-label': ariaLabel, id: idProp, inputRef, name, size = 'medium', onSelect, value, onChange, showMenu = true, }) {
52
51
  const id = useId(idProp);
53
- const { triggerProps: { ref: triggerRef, onClick, onKeyDownCapture, ...triggerProps }, menuProps, closeMenu, } = useFloatingMenu({
52
+ const { toggleProps: { ref: triggerRef, onClick, onKeyDownCapture, ...triggerProps }, menuProps, closeMenu, } = useCombobox({
54
53
  placement: 'bottom-start',
55
54
  });
56
55
  const inputRefLocal = useRef(null);
57
56
  return (_jsxs(_Fragment, { children: [_jsx("div", { "data-bspk": "search-bar", children: _jsx(TextInput, { "aria-label": ariaLabel, autoComplete: "off", containerRef: triggerRef, id: id, inputRef: (node) => {
58
57
  inputRef?.(node || null);
59
58
  inputRefLocal.current = node;
60
- }, leading: _jsx(SvgSearch, {}), name: name, onChange: (str) => onChange(str), placeholder: placeholder, size: size, value: value, ...triggerProps, onClick: (event) => {
59
+ }, leading: _jsx(SvgSearch, {}), name: name, onChange: (str) => onChange(str), placeholder: placeholder, size: size, value: value, ...triggerProps, onClick: () => {
61
60
  if (items?.length)
62
- onClick(event);
61
+ onClick();
63
62
  }, onKeyDownCapture: (event) => {
64
63
  const handled = onKeyDownCapture(event);
65
64
  if (handled)
@@ -1 +1 @@
1
- {"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../src/SearchBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAuB,IAAI,EAAE,MAAM,QAAQ,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAkB,SAAS,EAAE,MAAM,aAAa,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAkEtC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,SAAS,SAAS,CAAC,EACf,SAAS,EACT,KAAK,EACL,gBAAgB,EAChB,WAAW,GAAG,QAAQ,EACtB,YAAY,EAAE,SAAS,EACvB,EAAE,EAAE,MAAM,EACV,QAAQ,EACR,IAAI,EACJ,IAAI,GAAG,QAAQ,EACf,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,IAAI,GACF;IACb,MAAM,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IACzB,MAAM,EACF,YAAY,EAAE,EACV,GAAG,EAAE,UAAU,EACf,OAAO,EACP,gBAAgB,EAChB,GAAG,YAAY,EAClB,EACD,SAAS,EACT,SAAS,GACZ,GAAG,eAAe,CAAC;QAChB,SAAS,EAAE,cAAc;KAC5B,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IAEvD,OAAO,CACH,8BACI,2BAAe,YAAY,YACvB,KAAC,SAAS,kBACM,SAAS,EACrB,YAAY,EAAC,KAAK,EAClB,YAAY,EAAE,UAAU,EACxB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;wBACf,QAAQ,EAAE,CAAC,IAAI,IAAI,IAAI,CAAC,CAAC;wBACzB,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;oBACjC,CAAC,EACD,OAAO,EAAE,KAAC,SAAS,KAAG,EACtB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,EAChC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,KACR,YAAY,EAChB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;wBACf,IAAI,KAAK,EAAE,MAAM;4BAAE,OAAO,CAAC,KAAK,CAAC,CAAC;oBACtC,CAAC,EACD,gBAAgB,EAAE,CAAC,KAAK,EAAE,EAAE;wBACxB,MAAM,OAAO,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;wBAExC,IAAI,OAAO;4BAAE,OAAO;wBAEpB,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;oBACnC,CAAC,GACH,GACA,EACL,QAAQ,IAAI,CACT,KAAC,MAAM,cACH,KAAC,IAAI,IACD,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,gBAAgB,EACZ,CAAC,CAAC,KAAK,EAAE,MAAM;wBACf,CAAC,KAAK,EAAE,MAAM,IAAI,CACd,8BACI,KAAC,GAAG,IAAC,EAAE,EAAC,KAAK,EAAC,OAAO,EAAC,YAAY,iCAE5B,EACL,gBAAgB,IAAI,CACjB,KAAC,GAAG,IAAC,EAAE,EAAC,KAAK,EAAC,OAAO,EAAC,WAAW,YAC5B,gBAAgB,GACf,CACT,IACF,CACN,EAEL,QAAQ,EAAE,CAAC,cAAc,EAAE,KAAK,EAAE,EAAE;wBAChC,KAAK,EAAE,cAAc,EAAE,CAAC;wBACxB,MAAM,IAAI,GAAG,KAAK,EAAE,IAAI,CACpB,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,cAAc,CAAC,CAAC,CAAC,CACvC,CAAC;wBACF,QAAQ,EAAE,CAAC,IAAI,CAAC,CAAC;wBACjB,QAAQ,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC;wBAC5B,SAAS,EAAE,CAAC;oBAChB,CAAC,KACG,SAAS,GACf,GACG,CACZ,IACF,CACN,CAAC;AACN,CAAC;AAED,SAAS,CAAC,QAAQ,GAAG,WAAW,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAE,CAAC"}
1
+ {"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../src/SearchBar.tsx"],"names":[],"mappings":"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"}
@@ -2,23 +2,18 @@ import './segmented-control.scss';
2
2
  import { ElementProps } from './';
3
3
  export type SegmentedControlOption = {
4
4
  /**
5
- * The label of the option. This is the text that will be displayed on the
6
- * option.
5
+ * The label of the option. This is the text that will be displayed on the option.
7
6
  *
8
7
  * @required
9
8
  */
10
9
  label: string;
11
10
  /**
12
- * Determines if the element is
13
- * [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled).
11
+ * Determines if the element is [disabled](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled).
14
12
  *
15
13
  * @default false
16
14
  */
17
15
  disabled?: boolean;
18
- /**
19
- * The value of the option. If not provided, the label will be used as the
20
- * value.
21
- */
16
+ /** The value of the option. If not provided, the label will be used as the value. */
22
17
  value?: string;
23
18
  /**
24
19
  * The the icon to display before the label.
@@ -35,8 +30,7 @@ export type SegmentedControlOption = {
35
30
  };
36
31
  export type SegmentedControlProps = {
37
32
  /**
38
- * The options to display. Each option has a label and an optional leading
39
- * icon.
33
+ * The options to display. Each option has a label and an optional leading icon.
40
34
  *
41
35
  * @example
42
36
  * [
@@ -71,16 +65,15 @@ export type SegmentedControlProps = {
71
65
  */
72
66
  size?: 'medium' | 'small';
73
67
  /**
74
- * The width of the options. If set to 'fill', the options will fill the
75
- * width of the container. If set to 'hug', the options will be as wide as
76
- * their content.
68
+ * The width of the options. If set to 'fill', the options will fill the width of the container. If set to 'hug',
69
+ * the options will be as wide as their content.
77
70
  *
78
71
  * @default hug
79
72
  */
80
73
  width?: 'fill' | 'hug';
81
74
  /**
82
- * Determines if the labels of the options should be displayed. If icons are
83
- * not provided for every option this is ignored and labels are shown.
75
+ * Determines if the labels of the options should be displayed. If icons are not provided for every option this is
76
+ * ignored and labels are shown.
84
77
  *
85
78
  * @default true
86
79
  */
@@ -32,12 +32,10 @@ import { useOptionIconsInvalid } from './hooks/useOptionIconsInvalid';
32
32
  function SegmentedControl({ onChange, value, size = 'medium', options: optionsProp, width = 'hug', showLabels: showLabelsProp = true, ...containerProps }) {
33
33
  const options = Array.isArray(optionsProp) ? optionsProp : [];
34
34
  useOptionIconsInvalid(options);
35
- const hideLabels = showLabelsProp === false &&
36
- options.every((item) => item.icon && item.label);
35
+ const hideLabels = showLabelsProp === false && options.every((item) => item.icon && item.label);
37
36
  return (_jsx("div", { ...containerProps, "data-bspk": "segmented-control", "data-size": size, "data-width": width, children: options.map((item, index) => {
38
37
  const isActive = item.value === value;
39
- return (_jsx(Fragment, { children: _jsx(Tooltip, { disabled: !hideLabels, label: item.label, placement: "top", children: _jsx("button", { "aria-label": item.label, "data-first": index === 0 || undefined, "data-last": index === options.length - 1 || undefined, "data-selected": isActive || undefined, disabled: item.disabled || undefined, onClick: () => onChange(item.value || item.label), children: _jsx("span", { "data-outer": true, children: _jsxs("span", { "data-inner": true, children: [(isActive && item.iconActive) ||
40
- item.icon, !hideLabels && item.label] }) }) }) }) }, item.value));
38
+ return (_jsx(Fragment, { children: _jsx(Tooltip, { disabled: !hideLabels, label: item.label, placement: "top", children: _jsx("button", { "aria-label": item.label, "data-first": index === 0 || undefined, "data-last": index === options.length - 1 || undefined, "data-selected": isActive || undefined, disabled: item.disabled || undefined, onClick: () => onChange(item.value || item.label), children: _jsx("span", { "data-outer": true, children: _jsxs("span", { "data-inner": true, children: [(isActive && item.iconActive) || item.icon, !hideLabels && item.label] }) }) }) }) }, item.value));
41
39
  }) }));
42
40
  }
43
41
  SegmentedControl.bspkName = 'SegmentedControl';
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControl.js","sourceRoot":"","sources":["../src/SegmentedControl.tsx"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AA4FtE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,SAAS,gBAAgB,CAAC,EACtB,QAAQ,EACR,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,OAAO,EAAE,WAAW,EACpB,KAAK,GAAG,KAAK,EACb,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,GAAG,cAAc,EACwB;IACzC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9D,qBAAqB,CAAC,OAAO,CAAC,CAAC;IAE/B,MAAM,UAAU,GACZ,cAAc,KAAK,KAAK;QACxB,OAAO,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;IAErD,OAAO,CACH,iBACQ,cAAc,eACR,mBAAmB,eAClB,IAAI,gBACH,KAAK,YAEhB,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACzB,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC;YACtC,OAAO,CACH,KAAC,QAAQ,cACL,KAAC,OAAO,IACJ,QAAQ,EAAE,CAAC,UAAU,EACrB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,SAAS,EAAC,KAAK,YAEf,+BACgB,IAAI,CAAC,KAAK,gBACV,KAAK,KAAK,CAAC,IAAI,SAAS,eAEhC,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,SAAS,mBAE9B,QAAQ,IAAI,SAAS,EACpC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,GAAG,EAAE,CACV,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,YAGtC,6CACI,+CACK,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC;wCAC1B,IAAI,CAAC,IAAI,EACZ,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,IACvB,GACJ,GACF,GACH,IA1BC,IAAI,CAAC,KAAK,CA2Bd,CACd,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC;AAED,gBAAgB,CAAC,QAAQ,GAAG,kBAAkB,CAAC;AAE/C,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
1
+ {"version":3,"file":"SegmentedControl.js","sourceRoot":"","sources":["../src/SegmentedControl.tsx"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAqFtE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,SAAS,gBAAgB,CAAC,EACtB,QAAQ,EACR,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,OAAO,EAAE,WAAW,EACpB,KAAK,GAAG,KAAK,EACb,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,GAAG,cAAc,EACwB;IACzC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9D,qBAAqB,CAAC,OAAO,CAAC,CAAC;IAE/B,MAAM,UAAU,GAAG,cAAc,KAAK,KAAK,IAAI,OAAO,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;IAEhG,OAAO,CACH,iBAAS,cAAc,eAAY,mBAAmB,eAAY,IAAI,gBAAc,KAAK,YACpF,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACzB,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC;YACtC,OAAO,CACH,KAAC,QAAQ,cACL,KAAC,OAAO,IAAC,QAAQ,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAC,KAAK,YAC9D,+BACgB,IAAI,CAAC,KAAK,gBACV,KAAK,KAAK,CAAC,IAAI,SAAS,eACzB,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,SAAS,mBACrC,QAAQ,IAAI,SAAS,EACpC,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,YAEjD,6CACI,+CACK,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC,IAAI,IAAI,CAAC,IAAI,EAC1C,CAAC,UAAU,IAAI,IAAI,CAAC,KAAK,IACvB,GACJ,GACF,GACH,IAjBC,IAAI,CAAC,KAAK,CAkBd,CACd,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC;AAED,gBAAgB,CAAC,QAAQ,GAAG,kBAAkB,CAAC;AAE/C,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
@@ -1,16 +1,16 @@
1
- import './dropdown.scss';
1
+ import './select.scss';
2
2
  import { MenuProps } from './Menu';
3
3
  import { Placement } from './hooks/useFloating';
4
4
  import { CommonProps, InvalidPropsLibrary } from './';
5
- export type DropdownOption = Record<string, unknown> & {
5
+ export type SelectOption = Record<string, unknown> & {
6
6
  /** The value of the option. */
7
7
  value: string;
8
8
  /** The label of the option. This is the text that will be displayed on the option. */
9
9
  label: string;
10
10
  };
11
- export type DropdownProps<T extends DropdownOption = DropdownOption> = CommonProps<'aria-label' | 'disabled' | 'id' | 'name' | 'readOnly' | 'size'> & InvalidPropsLibrary & Pick<MenuProps<T>, 'isMulti' | 'itemCount' | 'renderListItem' | 'selectAll'> & {
11
+ export type SelectProps<T extends SelectOption = SelectOption> = CommonProps<'aria-label' | 'disabled' | 'id' | 'name' | 'readOnly' | 'size'> & InvalidPropsLibrary & Pick<MenuProps<T>, 'isMulti' | 'itemCount' | 'renderListItem' | 'selectAll'> & {
12
12
  /**
13
- * Array of options to display in the dropdown
13
+ * Array of options to display in the select
14
14
  *
15
15
  * @example
16
16
  * [
@@ -26,7 +26,7 @@ export type DropdownProps<T extends DropdownOption = DropdownOption> = CommonPro
26
26
  * { value: '10', label: 'Option 10' },
27
27
  * ];
28
28
  *
29
- * @type Array<DropdownOption>
29
+ * @type Array<SelectOption>
30
30
  * @required
31
31
  */
32
32
  options: T[];
@@ -37,18 +37,18 @@ export type DropdownProps<T extends DropdownOption = DropdownOption> = CommonPro
37
37
  */
38
38
  value?: Array<string>;
39
39
  /**
40
- * Placeholder for the dropdown
40
+ * Placeholder for the select
41
41
  *
42
42
  * @default Select one...
43
43
  */
44
44
  placeholder?: string;
45
45
  /**
46
- * The placement of the dropdown menu. Will be ignored if the menu is too close to the edge of the screen.
46
+ * The placement of the select menu. Will be ignored if the menu is too close to the edge of the screen.
47
47
  *
48
48
  * @default bottom
49
49
  */
50
50
  placement?: Extract<Placement, 'bottom' | 'top'>;
51
- /** The style of the dropdown. */
51
+ /** The style of the select. */
52
52
  style?: React.CSSProperties;
53
53
  /**
54
54
  * The function to call when the selected values change.
@@ -61,15 +61,15 @@ export type DropdownProps<T extends DropdownOption = DropdownOption> = CommonPro
61
61
  * A field element that allows users to select one option from a list of available choices. *
62
62
  *
63
63
  * @example
64
- * import { Dropdown } from '@bspk/ui/Dropdown';
64
+ * import { Select } from '@bspk/ui/Select';
65
65
  *
66
66
  * export function Example() {
67
67
  * const [selected, setSelected] = React.useState<string[]>([]);
68
68
  * return (
69
- * <Dropdown
69
+ * <Select
70
70
  * aria-label="Select an option"
71
71
  * itemCount={5}
72
- * name="example-dropdown"
72
+ * name="example-select"
73
73
  * onChange={setSelected}
74
74
  * options={[
75
75
  * { value: '1', label: 'Option 1' },
@@ -90,11 +90,11 @@ export type DropdownProps<T extends DropdownOption = DropdownOption> = CommonPro
90
90
  * );
91
91
  * }
92
92
  *
93
- * @name Dropdown
93
+ * @name Select
94
94
  */
95
- declare function Dropdown({ options, value: selected, onChange, 'aria-label': ariaLabel, placeholder, size, itemCount, disabled, id: propId, invalid, errorMessage, readOnly, placement, name, isMulti, renderListItem, style: styleProp, selectAll, }: DropdownProps): import("react/jsx-runtime").JSX.Element;
96
- declare namespace Dropdown {
95
+ declare function Select({ options, value: selected, onChange, 'aria-label': ariaLabel, placeholder, size, itemCount, disabled, id: propId, invalid, errorMessage, readOnly, name, isMulti, renderListItem, style: styleProp, selectAll, }: SelectProps): import("react/jsx-runtime").JSX.Element;
96
+ declare namespace Select {
97
97
  var bspkName: string;
98
98
  }
99
- export { Dropdown };
99
+ export { Select };
100
100
  /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */