@oneplatformdev/ui 0.1.99-beta.7 → 0.1.99-beta.70

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 (170) hide show
  1. package/Accordion/Accordion.d.ts +1 -1
  2. package/Accordion/Accordion.d.ts.map +1 -1
  3. package/Accordion/Accordion.js +48 -26
  4. package/Accordion/Accordion.js.map +1 -1
  5. package/AlertDialog/AlertDialog.stories.js +3 -2
  6. package/AlertDialog/AlertDialog.stories.js.map +1 -1
  7. package/AlertDialog/AlertDialogRoot.d.ts.map +1 -1
  8. package/AlertDialog/AlertDialogRoot.js +26 -24
  9. package/AlertDialog/AlertDialogRoot.js.map +1 -1
  10. package/Badge/badgeVariants.d.ts +1 -1
  11. package/Button/Button.d.ts +7 -1
  12. package/Button/Button.d.ts.map +1 -1
  13. package/Button/Button.js +49 -51
  14. package/Button/Button.js.map +1 -1
  15. package/Button/Button.types.d.ts +12 -0
  16. package/Button/Button.types.d.ts.map +1 -1
  17. package/Button/Button.utils.d.ts +3 -0
  18. package/Button/Button.utils.d.ts.map +1 -0
  19. package/Button/Button.utils.js +14 -0
  20. package/Button/Button.utils.js.map +1 -0
  21. package/Button/ButtonCounterBadge.d.ts +7 -0
  22. package/Button/ButtonCounterBadge.d.ts.map +1 -0
  23. package/Button/ButtonCounterBadge.js +20 -0
  24. package/Button/ButtonCounterBadge.js.map +1 -0
  25. package/Button/buttonVariants.d.ts +11 -20
  26. package/Button/buttonVariants.d.ts.map +1 -1
  27. package/Button/buttonVariants.js +76 -12
  28. package/Button/buttonVariants.js.map +1 -1
  29. package/Button/index.d.ts +1 -0
  30. package/Button/index.d.ts.map +1 -1
  31. package/Button/index.js +6 -3
  32. package/Button/index.js.map +1 -1
  33. package/ButtonIcon/ButtonIcon.d.ts +6 -1
  34. package/ButtonIcon/ButtonIcon.d.ts.map +1 -1
  35. package/ButtonIcon/ButtonIcon.js +69 -51
  36. package/ButtonIcon/ButtonIcon.js.map +1 -1
  37. package/ButtonIcon/ButtonIcon.stories.js +94 -65
  38. package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
  39. package/ButtonIcon/buttonIconVariants.d.ts +1 -1
  40. package/ButtonIcon/buttonIconVariants.d.ts.map +1 -1
  41. package/ButtonIcon/buttonIconVariants.js +7 -6
  42. package/ButtonIcon/buttonIconVariants.js.map +1 -1
  43. package/CHANGELOG.md +743 -0
  44. package/Calendar/Calendar.js +5 -4
  45. package/Calendar/Calendar.js.map +1 -1
  46. package/Combobox/Combobox.d.ts +1 -1
  47. package/Combobox/Combobox.d.ts.map +1 -1
  48. package/Combobox/Combobox.js +206 -191
  49. package/Combobox/Combobox.js.map +1 -1
  50. package/Combobox/Combobox.stories.js +208 -0
  51. package/Combobox/Combobox.stories.js.map +1 -0
  52. package/Combobox/Combobox.types.d.ts +34 -19
  53. package/Combobox/Combobox.types.d.ts.map +1 -1
  54. package/Combobox/ComboboxOptionItem.d.ts +2 -3
  55. package/Combobox/ComboboxOptionItem.d.ts.map +1 -1
  56. package/Combobox/ComboboxOptionItem.js +44 -21
  57. package/Combobox/ComboboxOptionItem.js.map +1 -1
  58. package/Combobox/ComboboxOptions.d.ts +2 -2
  59. package/Combobox/ComboboxOptions.d.ts.map +1 -1
  60. package/Combobox/ComboboxOptions.js +49 -49
  61. package/Combobox/ComboboxOptions.js.map +1 -1
  62. package/Command/Command.d.ts.map +1 -1
  63. package/Command/Command.js +10 -7
  64. package/Command/Command.js.map +1 -1
  65. package/DataTable/DataTable.js +16 -15
  66. package/DataTable/DataTable.js.map +1 -1
  67. package/Dialog/Dialog.d.ts.map +1 -1
  68. package/Dialog/Dialog.js +35 -24
  69. package/Dialog/Dialog.js.map +1 -1
  70. package/Dialog/Dialog.types.d.ts +4 -0
  71. package/Dialog/Dialog.types.d.ts.map +1 -0
  72. package/Dialog/Dialog.types.js +2 -0
  73. package/Dialog/Dialog.types.js.map +1 -0
  74. package/Dialog/index.d.ts +1 -0
  75. package/Dialog/index.d.ts.map +1 -1
  76. package/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  77. package/DropdownMenu/DropdownMenu.js +33 -20
  78. package/DropdownMenu/DropdownMenu.js.map +1 -1
  79. package/Form/Form.d.ts.map +1 -1
  80. package/Form/Form.js.map +1 -1
  81. package/Form/FormRenderControl.d.ts +1 -1
  82. package/Form/FormRenderControl.d.ts.map +1 -1
  83. package/Form/FormRenderControl.js +54 -14
  84. package/Form/FormRenderControl.js.map +1 -1
  85. package/Form/FormRenderControl.types.d.ts +4 -1
  86. package/Form/FormRenderControl.types.d.ts.map +1 -1
  87. package/FormCombobox/FormCombobox.d.ts.map +1 -1
  88. package/FormCombobox/FormCombobox.js +15 -13
  89. package/FormCombobox/FormCombobox.js.map +1 -1
  90. package/FormDatePicker/FormDatePicker.d.ts.map +1 -1
  91. package/FormDatePicker/FormDatePicker.js +18 -16
  92. package/FormDatePicker/FormDatePicker.js.map +1 -1
  93. package/FormDropzone/FormDropzone.d.ts.map +1 -1
  94. package/FormDropzone/FormDropzone.js +11 -9
  95. package/FormDropzone/FormDropzone.js.map +1 -1
  96. package/FormInput/FormInput.d.ts.map +1 -1
  97. package/FormInput/FormInput.js +27 -25
  98. package/FormInput/FormInput.js.map +1 -1
  99. package/FormSelect/FormSelect.d.ts.map +1 -1
  100. package/FormSelect/FormSelect.js +21 -17
  101. package/FormSelect/FormSelect.js.map +1 -1
  102. package/FormTextarea/FormTextarea.d.ts.map +1 -1
  103. package/FormTextarea/FormTextarea.js +15 -13
  104. package/FormTextarea/FormTextarea.js.map +1 -1
  105. package/InfoBlock/InfoBlock.d.ts +7 -0
  106. package/InfoBlock/InfoBlock.d.ts.map +1 -0
  107. package/InfoBlock/InfoBlock.js +27 -0
  108. package/InfoBlock/InfoBlock.js.map +1 -0
  109. package/InfoBlock/InfoBlock.stories.js +14 -0
  110. package/InfoBlock/InfoBlock.stories.js.map +1 -0
  111. package/InfoBlock/InfoBlock.types.d.ts +8 -0
  112. package/InfoBlock/InfoBlock.types.d.ts.map +1 -0
  113. package/InfoBlock/InfoBlock.types.js +2 -0
  114. package/InfoBlock/InfoBlock.types.js.map +1 -0
  115. package/InfoBlock/index.d.ts +3 -0
  116. package/InfoBlock/index.d.ts.map +1 -0
  117. package/InfoBlock/index.js +5 -0
  118. package/InfoBlock/index.js.map +1 -0
  119. package/InfoBlock/infoBlockVariants.d.ts +6 -0
  120. package/InfoBlock/infoBlockVariants.d.ts.map +1 -0
  121. package/InfoBlock/infoBlockVariants.js +26 -0
  122. package/InfoBlock/infoBlockVariants.js.map +1 -0
  123. package/Input/Input.js +1 -1
  124. package/Input/Input.js.map +1 -1
  125. package/Input/inputVariants.d.ts.map +1 -1
  126. package/Input/inputVariants.js +5 -4
  127. package/Input/inputVariants.js.map +1 -1
  128. package/LoadedIcon/LoadedIcon.d.ts.map +1 -1
  129. package/LoadedIcon/LoadedIcon.js +3 -1
  130. package/LoadedIcon/LoadedIcon.js.map +1 -1
  131. package/LoadingMask/LoadingMask.d.ts +1 -2
  132. package/LoadingMask/LoadingMask.d.ts.map +1 -1
  133. package/LoadingMask/LoadingMask.js +8 -8
  134. package/LoadingMask/LoadingMask.js.map +1 -1
  135. package/LoadingMask/LoadingMask.types.d.ts +1 -0
  136. package/LoadingMask/LoadingMask.types.d.ts.map +1 -1
  137. package/Resizable/Resizable.d.ts +5 -20
  138. package/Resizable/Resizable.d.ts.map +1 -1
  139. package/Resizable/Resizable.js +48 -31
  140. package/Resizable/Resizable.js.map +1 -1
  141. package/Resizable/Resizable.stories.js +140 -0
  142. package/Resizable/Resizable.stories.js.map +1 -0
  143. package/Search/Search.d.ts.map +1 -1
  144. package/Search/Search.js +41 -32
  145. package/Search/Search.js.map +1 -1
  146. package/Search/Search.stories.js +17 -0
  147. package/Search/Search.stories.js.map +1 -0
  148. package/TablePagination/TablePagination.js +9 -8
  149. package/TablePagination/TablePagination.js.map +1 -1
  150. package/Textarea/Textarea.d.ts.map +1 -1
  151. package/Textarea/Textarea.js +48 -43
  152. package/Textarea/Textarea.js.map +1 -1
  153. package/Textarea/Textarea.stories.js +1 -1
  154. package/Textarea/Textarea.stories.js.map +1 -1
  155. package/Textarea/Textarea.types.d.ts +3 -1
  156. package/Textarea/Textarea.types.d.ts.map +1 -1
  157. package/Tooltip/Tooltip.d.ts.map +1 -1
  158. package/Tooltip/Tooltip.js +41 -29
  159. package/Tooltip/Tooltip.js.map +1 -1
  160. package/Tooltip/Tooltip.types.d.ts +1 -0
  161. package/Tooltip/Tooltip.types.d.ts.map +1 -1
  162. package/Tooltip/tooltipVariants.d.ts +4 -0
  163. package/Tooltip/tooltipVariants.d.ts.map +1 -0
  164. package/Tooltip/tooltipVariants.js +23 -0
  165. package/Tooltip/tooltipVariants.js.map +1 -0
  166. package/index.d.ts +1 -0
  167. package/index.d.ts.map +1 -1
  168. package/index.js +335 -330
  169. package/index.js.map +1 -1
  170. package/package.json +4 -4
