@oneplatformdev/ui 0.1.99-beta.34 → 0.1.99-beta.36

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 (165) hide show
  1. package/.storybook/Wrappers.js.map +1 -1
  2. package/Accordion/Accordion.d.ts +1 -1
  3. package/Accordion/Accordion.d.ts.map +1 -1
  4. package/Accordion/Accordion.js +26 -48
  5. package/Accordion/Accordion.js.map +1 -1
  6. package/Alert/Alert.js.map +1 -1
  7. package/Alert/alertVariants.js.map +1 -1
  8. package/AlertDialog/AlertDialog.js.map +1 -1
  9. package/AlertDialog/AlertDialog.stories.js +2 -3
  10. package/AlertDialog/AlertDialog.stories.js.map +1 -1
  11. package/AlertDialog/AlertDialogRoot.js +18 -19
  12. package/AlertDialog/AlertDialogRoot.js.map +1 -1
  13. package/AreaChart/AreaChart.js.map +1 -1
  14. package/Aside/Aside.js.map +1 -1
  15. package/Aside/AsideSidebar.js.map +1 -1
  16. package/AspectRatio/AspectRatio.js.map +1 -1
  17. package/Avatar/Avatar.js.map +1 -1
  18. package/Badge/Badge.js.map +1 -1
  19. package/Badge/badgeVariants.js.map +1 -1
  20. package/Breadcrumb/Breadcrumb.js.map +1 -1
  21. package/Button/Button.js +1 -2
  22. package/Button/Button.js.map +1 -1
  23. package/Button/Button.stories.js.map +1 -1
  24. package/Button/ButtonCounterBadge.js.map +1 -1
  25. package/Button/buttonVariants.js +1 -1
  26. package/Button/buttonVariants.js.map +1 -1
  27. package/ButtonIcon/ButtonIcon.js +18 -19
  28. package/ButtonIcon/ButtonIcon.js.map +1 -1
  29. package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
  30. package/ButtonIcon/buttonIconVariants.js +1 -1
  31. package/ButtonIcon/buttonIconVariants.js.map +1 -1
  32. package/CHANGELOG.md +1874 -1949
  33. package/Calendar/Calendar.js +0 -1
  34. package/Calendar/Calendar.js.map +1 -1
  35. package/Card/Card.js.map +1 -1
  36. package/Carousel/Carousel.js +6 -7
  37. package/Carousel/Carousel.js.map +1 -1
  38. package/Chart/Chart.js.map +1 -1
  39. package/Checkbox/Checkbox.js +17 -18
  40. package/Checkbox/Checkbox.js.map +1 -1
  41. package/Collapsible/Collapsible.js.map +1 -1
  42. package/Combobox/Combobox.js +30 -32
  43. package/Combobox/Combobox.js.map +1 -1
  44. package/Combobox/Combobox.stories.js.map +1 -1
  45. package/Combobox/ComboboxOptionItem.js +4 -4
  46. package/Combobox/ComboboxOptionItem.js.map +1 -1
  47. package/Combobox/ComboboxOptions.js +8 -9
  48. package/Combobox/ComboboxOptions.js.map +1 -1
  49. package/Command/Command.js +25 -26
  50. package/Command/Command.js.map +1 -1
  51. package/DataTable/DataTable.js +12 -13
  52. package/DataTable/DataTable.js.map +1 -1
  53. package/DataTable/DataTableColumnFilter.js +6 -7
  54. package/DataTable/DataTableColumnFilter.js.map +1 -1
  55. package/DataTable/useDataTable.d.ts +1 -1
  56. package/DataTable/useDataTable.js.map +1 -1
  57. package/DatePicker/DatePicker.js +12 -13
  58. package/DatePicker/DatePicker.js.map +1 -1
  59. package/Dialog/Dialog.js.map +1 -1
  60. package/Dialog/DialogOverlayScope.js.map +1 -1
  61. package/Drawer/Drawer.js.map +1 -1
  62. package/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  63. package/DropdownMenu/DropdownMenu.js +20 -33
  64. package/DropdownMenu/DropdownMenu.js.map +1 -1
  65. package/Dropzone/Dropzone.js.map +1 -1
  66. package/Dropzone/Dropzone.types.js.map +1 -1
  67. package/Dropzone/DropzoneFilePreview.js.map +1 -1
  68. package/Dropzone/DropzoneSinglePickPreview.js.map +1 -1
  69. package/Dropzone/DropzoneUtils.js.map +1 -1
  70. package/Form/Form.js +14 -15
  71. package/Form/Form.js.map +1 -1
  72. package/Form/FormRenderControl.d.ts.map +1 -1
  73. package/Form/FormRenderControl.js +26 -13
  74. package/Form/FormRenderControl.js.map +1 -1
  75. package/Form/FormRenderControl.types.d.ts +2 -1
  76. package/Form/FormRenderControl.types.d.ts.map +1 -1
  77. package/Form/FormTooltipButton.d.ts +6 -0
  78. package/Form/FormTooltipButton.d.ts.map +1 -0
  79. package/Form/FormTooltipButton.js +33 -0
  80. package/Form/FormTooltipButton.js.map +1 -0
  81. package/Form/Form_old.js +4 -5
  82. package/Form/Form_old.js.map +1 -1
  83. package/FormCheckbox/FormCheckbox.js +4 -4
  84. package/FormCheckbox/FormCheckbox.js.map +1 -1
  85. package/FormCombobox/FormCombobox.js +4 -4
  86. package/FormCombobox/FormCombobox.js.map +1 -1
  87. package/FormDatePicker/FormDatePicker.js +4 -4
  88. package/FormDatePicker/FormDatePicker.js.map +1 -1
  89. package/FormDropzone/FormDropzone.js +3 -3
  90. package/FormDropzone/FormDropzone.js.map +1 -1
  91. package/FormInput/FormInput.d.ts.map +1 -1
  92. package/FormInput/FormInput.js +22 -21
  93. package/FormInput/FormInput.js.map +1 -1
  94. package/FormRadio/FormRadio.js.map +1 -1
  95. package/FormSelect/FormSelect.js +22 -25
  96. package/FormSelect/FormSelect.js.map +1 -1
  97. package/FormTextarea/FormTextarea.js +4 -4
  98. package/FormTextarea/FormTextarea.js.map +1 -1
  99. package/Header/Header.js.map +1 -1
  100. package/HoverCard/HoverCard.js.map +1 -1
  101. package/Input/Input.js.map +1 -1
  102. package/Input/inputVariants.js.map +1 -1
  103. package/InputOTP/InputOTP.d.ts.map +1 -1
  104. package/InputOTP/InputOTP.js.map +1 -1
  105. package/LICENSE +21 -21
  106. package/Label/Label.js.map +1 -1
  107. package/Label/labelVariants.js.map +1 -1
  108. package/LazyLoader/LazyLoader.js +4 -5
  109. package/LazyLoader/LazyLoader.js.map +1 -1
  110. package/LoadedIcon/LoadedIcon.js.map +1 -1
  111. package/LoadingMask/LoadingMask.js.map +1 -1
  112. package/LoadingMask/RenderLoadingMask.js.map +1 -1
  113. package/LoadingProgress/LoadingProgress.js.map +1 -1
  114. package/LoadingProgress/loadingProgressVariants.js.map +1 -1
  115. package/Menubar/Menubar.js.map +1 -1
  116. package/NavigationMenu/NavigationMenu.js.map +1 -1
  117. package/NavigationMenu/navigationMenuVariants.js.map +1 -1
  118. package/Pagination/Pagination.js +0 -1
  119. package/Pagination/Pagination.js.map +1 -1
  120. package/Popover/Popover.js.map +1 -1
  121. package/Progress/Progress.js.map +1 -1
  122. package/README.md +7 -7
  123. package/Radio/Radio.js.map +1 -1
  124. package/RadioGroup/RadioGroup.js.map +1 -1
  125. package/Resizable/Resizable.js.map +1 -1
  126. package/Resizable/Resizable.stories.js.map +1 -1
  127. package/ScrollArea/ScrollArea.js.map +1 -1
  128. package/Search/Search.js +8 -8
  129. package/Search/Search.js.map +1 -1
  130. package/Search/Search.stories.js.map +1 -1
  131. package/Select/Select.js +6 -7
  132. package/Select/Select.js.map +1 -1
  133. package/Select/Select.stories.js.map +1 -1
  134. package/Select/SelectRoot.js.map +1 -1
  135. package/Separator/Separator.js.map +1 -1
  136. package/Sheet/Sheet.js.map +1 -1
  137. package/Sidebar/Sidebar.js +20 -21
  138. package/Sidebar/Sidebar.js.map +1 -1
  139. package/Skeleton/Skeleton.js.map +1 -1
  140. package/Slider/Slider.js.map +1 -1
  141. package/Sonner/Sonner.js.map +1 -1
  142. package/Switch/Switch.js.map +1 -1
  143. package/Table/Table.js.map +1 -1
  144. package/TablePagination/TablePagination.js +17 -21
  145. package/TablePagination/TablePagination.js.map +1 -1
  146. package/Tabs/Tabs.js.map +1 -1
  147. package/Tabs/TabsRoot.js.map +1 -1
  148. package/Textarea/Textarea.js +17 -17
  149. package/Textarea/Textarea.js.map +1 -1
  150. package/Textarea/Textarea.stories.js.map +1 -1
  151. package/Textarea/useAutosizeTextArea.js.map +1 -1
  152. package/Theme/ThemeModeToggle.js +3 -4
  153. package/Theme/ThemeModeToggle.js.map +1 -1
  154. package/Theme/ThemeProvider.js.map +1 -1
  155. package/Toast/Toast.js.map +1 -1
  156. package/Toast/toast.constants.js.map +1 -1
  157. package/Toast/toastVariants.js.map +1 -1
  158. package/Toast/useToast.js.map +1 -1
  159. package/Toaster/Toaster.js.map +1 -1
  160. package/Toggle/Toggle.js.map +1 -1
  161. package/ToggleGroup/ToggleGroup.js.map +1 -1
  162. package/Tooltip/Tooltip.js.map +1 -1
  163. package/Tooltip/TooltipRoot.js.map +1 -1
  164. package/index.js +278 -278
  165. package/package.json +4 -4
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\nimport { cn } from \"@oneplatformdev/utils\"\nimport { ButtonVarianceProps, buttonVariants } from './buttonVariants';\nimport { ButtonAdornmentProps, type ButtonProps } from './Button.types';\n\nimport { Tooltip } from '../Tooltip';\nimport { LoadedIcon } from \"../LoadedIcon\";\nimport { createElement, isValidElement } from \"react\";\n\nconst normalizedVariantProperties = (props: ButtonVarianceProps): ButtonVarianceProps => {\n const { variant, size, color } = props;\n const vls = { color, variant, size }\n if ((variant as string) === 'default') {\n console.warn('Button variant \"default\" is deprecated. Please use \"variant=contained color=primary\" instead.')\n vls.variant = 'contained'\n vls.color = 'primary'\n return vls\n }\n if ((size as string) === 'icon') {\n console.warn('Button size \"icon\" is deprecated. Please use \"<ButtonIcon/>\" component instead.')\n vls.variant = 'contained'\n vls.color = 'secondary'\n return vls\n // throw new Error('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\n }\n if ((variant as string) === 'transparent') {\n console.warn('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\n throw new Error('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\n }\n if ((variant as string) === 'outline') {\n console.warn('Button variant \"outline\" is deprecated. Please use \"variant=outlined color=primary\" instead.')\n vls.variant = 'outlined'\n vls.color = 'primary'\n return vls\n }\n if ((variant as string) === 'secondary') {\n console.warn('Button variant \"secondary\" is deprecated. Please use \"variant=contained color=secondary\" instead.')\n vls.variant = 'contained'\n vls.color = 'secondary'\n return vls\n }\n if ((variant as string) === 'destructive') {\n console.warn('Button variant \"destructive\" is deprecated. Please use \"variant=contained color=error\" instead.')\n vls.variant = 'contained'\n vls.color = 'error'\n return vls\n }\n return vls;\n}\n\nconst renderAdornment = (Adornment?: ButtonAdornmentProps) => {\n if (!Adornment) return null;\n if (isValidElement(Adornment)) return Adornment;\n return createElement(Adornment);\n};\n\n/**\n * Universal Button component used for triggering actions and UI interactions.\n * Supports variants, sizes, colors, start/end icon adornments, custom slot content,\n * tooltip integration, loading state, and polymorphic rendering via `asChild`.\n *\n * @public\n * @see [Documentation](#) // TODO: add link to docs\n *\n * @example\n * > Import:\n * ```tsx\n * import { Button } from '@oneplatformdev/ui/Button';\n * ```\n * > Basic usage:\n * ```tsx\n * <Button>Click me</Button>\n * ```\n * > Variant and size:\n * ```tsx\n * <Button variant=\"outline\" size=\"lg\">Large Button</Button>\n * ```\n * > With icons:\n * ```tsx\n * <Button startAdornment={<PlusIcon />}>Create</Button>\n * <Button endAdornment={<ArrowRightIcon />}>Next</Button>\n * ```\n * > Icon style button:\n * ```tsx\n * <Button size=\"icon\">\n * <PlusIcon />\n * </Button>\n * ```\n * > Polymorphic rendering (`asChild`):\n * ```tsx\n * <Button asChild>\n * <a href=\"/dashboard\">Go to Dashboard</a>\n * </Button>\n * ```\n * > Tooltip via `message` or native `title`:\n * ```tsx\n * <Button title=\"Tooltip text\">Hover me</Button>\n * <Button message=\"Tooltip content\">Hover me</Button>\n * ```\n * > Loading state:\n * ```tsx\n * <Button loading>Processing...</Button>\n * ```\n * > Disabled:\n * ```tsx\n * <Button disabled>Disabled</Button>\n * ```\n *\n * Sizes\n * xs — compact, for tight UI areas. Classes: rounded-sm p-1 gap-1 text-xs min-h-4 min-w-14.\n * sm — small; slightly larger than xs. Classes: rounded-md p-1 gap-1 text-sm min-h-6 min-w-20.\n * md — default/text-heavy buttons. Classes: min-h-8 min-w-[102px] rounded-lg gap-1 px-2 py-1 text-sm leading-[1.12] [&_svg]:size-6.\n * lg — large/call-to-action. Classes: min-h-10 min-w-35 rounded-lg gap-1 px-3 py-2 text-base leading-normal [&_svg]:size-6.\n *\n * @remarks\n * - Designed for texted usage. If you need icon-only, use `ButtonIcon`.\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 Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref) => {\n const {\n disabled,\n className,\n variant,\n color,\n size,\n asChild = false,\n title = '',\n tooltip,\n tooltipProps = {},\n message,\n loading = false,\n children,\n startAdornment,\n endAdornment,\n screenReader,\n ...rest\n } = props;\n const Comp = asChild ? Slot : \"button\"\n const msg = message || tooltip || title;\n\n const content = asChild\n ? children\n : (\n <>\n {!!startAdornment && (\n <LoadedIcon loading={loading} size={size}>\n {renderAdornment(startAdornment)}\n </LoadedIcon>\n )}\n\n {children}\n\n {!!endAdornment && (\n <LoadedIcon loading={loading} size={size}>\n {renderAdornment(endAdornment)}\n </LoadedIcon>\n )}\n\n {!!screenReader && <span className=\"sr-only\">{typeof screenReader === 'string' ? screenReader : screenReader.text}</span>}\n </>\n )\n\n const cmp = (\n <Comp\n type='button'\n ref={ref}\n disabled={disabled}\n className={cn(\n buttonVariants({\n ...normalizedVariantProperties({ variant, size, color }),\n className\n }),\n loading && 'pointer-events-none opacity-80 user-select-none',\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)\nButton.displayName = \"Button\"\nexport default Button;\n"],"names":["normalizedVariantProperties","props","variant","size","color","vls","renderAdornment","Adornment","isValidElement","createElement","Button","React","ref","disabled","className","asChild","title","tooltip","tooltipProps","message","loading","children","startAdornment","endAdornment","screenReader","rest","Comp","Slot","msg","content","jsxs","Fragment","jsx","LoadedIcon","cmp","cn","buttonVariants","Tooltip"],"mappings":";;;;;;;;;AAWA,MAAMA,IAA8B,CAACC,MAAoD;AACvF,QAAM,EAAE,SAAAC,GAAS,MAAAC,GAAM,OAAAC,EAAA,IAAUH,GAC3BI,IAAM,EAAE,OAAAD,GAAO,SAAAF,GAAS,MAAAC,EAAA;AAC9B,MAAKD,MAAuB;AAC1B,mBAAQ,KAAK,+FAA+F,GAC5GG,EAAI,UAAU,aACdA,EAAI,QAAQ,WACLA;AAET,MAAKF,MAAoB;AACvB,mBAAQ,KAAK,iFAAiF,GAC9FE,EAAI,UAAU,aACdA,EAAI,QAAQ,aACLA;AAGT,MAAKH,MAAuB;AAC1B,kBAAQ,KAAK,6EAA6E,GACpF,IAAI,MAAM,6EAA6E;AAE/F,SAAKA,MAAuB,aAC1B,QAAQ,KAAK,8FAA8F,GAC3GG,EAAI,UAAU,YACdA,EAAI,QAAQ,WACLA,KAEJH,MAAuB,eAC1B,QAAQ,KAAK,mGAAmG,GAChHG,EAAI,UAAU,aACdA,EAAI,QAAQ,aACLA,MAEJH,MAAuB,kBAC1B,QAAQ,KAAK,iGAAiG,GAC9GG,EAAI,UAAU,aACdA,EAAI,QAAQ,UACLA;AAGX,GAEMC,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAS,IAAUA,IAC/BE,EAAcF,CAAS,IAFP,MAqEZG,IAASC,EAAM;AAAA,EAC1B,CAACV,GAAOW,MAAQ;AACd,UAAM;AAAA,MACJ,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,SAAAZ;AAAA,MACA,OAAAE;AAAA,MACA,MAAAD;AAAA,MACA,SAAAY,IAAU;AAAA,MACV,OAAAC,IAAQ;AAAA,MACR,SAAAC;AAAA,MACA,cAAAC,IAAe,CAAA;AAAA,MACf,SAAAC;AAAA,MACA,SAAAC,IAAU;AAAA,MACV,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,cAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDxB,GACEyB,IAAOX,IAAUY,IAAO,UACxBC,IAAMT,KAAWF,KAAWD,GAE5Ba,IAAUd,IACZM,IAEA,gBAAAS,EAAAC,GAAA,EACG,UAAA;AAAA,MAAA,CAAC,CAACT,KACD,gBAAAU,EAACC,GAAA,EAAW,SAAAb,GAAkB,MAAAjB,GAC3B,UAAAG,EAAgBgB,CAAc,GACjC;AAAA,MAGDD;AAAA,MAEA,CAAC,CAACE,KACD,gBAAAS,EAACC,KAAW,SAAAb,GAAkB,MAAAjB,GAC3B,UAAAG,EAAgBiB,CAAY,GAC/B;AAAA,MAGD,CAAC,CAACC,KAAgB,gBAAAQ,EAAC,QAAA,EAAK,WAAU,WAAW,UAAA,OAAOR,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAAK;AAAA,IAAA,GACpH,GAGEU,IACJ,gBAAAF;AAAA,MAACN;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAd;AAAA,QACA,UAAAC;AAAA,QACA,WAAWsB;AAAA,UACTC,EAAe;AAAA,YACb,GAAGpC,EAA4B,EAAE,SAAAE,GAAS,MAAAC,GAAM,OAAAC,GAAO;AAAA,YACvD,WAAAU;AAAA,UAAA,CACD;AAAA,UACDM,KAAW;AAAA,QAAA;AAAA,QAEZ,GAAGK;AAAA,QAEH,UAAAI;AAAA,MAAA;AAAA,IAAA;AAIL,WAAKD,IAEH,gBAAAI;AAAA,MAACK;AAAA,MAAA;AAAA,QACE,GAAInB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASL,KAAYO,KAAW,CAACQ,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAM;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACAxB,EAAO,cAAc;"}
1
+ {"version":3,"file":"Button.js","sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from \"react\"\r\nimport { Slot } from \"@radix-ui/react-slot\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\nimport { ButtonVarianceProps, buttonVariants } from './buttonVariants';\r\nimport { ButtonAdornmentProps, type ButtonProps } from './Button.types';\r\n\r\nimport { Tooltip } from '../Tooltip';\r\nimport { LoadedIcon } from \"../LoadedIcon\";\r\nimport { createElement, isValidElement } from \"react\";\r\n\r\nconst normalizedVariantProperties = (props: ButtonVarianceProps): ButtonVarianceProps => {\r\n const { variant, size, color } = props;\r\n const vls = { color, variant, size }\r\n if ((variant as string) === 'default') {\r\n console.warn('Button variant \"default\" is deprecated. Please use \"variant=contained color=primary\" instead.')\r\n vls.variant = 'contained'\r\n vls.color = 'primary'\r\n return vls\r\n }\r\n if ((size as string) === 'icon') {\r\n console.warn('Button size \"icon\" is deprecated. Please use \"<ButtonIcon/>\" component instead.')\r\n vls.variant = 'contained'\r\n vls.color = 'secondary'\r\n return vls\r\n // throw new Error('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\r\n }\r\n if ((variant as string) === 'transparent') {\r\n console.warn('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\r\n throw new Error('Button variant \"transparent\" is removed. Please use \"variant=none\" instead.')\r\n }\r\n if ((variant as string) === 'outline') {\r\n console.warn('Button variant \"outline\" is deprecated. Please use \"variant=outlined color=primary\" instead.')\r\n vls.variant = 'outlined'\r\n vls.color = 'primary'\r\n return vls\r\n }\r\n if ((variant as string) === 'secondary') {\r\n console.warn('Button variant \"secondary\" is deprecated. Please use \"variant=contained color=secondary\" instead.')\r\n vls.variant = 'contained'\r\n vls.color = 'secondary'\r\n return vls\r\n }\r\n if ((variant as string) === 'destructive') {\r\n console.warn('Button variant \"destructive\" is deprecated. Please use \"variant=contained color=error\" instead.')\r\n vls.variant = 'contained'\r\n vls.color = 'error'\r\n return vls\r\n }\r\n return vls;\r\n}\r\n\r\nconst renderAdornment = (Adornment?: ButtonAdornmentProps) => {\r\n if (!Adornment) return null;\r\n if (isValidElement(Adornment)) return Adornment;\r\n return createElement(Adornment);\r\n};\r\n\r\n/**\r\n * Universal Button component used for triggering actions and UI interactions.\r\n * Supports variants, sizes, colors, start/end icon adornments, custom slot content,\r\n * tooltip integration, loading state, and polymorphic rendering via `asChild`.\r\n *\r\n * @public\r\n * @see [Documentation](#) // TODO: add link to docs\r\n *\r\n * @example\r\n * > Import:\r\n * ```tsx\r\n * import { Button } from '@oneplatformdev/ui/Button';\r\n * ```\r\n * > Basic usage:\r\n * ```tsx\r\n * <Button>Click me</Button>\r\n * ```\r\n * > Variant and size:\r\n * ```tsx\r\n * <Button variant=\"outline\" size=\"lg\">Large Button</Button>\r\n * ```\r\n * > With icons:\r\n * ```tsx\r\n * <Button startAdornment={<PlusIcon />}>Create</Button>\r\n * <Button endAdornment={<ArrowRightIcon />}>Next</Button>\r\n * ```\r\n * > Icon style button:\r\n * ```tsx\r\n * <Button size=\"icon\">\r\n * <PlusIcon />\r\n * </Button>\r\n * ```\r\n * > Polymorphic rendering (`asChild`):\r\n * ```tsx\r\n * <Button asChild>\r\n * <a href=\"/dashboard\">Go to Dashboard</a>\r\n * </Button>\r\n * ```\r\n * > Tooltip via `message` or native `title`:\r\n * ```tsx\r\n * <Button title=\"Tooltip text\">Hover me</Button>\r\n * <Button message=\"Tooltip content\">Hover me</Button>\r\n * ```\r\n * > Loading state:\r\n * ```tsx\r\n * <Button loading>Processing...</Button>\r\n * ```\r\n * > Disabled:\r\n * ```tsx\r\n * <Button disabled>Disabled</Button>\r\n * ```\r\n *\r\n * Sizes\r\n * xs — compact, for tight UI areas. Classes: rounded-sm p-1 gap-1 text-xs min-h-4 min-w-14.\r\n * sm — small; slightly larger than xs. Classes: rounded-md p-1 gap-1 text-sm min-h-6 min-w-20.\r\n * md — default/text-heavy buttons. Classes: min-h-8 min-w-[102px] rounded-lg gap-1 px-2 py-1 text-sm leading-[1.12] [&_svg]:size-6.\r\n * lg — large/call-to-action. Classes: min-h-10 min-w-35 rounded-lg gap-1 px-3 py-2 text-base leading-normal [&_svg]:size-6.\r\n *\r\n * @remarks\r\n * - Designed for texted usage. If you need icon-only, use `ButtonIcon`.\r\n * - Works with any SVG React component or element, e.g. lucide-react, heroicons, custom icons.\r\n *\r\n * @see {@link ButtonIcon} for icon-only buttons\r\n */\r\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n (props, ref) => {\r\n const {\r\n disabled,\r\n className,\r\n variant,\r\n color,\r\n size,\r\n asChild = false,\r\n title = '',\r\n tooltip,\r\n tooltipProps = {},\r\n message,\r\n loading = false,\r\n children,\r\n startAdornment,\r\n endAdornment,\r\n screenReader,\r\n ...rest\r\n } = props;\r\n const Comp = asChild ? Slot : \"button\"\r\n const msg = message || tooltip || title;\r\n\r\n const content = asChild\r\n ? children\r\n : (\r\n <>\r\n {!!startAdornment && (\r\n <LoadedIcon loading={loading} size={size}>\r\n {renderAdornment(startAdornment)}\r\n </LoadedIcon>\r\n )}\r\n\r\n {children}\r\n\r\n {!!endAdornment && (\r\n <LoadedIcon loading={loading} size={size}>\r\n {renderAdornment(endAdornment)}\r\n </LoadedIcon>\r\n )}\r\n\r\n {!!screenReader && <span className=\"sr-only\">{typeof screenReader === 'string' ? screenReader : screenReader.text}</span>}\r\n </>\r\n )\r\n\r\n const cmp = (\r\n <Comp\r\n type='button'\r\n ref={ref}\r\n disabled={disabled}\r\n className={cn(\r\n buttonVariants({\r\n ...normalizedVariantProperties({ variant, size, color }),\r\n className\r\n }),\r\n loading && 'pointer-events-none opacity-80 user-select-none',\r\n )}\r\n {...rest}\r\n >\r\n {content}\r\n </Comp>\r\n )\r\n\r\n if (!msg) return cmp\r\n return (\r\n <Tooltip\r\n {...(tooltipProps || {})}\r\n open={tooltipProps.open ?? (disabled || loading || !msg) ? false : undefined}\r\n message={msg}\r\n >\r\n {cmp}\r\n </Tooltip>\r\n )\r\n }\r\n)\r\nButton.displayName = \"Button\"\r\nexport default Button;\r\n"],"names":["normalizedVariantProperties","props","variant","size","color","vls","renderAdornment","Adornment","isValidElement","createElement","Button","React","ref","disabled","className","asChild","title","tooltip","tooltipProps","message","loading","children","startAdornment","endAdornment","screenReader","rest","Comp","Slot","msg","content","jsxs","Fragment","jsx","LoadedIcon","cmp","cn","buttonVariants","Tooltip"],"mappings":";;;;;;;;AAWA,MAAMA,IAA8B,CAACC,MAAoD;AACvF,QAAM,EAAE,SAAAC,GAAS,MAAAC,GAAM,OAAAC,EAAA,IAAUH,GAC3BI,IAAM,EAAE,OAAAD,GAAO,SAAAF,GAAS,MAAAC,EAAA;AAC9B,MAAKD,MAAuB;AAC1B,mBAAQ,KAAK,+FAA+F,GAC5GG,EAAI,UAAU,aACdA,EAAI,QAAQ,WACLA;AAET,MAAKF,MAAoB;AACvB,mBAAQ,KAAK,iFAAiF,GAC9FE,EAAI,UAAU,aACdA,EAAI,QAAQ,aACLA;AAGT,MAAKH,MAAuB;AAC1B,kBAAQ,KAAK,6EAA6E,GACpF,IAAI,MAAM,6EAA6E;AAE/F,SAAKA,MAAuB,aAC1B,QAAQ,KAAK,8FAA8F,GAC3GG,EAAI,UAAU,YACdA,EAAI,QAAQ,WACLA,KAEJH,MAAuB,eAC1B,QAAQ,KAAK,mGAAmG,GAChHG,EAAI,UAAU,aACdA,EAAI,QAAQ,aACLA,MAEJH,MAAuB,kBAC1B,QAAQ,KAAK,iGAAiG,GAC9GG,EAAI,UAAU,aACdA,EAAI,QAAQ,UACLA;AAGX,GAEMC,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAS,IAAUA,IAC/BE,EAAcF,CAAS,IAFP,MAqEZG,IAASC,EAAM;AAAA,EAC1B,CAACV,GAAOW,MAAQ;AACd,UAAM;AAAA,MACJ,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,SAAAZ;AAAA,MACA,OAAAE;AAAA,MACA,MAAAD;AAAA,MACA,SAAAY,IAAU;AAAA,MACV,OAAAC,IAAQ;AAAA,MACR,SAAAC;AAAA,MACA,cAAAC,IAAe,CAAA;AAAA,MACf,SAAAC;AAAA,MACA,SAAAC,IAAU;AAAA,MACV,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,cAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACDxB,GACEyB,IAAOX,IAAUY,IAAO,UACxBC,IAAMT,KAAWF,KAAWD,GAE5Ba,IAAUd,IACZM,IAEA,gBAAAS,EAAAC,GAAA,EACG,UAAA;AAAA,MAAA,CAAC,CAACT,KACD,gBAAAU,EAACC,GAAA,EAAW,SAAAb,GAAkB,MAAAjB,GAC3B,UAAAG,EAAgBgB,CAAc,GACjC;AAAA,MAGDD;AAAA,MAEA,CAAC,CAACE,KACD,gBAAAS,EAACC,KAAW,SAAAb,GAAkB,MAAAjB,GAC3B,UAAAG,EAAgBiB,CAAY,GAC/B;AAAA,MAGD,CAAC,CAACC,KAAgB,gBAAAQ,EAAC,QAAA,EAAK,WAAU,WAAW,UAAA,OAAOR,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAAK;AAAA,IAAA,GACpH,GAGEU,IACJ,gBAAAF;AAAA,MAACN;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAd;AAAA,QACA,UAAAC;AAAA,QACA,WAAWsB;AAAA,UACTC,EAAe;AAAA,YACb,GAAGpC,EAA4B,EAAE,SAAAE,GAAS,MAAAC,GAAM,OAAAC,GAAO;AAAA,YACvD,WAAAU;AAAA,UAAA,CACD;AAAA,UACDM,KAAW;AAAA,QAAA;AAAA,QAEZ,GAAGK;AAAA,QAEH,UAAAI;AAAA,MAAA;AAAA,IAAA;AAIL,WAAKD,IAEH,gBAAAI;AAAA,MAACK;AAAA,MAAA;AAAA,QACE,GAAInB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASL,KAAYO,KAAW,CAACQ,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAM;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACAxB,EAAO,cAAc;"}
@@ -1 +1 @@
1
- {"version":3,"file":"Button.stories.js","sources":["../../src/Button/Button.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\n\nimport { Button } from './Button';\nimport { ButtonProps } from './Button.types';\nimport React from 'react';\nimport { PlusIcon, Trash2Icon, FileDownIcon } from 'lucide-react';\nimport { DashedWrapper } from \"../../.storybook/Wrappers\";\n\nconst States = (props: ButtonProps) => (\n <div\n style={{\n position: 'relative',\n display: 'flex',\n flexDirection: 'column',\n gap: '16px',\n }}\n >\n {[ 'default', 'hover', 'focus', 'active', 'disabled', 'loading' ]\n .map((state) => (\n <Button\n key={state}\n id={state}\n {...props}\n disabled={state === 'disabled' || props.disabled}\n loading={state === 'loading' || props.loading}\n >\n {props.children}\n </Button>\n ))}\n </div>\n);\n\nconst variants: ButtonProps['variant'][] = [ 'none', 'contained', 'outlined', 'ghost' ]\nconst colors: ButtonProps['color'][] = [ 'primary', 'secondary', 'error' ]\nconst sizes: ButtonProps['size'][] = [ 'xs', 'sm', 'md', 'lg' ]\n\nconst variant_default: ButtonProps['variant'] = 'contained';\nconst color_default: ButtonProps['color'] = 'primary';\nconst size_default: ButtonProps['size'] = 'lg';\n\nconst iconMap = {\n 'undefined': undefined,\n \"<PlusIcon />\": <PlusIcon/>,\n \"<Trash2Icon />\": <Trash2Icon/>,\n \"<FileDownIcon />\": <FileDownIcon/>,\n PlusIcon: PlusIcon,\n Trash2Icon: Trash2Icon,\n FileDownIcon: FileDownIcon,\n};\n\nconst meta = {\n title: 'Button',\n component: Button,\n // render: Template,\n args: {\n tooltip: undefined,\n asChild: false,\n //\n variant: variant_default,\n color: color_default,\n size: size_default,\n loading: false,\n disabled: false,\n startAdornment: undefined,\n endAdornment: undefined,\n slotProps: {},\n tooltipProps: {}\n },\n argTypes: {\n tooltip: {\n name: 'tooltip',\n description: 'Button tooltip from ButtonProps [deprecated, use title and message instead]',\n control: false,\n },\n asChild: {\n name: 'asChild',\n description: 'Button asChild from ButtonProps [boolean]',\n control: false\n },\n variant: {\n name: 'variant',\n description: 'Button variant from ButtonProps',\n options: variants,\n control: { type: 'inline-radio', }\n },\n color: {\n name: 'color',\n description: 'Button color from ButtonProps',\n options: colors,\n control: { type: 'inline-radio' }\n },\n size: {\n name: 'size',\n description: 'Button size from ButtonProps',\n options: sizes,\n control: { type: 'inline-radio' }\n },\n title: {\n name: 'title',\n description: \"Button tooltip title from HTMLAttributes<HTMLButtonElement> [string only]\",\n control: { type: 'text' },\n },\n message: {\n name: 'message',\n description: 'Button tooltip message from ButtonProps [ReactNode]',\n control: { type: \"object\" },\n },\n startAdornment: {\n name: 'startAdornment',\n description: 'Button startAdornment from ButtonProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\n options: Object.keys(iconMap),\n mapping: iconMap,\n control: { type: 'inline-radio' },\n },\n endAdornment: {\n name: 'endAdornment',\n description: 'Button endAdornment from ButtonProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\n options: Object.keys(iconMap),\n mapping: iconMap,\n control: { type: 'inline-radio' },\n },\n slotProps: {\n name: 'slotProps',\n description: 'Button slotProps from ButtonProps [object]',\n control: { type: \"object\" },\n },\n tooltipProps: {\n name: 'tooltipProps',\n description: 'Button tooltipProps from ButtonProps [object]',\n control: { type: \"object\" },\n },\n },\n parameters: {\n pseudo: {\n hover: '#hover',\n focus: '#focus',\n active: '#active',\n disabled: '#disabled',\n },\n }\n} satisfies Meta<typeof Button>;\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\nconst args: Story['args'] = {\n ...meta.args,\n startAdornment: <PlusIcon/>,\n endAdornment: <PlusIcon/>,\n children: 'children',\n}\n\nexport const Default: Story = {\n args: {\n ...meta.args,\n children: '_children_',\n }\n};\n\nexport const Disabled: Story = {\n render: (props) => (\n <DashedWrapper>\n <Button {...props} />\n <Button {...props} startAdornment={<PlusIcon/>}/>\n <Button {...props} startAdornment={<PlusIcon/>} endAdornment={<PlusIcon/>}/>\n <Button {...props} endAdornment={<PlusIcon/>}/>\n </DashedWrapper>\n ),\n args: {\n ...meta.args,\n disabled: true,\n children: 'disabled',\n }\n};\n\nexport const Loading: Story = {\n render: (props) => (\n <DashedWrapper>\n <Button {...props} />\n <Button {...props} startAdornment={<PlusIcon/>}/>\n <Button {...props} startAdornment={<PlusIcon/>} endAdornment={<PlusIcon/>}/>\n <Button {...props} endAdornment={<PlusIcon/>}/>\n </DashedWrapper>\n ),\n args: {\n children: 'Loading…',\n loading: true,\n },\n};\n\nexport const Tooltips: Story = {\n render: (props) => (\n <DashedWrapper>\n <div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>\n <Button\n {...props}\n title='delayDuration: 0'\n tooltipProps={{ delayDuration: 0 }}\n >\n delayDuration: 0\n </Button>\n <Button\n {...props}\n title='delayDuration: 300 [default]'\n tooltipProps={{ delayDuration: 300 }}\n >\n delayDuration: 300\n </Button>\n <Button\n {...props}\n title='delayDuration: 700'\n tooltipProps={{ delayDuration: 700 }}\n >\n delayDuration: 700\n </Button>\n\n <Button {...props} title='title_string'>title</Button>\n <Button {...props} message='message_string'>message: string</Button>\n <Button\n {...props}\n message={<span>message_node_span</span>}\n >\n message: ReactNode\n </Button>\n <Button\n {...props}\n message='message_string'\n tooltipProps={{\n showQuestionMark: true\n }}\n >\n showQuestionMark: true\n </Button>\n </div>\n </DashedWrapper>\n ),\n args: {\n children: 'tooltips',\n tooltipProps: {\n defaultOpen: true\n },\n },\n};\n\nexport const Primary: Story = {\n args: {\n ...args,\n color: 'primary',\n size: 'lg',\n children: 'Створити',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: (props) => (\n <div className='flex'>\n <DashedWrapper>\n <States {...props} variant='contained'/>\n <States {...props} variant='outlined'/>\n <States {...props} variant='ghost'/>\n </DashedWrapper>\n </div>\n ),\n};\n\nexport const Secondary: Story = {\n args: {\n ...args,\n color: 'secondary',\n size: 'lg',\n children: 'Створити',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: (props) => (\n <div className='flex'>\n <DashedWrapper>\n <States {...props} variant='contained'/>\n <States {...props} variant='outlined'/>\n <States {...props} variant='ghost'/>\n </DashedWrapper>\n </div>\n ),\n};\n\nexport const Error: Story = {\n args: {\n ...args,\n color: 'error',\n size: 'lg',\n children: 'Створити',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: (props) => (\n <div className='flex'>\n <DashedWrapper>\n <States {...props} variant='contained'/>\n <States {...props} variant='outlined'/>\n <States {...props} variant='ghost'/>\n </DashedWrapper>\n </div>\n ),\n};\n"],"names":["States","props","jsx","state","Button","variants","colors","sizes","variant_default","color_default","size_default","iconMap","PlusIcon","Trash2Icon","FileDownIcon","meta","args","Default","Disabled","jsxs","DashedWrapper","Loading","Tooltips","Primary","Secondary","Error"],"mappings":"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"}
1
+ {"version":3,"file":"Button.stories.js","sources":["../../src/Button/Button.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\r\n\r\nimport { Button } from './Button';\r\nimport { ButtonProps } from './Button.types';\r\nimport React from 'react';\r\nimport { PlusIcon, Trash2Icon, FileDownIcon } from 'lucide-react';\r\nimport { DashedWrapper } from \"../../.storybook/Wrappers\";\r\n\r\nconst States = (props: ButtonProps) => (\r\n <div\r\n style={{\r\n position: 'relative',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '16px',\r\n }}\r\n >\r\n {[ 'default', 'hover', 'focus', 'active', 'disabled', 'loading' ]\r\n .map((state) => (\r\n <Button\r\n key={state}\r\n id={state}\r\n {...props}\r\n disabled={state === 'disabled' || props.disabled}\r\n loading={state === 'loading' || props.loading}\r\n >\r\n {props.children}\r\n </Button>\r\n ))}\r\n </div>\r\n);\r\n\r\nconst variants: ButtonProps['variant'][] = [ 'none', 'contained', 'outlined', 'ghost' ]\r\nconst colors: ButtonProps['color'][] = [ 'primary', 'secondary', 'error' ]\r\nconst sizes: ButtonProps['size'][] = [ 'xs', 'sm', 'md', 'lg' ]\r\n\r\nconst variant_default: ButtonProps['variant'] = 'contained';\r\nconst color_default: ButtonProps['color'] = 'primary';\r\nconst size_default: ButtonProps['size'] = 'lg';\r\n\r\nconst iconMap = {\r\n 'undefined': undefined,\r\n \"<PlusIcon />\": <PlusIcon/>,\r\n \"<Trash2Icon />\": <Trash2Icon/>,\r\n \"<FileDownIcon />\": <FileDownIcon/>,\r\n PlusIcon: PlusIcon,\r\n Trash2Icon: Trash2Icon,\r\n FileDownIcon: FileDownIcon,\r\n};\r\n\r\nconst meta = {\r\n title: 'Button',\r\n component: Button,\r\n // render: Template,\r\n args: {\r\n tooltip: undefined,\r\n asChild: false,\r\n //\r\n variant: variant_default,\r\n color: color_default,\r\n size: size_default,\r\n loading: false,\r\n disabled: false,\r\n startAdornment: undefined,\r\n endAdornment: undefined,\r\n slotProps: {},\r\n tooltipProps: {}\r\n },\r\n argTypes: {\r\n tooltip: {\r\n name: 'tooltip',\r\n description: 'Button tooltip from ButtonProps [deprecated, use title and message instead]',\r\n control: false,\r\n },\r\n asChild: {\r\n name: 'asChild',\r\n description: 'Button asChild from ButtonProps [boolean]',\r\n control: false\r\n },\r\n variant: {\r\n name: 'variant',\r\n description: 'Button variant from ButtonProps',\r\n options: variants,\r\n control: { type: 'inline-radio', }\r\n },\r\n color: {\r\n name: 'color',\r\n description: 'Button color from ButtonProps',\r\n options: colors,\r\n control: { type: 'inline-radio' }\r\n },\r\n size: {\r\n name: 'size',\r\n description: 'Button size from ButtonProps',\r\n options: sizes,\r\n control: { type: 'inline-radio' }\r\n },\r\n title: {\r\n name: 'title',\r\n description: \"Button tooltip title from HTMLAttributes<HTMLButtonElement> [string only]\",\r\n control: { type: 'text' },\r\n },\r\n message: {\r\n name: 'message',\r\n description: 'Button tooltip message from ButtonProps [ReactNode]',\r\n control: { type: \"object\" },\r\n },\r\n startAdornment: {\r\n name: 'startAdornment',\r\n description: 'Button startAdornment from ButtonProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\r\n options: Object.keys(iconMap),\r\n mapping: iconMap,\r\n control: { type: 'inline-radio' },\r\n },\r\n endAdornment: {\r\n name: 'endAdornment',\r\n description: 'Button endAdornment from ButtonProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\r\n options: Object.keys(iconMap),\r\n mapping: iconMap,\r\n control: { type: 'inline-radio' },\r\n },\r\n slotProps: {\r\n name: 'slotProps',\r\n description: 'Button slotProps from ButtonProps [object]',\r\n control: { type: \"object\" },\r\n },\r\n tooltipProps: {\r\n name: 'tooltipProps',\r\n description: 'Button tooltipProps from ButtonProps [object]',\r\n control: { type: \"object\" },\r\n },\r\n },\r\n parameters: {\r\n pseudo: {\r\n hover: '#hover',\r\n focus: '#focus',\r\n active: '#active',\r\n disabled: '#disabled',\r\n },\r\n }\r\n} satisfies Meta<typeof Button>;\r\nexport default meta;\r\n\r\ntype Story = StoryObj<typeof meta>;\r\nconst args: Story['args'] = {\r\n ...meta.args,\r\n startAdornment: <PlusIcon/>,\r\n endAdornment: <PlusIcon/>,\r\n children: 'children',\r\n}\r\n\r\nexport const Default: Story = {\r\n args: {\r\n ...meta.args,\r\n children: '_children_',\r\n }\r\n};\r\n\r\nexport const Disabled: Story = {\r\n render: (props) => (\r\n <DashedWrapper>\r\n <Button {...props} />\r\n <Button {...props} startAdornment={<PlusIcon/>}/>\r\n <Button {...props} startAdornment={<PlusIcon/>} endAdornment={<PlusIcon/>}/>\r\n <Button {...props} endAdornment={<PlusIcon/>}/>\r\n </DashedWrapper>\r\n ),\r\n args: {\r\n ...meta.args,\r\n disabled: true,\r\n children: 'disabled',\r\n }\r\n};\r\n\r\nexport const Loading: Story = {\r\n render: (props) => (\r\n <DashedWrapper>\r\n <Button {...props} />\r\n <Button {...props} startAdornment={<PlusIcon/>}/>\r\n <Button {...props} startAdornment={<PlusIcon/>} endAdornment={<PlusIcon/>}/>\r\n <Button {...props} endAdornment={<PlusIcon/>}/>\r\n </DashedWrapper>\r\n ),\r\n args: {\r\n children: 'Loading…',\r\n loading: true,\r\n },\r\n};\r\n\r\nexport const Tooltips: Story = {\r\n render: (props) => (\r\n <DashedWrapper>\r\n <div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>\r\n <Button\r\n {...props}\r\n title='delayDuration: 0'\r\n tooltipProps={{ delayDuration: 0 }}\r\n >\r\n delayDuration: 0\r\n </Button>\r\n <Button\r\n {...props}\r\n title='delayDuration: 300 [default]'\r\n tooltipProps={{ delayDuration: 300 }}\r\n >\r\n delayDuration: 300\r\n </Button>\r\n <Button\r\n {...props}\r\n title='delayDuration: 700'\r\n tooltipProps={{ delayDuration: 700 }}\r\n >\r\n delayDuration: 700\r\n </Button>\r\n\r\n <Button {...props} title='title_string'>title</Button>\r\n <Button {...props} message='message_string'>message: string</Button>\r\n <Button\r\n {...props}\r\n message={<span>message_node_span</span>}\r\n >\r\n message: ReactNode\r\n </Button>\r\n <Button\r\n {...props}\r\n message='message_string'\r\n tooltipProps={{\r\n showQuestionMark: true\r\n }}\r\n >\r\n showQuestionMark: true\r\n </Button>\r\n </div>\r\n </DashedWrapper>\r\n ),\r\n args: {\r\n children: 'tooltips',\r\n tooltipProps: {\r\n defaultOpen: true\r\n },\r\n },\r\n};\r\n\r\nexport const Primary: Story = {\r\n args: {\r\n ...args,\r\n color: 'primary',\r\n size: 'lg',\r\n children: 'Створити',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: (props) => (\r\n <div className='flex'>\r\n <DashedWrapper>\r\n <States {...props} variant='contained'/>\r\n <States {...props} variant='outlined'/>\r\n <States {...props} variant='ghost'/>\r\n </DashedWrapper>\r\n </div>\r\n ),\r\n};\r\n\r\nexport const Secondary: Story = {\r\n args: {\r\n ...args,\r\n color: 'secondary',\r\n size: 'lg',\r\n children: 'Створити',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: (props) => (\r\n <div className='flex'>\r\n <DashedWrapper>\r\n <States {...props} variant='contained'/>\r\n <States {...props} variant='outlined'/>\r\n <States {...props} variant='ghost'/>\r\n </DashedWrapper>\r\n </div>\r\n ),\r\n};\r\n\r\nexport const Error: Story = {\r\n args: {\r\n ...args,\r\n color: 'error',\r\n size: 'lg',\r\n children: 'Створити',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: (props) => (\r\n <div className='flex'>\r\n <DashedWrapper>\r\n <States {...props} variant='contained'/>\r\n <States {...props} variant='outlined'/>\r\n <States {...props} variant='ghost'/>\r\n </DashedWrapper>\r\n </div>\r\n ),\r\n};\r\n"],"names":["States","props","jsx","state","Button","variants","colors","sizes","variant_default","color_default","size_default","iconMap","PlusIcon","Trash2Icon","FileDownIcon","meta","args","Default","Disabled","jsxs","DashedWrapper","Loading","Tooltips","Primary","Secondary","Error"],"mappings":"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"}
@@ -1 +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
+ {"version":3,"file":"ButtonCounterBadge.js","sources":["../../src/Button/ButtonCounterBadge.tsx"],"sourcesContent":["import { ButtonCounterBadgeReader, ButtonCounterBadgeReaderOptions } from \"./Button.types\";\r\nimport { type ButtonBadgeCVAProps, buttonBadgeVariants } from \"./buttonVariants\";\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\nexport interface ButtonCounterBadgeProps extends ButtonBadgeCVAProps {\r\n counter?: ButtonCounterBadgeReader;\r\n}\r\n\r\nconst normalizeCounter = (counter: ButtonCounterBadgeReader): ButtonCounterBadgeReaderOptions | null => {\r\n if(!counter) return null\r\n if(typeof counter === 'number') return { count: counter };\r\n return counter;\r\n}\r\n\r\nconst MIN_COUNT = 99;\r\nconst normalizeCount = (count: number): number => {\r\n const c = count || 0;\r\n return Math.max(0, Math.min(c, MIN_COUNT));\r\n}\r\n\r\nconst isOverflown = (count: number): boolean => count > MIN_COUNT\r\n\r\nexport const ButtonCounterBadge = (props: ButtonCounterBadgeProps) => {\r\n const {counter: initializeCounter, ...rest} = props;\r\n const counter = normalizeCounter(initializeCounter);\r\n if(!counter?.count) return null;\r\n return (\r\n <div\r\n className={cn(buttonBadgeVariants({ ...rest }))}\r\n >\r\n {normalizeCount(counter.count)}\r\n {isOverflown(counter.count) && (\r\n <span className=\"relative -top-[0.5px]\">+</span>\r\n )}\r\n </div>\r\n )\r\n}\r\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;"}
@@ -8,7 +8,7 @@ const s = r(
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
10
  "[&_svg]:pointer-events-none [&_svg]:shrink-0",
11
- "transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200"
11
+ "transition-transform [&_svg]:transition-transform"
12
12
  ],
13
13
  {
14
14
  variants: {
@@ -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 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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"}
1
+ {"version":3,"file":"buttonVariants.js","sources":["../../src/Button/buttonVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\nexport const buttonVariants = cva(\r\n [\r\n \"inline-flex items-center justify-center box-border\",\r\n 'whitespace-nowrap font-medium',\r\n 'cursor-pointer',\r\n \"transition-colors focus-visible:outline-hidden focus-visible:ring-none focus-visible:ring-transparent\",\r\n \"disabled:pointer-events-none disabled:cursor-default\",\r\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\r\n 'transition-transform [&_svg]:transition-transform',\r\n ],\r\n {\r\n variants: {\r\n variant: {\r\n none: \"\",\r\n contained: \"\",\r\n outlined: \"\",\r\n ghost: '',\r\n },\r\n color: {\r\n primary: '',\r\n secondary: '',\r\n error: '',\r\n },\r\n size: {\r\n xs: 'rounded-sm p-1 gap-1 text-xs min-h-4 min-w-14',\r\n sm: 'rounded-md p-1 gap-1 text-sm min-h-6 min-w-20',\r\n md: cn(\r\n 'min-h-8 min-w-[102px] rounded-lg gap-1 px-2 py-1',\r\n 'text-sm leading-[1.12] [&_svg]:size-6',\r\n ),\r\n lg: cn(\r\n \"min-h-10 min-w-35 rounded-lg gap-1 px-2.5 py-1.5\",\r\n 'text-base leading-normal [&_svg]:size-6',\r\n )\r\n }\r\n },\r\n compoundVariants: [\r\n // PRIMARY BUTTON VARIANTS\r\n {\r\n color: 'primary',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#9368FF] border border-[#9368FF] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\r\n 'hover:bg-[#7F4EEB]',\r\n 'focus:bg-[#7F4EEB] focus:border-[#6B3DD9]',\r\n 'active:bg-[#6B3DD9]',\r\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'primary',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#9368FF] text-[#9368FF] [&_svg]:text-[#9368FF]',\r\n 'hover:bg-[#9368FF0F]',\r\n 'active:bg-[#9368FF0F] active:border-[#6B3DD9]',\r\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'primary',\r\n variant: 'ghost',\r\n className: cn(\r\n 'bg-transparent border border-transparent text-[#9368FF] [&_svg]:text-[#9368FF]',\r\n 'hover:text-[#6B3DD9] hover:[&_svg]:text-[#6B3DD9]',\r\n 'focus:text-[#6B3DD9] focus:[&_svg]:text-[#6B3DD9]',\r\n 'active:bg-[#9368FF0F]',\r\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n // SECONDARY BUTTON VARIANTS\r\n {\r\n color: 'secondary',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#FCFCFC] border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\r\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\r\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\r\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\r\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'secondary',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\r\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\r\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\r\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\r\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'secondary',\r\n variant: 'ghost',\r\n className: cn(\r\n 'text-[#06080D] [&_svg]:text-[#06080D] bg-transparent border border-transparent',\r\n 'hover:bg-[#F9FAFB]',\r\n 'focus:bg-[#FCFCFC]',\r\n 'active:bg-[#F9FAFB]',\r\n 'disabled:bg-[#FCFCFC] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n // ERROR BUTTON VARIANTS\r\n {\r\n color: 'error',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#EF4444] border border-[#EF4444] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\r\n 'hover:bg-[#DC2626]',\r\n 'focus:bg-[#DC2626]',\r\n 'active:bg-[#DC2626]',\r\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'error',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#EF4444] text-[#EF4444] [&_svg]:text-[#EF4444]',\r\n 'hover:bg-[#EF44440F]',\r\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\r\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'error',\r\n variant: 'ghost',\r\n className: cn(\r\n 'bg-transparent border border-transparent text-[#EF4444] [&_svg]:text-[#EF4444]',\r\n 'hover:bg-[#EF44440F] hover:text-[#DC2626] hover:[&_svg]:text-[#DC2626]',\r\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\r\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n ],\r\n defaultVariants: {\r\n variant: 'contained',\r\n color: 'primary',\r\n size: 'lg',\r\n },\r\n }\r\n)\r\n\r\nexport type ButtonVarianceProps = VariantProps<typeof buttonVariants>;\r\n\r\nexport const buttonBadgeVariants = cva(\r\n [\r\n 'absolute z-0',\r\n 'flex items-center justify-center text-center p-0',\r\n 'font-medium leading-none tracking-tighter',\r\n 'rounded-full w-fit min-w-4 h-4 text-[10px] px-0.5 box-border',\r\n ],\r\n {\r\n variants: {\r\n variant: {\r\n none: '',\r\n contained: '',\r\n outlined: '',\r\n ghost: \"\",\r\n },\r\n color: {\r\n primary: \"\",\r\n secondary: \"\",\r\n error: \"\"\r\n },\r\n size: {\r\n xs: '',\r\n sm: '',\r\n md: '',\r\n lg: '-top-[2px] left-[14px]',\r\n },\r\n rounded: {\r\n true: 'left-1/2 -translate-x-1/2 -translate-y-1/2',\r\n false: '',\r\n },\r\n disabled: {\r\n true: '',\r\n false: '',\r\n }\r\n },\r\n compoundVariants: [\r\n // SIZE XS\r\n { size: 'xs', rounded: false, className: '-top-px -right-px translate-x-1/2 -translate-y-1/2' },\r\n { size: 'xs', rounded: true, className: '-top-px' },\r\n // SIZE SM\r\n { size: 'sm', rounded: false, className: 'top-0 right-0 translate-x-1/2 -translate-y-1/2' },\r\n { size: 'sm', rounded: true, className: '-top-[3px]' },\r\n // SIZE MD\r\n { size: 'md', rounded: false, className: '-top-[4px] left-[12px]' },\r\n { size: 'md', rounded: true, className: '-top-[6px]' },\r\n // SIZE LG\r\n { size: 'lg', rounded: false, className: '-top-[4px] left-[12px]' },\r\n { size: 'lg', rounded: true, className: '-top-2' },\r\n\r\n // COLORS\r\n {\r\n color: ['primary', 'secondary', 'error'],\r\n className: 'bg-[#9368FF] text-[#FCFCFC]',\r\n },\r\n {\r\n color: ['primary', 'secondary', 'error'],\r\n disabled: true,\r\n className: 'bg-[#666A78] text-[#FCFCFC]'\r\n },\r\n ],\r\n defaultVariants: {\r\n color: \"primary\",\r\n variant: \"contained\",\r\n size: \"lg\",\r\n disabled: false,\r\n rounded: false,\r\n },\r\n }\r\n)\r\nexport type ButtonBadgeCVAProps = VariantProps<typeof buttonBadgeVariants>;\r\n"],"names":["buttonVariants","cva","cn","buttonBadgeVariants"],"mappings":"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"}
@@ -1,24 +1,23 @@
1
- import { jsxs as g, Fragment as R, jsx as r } from "react/jsx-runtime";
1
+ import { jsxs as g, Fragment as R, jsx as e } from "react/jsx-runtime";
2
2
  import * as j from "react";
3
3
  import { isValidElement as E, createElement as I } from "react";
4
4
  import { cn as V } from "@oneplatformdev/utils";
5
5
  import { buttonIconVariants as w } from "./buttonIconVariants.js";
6
6
  import { Slot as z } from "@radix-ui/react-slot";
7
- import "@radix-ui/react-tooltip";
8
- import { Tooltip as F } from "../Tooltip/Tooltip.js";
7
+ import { ButtonCounterBadge as F } from "../Button/ButtonCounterBadge.js";
9
8
  import { LoadedIcon as L } from "../LoadedIcon/LoadedIcon.js";
10
- import { ButtonCounterBadge as P } from "../Button/ButtonCounterBadge.js";
9
+ import { Tooltip as P } from "../Tooltip/Tooltip.js";
11
10
  const S = (t) => t ? E(t) ? t : I(t) : null, T = j.forwardRef(
12
11
  (t, h) => {
13
12
  const {
14
13
  asChild: a,
15
- children: m,
14
+ children: l,
16
15
  icon: b,
17
- disabled: e = !1,
16
+ disabled: r = !1,
18
17
  loading: n = !1,
19
18
  message: y,
20
19
  title: x = "",
21
- tooltipProps: l = {},
20
+ tooltipProps: m = {},
22
21
  className: B,
23
22
  variant: c,
24
23
  color: p,
@@ -27,30 +26,30 @@ const S = (t) => t ? E(t) ? t : I(t) : null, T = j.forwardRef(
27
26
  screenReader: o,
28
27
  counter: N,
29
28
  ...v
30
- } = t, C = a ? z : "button", i = y || x, d = a ? m : /* @__PURE__ */ g(R, { children: [
29
+ } = t, C = a ? z : "button", i = y || x, d = a ? l : /* @__PURE__ */ g(R, { children: [
31
30
  /* @__PURE__ */ g(L, { loading: n, size: s, children: [
32
- S(b) ?? m,
33
- /* @__PURE__ */ r(
34
- P,
31
+ S(b) ?? l,
32
+ /* @__PURE__ */ e(
33
+ F,
35
34
  {
36
35
  counter: N,
37
36
  variant: c,
38
37
  color: p,
39
38
  size: s,
40
- disabled: e,
39
+ disabled: r,
41
40
  rounded: u
42
41
  }
43
42
  )
44
43
  ] }),
45
- !!o && /* @__PURE__ */ r("span", { className: "sr-only", children: typeof o == "string" ? o : o.text })
44
+ !!o && /* @__PURE__ */ e("span", { className: "sr-only", children: typeof o == "string" ? o : o.text })
46
45
  ] });
47
46
  if (!d) return null;
48
- const f = /* @__PURE__ */ r(
47
+ const f = /* @__PURE__ */ e(
49
48
  C,
50
49
  {
51
50
  type: "button",
52
51
  ref: h,
53
- disabled: e,
52
+ disabled: r,
54
53
  className: V(
55
54
  "group group/button group/button-icon",
56
55
  w({
@@ -66,11 +65,11 @@ const S = (t) => t ? E(t) ? t : I(t) : null, T = j.forwardRef(
66
65
  children: d
67
66
  }
68
67
  );
69
- return i ? /* @__PURE__ */ r(
70
- F,
68
+ return i ? /* @__PURE__ */ e(
69
+ P,
71
70
  {
72
- ...l || {},
73
- open: l.open ?? (e || n || !i) ? !1 : void 0,
71
+ ...m || {},
72
+ open: m.open ?? (r || n || !i) ? !1 : void 0,
74
73
  message: i,
75
74
  children: f
76
75
  }
@@ -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\";\nimport { ButtonCounterBadge } from \"../Button/ButtonCounterBadge\";\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 * > 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":["renderInnerIcon","Icon","isValidElement","createElement","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","jsx","ButtonCounterBadge","cmp","cn","buttonIconVariants","Tooltip"],"mappings":";;;;;;;;;;AAaA,MAAMA,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAI,IAAUA,IAC1BE,EAAcF,CAAI,IAFP,MA4DPG,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,QAAAnB,EAAgBU,CAAI,KAAKD;AAAA,QAC1B,gBAAAsB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAAV;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,gBAAAU,EAAC,QAAA,EAAK,WAAU,WACb,UAAA,OAAOV,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAClE;AAAA,IAAA,GAEJ;AAGJ,QAAI,CAACM,EAAS,QAAO;AAErB,UAAMM,IACJ,gBAAAF;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAjB;AAAA,QACA,UAAAI;AAAA,QACA,WAAWuB;AAAA,UACT;AAAA,UACAC,EAAmB;AAAA,YACjB,SAAAlB;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,gBAAAK;AAAA,MAACK;AAAA,MAAA;AAAA,QACE,GAAIrB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASJ,KAAYC,KAAW,CAACc,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAO;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACA7B,EAAW,cAAc;"}
1
+ {"version":3,"file":"ButtonIcon.js","sources":["../../src/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import * as React from \"react\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\nimport { buttonIconVariants } from './buttonIconVariants';\r\nimport { ButtonIconProps } from './ButtonIcon.types';\r\nimport { Slot } from \"@radix-ui/react-slot\"\r\n\r\nimport { Tooltip } from '../Tooltip';\r\nimport { LoadedIcon } from \"../LoadedIcon\";\r\nimport { ButtonIconType } from \"../Button\";\r\nimport { createElement, isValidElement } from \"react\";\r\nimport { ButtonCounterBadge } from \"../Button/ButtonCounterBadge\";\r\n\r\nconst renderInnerIcon = (Icon?: ButtonIconType) => {\r\n if (!Icon) return null;\r\n if (isValidElement(Icon)) return Icon;\r\n return createElement(Icon);\r\n};\r\n\r\n/**\r\n * Icon-only version of the Button component.\r\n *\r\n * `ButtonIcon` is used for compact actions represented by an icon instead of text.\r\n * Supports all core features of Button: variants, sizes, tooltips, disabled and loading state.\r\n *\r\n * @public\r\n * @see [Documentation](#) // TODO: add link to docs\r\n *\r\n * @example\r\n * > Import:\r\n * ```tsx\r\n * import { ButtonIcon } from '@oneplatformdev/ui/ButtonIcon';\r\n * ```\r\n * > Basic usage by icon:\r\n * ```tsx\r\n *<ButtonIcon icon={<PlusIcon />}/>\r\n *<ButtonIcon icon={PlusIcon}/>\r\n * ```\r\n * > Basic usage by children:\r\n * ```tsx\r\n *<ButtonIcon>\r\n * <PlusIcon />\r\n *</ButtonIcon>\r\n * ```\r\n * > With variant & color:\r\n * ```tsx\r\n *<ButtonIcon variant=\"outline\" color=\"primary\">\r\n * <Search />\r\n *</ButtonIcon>\r\n * ```\r\n * > With tooltip message:\r\n * ```tsx\r\n *<ButtonIcon message=\"Edit item\">\r\n * <PencilLine />\r\n *</ButtonIcon>\r\n * ```\r\n * > Loading state:\r\n * ```tsx\r\n *<ButtonIcon loading>\r\n * <Trash2 />\r\n *</ButtonIcon>\r\n * ```\r\n * > Badge counter:\r\n * ```tsx\r\n *<ButtonIcon counter={5} icon={MessageCircleMoreIcon}/>\r\n *<ButtonIcon counter={{ count: 8 }} icon={MessageCircleMoreIcon}/>\r\n * ```\r\n *\r\n * @remarks\r\n * - Designed for icon-only usage. If you need text, use `Button`.\r\n * - Works with any SVG React component or element, e.g. lucide-react, heroicons, custom icons.\r\n *\r\n * @see {@link Button} for regular text buttons\r\n */\r\nexport const ButtonIcon = React.forwardRef<HTMLButtonElement, ButtonIconProps>(\r\n (props, ref) => {\r\n const {\r\n asChild,\r\n children,\r\n icon,\r\n disabled = false,\r\n loading = false,\r\n message,\r\n title = '',\r\n tooltipProps = {},\r\n className,\r\n variant,\r\n color,\r\n size,\r\n rounded,\r\n screenReader,\r\n counter,\r\n ...rest\r\n } = props;\r\n\r\n const Comp = asChild ? Slot : \"button\"\r\n const msg = message || title;\r\n\r\n const content = asChild\r\n ? children\r\n : (\r\n <>\r\n <LoadedIcon loading={loading} size={size}>\r\n {renderInnerIcon(icon) ?? children}\r\n <ButtonCounterBadge\r\n counter={counter}\r\n variant={variant}\r\n color={color}\r\n size={size}\r\n disabled={disabled}\r\n rounded={rounded}\r\n />\r\n </LoadedIcon>\r\n\r\n {!!screenReader && (\r\n <span className=\"sr-only\">\r\n {typeof screenReader === 'string' ? screenReader : screenReader.text}\r\n </span>\r\n )}\r\n </>\r\n )\r\n\r\n if (!content) return null;\r\n\r\n const cmp = (\r\n <Comp\r\n type='button'\r\n ref={ref}\r\n disabled={disabled}\r\n className={cn(\r\n 'group group/button group/button-icon',\r\n buttonIconVariants({\r\n variant, size, color, rounded,\r\n className\r\n }),\r\n loading && 'pointer-events-none opacity-80',\r\n )}\r\n {...rest}\r\n >\r\n {content}\r\n </Comp>\r\n )\r\n\r\n if (!msg) return cmp\r\n return (\r\n <Tooltip\r\n {...(tooltipProps || {})}\r\n open={tooltipProps.open ?? (disabled || loading || !msg) ? false : undefined}\r\n message={msg}\r\n >\r\n {cmp}\r\n </Tooltip>\r\n )\r\n }\r\n)\r\nButtonIcon.displayName = \"Button\"\r\nexport default ButtonIcon;\r\n"],"names":["renderInnerIcon","Icon","isValidElement","createElement","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","jsx","ButtonCounterBadge","cmp","cn","buttonIconVariants","Tooltip"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAkB,CAACC,MAClBA,IACDC,EAAeD,CAAI,IAAUA,IAC1BE,EAAcF,CAAI,IAFP,MA4DPG,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,QAAAnB,EAAgBU,CAAI,KAAKD;AAAA,QAC1B,gBAAAsB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAAV;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,gBAAAU,EAAC,QAAA,EAAK,WAAU,WACb,UAAA,OAAOV,KAAiB,WAAWA,IAAeA,EAAa,KAAA,CAClE;AAAA,IAAA,GAEJ;AAGJ,QAAI,CAACM,EAAS,QAAO;AAErB,UAAMM,IACJ,gBAAAF;AAAA,MAACP;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,KAAAjB;AAAA,QACA,UAAAI;AAAA,QACA,WAAWuB;AAAA,UACT;AAAA,UACAC,EAAmB;AAAA,YACjB,SAAAlB;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,gBAAAK;AAAA,MAACK;AAAA,MAAA;AAAA,QACE,GAAIrB,KAAgB,CAAA;AAAA,QACrB,MAAMA,EAAa,SAASJ,KAAYC,KAAW,CAACc,KAAO,KAAQ;AAAA,QACnE,SAASA;AAAA,QAER,UAAAO;AAAA,MAAA;AAAA,IAAA,IAPYA;AAAA,EAUnB;AACF;AACA7B,EAAW,cAAc;"}
@@ -1 +1 @@
1
- {"version":3,"file":"ButtonIcon.stories.js","sources":["../../src/ButtonIcon/ButtonIcon.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\n\nimport { ButtonIcon } from './ButtonIcon';\nimport type { ButtonIconProps } from './ButtonIcon.types';\nimport React from 'react';\nimport { FileDownIcon, PlusIcon, Trash2Icon, MessageCircleMoreIcon } from 'lucide-react'\nimport { DashedWrapper } from \"../../.storybook/Wrappers\";\nimport { ButtonProps } from \"../Button\";\n\nconst Template = (props: ButtonIconProps) => <ButtonIcon {...props}/>\nTemplate.args = {\n onClick: { action: (e: React.MouseEvent<HTMLButtonElement>) => e },\n};\n\nconst States = (props: ButtonIconProps) => (\n <div\n style={{\n position: 'relative',\n display: 'flex',\n flexDirection: 'column',\n gap: '16px',\n }}\n >\n {[ 'default', 'hover', 'focus', 'active', 'disabled' ]\n .map((state) => (\n <ButtonIcon\n key={state}\n id={state}\n {...props}\n disabled={state === 'disabled' || props.disabled}\n >\n {props.children}\n </ButtonIcon>\n ))}\n </div>\n);\n\nconst StateRender = (props: ButtonIconProps) => (\n <div className='flex'>\n <DashedWrapper>\n <States {...props} variant='contained'/>\n <States {...props} variant='outlined'/>\n <States {...props} variant='ghost'/>\n </DashedWrapper>\n <DashedWrapper>\n <States {...props} variant='contained' rounded/>\n <States {...props} variant='outlined' rounded/>\n <States {...props} variant='ghost' rounded/>\n </DashedWrapper>\n </div>\n);\n\nconst variants: ButtonIconProps['variant'][] = [ 'contained', 'outlined', 'ghost' ]\nconst colors: ButtonIconProps['color'][] = [ 'primary', 'secondary', 'error' ]\nconst sizes: ButtonIconProps['size'][] = [ 'xs', 'sm', 'md', 'lg' ]\n\nconst variant_default: ButtonProps['variant'] = 'contained';\nconst color_default: ButtonProps['color'] = 'primary';\nconst size_default: ButtonProps['size'] = 'lg';\n\nconst iconMap = {\n 'undefined': undefined,\n \"<PlusIcon />\": <PlusIcon/>,\n \"<Trash2Icon />\": <Trash2Icon/>,\n \"<FileDownIcon />\": <FileDownIcon/>,\n PlusIcon: PlusIcon,\n Trash2Icon: Trash2Icon,\n FileDownIcon: FileDownIcon,\n};\n\nconst iconChildrenMap = {\n \"<PlusIcon />\": <PlusIcon/>,\n \"<Trash2Icon />\": <Trash2Icon/>,\n \"<FileDownIcon />\": <FileDownIcon/>,\n};\n\nconst meta = {\n title: 'ButtonIcon',\n component: ButtonIcon,\n render: Template,\n args: {\n asChild: false,\n disabled: false,\n loading: false,\n rounded: false,\n variant: variant_default,\n color: color_default,\n size: size_default,\n children: <PlusIcon/>,\n icon: undefined,\n message: undefined,\n title: undefined,\n },\n argTypes: {\n tooltip: {\n name: 'tooltip',\n description: 'ButtonIcon tooltip from ButtonIconProps [deprecated, use title and message instead]',\n control: false,\n },\n asChild: {\n name: 'asChild',\n description: 'ButtonIcon asChild from ButtonIconProps [boolean]',\n control: false\n },\n variant: {\n name: 'variant',\n description: 'ButtonIcon variant',\n defaultValue: variants[0],\n options: variants,\n control: { type: 'inline-radio', },\n },\n color: {\n name: 'color',\n description: 'ButtonIcon color',\n defaultValue: colors[0],\n options: colors,\n control: { type: 'inline-radio' },\n },\n size: {\n name: 'size',\n description: 'ButtonIcon size',\n defaultValue: sizes[0],\n options: sizes,\n control: { type: 'inline-radio' },\n },\n title: {\n name: 'title',\n description: \"ButtonIcon tooltip title from HTMLAttributes<HTMLButtonElement> [string only]\",\n control: { type: 'text' },\n },\n message: {\n name: 'message',\n description: 'ButtonIcon tooltip message from ButtonProps [ReactNode]',\n control: { type: \"object\" },\n },\n disabled: {\n name: 'disabled',\n description: 'ButtonIcon disabled',\n control: { type: 'boolean' }\n },\n rounded: {\n name: 'rounded',\n description: 'ButtonIcon rounded',\n control: { type: 'boolean' }\n },\n loading: {\n name: 'loading',\n description: 'ButtonIcon loading',\n control: { type: 'boolean' }\n },\n icon: {\n name: 'icon',\n description: 'ButtonIcon icon from ButtonIconProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\n options: Object.keys(iconMap),\n mapping: iconMap,\n control: { type: 'inline-radio' },\n },\n children: {\n name: 'children',\n description: 'ButtonIcon children from ButtonIconProps [`ReactNode`]',\n options: Object.keys(iconChildrenMap),\n mapping: iconChildrenMap,\n control: { type: 'inline-radio' },\n },\n counter: {\n name: 'counter',\n description: 'ButtonIcon counter from ButtonIconProps [`number` | `ButtonCounterBadgeReaderOptions`]',\n control: { type: 'number' },\n }\n },\n parameters: {\n pseudo: {\n hover: '#hover',\n focus: '#focus',\n active: '#active',\n disabled: '#disabled',\n },\n }\n} satisfies Meta<typeof ButtonIcon>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\nconst args: Story['args'] = {\n asChild: false,\n disabled: false,\n loading: false,\n rounded: false,\n children: <PlusIcon/>,\n}\n\nexport const Default: Story = {\n args: {\n ...meta.args,\n icon: FileDownIcon,\n children: undefined,\n }\n};\n\nexport const Counter: Story = {\n render: (props) => (\n <div className='flex flex-col gap-3'>\n {sizes.map((size) => (\n <DashedWrapper key={size}>\n <ButtonIcon {...props} size={size} message='from counter'/>\n <ButtonIcon {...props} size={size} counter={0} message='count=0'/>\n <ButtonIcon {...props} size={size} counter={9} message='count=9'/>\n <ButtonIcon {...props} size={size} counter={99} message='count=99'/>\n <ButtonIcon {...props} size={size} counter={999} message='count=999'/>\n </DashedWrapper>\n ))}\n </div>\n ),\n args: {\n ...meta.args,\n variant: 'ghost',\n color: 'secondary',\n icon: MessageCircleMoreIcon,\n counter: 12,\n title: 'counter',\n },\n parameters: {\n controls: {\n include: ['counter', 'variant', 'color', 'disabled', 'loading', 'rounded' ],\n },\n },\n};\n\nexport const Primary: Story = {\n args: {\n ...args,\n color: 'primary',\n size: 'lg',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: StateRender,\n};\nPrimary.parameters = {\n controls: { exclude: [ 'variant', 'color' ] },\n}\n\nexport const Secondary: Story = {\n args: {\n ...args,\n color: 'secondary',\n size: 'lg',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: StateRender,\n};\nSecondary.parameters = {\n controls: { exclude: [ 'variant', 'color' ] },\n}\n\nexport const Error: Story = {\n args: {\n ...args,\n color: 'error',\n size: 'lg',\n },\n argTypes: {\n variant: { control: false },\n color: { control: false },\n },\n render: StateRender,\n};\nError.parameters = {\n controls: { exclude: [ 'variant', 'color' ] },\n}\n"],"names":["Template","props","jsx","ButtonIcon","States","state","StateRender","jsxs","DashedWrapper","variants","colors","sizes","variant_default","color_default","size_default","iconMap","PlusIcon","Trash2Icon","FileDownIcon","iconChildrenMap","meta","args","Default","Counter","size","MessageCircleMoreIcon","Primary","Secondary","Error"],"mappings":"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"}
1
+ {"version":3,"file":"ButtonIcon.stories.js","sources":["../../src/ButtonIcon/ButtonIcon.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react';\r\n\r\nimport { ButtonIcon } from './ButtonIcon';\r\nimport type { ButtonIconProps } from './ButtonIcon.types';\r\nimport React from 'react';\r\nimport { FileDownIcon, PlusIcon, Trash2Icon, MessageCircleMoreIcon } from 'lucide-react'\r\nimport { DashedWrapper } from \"../../.storybook/Wrappers\";\r\nimport { ButtonProps } from \"../Button\";\r\n\r\nconst Template = (props: ButtonIconProps) => <ButtonIcon {...props}/>\r\nTemplate.args = {\r\n onClick: { action: (e: React.MouseEvent<HTMLButtonElement>) => e },\r\n};\r\n\r\nconst States = (props: ButtonIconProps) => (\r\n <div\r\n style={{\r\n position: 'relative',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '16px',\r\n }}\r\n >\r\n {[ 'default', 'hover', 'focus', 'active', 'disabled' ]\r\n .map((state) => (\r\n <ButtonIcon\r\n key={state}\r\n id={state}\r\n {...props}\r\n disabled={state === 'disabled' || props.disabled}\r\n >\r\n {props.children}\r\n </ButtonIcon>\r\n ))}\r\n </div>\r\n);\r\n\r\nconst StateRender = (props: ButtonIconProps) => (\r\n <div className='flex'>\r\n <DashedWrapper>\r\n <States {...props} variant='contained'/>\r\n <States {...props} variant='outlined'/>\r\n <States {...props} variant='ghost'/>\r\n </DashedWrapper>\r\n <DashedWrapper>\r\n <States {...props} variant='contained' rounded/>\r\n <States {...props} variant='outlined' rounded/>\r\n <States {...props} variant='ghost' rounded/>\r\n </DashedWrapper>\r\n </div>\r\n);\r\n\r\nconst variants: ButtonIconProps['variant'][] = [ 'contained', 'outlined', 'ghost' ]\r\nconst colors: ButtonIconProps['color'][] = [ 'primary', 'secondary', 'error' ]\r\nconst sizes: ButtonIconProps['size'][] = [ 'xs', 'sm', 'md', 'lg' ]\r\n\r\nconst variant_default: ButtonProps['variant'] = 'contained';\r\nconst color_default: ButtonProps['color'] = 'primary';\r\nconst size_default: ButtonProps['size'] = 'lg';\r\n\r\nconst iconMap = {\r\n 'undefined': undefined,\r\n \"<PlusIcon />\": <PlusIcon/>,\r\n \"<Trash2Icon />\": <Trash2Icon/>,\r\n \"<FileDownIcon />\": <FileDownIcon/>,\r\n PlusIcon: PlusIcon,\r\n Trash2Icon: Trash2Icon,\r\n FileDownIcon: FileDownIcon,\r\n};\r\n\r\nconst iconChildrenMap = {\r\n \"<PlusIcon />\": <PlusIcon/>,\r\n \"<Trash2Icon />\": <Trash2Icon/>,\r\n \"<FileDownIcon />\": <FileDownIcon/>,\r\n};\r\n\r\nconst meta = {\r\n title: 'ButtonIcon',\r\n component: ButtonIcon,\r\n render: Template,\r\n args: {\r\n asChild: false,\r\n disabled: false,\r\n loading: false,\r\n rounded: false,\r\n variant: variant_default,\r\n color: color_default,\r\n size: size_default,\r\n children: <PlusIcon/>,\r\n icon: undefined,\r\n message: undefined,\r\n title: undefined,\r\n },\r\n argTypes: {\r\n tooltip: {\r\n name: 'tooltip',\r\n description: 'ButtonIcon tooltip from ButtonIconProps [deprecated, use title and message instead]',\r\n control: false,\r\n },\r\n asChild: {\r\n name: 'asChild',\r\n description: 'ButtonIcon asChild from ButtonIconProps [boolean]',\r\n control: false\r\n },\r\n variant: {\r\n name: 'variant',\r\n description: 'ButtonIcon variant',\r\n defaultValue: variants[0],\r\n options: variants,\r\n control: { type: 'inline-radio', },\r\n },\r\n color: {\r\n name: 'color',\r\n description: 'ButtonIcon color',\r\n defaultValue: colors[0],\r\n options: colors,\r\n control: { type: 'inline-radio' },\r\n },\r\n size: {\r\n name: 'size',\r\n description: 'ButtonIcon size',\r\n defaultValue: sizes[0],\r\n options: sizes,\r\n control: { type: 'inline-radio' },\r\n },\r\n title: {\r\n name: 'title',\r\n description: \"ButtonIcon tooltip title from HTMLAttributes<HTMLButtonElement> [string only]\",\r\n control: { type: 'text' },\r\n },\r\n message: {\r\n name: 'message',\r\n description: 'ButtonIcon tooltip message from ButtonProps [ReactNode]',\r\n control: { type: \"object\" },\r\n },\r\n disabled: {\r\n name: 'disabled',\r\n description: 'ButtonIcon disabled',\r\n control: { type: 'boolean' }\r\n },\r\n rounded: {\r\n name: 'rounded',\r\n description: 'ButtonIcon rounded',\r\n control: { type: 'boolean' }\r\n },\r\n loading: {\r\n name: 'loading',\r\n description: 'ButtonIcon loading',\r\n control: { type: 'boolean' }\r\n },\r\n icon: {\r\n name: 'icon',\r\n description: 'ButtonIcon icon from ButtonIconProps [`undefined` | `ComponentType<SVGProps<SVGSVGElement>>` | `ReactElement<SVGProps<SVGSVGElement>>`]',\r\n options: Object.keys(iconMap),\r\n mapping: iconMap,\r\n control: { type: 'inline-radio' },\r\n },\r\n children: {\r\n name: 'children',\r\n description: 'ButtonIcon children from ButtonIconProps [`ReactNode`]',\r\n options: Object.keys(iconChildrenMap),\r\n mapping: iconChildrenMap,\r\n control: { type: 'inline-radio' },\r\n },\r\n counter: {\r\n name: 'counter',\r\n description: 'ButtonIcon counter from ButtonIconProps [`number` | `ButtonCounterBadgeReaderOptions`]',\r\n control: { type: 'number' },\r\n }\r\n },\r\n parameters: {\r\n pseudo: {\r\n hover: '#hover',\r\n focus: '#focus',\r\n active: '#active',\r\n disabled: '#disabled',\r\n },\r\n }\r\n} satisfies Meta<typeof ButtonIcon>;\r\n\r\nexport default meta;\r\n\r\ntype Story = StoryObj<typeof meta>;\r\nconst args: Story['args'] = {\r\n asChild: false,\r\n disabled: false,\r\n loading: false,\r\n rounded: false,\r\n children: <PlusIcon/>,\r\n}\r\n\r\nexport const Default: Story = {\r\n args: {\r\n ...meta.args,\r\n icon: FileDownIcon,\r\n children: undefined,\r\n }\r\n};\r\n\r\nexport const Counter: Story = {\r\n render: (props) => (\r\n <div className='flex flex-col gap-3'>\r\n {sizes.map((size) => (\r\n <DashedWrapper key={size}>\r\n <ButtonIcon {...props} size={size} message='from counter'/>\r\n <ButtonIcon {...props} size={size} counter={0} message='count=0'/>\r\n <ButtonIcon {...props} size={size} counter={9} message='count=9'/>\r\n <ButtonIcon {...props} size={size} counter={99} message='count=99'/>\r\n <ButtonIcon {...props} size={size} counter={999} message='count=999'/>\r\n </DashedWrapper>\r\n ))}\r\n </div>\r\n ),\r\n args: {\r\n ...meta.args,\r\n variant: 'ghost',\r\n color: 'secondary',\r\n icon: MessageCircleMoreIcon,\r\n counter: 12,\r\n title: 'counter',\r\n },\r\n parameters: {\r\n controls: {\r\n include: ['counter', 'variant', 'color', 'disabled', 'loading', 'rounded' ],\r\n },\r\n },\r\n};\r\n\r\nexport const Primary: Story = {\r\n args: {\r\n ...args,\r\n color: 'primary',\r\n size: 'lg',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: StateRender,\r\n};\r\nPrimary.parameters = {\r\n controls: { exclude: [ 'variant', 'color' ] },\r\n}\r\n\r\nexport const Secondary: Story = {\r\n args: {\r\n ...args,\r\n color: 'secondary',\r\n size: 'lg',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: StateRender,\r\n};\r\nSecondary.parameters = {\r\n controls: { exclude: [ 'variant', 'color' ] },\r\n}\r\n\r\nexport const Error: Story = {\r\n args: {\r\n ...args,\r\n color: 'error',\r\n size: 'lg',\r\n },\r\n argTypes: {\r\n variant: { control: false },\r\n color: { control: false },\r\n },\r\n render: StateRender,\r\n};\r\nError.parameters = {\r\n controls: { exclude: [ 'variant', 'color' ] },\r\n}\r\n"],"names":["Template","props","jsx","ButtonIcon","States","state","StateRender","jsxs","DashedWrapper","variants","colors","sizes","variant_default","color_default","size_default","iconMap","PlusIcon","Trash2Icon","FileDownIcon","iconChildrenMap","meta","args","Default","Counter","size","MessageCircleMoreIcon","Primary","Secondary","Error"],"mappings":"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"}
@@ -8,7 +8,7 @@ const a = r(
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
10
  "[&_svg]:pointer-events-none [&_svg]:shrink-0",
11
- "transition-transform duration-200 [&_svg]:transition-transform [&_svg]:duration-200"
11
+ "transition-transform [&_svg]:transition-transform"
12
12
  ],
13
13
  {
14
14
  variants: {
@@ -1 +1 @@
1
- {"version":3,"file":"buttonIconVariants.js","sources":["../../src/ButtonIcon/buttonIconVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from \"@oneplatformdev/utils\";\n\nexport const buttonIconVariants = cva(\n [\n \"inline-flex items-center justify-center relative\",\n 'whitespace-nowrap font-medium aspect-square',\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 '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: 'w-4 h-4 size-4 rounded-sm p-0 [&_svg]:size-3',\n sm: 'w-6 h-6 size-6 rounded-md p-0 [&_svg]:size-4',\n md: 'w-8 h-8 size-8 rounded-lg p-1 [&_svg]:size-5',\n lg: 'w-10 h-10 size-10 rounded-lg p-1 [&_svg]:size-6',\n },\n rounded: {\n true: \"rounded-full\",\n false: \"\",\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 // ROUNDED BUTTON VARIANTS\n {\n variant: 'ghost',\n rounded: true,\n className: cn(\n 'bg-[#FCFCFC] shadow-[-1px_-1px_10px_rgba(6,8,13,0.06),_1px_1px_10px_rgba(6,8,13,0.06)]',\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\n ),\n }\n ],\n defaultVariants: {\n color: \"primary\",\n variant: \"contained\",\n size: \"lg\",\n rounded: false,\n },\n }\n)\n\nexport type ButtonIconVarianceProps = VariantProps<typeof buttonIconVariants>;\n"],"names":["buttonIconVariants","cva","cn"],"mappings":";;AAGO,MAAMA,IAAqBC;AAAA,EAChC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,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,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,SAAS;AAAA,QACP,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,kBAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWC;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;AAAA,MAGF;AAAA,QACE,SAAS;AAAA,QACT,SAAS;AAAA,QACT,WAAWA;AAAA,UACX;AAAA,UACE;AAAA,QAAA;AAAA,MACF;AAAA,IACF;AAAA,IAEF,iBAAiB;AAAA,MACf,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}
1
+ {"version":3,"file":"buttonIconVariants.js","sources":["../../src/ButtonIcon/buttonIconVariants.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\nexport const buttonIconVariants = cva(\r\n [\r\n \"inline-flex items-center justify-center relative\",\r\n 'whitespace-nowrap font-medium aspect-square',\r\n 'cursor-pointer box-border',\r\n \"transition-colors focus-visible:outline-hidden focus-visible:ring-none focus-visible:ring-transparent\",\r\n \"disabled:pointer-events-none disabled:cursor-default\",\r\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\r\n 'transition-transform [&_svg]:transition-transform',\r\n ],\r\n {\r\n variants: {\r\n variant: {\r\n none: '',\r\n contained: '',\r\n outlined: '',\r\n ghost: \"\",\r\n },\r\n color: {\r\n primary: \"\",\r\n secondary: \"\",\r\n error: \"\"\r\n },\r\n size: {\r\n xs: 'w-4 h-4 size-4 rounded-sm p-0 [&_svg]:size-3',\r\n sm: 'w-6 h-6 size-6 rounded-md p-0 [&_svg]:size-4',\r\n md: 'w-8 h-8 size-8 rounded-lg p-1 [&_svg]:size-5',\r\n lg: 'w-10 h-10 size-10 rounded-lg p-1 [&_svg]:size-6',\r\n },\r\n rounded: {\r\n true: \"rounded-full\",\r\n false: \"\",\r\n },\r\n },\r\n compoundVariants: [\r\n // PRIMARY BUTTON VARIANTS\r\n {\r\n color: 'primary',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#9368FF] border border-[#9368FF] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\r\n 'hover:bg-[#7F4EEB]',\r\n 'focus:bg-[#7F4EEB] focus:border-[#6B3DD9]',\r\n 'active:bg-[#6B3DD9]',\r\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'primary',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#9368FF] text-[#9368FF] [&_svg]:text-[#9368FF]',\r\n 'hover:bg-[#9368FF0F]',\r\n 'active:bg-[#9368FF0F] active:border-[#6B3DD9]',\r\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'primary',\r\n variant: 'ghost',\r\n className: cn(\r\n 'bg-transparent border border-transparent text-[#9368FF] [&_svg]:text-[#9368FF]',\r\n 'hover:text-[#6B3DD9] hover:[&_svg]:text-[#6B3DD9]',\r\n 'focus:text-[#6B3DD9] focus:[&_svg]:text-[#6B3DD9]',\r\n 'active:bg-[#9368FF0F]',\r\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n // SECONDARY BUTTON VARIANTS\r\n {\r\n color: 'secondary',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#FCFCFC] border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\r\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\r\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\r\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\r\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'secondary',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#E1E1E5] text-[#06080D] [&_svg]:text-[#06080D]',\r\n 'hover:bg-[#F9FAFB] hover:border-[#E1E1E5]',\r\n 'focus:bg-[#FCFCFC] focus:border-[#C5C7CD]',\r\n 'active:bg-[#F9FAFB] active:border-[#C5C7CD]',\r\n 'disabled:bg-[#FCFCFC] disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'secondary',\r\n variant: 'ghost',\r\n className: cn(\r\n 'text-[#06080D] [&_svg]:text-[#06080D] bg-transparent border border-transparent',\r\n 'hover:bg-[#F9FAFB]',\r\n 'focus:bg-[#FCFCFC]',\r\n 'active:bg-[#F9FAFB]',\r\n 'disabled:bg-[#FCFCFC] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n // ERROR BUTTON VARIANTS\r\n {\r\n color: 'error',\r\n variant: 'contained',\r\n className: cn(\r\n 'bg-[#EF4444] border border-[#EF4444] text-[#FCFCFC] [&_svg]:text-[#FCFCFC]',\r\n 'hover:bg-[#DC2626]',\r\n 'focus:bg-[#DC2626]',\r\n 'active:bg-[#DC2626]',\r\n 'disabled:bg-[#E8E9EB] disabled:border-[#E8E9EB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'error',\r\n variant: 'outlined',\r\n className: cn(\r\n 'bg-transparent border border-[#EF4444] text-[#EF4444] [&_svg]:text-[#EF4444]',\r\n 'hover:bg-[#EF44440F]',\r\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\r\n 'disabled:border-[#EBEBEB] disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n {\r\n color: 'error',\r\n variant: 'ghost',\r\n className: cn(\r\n 'bg-transparent border border-transparent text-[#EF4444] [&_svg]:text-[#EF4444]',\r\n 'hover:bg-[#EF44440F] hover:text-[#DC2626] hover:[&_svg]:text-[#DC2626]',\r\n 'active:bg-[#DC26260F] active:border-[#DC2626]',\r\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n },\r\n // ROUNDED BUTTON VARIANTS\r\n {\r\n variant: 'ghost',\r\n rounded: true,\r\n className: cn(\r\n 'bg-[#FCFCFC] shadow-[-1px_-1px_10px_rgba(6,8,13,0.06),_1px_1px_10px_rgba(6,8,13,0.06)]',\r\n 'disabled:text-[#666A78] disabled:[&_svg]:text-[#666A78]',\r\n ),\r\n }\r\n ],\r\n defaultVariants: {\r\n color: \"primary\",\r\n variant: \"contained\",\r\n size: \"lg\",\r\n rounded: false,\r\n },\r\n }\r\n)\r\n\r\nexport type ButtonIconVarianceProps = VariantProps<typeof buttonIconVariants>;\r\n"],"names":["buttonIconVariants","cva","cn"],"mappings":";;AAGO,MAAMA,IAAqBC;AAAA,EAChC;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,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,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,MAEN,SAAS;AAAA,QACP,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,kBAAkB;AAAA;AAAA,MAEhB;AAAA,QACE,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAWC;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;AAAA,MAGF;AAAA,QACE,SAAS;AAAA,QACT,SAAS;AAAA,QACT,WAAWA;AAAA,UACX;AAAA,UACE;AAAA,QAAA;AAAA,MACF;AAAA,IACF;AAAA,IAEF,iBAAiB;AAAA,MACf,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ;"}