@@ -1 +1 @@
1
- {"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../src/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAEhE,KAAK,yBAAyB,GAAG;IAC/B,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAA;AACD,MAAM,MAAM,kBAAkB,GAAG,yBAAyB,CAAC,MAAM,CAAC,GAAG,yBAAyB,CAAA;AAE9F,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,OAAO,GAAG,UAAU,CAAC;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAC;CACnC;AAED,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,wCAAwC;IACxC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED,MAAM,MAAM,eAAe,CACzB,YAAY,SAAS,MAAM,GAAG,MAAM,EACpC,SAAS,GAAG,OAAO,IAEnB,kBAAkB,GAClB,kBAAkB,GAClB,YAAY,GAAG;IACf,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF,MAAM,WAAW,eAAe;CAAG;AAEnC,MAAM,MAAM,cAAc,GACtB,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,GACtC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE1C,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC;AAElD,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,mBAAmB,EAAE,eAAe,CAAC;IAC7D,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC"}
1
+ {"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../src/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnF,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;AAEhE,KAAK,yBAAyB,GAAG;IAC/B,+EAA+E;IAC/E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAA;AACD,MAAM,MAAM,kBAAkB,GAAG,yBAAyB,CAAC,MAAM,CAAC,GAAG,yBAAyB,CAAA;AAE9F,MAAM,MAAM,+BAA+B,GAAG;IAC5C;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAA;AACD,MAAM,MAAM,wBAAwB,GAAG,+BAA+B,CAAC,OAAO,CAAC,GAAG,+BAA+B,CAAA;AAEjH,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,OAAO,GAAG,UAAU,CAAC;IAC9D,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAC;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACpC;AAED,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC,wCAAwC;IACxC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B;AAED,MAAM,MAAM,eAAe,CACzB,YAAY,SAAS,MAAM,GAAG,MAAM,EACpC,SAAS,GAAG,OAAO,IAEnB,kBAAkB,GAClB,kBAAkB,GAClB,YAAY,GAAG;IACf,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB,CAAC;AAEF,MAAM,WAAW,eAAe;CAAG;AAEnC,MAAM,MAAM,cAAc,GACtB,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,GACtC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE1C,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC;AAElD,MAAM,WAAW,WACf,SAAQ,eAAe,CAAC,mBAAmB,EAAE,eAAe,CAAC;IAC7D,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC"}
@@ -0,0 +1,3 @@
1
+ import { ButtonIconType } from './Button.types';
2
+ export declare const renderInnerIcon: (Icon?: ButtonIconType) => import('react').ReactElement<import('react').SVGProps<SVGSVGElement>, string | import('react').JSXElementConstructor<any>> | null;
3
+ //# sourceMappingURL=Button.utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.utils.d.ts","sourceRoot":"","sources":["../../src/Button/Button.utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,eAAO,MAAM,eAAe,GAAI,OAAO,cAAc,sIAQpD,CAAC"}
@@ -0,0 +1,14 @@
1
+ import { isValidElement as t, createElement as n, cloneElement as i } from "react";
2
+ const o = (e) => {
3
+ if (!e) return null;
4
+ if (t(e)) return e;
5
+ const r = n(e);
6
+ return i(r, {
7
+ strokeWidth: 1.5,
8
+ ...r.props
9
+ });
10
+ };
11
+ export {
12
+ o as renderInnerIcon
13
+ };
14
+ //# sourceMappingURL=Button.utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.utils.js","sources":["../../src/Button/Button.utils.ts"],"sourcesContent":["import { ButtonIconType } from \"./Button.types\";\nimport { cloneElement, createElement, isValidElement } from \"react\";\n\nexport const renderInnerIcon = (Icon?: ButtonIconType) => {\n if (!Icon) return null;\n if (isValidElement(Icon)) return Icon;\n const icon = createElement(Icon);\n return cloneElement(icon, {\n strokeWidth: 1.5,\n ...icon.props,\n });\n};\n"],"names":["renderInnerIcon","Icon","isValidElement","icon","createElement","cloneElement"],"mappings":";AAGO,MAAMA,IAAkB,CAACC,MAA0B;AACxD,MAAI,CAACA,EAAM,QAAO;AAClB,MAAIC,EAAeD,CAAI,EAAG,QAAOA;AACjC,QAAME,IAAOC,EAAcH,CAAI;AAC/B,SAAOI,EAAaF,GAAM;AAAA,IACxB,aAAa;AAAA,IACb,GAAGA,EAAK;AAAA,EAAA,CACT;AACH;"}
@@ -0,0 +1,7 @@
1
+ import { ButtonCounterBadgeReader } from './Button.types';
2
+ import { ButtonBadgeCVAProps } from './buttonVariants';
3
+ export interface ButtonCounterBadgeProps extends ButtonBadgeCVAProps {
4
+ counter?: ButtonCounterBadgeReader;
5
+ }
6
+ export declare const ButtonCounterBadge: (props: ButtonCounterBadgeProps) => import("react/jsx-runtime").JSX.Element | null;
7
+ //# sourceMappingURL=ButtonCounterBadge.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonCounterBadge.d.ts","sourceRoot":"","sources":["../../src/Button/ButtonCounterBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAmC,MAAM,gBAAgB,CAAC;AAC3F,OAAO,EAAE,KAAK,mBAAmB,EAAuB,MAAM,kBAAkB,CAAC;AAGjF,MAAM,WAAW,uBAAwB,SAAQ,mBAAmB;IAClE,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACpC;AAgBD,eAAO,MAAM,kBAAkB,GAAI,OAAO,uBAAuB,mDAchE,CAAA"}
@@ -0,0 +1,20 @@
1
+ import { jsxs as i, jsx as s } from "react/jsx-runtime";
2
+ import { buttonBadgeVariants as c } from "./buttonVariants.js";
3
+ import { cn as u } from "@oneplatformdev/utils";
4
+ const a = (t) => t ? typeof t == "number" ? { count: t } : t : null, o = 99, l = (t) => Math.max(0, Math.min(t || 0, o)), m = (t) => t > o, x = (t) => {
5
+ const { counter: r, ...e } = t, n = a(r);
6
+ return n?.count ? /* @__PURE__ */ i(
7
+ "div",
8
+ {
9
+ className: u(c({ ...e })),
10
+ children: [
11
+ l(n.count),
12
+ m(n.count) && /* @__PURE__ */ s("span", { className: "relative -top-[0.5px]", children: "+" })
13
+ ]
14
+ }
15
+ ) : null;
16
+ };
17
+ export {
18
+ x as ButtonCounterBadge
19
+ };
20
+ //# sourceMappingURL=ButtonCounterBadge.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ButtonCounterBadge.js","sources":["../../src/Button/ButtonCounterBadge.tsx"],"sourcesContent":["import { ButtonCounterBadgeReader, ButtonCounterBadgeReaderOptions } from \"./Button.types\";\nimport { type ButtonBadgeCVAProps, buttonBadgeVariants } from \"./buttonVariants\";\nimport { cn } from \"@oneplatformdev/utils\";\n\nexport interface ButtonCounterBadgeProps extends ButtonBadgeCVAProps {\n counter?: ButtonCounterBadgeReader;\n}\n\nconst normalizeCounter = (counter: ButtonCounterBadgeReader): ButtonCounterBadgeReaderOptions | null => {\n if(!counter) return null\n if(typeof counter === 'number') return { count: counter };\n return counter;\n}\n\nconst MIN_COUNT = 99;\nconst normalizeCount = (count: number): number => {\n const c = count || 0;\n return Math.max(0, Math.min(c, MIN_COUNT));\n}\n\nconst isOverflown = (count: number): boolean => count > MIN_COUNT\n\nexport const ButtonCounterBadge = (props: ButtonCounterBadgeProps) => {\n const {counter: initializeCounter, ...rest} = props;\n const counter = normalizeCounter(initializeCounter);\n if(!counter?.count) return null;\n return (\n <div\n className={cn(buttonBadgeVariants({ ...rest }))}\n >\n {normalizeCount(counter.count)}\n {isOverflown(counter.count) && (\n <span className=\"relative -top-[0.5px]\">+</span>\n )}\n </div>\n )\n}\n"],"names":["normalizeCounter","counter","MIN_COUNT","normalizeCount","count","isOverflown","ButtonCounterBadge","props","initializeCounter","rest","jsxs","cn","buttonBadgeVariants"],"mappings":";;;AAQA,MAAMA,IAAmB,CAACC,MACpBA,IACD,OAAOA,KAAY,WAAiB,EAAE,OAAOA,EAAA,IACzCA,IAFa,MAKhBC,IAAY,IACZC,IAAiB,CAACC,MAEf,KAAK,IAAI,GAAG,KAAK,IADdA,KAAS,GACYF,CAAS,CAAC,GAGrCG,IAAc,CAACD,MAA2BA,IAAQF,GAE3CI,IAAqB,CAACC,MAAmC;AACpE,QAAM,EAAC,SAASC,GAAmB,GAAGC,MAAQF,GACxCN,IAAUD,EAAiBQ,CAAiB;AAClD,SAAIP,GAAS,QAEX,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAGC,EAAoB,EAAE,GAAGH,EAAA,CAAM,CAAC;AAAA,MAE7C,UAAA;AAAA,QAAAN,EAAeF,EAAQ,KAAK;AAAA,QAC5BI,EAAYJ,EAAQ,KAAK,uBACvB,QAAA,EAAK,WAAU,yBAAwB,UAAA,IAAA,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IAPpB;AAW7B;"}
@@ -1,25 +1,16 @@
1
1
  import { VariantProps } from 'class-variance-authority';
2
2
  export declare const buttonVariants: (props?: ({
3
- variant?: "none" | "default" | "destructive" | "outline" | "secondary" | "contained" | "outlined" | "ghost" | null | undefined;
4
- color?: "secondary" | "primary" | "error" | null | undefined;
3
+ variant?: "none" | "contained" | "outlined" | "ghost" | null | undefined;
4
+ color?: "primary" | "secondary" | "error" | null | undefined;
5
5
  size?: "xs" | "sm" | "md" | "lg" | null | undefined;
6
6
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
7
- export type ButtonCVAProps = VariantProps<typeof buttonVariants>;
8
- type ButtonCVANoVariantProps = Omit<VariantProps<typeof buttonVariants>, 'variant'>;
9
- type ButtonCVAVariants = ButtonCVAProps['variant'];
10
- /** @deprecated use "variant=contained color=primary" instead */
11
- type LegacyDefaultVariant = 'default';
12
- /** @deprecated use "variant=outlined color=primary" instead */
13
- type LegacyOutlineVariant = 'outline';
14
- /** @deprecated use "variant=text color=primary" instead */
15
- type LegacyGhostVariant = 'ghost';
16
- /** @deprecated use "variant=contained color=secondary" instead */
17
- type LegacySecondaryVariant = 'secondary';
18
- /** @deprecated use "variant=contained color=error" instead */
19
- type LegacyDestructiveVariant = 'destructive';
20
- type ModernVariant = Exclude<ButtonCVAVariants, 'default' | 'outline' | 'ghost' | 'secondary' | 'destructive'> | LegacyDefaultVariant | LegacyOutlineVariant | LegacyGhostVariant | LegacySecondaryVariant | LegacyDestructiveVariant;
21
- export interface ButtonVarianceProps extends ButtonCVANoVariantProps {
22
- variant?: ModernVariant;
23
- }
24
- export {};
7
+ export type ButtonVarianceProps = VariantProps<typeof buttonVariants>;
8
+ export declare const buttonBadgeVariants: (props?: ({
9
+ variant?: "none" | "contained" | "outlined" | "ghost" | null | undefined;
10
+ color?: "primary" | "secondary" | "error" | null | undefined;
11
+ size?: "xs" | "sm" | "md" | "lg" | null | undefined;
12
+ rounded?: boolean | null | undefined;
13
+ disabled?: boolean | null | undefined;
14
+ } & import('class-variance-authority/types').ClassProp) | undefined) => string;
15
+ export type ButtonBadgeCVAProps = VariantProps<typeof buttonBadgeVariants>;
25
16
  //# sourceMappingURL=buttonVariants.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"buttonVariants.d.ts","sourceRoot":"","sources":["../../src/Button/buttonVariants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,eAAO,MAAM,cAAc;;;;8EAmJ1B,CAAA;AAED,MAAM,MAAM,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAEjE,KAAK,uBAAuB,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,cAAc,CAAC,EAAE,SAAS,CAAC,CAAA;AAEnF,KAAK,iBAAiB,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC;AAEnD,gEAAgE;AAChE,KAAK,oBAAoB,GAAG,SAAS,CAAC;AACtC,+DAA+D;AAC/D,KAAK,oBAAoB,GAAG,SAAS,CAAC;AACtC,2DAA2D;AAC3D,KAAK,kBAAkB,GAAG,OAAO,CAAC;AAClC,kEAAkE;AAClE,KAAK,sBAAsB,GAAG,WAAW,CAAC;AAC1C,8DAA8D;AAC9D,KAAK,wBAAwB,GAAG,aAAa,CAAC;AAE9C,KAAK,aAAa,GACd,OAAO,CAAC,iBAAiB,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,aAAa,CAAC,GACzF,oBAAoB,GACpB,oBAAoB,GACpB,kBAAkB,GAClB,sBAAsB,GACtB,wBAAwB,CAAC;AAE7B,MAAM,WAAW,mBAAoB,SAAQ,uBAAuB;IAClE,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB"}
1
+ {"version":3,"file":"buttonVariants.d.ts","sourceRoot":"","sources":["../../src/Button/buttonVariants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,eAAO,MAAM,cAAc;;;;8EA+I1B,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAEtE,eAAO,MAAM,mBAAmB;;;;;;8EAoE/B,CAAA;AACD,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
@@ -1,22 +1,18 @@
1
- import { cva as t } from "class-variance-authority";
1
+ import { cva as r } from "class-variance-authority";
2
2
  import { cn as e } from "@oneplatformdev/utils";
3
- const o = t(
3
+ const s = r(
4
4
  [
5
- "inline-flex items-center justify-center",
5
+ "inline-flex items-center justify-center box-border",
6
6
  "whitespace-nowrap font-medium",
7
- "cursor-pointer box-border",
7
+ "cursor-pointer",
8
8
  "transition-colors focus-visible:outline-hidden focus-visible:ring-none focus-visible:ring-transparent",
9
9
  "disabled:pointer-events-none disabled:cursor-default",
10
- "[&_svg]:pointer-events-none [&_svg]:shrink-0"
10
+ "[&_svg]:pointer-events-none [&_svg]:shrink-0",
11
+ "transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200"
11
12
  ],
12
13
  {
13
14
  variants: {
14
15
  variant: {
15
- default: "deprecated.do_not_use",
16
- outline: "deprecated.do_not_use",
17
- secondary: "deprecated.do_not_use",
18
- destructive: "deprecated.do_not_use",
19
- //
20
16
  none: "",
21
17
  contained: "",
22
18
  outlined: "",
@@ -35,7 +31,7 @@ const o = t(
35
31
  "text-sm leading-[1.12] [&_svg]:size-6"
36
32
  ),
37
33
  lg: e(
38
- "min-h-10 min-w-35 rounded-lg gap-1 px-3 py-2",
34
+ "min-h-10 min-w-35 rounded-lg gap-1 px-2.5 py-1.5",
39
35
  "text-base leading-normal [&_svg]:size-6"
40
36
  )
41
37
  }
@@ -147,8 +143,76 @@ const o = t(
147
143
  size: "lg"
148
144
  }
149
145
  }
146
+ ), o = r(
147
+ [
148
+ "absolute z-0",
149
+ "flex items-center justify-center text-center p-0",
150
+ "font-medium leading-none tracking-tighter",
151
+ "rounded-full w-fit min-w-4 h-4 text-[10px] px-0.5 box-border"
152
+ ],
153
+ {
154
+ variants: {
155
+ variant: {
156
+ none: "",
157
+ contained: "",
158
+ outlined: "",
159
+ ghost: ""
160
+ },
161
+ color: {
162
+ primary: "",
163
+ secondary: "",
164
+ error: ""
165
+ },
166
+ size: {
167
+ xs: "",
168
+ sm: "",
169
+ md: "",
170
+ lg: "-top-[2px] left-[14px]"
171
+ },
172
+ rounded: {
173
+ true: "left-1/2 -translate-x-1/2 -translate-y-1/2",
174
+ false: ""
175
+ },
176
+ disabled: {
177
+ true: "",
178
+ false: ""
179
+ }
180
+ },
181
+ compoundVariants: [
182
+ // SIZE XS
183
+ { size: "xs", rounded: !1, className: "-top-px -right-px translate-x-1/2 -translate-y-1/2" },
184
+ { size: "xs", rounded: !0, className: "-top-px" },
185
+ // SIZE SM
186
+ { size: "sm", rounded: !1, className: "top-0 right-0 translate-x-1/2 -translate-y-1/2" },
187
+ { size: "sm", rounded: !0, className: "-top-[3px]" },
188
+ // SIZE MD
189
+ { size: "md", rounded: !1, className: "-top-[4px] left-[12px]" },
190
+ { size: "md", rounded: !0, className: "-top-[6px]" },
191
+ // SIZE LG
192
+ { size: "lg", rounded: !1, className: "-top-[4px] left-[12px]" },
193
+ { size: "lg", rounded: !0, className: "-top-2" },
194
+ // COLORS
195
+ {
196
+ color: ["primary", "secondary", "error"],
197
+ className: "bg-[#9368FF] text-[#FCFCFC]"
198
+ },
199
+ {
200
+ color: ["primary", "secondary", "error"],
201
+ disabled: !0,
202
+ className: "bg-[#666A78] text-[#FCFCFC]"
203
+ }
204
+ ],
205
+ defaultVariants: {
206
+ color: "primary",
207
+ variant: "contained",
208
+ size: "lg",
209
+ disabled: !1,
210
+ rounded: !1
211
+ }
212
+ }
150
213
  );
151
214
  export {
152
- o as buttonVariants
215
+ o as buttonBadgeVariants,
216
+ s as buttonVariants
153
217
  };
154
218
  //# sourceMappingURL=buttonVariants.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"buttonVariants.js","sources":["../../src/Button/buttonVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from \"@oneplatformdev/utils\";\n\nexport const buttonVariants = cva(\n [\n \"inline-flex items-center justify-center\",\n 'whitespace-nowrap font-medium',\n 'cursor-pointer box-border',\n \"transition-colors focus-visible:outline-hidden focus-visible:ring-none focus-visible:ring-transparent\",\n \"disabled:pointer-events-none disabled:cursor-default\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n ],\n {\n variants: {\n variant: {\n default: \"deprecated.do_not_use\",\n outline: \"deprecated.do_not_use\",\n secondary: \"deprecated.do_not_use\",\n destructive: \"deprecated.do_not_use\",\n //\n none: \"\",\n contained: \"\",\n outlined: \"\",\n ghost: '',\n },\n color: {\n primary: '',\n secondary: '',\n error: '',\n },\n size: {\n xs: 'rounded-sm p-1 gap-1 text-xs min-h-4 min-w-14',\n sm: 'rounded-md p-1 gap-1 text-sm min-h-6 min-w-20',\n md: cn(\n 'min-h-8 min-w-[102px] rounded-lg gap-1 px-2 py-1',\n 'text-sm leading-[1.12] [&_svg]:size-6',\n ),\n lg: cn(\n \"min-h-10 min-w-35 rounded-lg gap-1 px-3 py-2\",\n 'text-base leading-normal [&_svg]:size-6',\n )\n }\n },\n compoundVariants: [\n // PRIMARY BUTTON VARIANTS\n {\n color: 'primary',\n variant: 'contained',\n className: cn(\n 'bg-[#9368FF] border border-[#9368FF] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\n 'hover:bg-[#7F4EEB]',\n 'focus:bg-[#7F4EEB] focus:border-[#6B3DD9]',\n 'active:bg-[#6B3DD9]',\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'primary',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#9368FF] text-[#9368FF] [&_svg]:text-[#9368FF]',\n 'hover:bg-[#9368FF0F]',\n 'active:bg-[#9368FF0F] active:border-[#6B3DD9]',\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'primary',\n variant: 'ghost',\n className: cn(\n 'bg-transparent border border-transparent text-[#9368FF] [&_svg]:text-[#9368FF]',\n 'hover:text-[#6B3DD9] hover:[&_svg]:text-[#6B3DD9]',\n 'focus:text-[#6B3DD9] focus:[&_svg]:text-[#6B3DD9]',\n 'active:bg-[#9368FF0F]',\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n // SECONDARY BUTTON VARIANTS\n {\n color: 'secondary',\n variant: 'contained',\n className: cn(\n 'bg-[#FCFCFC] border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'secondary',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'secondary',\n variant: 'ghost',\n className: cn(\n 'text-[#06080D] [&_svg]:text-[#06080D] bg-transparent border border-transparent',\n 'hover:bg-[#F9FAFB]',\n 'focus:bg-[#FCFCFC]',\n 'active:bg-[#F9FAFB]',\n 'disabled:bg-[#FCFCFC] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n // ERROR BUTTON VARIANTS\n {\n color: 'error',\n variant: 'contained',\n className: cn(\n 'bg-[#EF4444] border border-[#EF4444] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\n 'hover:bg-[#DC2626]',\n 'focus:bg-[#DC2626]',\n 'active:bg-[#DC2626]',\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'error',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#EF4444] text-[#EF4444] [&_svg]:text-[#EF4444]',\n 'hover:bg-[#EF44440F]',\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'error',\n variant: 'ghost',\n className: cn(\n 'bg-transparent border border-transparent text-[#EF4444] [&_svg]:text-[#EF4444]',\n 'hover:bg-[#EF44440F] hover:text-[#DC2626] hover:[&_svg]:text-[#DC2626]',\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n ],\n defaultVariants: {\n variant: 'contained',\n color: 'primary',\n size: 'lg',\n },\n }\n)\n\nexport type ButtonCVAProps = VariantProps<typeof buttonVariants>;\n\ntype ButtonCVANoVariantProps = Omit<VariantProps<typeof buttonVariants>, 'variant'>\n\ntype ButtonCVAVariants = ButtonCVAProps['variant'];\n\n/** @deprecated use \"variant=contained color=primary\" instead */\ntype LegacyDefaultVariant = 'default';\n/** @deprecated use \"variant=outlined color=primary\" instead */\ntype LegacyOutlineVariant = 'outline';\n/** @deprecated use \"variant=text color=primary\" instead */\ntype LegacyGhostVariant = 'ghost';\n/** @deprecated use \"variant=contained color=secondary\" instead */\ntype LegacySecondaryVariant = 'secondary';\n/** @deprecated use \"variant=contained color=error\" instead */\ntype LegacyDestructiveVariant = 'destructive';\n\ntype ModernVariant =\n | Exclude<ButtonCVAVariants, 'default' | 'outline' | 'ghost' | 'secondary' | 'destructive'>\n | LegacyDefaultVariant\n | LegacyOutlineVariant\n | LegacyGhostVariant\n | LegacySecondaryVariant\n | LegacyDestructiveVariant;\n\nexport interface ButtonVarianceProps extends ButtonCVANoVariantProps {\n variant?: ModernVariant;\n}\n"],"names":["buttonVariants","cva","cn"],"mappings":";;AAGO,MAAMA,IAAiBC;AAAA,EAC5B;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA;AAAA,QAEb,MAAM;AAAA,QACN,WAAW;AAAA,QACX,UAAU;AAAA,QACV,OAAO;AAAA,MAAA;AAAA,MAET,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,OAAO;AAAA,MAAA;AAAA,MAET,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAIC;AAAA,UACF;AAAA,UACA;AAAA,QAAA;AAAA,QAEF,IAAIA;AAAA,UACF;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF;AAAA,IAEF,kBAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA;AAAA,MAGF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA;AAAA,MAGF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,MAEF;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWA;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ;"}
1
+ {"version":3,"file":"buttonVariants.js","sources":["../../src/Button/buttonVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from \"@oneplatformdev/utils\";\n\nexport const buttonVariants = cva(\n [\n \"inline-flex items-center justify-center box-border\",\n 'whitespace-nowrap font-medium',\n 'cursor-pointer',\n \"transition-colors focus-visible:outline-hidden focus-visible:ring-none focus-visible:ring-transparent\",\n \"disabled:pointer-events-none disabled:cursor-default\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n 'transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200',\n ],\n {\n variants: {\n variant: {\n none: \"\",\n contained: \"\",\n outlined: \"\",\n ghost: '',\n },\n color: {\n primary: '',\n secondary: '',\n error: '',\n },\n size: {\n xs: 'rounded-sm p-1 gap-1 text-xs min-h-4 min-w-14',\n sm: 'rounded-md p-1 gap-1 text-sm min-h-6 min-w-20',\n md: cn(\n 'min-h-8 min-w-[102px] rounded-lg gap-1 px-2 py-1',\n 'text-sm leading-[1.12] [&_svg]:size-6',\n ),\n lg: cn(\n \"min-h-10 min-w-35 rounded-lg gap-1 px-2.5 py-1.5\",\n 'text-base leading-normal [&_svg]:size-6',\n )\n }\n },\n compoundVariants: [\n // PRIMARY BUTTON VARIANTS\n {\n color: 'primary',\n variant: 'contained',\n className: cn(\n 'bg-[#9368FF] border border-[#9368FF] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\n 'hover:bg-[#7F4EEB]',\n 'focus:bg-[#7F4EEB] focus:border-[#6B3DD9]',\n 'active:bg-[#6B3DD9]',\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'primary',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#9368FF] text-[#9368FF] [&_svg]:text-[#9368FF]',\n 'hover:bg-[#9368FF0F]',\n 'active:bg-[#9368FF0F] active:border-[#6B3DD9]',\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'primary',\n variant: 'ghost',\n className: cn(\n 'bg-transparent border border-transparent text-[#9368FF] [&_svg]:text-[#9368FF]',\n 'hover:text-[#6B3DD9] hover:[&_svg]:text-[#6B3DD9]',\n 'focus:text-[#6B3DD9] focus:[&_svg]:text-[#6B3DD9]',\n 'active:bg-[#9368FF0F]',\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n // SECONDARY BUTTON VARIANTS\n {\n color: 'secondary',\n variant: 'contained',\n className: cn(\n 'bg-[#FCFCFC] border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'secondary',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'secondary',\n variant: 'ghost',\n className: cn(\n 'text-[#06080D] [&_svg]:text-[#06080D] bg-transparent border border-transparent',\n 'hover:bg-[#F9FAFB]',\n 'focus:bg-[#FCFCFC]',\n 'active:bg-[#F9FAFB]',\n 'disabled:bg-[#FCFCFC] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n // ERROR BUTTON VARIANTS\n {\n color: 'error',\n variant: 'contained',\n className: cn(\n 'bg-[#EF4444] border border-[#EF4444] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\n 'hover:bg-[#DC2626]',\n 'focus:bg-[#DC2626]',\n 'active:bg-[#DC2626]',\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'error',\n variant: 'outlined',\n className: cn(\n 'bg-transparent border border-[#EF4444] text-[#EF4444] [&_svg]:text-[#EF4444]',\n 'hover:bg-[#EF44440F]',\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n {\n color: 'error',\n variant: 'ghost',\n className: cn(\n 'bg-transparent border border-transparent text-[#EF4444] [&_svg]:text-[#EF4444]',\n 'hover:bg-[#EF44440F] hover:text-[#DC2626] hover:[&_svg]:text-[#DC2626]',\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n },\n ],\n defaultVariants: {\n variant: 'contained',\n color: 'primary',\n size: 'lg',\n },\n }\n)\n\nexport type ButtonVarianceProps = VariantProps<typeof buttonVariants>;\n\nexport const buttonBadgeVariants = cva(\n [\n 'absolute z-0',\n 'flex items-center justify-center text-center p-0',\n 'font-medium leading-none tracking-tighter',\n 'rounded-full w-fit min-w-4 h-4 text-[10px] px-0.5 box-border',\n ],\n {\n variants: {\n variant: {\n none: '',\n contained: '',\n outlined: '',\n ghost: \"\",\n },\n color: {\n primary: \"\",\n secondary: \"\",\n error: \"\"\n },\n size: {\n xs: '',\n sm: '',\n md: '',\n lg: '-top-[2px] left-[14px]',\n },\n rounded: {\n true: 'left-1/2 -translate-x-1/2 -translate-y-1/2',\n false: '',\n },\n disabled: {\n true: '',\n false: '',\n }\n },\n compoundVariants: [\n // SIZE XS\n { size: 'xs', rounded: false, className: '-top-px -right-px translate-x-1/2 -translate-y-1/2' },\n { size: 'xs', rounded: true, className: '-top-px' },\n // SIZE SM\n { size: 'sm', rounded: false, className: 'top-0 right-0 translate-x-1/2 -translate-y-1/2' },\n { size: 'sm', rounded: true, className: '-top-[3px]' },\n // SIZE MD\n { size: 'md', rounded: false, className: '-top-[4px] left-[12px]' },\n { size: 'md', rounded: true, className: '-top-[6px]' },\n // SIZE LG\n { size: 'lg', rounded: false, className: '-top-[4px] left-[12px]' },\n { size: 'lg', rounded: true, className: '-top-2' },\n\n // COLORS\n {\n color: ['primary', 'secondary', 'error'],\n className: 'bg-[#9368FF] text-[#FCFCFC]',\n },\n {\n color: ['primary', 'secondary', 'error'],\n disabled: true,\n className: 'bg-[#666A78] text-[#FCFCFC]'\n },\n ],\n defaultVariants: {\n color: \"primary\",\n variant: \"contained\",\n size: \"lg\",\n disabled: false,\n rounded: false,\n },\n }\n)\nexport type ButtonBadgeCVAProps = VariantProps<typeof buttonBadgeVariants>;\n"],"names":["buttonVariants","cva","cn","buttonBadgeVariants"],"mappings":"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"}
package/Button/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  export { Button as default, Button } from './Button';
2
2
  export * from './buttonVariants';
3
3
  export type * from './Button.types';
4
+ export * from './Button.utils';
4
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACrD,cAAc,kBAAkB,CAAC;AACjC,mBAAmB,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACrD,cAAc,kBAAkB,CAAC;AACjC,mBAAmB,gBAAgB,CAAC;AACpC,cAAc,gBAAgB,CAAC"}
package/Button/index.js CHANGED
@@ -1,8 +1,11 @@
1
- import { Button as r, Button as a } from "./Button.js";
2
- import { buttonVariants as u } from "./buttonVariants.js";
1
+ import { Button as r, Button as n } from "./Button.js";
2
+ import { buttonBadgeVariants as a, buttonVariants as u } from "./buttonVariants.js";
3
+ import { renderInnerIcon as d } from "./Button.utils.js";
3
4
  export {
4
5
  r as Button,
6
+ a as buttonBadgeVariants,
5
7
  u as buttonVariants,
6
- a as default
8
+ n as default,
9
+ d as renderInnerIcon
7
10
  };
8
11
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
@@ -43,12 +43,17 @@ import * as React from "react";
43
43
  * <Trash2 />
44
44
  *</ButtonIcon>
45
45
  * ```
46
+ * > Badge counter:
47
+ * ```tsx
48
+ *<ButtonIcon counter={5} icon={MessageCircleMoreIcon}/>
49
+ *<ButtonIcon counter={{ count: 8 }} icon={MessageCircleMoreIcon}/>
50
+ * ```
46
51
  *
47
52
  * @remarks
48
53
  * - Designed for icon-only usage. If you need text, use `Button`.
49
54
  * - Works with any SVG React component or element, e.g. lucide-react, heroicons, custom icons.
50
55
  *
51
- * @see {@link ButtonIcon} for icon-only buttons
56
+ * @see {@link Button} for regular text buttons
52
57
  */
53
58
  export declare const ButtonIcon: React.ForwardRefExoticComponent<ButtonIconProps & React.RefAttributes<HTMLButtonElement>>;
54
59
  export default ButtonIcon;
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../src/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAcrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,eAAO,MAAM,UAAU,2FAiEtB,CAAA;AAED,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../src/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAQrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,eAAO,MAAM,UAAU,2FAgFtB,CAAA;AAED,eAAe,UAAU,CAAC"}
@@ -1,69 +1,87 @@
1
- import { jsx as n, jsxs as R } from "react/jsx-runtime";
2
- import * as j from "react";
3
- import { isValidElement as B, createElement as C } from "react";
4
- import { cn as E } from "@oneplatformdev/utils";
5
- import { buttonIconVariants as I } from "./buttonIconVariants.js";
6
- import { Slot as V } from "@radix-ui/react-slot";
1
+ import { jsxs as f, Fragment as C, jsx as t } from "react/jsx-runtime";
2
+ import * as R from "react";
3
+ import { cn as j } from "@oneplatformdev/utils";
4
+ import { buttonIconVariants as w } from "./buttonIconVariants.js";
5
+ import { Slot as z } from "@radix-ui/react-slot";
7
6
  import "@radix-ui/react-tooltip";
8
- import { Tooltip as w } from "../Tooltip/Tooltip.js";
9
- import { LoadedIcon as z } from "../LoadedIcon/LoadedIcon.js";
10
- const L = (t) => t ? B(t) ? t : C(t) : null, P = j.forwardRef(
11
- (t, d) => {
7
+ import { Tooltip as F } from "../Tooltip/Tooltip.js";
8
+ import { LoadedIcon as L } from "../LoadedIcon/LoadedIcon.js";
9
+ import { ButtonCounterBadge as P } from "../Button/ButtonCounterBadge.js";
10
+ import "../Button/Button.js";
11
+ import "../Button/buttonVariants.js";
12
+ import { renderInnerIcon as S } from "../Button/Button.utils.js";
13
+ const T = R.forwardRef(
14
+ (g, h) => {
12
15
  const {
13
- asChild: s,
14
- children: i,
15
- icon: f,
16
- disabled: a = !1,
17
- loading: o = !1,
18
- message: u,
19
- title: h = "",
20
- tooltipProps: l = {},
21
- className: g,
22
- variant: y,
23
- color: b,
24
- size: m,
25
- rounded: x,
26
- screenReader: e,
16
+ asChild: i,
17
+ children: a,
18
+ icon: b,
19
+ disabled: r = !1,
20
+ loading: n = !1,
21
+ message: y,
22
+ title: I = "",
23
+ tooltipProps: m = {},
24
+ className: x,
25
+ variant: c,
26
+ color: p,
27
+ size: e,
28
+ rounded: l,
29
+ screenReader: o,
30
+ counter: B,
27
31
  ...N
28
- } = t, v = s ? V : "button", r = u || h, c = s ? i : /* @__PURE__ */ n(z, { loading: o, size: m, children: L(f) ?? i });
29
- if (!c) return null;
30
- const p = /* @__PURE__ */ R(
32
+ } = g, v = i ? z : "button", s = y || I, d = i ? a : /* @__PURE__ */ f(C, { children: [
33
+ /* @__PURE__ */ f(L, { loading: n, size: e, children: [
34
+ S(b) ?? a,
35
+ /* @__PURE__ */ t(
36
+ P,
37
+ {
38
+ counter: B,
39
+ variant: c,
40
+ color: p,
41
+ size: e,
42
+ disabled: r,
43
+ rounded: l
44
+ }
45
+ )
46
+ ] }),
47
+ !!o && /* @__PURE__ */ t("span", { className: "sr-only", children: typeof o == "string" ? o : o.text })
48
+ ] });
49
+ if (!d) return null;
50
+ const u = /* @__PURE__ */ t(
31
51
  v,
32
52
  {
33
53
  type: "button",
34
- ref: d,
35
- disabled: a,
36
- className: E(
37
- I({
38
- variant: y,
39
- size: m,
40
- color: b,
41
- rounded: x,
42
- className: g
54
+ ref: h,
55
+ disabled: r,
56
+ className: j(
57
+ "group group/button group/button-icon",
58
+ w({
59
+ variant: c,
60
+ size: e,
61
+ color: p,
62
+ rounded: l,
63
+ className: x
43
64
  }),
44
- o && "pointer-events-none opacity-80"
65
+ n && "pointer-events-none opacity-80"
45
66
  ),
46
67
  ...N,
47
- children: [
48
- c,
49
- !!e && /* @__PURE__ */ n("span", { className: "sr-only", children: typeof e == "string" ? e : e.text })
50
- ]
68
+ children: d
51
69
  }
52
70
  );
53
- return r ? /* @__PURE__ */ n(
54
- w,
71
+ return s ? /* @__PURE__ */ t(
72
+ F,
55
73
  {
56
- ...l || {},
57
- open: l.open ?? (a || o || !r) ? !1 : void 0,
58
- message: r,
59
- children: p
74
+ ...m || {},
75
+ open: m.open ?? (r || n || !s) ? !1 : void 0,
76
+ message: s,
77
+ children: u
60
78
  }
61
- ) : p;
79
+ ) : u;
62
80
  }
63
81
  );
64
- P.displayName = "Button";
82
+ T.displayName = "Button";
65
83
  export {
66
- P as ButtonIcon,
67
- P as default
84
+ T as ButtonIcon,
85
+ T as default
68
86
  };
69
87
  //# sourceMappingURL=ButtonIcon.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.js","sources":["../../src/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@oneplatformdev/utils\"\nimport { buttonIconVariants } from './buttonIconVariants';\nimport { ButtonIconProps } from './ButtonIcon.types';\nimport { Slot } from \"@radix-ui/react-slot\"\n\nimport { Tooltip } from '../Tooltip';\nimport { LoadedIcon } from \"../LoadedIcon\";\nimport { ButtonIconType } from \"../Button\";\nimport { createElement, isValidElement } from \"react\";\n\nconst renderInnerIcon = (Icon?: ButtonIconType) => {\n if (!Icon) return null;\n if (isValidElement(Icon)) return Icon;\n return createElement(Icon);\n};\n\n/**\n * Icon-only version of the Button component.\n *\n * `ButtonIcon` is used for compact actions represented by an icon instead of text.\n * Supports all core features of Button: variants, sizes, tooltips, disabled and loading state.\n *\n * @public\n * @see [Documentation](#) // TODO: add link to docs\n *\n * @example\n * > Import:\n * ```tsx\n * import { ButtonIcon } from '@oneplatformdev/ui/ButtonIcon';\n * ```\n * > Basic usage by icon:\n * ```tsx\n *<ButtonIcon icon={<PlusIcon />}/>\n *<ButtonIcon icon={PlusIcon}/>\n * ```\n * > Basic usage by children:\n * ```tsx\n *<ButtonIcon>\n * <PlusIcon />\n *</ButtonIcon>\n * ```\n * > With variant & color:\n * ```tsx\n *<ButtonIcon variant=\"outline\" color=\"primary\">\n * <Search />\n *</ButtonIcon>\n * ```\n * > With tooltip message:\n * ```tsx\n *<ButtonIcon message=\"Edit item\">\n * <PencilLine />\n *</ButtonIcon>\n * ```\n * > Loading state:\n * ```tsx\n *<ButtonIcon loading>\n * <Trash2 />\n *</ButtonIcon>\n * ```\n *\n * @remarks\n * - Designed for icon-only usage. If you need text, use `Button`.\n * - Works with any SVG React component or element, e.g. lucide-react, heroicons, custom icons.\n *\n * @see {@link ButtonIcon} for icon-only buttons\n */\nexport const ButtonIcon = React.forwardRef<HTMLButtonElement, ButtonIconProps>(\n (props, ref) => {\n const {\n asChild,\n children,\n icon,\n disabled = false,\n loading = false,\n message,\n title = '',\n tooltipProps = {},\n className,\n variant,\n color,\n size,\n rounded,\n screenReader,\n ...rest\n } = props;\n\n const Comp = asChild ? Slot : \"button\"\n const msg = message || title;\n\n const content = asChild\n ? children\n : (\n <LoadedIcon loading={loading} size={size}>\n {renderInnerIcon(icon) ?? children}\n </LoadedIcon>\n )\n\n if (!content) return null;\n\n const cmp = (\n <Comp\n type='button'\n ref={ref}\n disabled={disabled}\n className={cn(\n buttonIconVariants({\n variant, size, color, rounded,\n className\n }),\n loading && 'pointer-events-none opacity-80',\n )}\n {...rest}\n >\n {content}\n {!!screenReader && <span className=\"sr-only\">\n {typeof screenReader === 'string' ? screenReader : screenReader.text}\n </span>}\n </Comp>\n )\n\n if (!msg) return cmp\n return (\n <Tooltip\n {...(tooltipProps || {})}\n open={tooltipProps.open ?? (disabled || loading || !msg) ? false : undefined}\n message={msg}\n >\n {cmp}\n </Tooltip>\n )\n }\n)\nButtonIcon.displayName = \"Button\"\nexport default ButtonIcon;\n"],"names":["renderInnerIcon","Icon","isValidElement","createElement","ButtonIcon","React","props","ref","asChild","children","icon","disabled","loading","message","title","tooltipProps","className","variant","color","size","rounded","screenReader","rest","Comp","Slot","msg","content","jsx","LoadedIcon","cmp","jsxs","cn","buttonIconVariants","Tooltip"],"mappings":";;;;;;;;;AAYA,MAAMA,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAI,IAAUA,IAC1BE,EAAcF,CAAI,IAFP,MAuDPG,IAAaC,EAAM;AAAA,EAC9B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,MAAAC;AAAA,MACA,UAAAC,IAAW;AAAA,MACX,SAAAC,IAAU;AAAA,MACV,SAAAC;AAAA,MACA,OAAAC,IAAQ;AAAA,MACR,cAAAC,IAAe,CAAA;AAAA,MACf,WAAAC;AAAA,MACA,SAAAC;AAAA,MACA,OAAAC;AAAA,MACA,MAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDhB,GAEEiB,IAAOf,IAAUgB,IAAO,UACxBC,IAAMZ,KAAWC,GAEjBY,IAAUlB,IACZC,IAEA,gBAAAkB,EAACC,GAAA,EAAW,SAAAhB,GAAkB,MAAAO,GAC3B,UAAAnB,EAAgBU,CAAI,KAAKD,EAAA,CAC5B;AAGJ,QAAI,CAACiB,EAAS,QAAO;AAErB,UAAMG,IACJ,gBAAAC;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAhB;AAAA,QACA,UAAAI;AAAA,QACA,WAAWoB;AAAA,UACTC,EAAmB;AAAA,YACjB,SAAAf;AAAA,YAAS,MAAAE;AAAA,YAAM,OAAAD;AAAA,YAAO,SAAAE;AAAA,YACtB,WAAAJ;AAAA,UAAA,CACD;AAAA,UACDJ,KAAW;AAAA,QAAA;AAAA,QAEZ,GAAGU;AAAA,QAEH,UAAA;AAAA,UAAAI;AAAA,UACA,CAAC,CAACL,KAAgB,gBAAAM,EAAC,QAAA,EAAK,WAAU,WAChC,UAAA,OAAON,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAClE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAIJ,WAAKI,IAEH,gBAAAE;AAAA,MAACM;AAAA,MAAA;AAAA,QACE,GAAIlB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASJ,KAAYC,KAAW,CAACa,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAI;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACAzB,EAAW,cAAc;"}
1
+ {"version":3,"file":"ButtonIcon.js","sources":["../../src/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@oneplatformdev/utils\"\nimport { buttonIconVariants } from './buttonIconVariants';\nimport { ButtonIconProps } from './ButtonIcon.types';\nimport { Slot } from \"@radix-ui/react-slot\"\n\nimport { Tooltip } from '../Tooltip';\nimport { LoadedIcon } from \"../LoadedIcon\";\nimport { ButtonCounterBadge } from \"../Button/ButtonCounterBadge\";\nimport { renderInnerIcon } from \"../Button\";\n\n/**\n * Icon-only version of the Button component.\n *\n * `ButtonIcon` is used for compact actions represented by an icon instead of text.\n * Supports all core features of Button: variants, sizes, tooltips, disabled and loading state.\n *\n * @public\n * @see [Documentation](#) // TODO: add link to docs\n *\n * @example\n * > Import:\n * ```tsx\n * import { ButtonIcon } from '@oneplatformdev/ui/ButtonIcon';\n * ```\n * > Basic usage by icon:\n * ```tsx\n *<ButtonIcon icon={<PlusIcon />}/>\n *<ButtonIcon icon={PlusIcon}/>\n * ```\n * > Basic usage by children:\n * ```tsx\n *<ButtonIcon>\n * <PlusIcon />\n *</ButtonIcon>\n * ```\n * > With variant & color:\n * ```tsx\n *<ButtonIcon variant=\"outline\" color=\"primary\">\n * <Search />\n *</ButtonIcon>\n * ```\n * > With tooltip message:\n * ```tsx\n *<ButtonIcon message=\"Edit item\">\n * <PencilLine />\n *</ButtonIcon>\n * ```\n * > Loading state:\n * ```tsx\n *<ButtonIcon loading>\n * <Trash2 />\n *</ButtonIcon>\n * ```\n * > Badge counter:\n * ```tsx\n *<ButtonIcon counter={5} icon={MessageCircleMoreIcon}/>\n *<ButtonIcon counter={{ count: 8 }} icon={MessageCircleMoreIcon}/>\n * ```\n *\n * @remarks\n * - Designed for icon-only usage. If you need text, use `Button`.\n * - Works with any SVG React component or element, e.g. lucide-react, heroicons, custom icons.\n *\n * @see {@link Button} for regular text buttons\n */\nexport const ButtonIcon = React.forwardRef<HTMLButtonElement, ButtonIconProps>(\n (props, ref) => {\n const {\n asChild,\n children,\n icon,\n disabled = false,\n loading = false,\n message,\n title = '',\n tooltipProps = {},\n className,\n variant,\n color,\n size,\n rounded,\n screenReader,\n counter,\n ...rest\n } = props;\n\n const Comp = asChild ? Slot : \"button\"\n const msg = message || title;\n\n const content = asChild\n ? children\n : (\n <>\n <LoadedIcon loading={loading} size={size}>\n {renderInnerIcon(icon) ?? children}\n <ButtonCounterBadge\n counter={counter}\n variant={variant}\n color={color}\n size={size}\n disabled={disabled}\n rounded={rounded}\n />\n </LoadedIcon>\n\n {!!screenReader && (\n <span className=\"sr-only\">\n {typeof screenReader === 'string' ? screenReader : screenReader.text}\n </span>\n )}\n </>\n )\n\n if (!content) return null;\n\n const cmp = (\n <Comp\n type='button'\n ref={ref}\n disabled={disabled}\n className={cn(\n 'group group/button group/button-icon',\n buttonIconVariants({\n variant, size, color, rounded,\n className\n }),\n loading && 'pointer-events-none opacity-80',\n )}\n {...rest}\n >\n {content}\n </Comp>\n )\n\n if (!msg) return cmp\n return (\n <Tooltip\n {...(tooltipProps || {})}\n open={tooltipProps.open ?? (disabled || loading || !msg) ? false : undefined}\n message={msg}\n >\n {cmp}\n </Tooltip>\n )\n }\n)\nButtonIcon.displayName = \"Button\"\nexport default ButtonIcon;\n"],"names":["ButtonIcon","React","props","ref","asChild","children","icon","disabled","loading","message","title","tooltipProps","className","variant","color","size","rounded","screenReader","counter","rest","Comp","Slot","msg","content","jsxs","Fragment","LoadedIcon","renderInnerIcon","jsx","ButtonCounterBadge","cmp","cn","buttonIconVariants","Tooltip"],"mappings":";;;;;;;;;;;;AAmEO,MAAMA,IAAaC,EAAM;AAAA,EAC9B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,MAAAC;AAAA,MACA,UAAAC,IAAW;AAAA,MACX,SAAAC,IAAU;AAAA,MACV,SAAAC;AAAA,MACA,OAAAC,IAAQ;AAAA,MACR,cAAAC,IAAe,CAAA;AAAA,MACf,WAAAC;AAAA,MACA,SAAAC;AAAA,MACA,OAAAC;AAAA,MACA,MAAAC;AAAA,MACA,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,SAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDjB,GAEEkB,IAAOhB,IAAUiB,IAAO,UACxBC,IAAMb,KAAWC,GAEjBa,IAAUnB,IACZC,IAEA,gBAAAmB,EAAAC,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAD,EAACE,GAAA,EAAW,SAAAlB,GAAkB,MAAAO,GAC3B,UAAA;AAAA,QAAAY,EAAgBrB,CAAI,KAAKD;AAAA,QAC1B,gBAAAuB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAAX;AAAA,YACA,SAAAL;AAAA,YACA,OAAAC;AAAA,YACA,MAAAC;AAAA,YACA,UAAAR;AAAA,YACA,SAAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACF,GACF;AAAA,MAEC,CAAC,CAACC,KACD,gBAAAW,EAAC,QAAA,EAAK,WAAU,WACb,UAAA,OAAOX,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAClE;AAAA,IAAA,GAEJ;AAGJ,QAAI,CAACM,EAAS,QAAO;AAErB,UAAMO,IACJ,gBAAAF;AAAA,MAACR;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAjB;AAAA,QACA,UAAAI;AAAA,QACA,WAAWwB;AAAA,UACT;AAAA,UACAC,EAAmB;AAAA,YACjB,SAAAnB;AAAA,YAAS,MAAAE;AAAA,YAAM,OAAAD;AAAA,YAAO,SAAAE;AAAA,YACtB,WAAAJ;AAAA,UAAA,CACD;AAAA,UACDJ,KAAW;AAAA,QAAA;AAAA,QAEZ,GAAGW;AAAA,QAEH,UAAAI;AAAA,MAAA;AAAA,IAAA;AAIL,WAAKD,IAEH,gBAAAM;AAAA,MAACK;AAAA,MAAA;AAAA,QACE,GAAItB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASJ,KAAYC,KAAW,CAACc,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAQ;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACA9B,EAAW,cAAc;"}