kz-design-system 0.0.6 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/button.d.mts +1 -1
- package/dist/button.d.ts +1 -1
- package/dist/button.js.map +1 -1
- package/dist/button.mjs.map +1 -1
- package/dist/dropdown.d.mts +5 -3
- package/dist/dropdown.d.ts +5 -3
- package/dist/dropdown.js +17 -4
- package/dist/dropdown.js.map +1 -1
- package/dist/dropdown.mjs +17 -4
- package/dist/dropdown.mjs.map +1 -1
- package/dist/{enum-B7HQ_ry_.d.mts → enum-CzPXGhKb.d.mts} +13 -1
- package/dist/{enum-B7HQ_ry_.d.ts → enum-CzPXGhKb.d.ts} +13 -1
- package/dist/{index-BJjuXO7p.d.ts → index-CGq0fQuP.d.ts} +1 -1
- package/dist/{index-BET7QcgK.d.mts → index-DduDIWAK.d.mts} +1 -1
- package/dist/index.d.mts +21 -38
- package/dist/index.d.ts +21 -38
- package/dist/index.js +412 -410
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +408 -409
- package/dist/index.mjs.map +1 -1
- package/dist/sidemenu.js +63 -48
- package/dist/sidemenu.js.map +1 -1
- package/dist/sidemenu.mjs +63 -48
- package/dist/sidemenu.mjs.map +1 -1
- package/dist/styles.css +2 -2
- package/dist/theme.d.mts +2 -2
- package/dist/theme.d.ts +2 -2
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs.map +1 -1
- package/package.json +1 -1
package/dist/button.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { q as ButtonVariant, o as ButtonSize, p as ButtonType, B as ButtonAspectRatio } from './enum-CzPXGhKb.mjs';
|
|
3
3
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
5
|
|
package/dist/button.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { q as ButtonVariant, o as ButtonSize, p as ButtonType, B as ButtonAspectRatio } from './enum-CzPXGhKb.js';
|
|
3
3
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
5
|
|
package/dist/button.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/button/index.ts","../src/components/button/Button.tsx","../src/constants/enum.ts","../src/components/button/button.variants.ts","../src/icon/icon-sizes.ts","../src/utils/cn.ts"],"sourcesContent":["export {\n Button,\n buttonVariants,\n type ButtonProps,\n type ButtonVariants,\n} from \"./Button\";\nexport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\n","import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":["ButtonVariant","ButtonSize","ButtonType","ButtonAspectRatio"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/button/index.ts","../src/components/button/Button.tsx","../src/constants/enum.ts","../src/components/button/button.variants.ts","../src/icon/icon-sizes.ts","../src/utils/cn.ts"],"sourcesContent":["export {\n Button,\n buttonVariants,\n type ButtonProps,\n type ButtonVariants,\n} from \"./Button\";\nexport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\n","import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum AvatarSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n Xl = \"xl\",\n}\n\nexport enum AvatarStatus {\n Online = \"online\",\n Busy = \"busy\",\n Away = \"away\",\n Offline = \"offline\",\n}\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":["ButtonVariant","ButtonSize","ButtonType","ButtonAspectRatio"]}
|
package/dist/button.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/button/Button.tsx","../src/constants/enum.ts","../src/components/button/button.variants.ts","../src/icon/icon-sizes.ts","../src/utils/cn.ts"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":["ButtonVariant","ButtonSize","ButtonType","ButtonAspectRatio"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/button/Button.tsx","../src/constants/enum.ts","../src/components/button/button.variants.ts","../src/icon/icon-sizes.ts","../src/utils/cn.ts"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum AvatarSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n Xl = \"xl\",\n}\n\nexport enum AvatarStatus {\n Online = \"online\",\n Busy = \"busy\",\n Away = \"away\",\n Offline = \"offline\",\n}\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":["ButtonVariant","ButtonSize","ButtonType","ButtonAspectRatio"]}
|
package/dist/dropdown.d.mts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
3
|
-
import { D as DropdownTriggerVariant } from './enum-
|
|
3
|
+
import { D as DropdownTriggerVariant } from './enum-CzPXGhKb.mjs';
|
|
4
4
|
|
|
5
5
|
declare const Dropdown: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
|
|
6
6
|
interface DropdownTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger> {
|
|
7
|
-
/** Visual style: default (filled/bordered) or ghost (minimal, like ghost button). */
|
|
8
7
|
variant?: DropdownTriggerVariant;
|
|
9
|
-
/** When true (default), shows a chevron icon after children. Set false to hide it. */
|
|
10
8
|
showChevron?: boolean;
|
|
9
|
+
startIcon?: React.ReactNode;
|
|
10
|
+
endIcon?: React.ReactNode;
|
|
11
11
|
}
|
|
12
12
|
declare const DropdownTrigger: React.ForwardRefExoticComponent<DropdownTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
13
13
|
interface DropdownContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> {
|
|
@@ -83,6 +83,7 @@ type DropdownButtonItem = {
|
|
|
83
83
|
onSelect?: () => void;
|
|
84
84
|
disabled?: boolean;
|
|
85
85
|
icon?: React.ReactNode;
|
|
86
|
+
endIcon?: React.ReactNode;
|
|
86
87
|
shortcut?: string;
|
|
87
88
|
} | {
|
|
88
89
|
type: "label";
|
|
@@ -98,6 +99,7 @@ type DropdownButtonItem = {
|
|
|
98
99
|
items: DropdownButtonItem[];
|
|
99
100
|
disabled?: boolean;
|
|
100
101
|
icon?: React.ReactNode;
|
|
102
|
+
endIcon?: React.ReactNode;
|
|
101
103
|
};
|
|
102
104
|
interface DropdownButtonTrigger {
|
|
103
105
|
label?: React.ReactNode;
|
package/dist/dropdown.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
3
|
-
import { D as DropdownTriggerVariant } from './enum-
|
|
3
|
+
import { D as DropdownTriggerVariant } from './enum-CzPXGhKb.js';
|
|
4
4
|
|
|
5
5
|
declare const Dropdown: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
|
|
6
6
|
interface DropdownTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger> {
|
|
7
|
-
/** Visual style: default (filled/bordered) or ghost (minimal, like ghost button). */
|
|
8
7
|
variant?: DropdownTriggerVariant;
|
|
9
|
-
/** When true (default), shows a chevron icon after children. Set false to hide it. */
|
|
10
8
|
showChevron?: boolean;
|
|
9
|
+
startIcon?: React.ReactNode;
|
|
10
|
+
endIcon?: React.ReactNode;
|
|
11
11
|
}
|
|
12
12
|
declare const DropdownTrigger: React.ForwardRefExoticComponent<DropdownTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
13
13
|
interface DropdownContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> {
|
|
@@ -83,6 +83,7 @@ type DropdownButtonItem = {
|
|
|
83
83
|
onSelect?: () => void;
|
|
84
84
|
disabled?: boolean;
|
|
85
85
|
icon?: React.ReactNode;
|
|
86
|
+
endIcon?: React.ReactNode;
|
|
86
87
|
shortcut?: string;
|
|
87
88
|
} | {
|
|
88
89
|
type: "label";
|
|
@@ -98,6 +99,7 @@ type DropdownButtonItem = {
|
|
|
98
99
|
items: DropdownButtonItem[];
|
|
99
100
|
disabled?: boolean;
|
|
100
101
|
icon?: React.ReactNode;
|
|
102
|
+
endIcon?: React.ReactNode;
|
|
101
103
|
};
|
|
102
104
|
interface DropdownButtonTrigger {
|
|
103
105
|
label?: React.ReactNode;
|
package/dist/dropdown.js
CHANGED
|
@@ -169,13 +169,17 @@ var DropdownTrigger = React2.forwardRef(
|
|
|
169
169
|
className,
|
|
170
170
|
variant = "default" /* Default */,
|
|
171
171
|
showChevron = true,
|
|
172
|
+
startIcon,
|
|
173
|
+
endIcon,
|
|
172
174
|
children,
|
|
173
175
|
...props
|
|
174
176
|
}, ref) => {
|
|
175
177
|
const isGhost = variant === "ghost" /* Ghost */;
|
|
176
|
-
const triggerContent = asChild
|
|
178
|
+
const triggerContent = asChild ? children : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
|
|
179
|
+
startIcon ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "kz-dropdown-trigger-icon-start", children: startIcon }) : null,
|
|
177
180
|
children,
|
|
178
|
-
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
181
|
+
endIcon ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "kz-dropdown-trigger-icon-end", children: endIcon }) : null,
|
|
182
|
+
showChevron ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
179
183
|
Icon,
|
|
180
184
|
{
|
|
181
185
|
name: "chevron-down" /* ChevronDown */,
|
|
@@ -183,7 +187,7 @@ var DropdownTrigger = React2.forwardRef(
|
|
|
183
187
|
size: "sm",
|
|
184
188
|
"aria-hidden": true
|
|
185
189
|
}
|
|
186
|
-
)
|
|
190
|
+
) : null
|
|
187
191
|
] });
|
|
188
192
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
189
193
|
DropdownMenuPrimitive.Trigger,
|
|
@@ -547,7 +551,15 @@ function renderItems(items) {
|
|
|
547
551
|
}
|
|
548
552
|
if (item.type === "submenu") {
|
|
549
553
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(DropdownSub, { children: [
|
|
550
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
554
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
555
|
+
DropdownSubTrigger,
|
|
556
|
+
{
|
|
557
|
+
disabled: item.disabled,
|
|
558
|
+
startIcon: item.icon,
|
|
559
|
+
endIcon: item.endIcon,
|
|
560
|
+
children: item.label
|
|
561
|
+
}
|
|
562
|
+
),
|
|
551
563
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DropdownSubContent, { children: renderItems(item.items) })
|
|
552
564
|
] }, item.key);
|
|
553
565
|
}
|
|
@@ -560,6 +572,7 @@ function renderItems(items) {
|
|
|
560
572
|
it.onSelect?.();
|
|
561
573
|
},
|
|
562
574
|
startIcon: it.icon,
|
|
575
|
+
endIcon: it.endIcon,
|
|
563
576
|
shortcut: it.shortcut,
|
|
564
577
|
children: it.label
|
|
565
578
|
},
|
package/dist/dropdown.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/dropdown/index.ts","../src/components/dropdown/dropdown.tsx","../src/utils/cn.ts","../src/icon/Icon.tsx","../src/icon/icon-registry.tsx","../src/icon/icon-sizes.ts","../src/constants/enum.ts","../src/components/button/Button.tsx","../src/components/button/button.variants.ts","../src/components/dropdown/DropdownButton.tsx"],"sourcesContent":["export {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownCheckboxItem,\n DropdownRadioGroup,\n DropdownRadioItem,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n} from \"./dropdown\";\nexport type { DropdownTriggerProps } from \"./dropdown\";\nexport { DropdownButton } from \"./DropdownButton\";\nexport { DropdownTriggerVariant } from \"../../constants/enum\";\nexport type {\n DropdownButtonProps,\n DropdownButtonTrigger,\n DropdownButtonItem,\n DropdownButtonVariant,\n DropdownButtonAlign,\n DropdownButtonSide,\n} from \"./dropdown.types\";\n","import * as React from \"react\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport { Check, ChevronRight, Circle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { Icon, IconName } from \"../../icon\";\nimport { DropdownTriggerVariant } from \"../../constants/enum\";\n\nconst Dropdown = DropdownMenuPrimitive.Root;\n\nexport interface DropdownTriggerProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Trigger\n> {\n /** Visual style: default (filled/bordered) or ghost (minimal, like ghost button). */\n variant?: DropdownTriggerVariant;\n /** When true (default), shows a chevron icon after children. Set false to hide it. */\n showChevron?: boolean;\n}\n\nconst DropdownTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Trigger>,\n DropdownTriggerProps\n>(\n (\n {\n asChild = false,\n disabled,\n className,\n variant = DropdownTriggerVariant.Default,\n showChevron = true,\n children,\n ...props\n },\n ref\n ) => {\n const isGhost = variant === DropdownTriggerVariant.Ghost;\n const triggerContent =\n asChild || !showChevron ? (\n children\n ) : (\n <>\n {children}\n <Icon\n name={IconName.ChevronDown}\n className=\"kz-dropdown-trigger-chevron\"\n size=\"sm\"\n aria-hidden\n />\n </>\n );\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n asChild={asChild}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-trigger\",\n isGhost && \"kz-dropdown-trigger-ghost\",\n className\n )}\n {...props}\n >\n {triggerContent}\n </DropdownMenuPrimitive.Trigger>\n );\n }\n);\nDropdownTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;\n\ninterface DropdownContentProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Content\n> {\n className?: string;\n align?: \"start\" | \"center\" | \"end\";\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n sideOffset?: number;\n alignOffset?: number;\n avoidCollisions?: boolean;\n}\n\nconst DropdownContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n DropdownContentProps\n>(\n (\n {\n className,\n align = \"center\",\n side = \"bottom\",\n sideOffset = 4,\n alignOffset = 0,\n avoidCollisions = true,\n ...props\n },\n ref\n ) => (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Content\n ref={ref}\n align={align}\n side={side}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n className={cn(\"kz-dropdown-content\", className)}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n )\n);\nDropdownContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\ninterface DropdownItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Item\n> {\n onSelect?: (event: Event) => void;\n disabled?: boolean;\n destructive?: boolean;\n inset?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n shortcut?: string;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n DropdownItemProps\n>(\n (\n {\n className,\n onSelect,\n disabled,\n destructive,\n inset,\n startIcon,\n endIcon,\n shortcut,\n children,\n ...props\n },\n ref\n ) => (\n <DropdownMenuPrimitive.Item\n ref={ref}\n onSelect={onSelect}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-item\",\n inset && \"kz-dropdown-item-inset\",\n destructive && \"kz-dropdown-item-destructive\",\n className\n )}\n {...props}\n >\n {startIcon ? (\n <span className=\"kz-dropdown-item-icon-start\">{startIcon}</span>\n ) : null}\n <span className=\"kz-dropdown-item-text\">{children}</span>\n {shortcut ? (\n <span className=\"kz-dropdown-item-shortcut\">{shortcut}</span>\n ) : null}\n {endIcon ? (\n <span className=\"kz-dropdown-item-icon-end\">{endIcon}</span>\n ) : null}\n </DropdownMenuPrimitive.Item>\n )\n);\nDropdownItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator> & {\n className?: string;\n }\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"kz-dropdown-separator\", className)}\n {...props}\n />\n));\nDropdownSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\ninterface DropdownLabelProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Label\n> {\n inset?: boolean;\n className?: string;\n}\n\nconst DropdownLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n DropdownLabelProps\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.Label\n ref={ref}\n className={cn(\n \"kz-dropdown-label\",\n inset && \"kz-dropdown-label-inset\",\n className\n )}\n {...props}\n />\n));\nDropdownLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\ninterface DropdownCheckboxItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.CheckboxItem\n> {\n checked?: boolean | \"indeterminate\";\n onCheckedChange?: (checked: boolean) => void;\n disabled?: boolean;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n DropdownCheckboxItemProps\n>(\n (\n { className, checked, onCheckedChange, disabled, children, ...props },\n ref\n ) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n checked={checked}\n onCheckedChange={onCheckedChange}\n disabled={disabled}\n className={cn(\"kz-dropdown-checkbox-item\", className)}\n {...props}\n >\n <DropdownMenuPrimitive.ItemIndicator className=\"kz-dropdown-item-indicator\">\n {checked === \"indeterminate\" ? (\n <span className=\"kz-dropdown-item-indicator-minus\">−</span>\n ) : (\n <Check className=\"kz-dropdown-item-indicator-check\" />\n )}\n </DropdownMenuPrimitive.ItemIndicator>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n )\n);\nDropdownCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownRadioGroup = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioGroup>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioGroup\n ref={ref}\n className={cn(\"kz-dropdown-radio-group\", className)}\n {...props}\n />\n));\nDropdownRadioGroup.displayName = DropdownMenuPrimitive.RadioGroup.displayName;\n\ninterface DropdownRadioItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItem\n> {\n value: string;\n disabled?: boolean;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n DropdownRadioItemProps\n>(({ className, value, disabled, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\"kz-dropdown-radio-item\", className)}\n {...props}\n >\n <DropdownMenuPrimitive.ItemIndicator className=\"kz-dropdown-item-indicator\">\n <Circle className=\"kz-dropdown-item-indicator-dot\" />\n </DropdownMenuPrimitive.ItemIndicator>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownSub = DropdownMenuPrimitive.Sub;\n\ninterface DropdownSubTriggerProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubTrigger\n> {\n inset?: boolean;\n disabled?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n DropdownSubTriggerProps\n>(\n (\n { className, inset, disabled, startIcon, endIcon, children, ...props },\n ref\n ) => (\n <DropdownMenuPrimitive.SubTrigger\n ref={ref}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-sub-trigger\",\n inset && \"kz-dropdown-sub-trigger-inset\",\n className\n )}\n {...props}\n >\n {startIcon ? (\n <span className=\"kz-dropdown-item-icon-start\">{startIcon}</span>\n ) : null}\n <span className=\"kz-dropdown-item-text\">{children}</span>\n {endIcon ?? (\n <ChevronRight className=\"kz-dropdown-sub-trigger-chevron\" aria-hidden />\n )}\n </DropdownMenuPrimitive.SubTrigger>\n )\n);\nDropdownSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;\n\ninterface DropdownSubContentProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubContent\n> {\n className?: string;\n sideOffset?: number;\n alignOffset?: number;\n children: React.ReactNode;\n}\n\nconst DropdownSubContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n DropdownSubContentProps\n>(({ className, sideOffset = 8, alignOffset, children, ...props }, ref) => (\n <DropdownMenuPrimitive.SubContent\n ref={ref}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n className={cn(\"kz-dropdown-sub-content\", className)}\n {...props}\n >\n {children}\n </DropdownMenuPrimitive.SubContent>\n));\nDropdownSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;\n\nexport {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownCheckboxItem,\n DropdownRadioGroup,\n DropdownRadioItem,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n};\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import * as React from \"react\";\nimport { iconRegistry, IconName } from \"./icon-registry\";\nimport { iconSize, type IconSizeKey } from \"./icon-sizes\";\nimport { cn } from \"../utils/cn\";\n\nexport interface IconProps extends Omit<\n React.SVGAttributes<SVGSVGElement>,\n \"color\"\n> {\n name: IconName;\n size?: IconSizeKey | number;\n color?: string;\n className?: string;\n}\n\nconst Icon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ name, size = \"md\", color, className, ...props }, ref) => {\n const Component = iconRegistry[name];\n if (!Component) return null;\n const sizePx = typeof size === \"number\" ? size : iconSize[size];\n const resolvedColor = color ?? \"var(--kz-color-icon-default, currentColor)\";\n return (\n <Component\n ref={ref}\n size={sizePx}\n color={resolvedColor}\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n\nexport { Icon, iconRegistry, iconSize, IconName };\nexport type { IconSizeKey };\n","import type { LucideIcon } from \"lucide-react\";\nimport {\n Search,\n CircleAlert,\n CheckCircle,\n TriangleAlert,\n Loader2,\n ChevronDown,\n ChevronLeft,\n ChevronRight,\n BarChart2,\n Shield,\n ArrowLeft,\n ArrowUp,\n ArrowDown,\n ArrowUpDown,\n EllipsisVertical,\n Sun,\n Moon,\n Settings,\n LogOut,\n User,\n FileText,\n LockOpen,\n Calendar,\n ChartArea,\n ChartBar,\n ChartBarBig,\n ChartBarDecreasing,\n ChartBarIncreasing,\n ChartBarStacked,\n ChartCandlestick,\n ChartColumn,\n ChartColumnBig,\n ChartColumnDecreasing,\n ChartColumnIncreasing,\n ChartColumnStacked,\n ChartGantt,\n ChartLine,\n ChartNetwork,\n ChartNoAxesColumn,\n ChartNoAxesColumnDecreasing,\n ChartNoAxesColumnIncreasing,\n ChartNoAxesCombined,\n ChartNoAxesGantt,\n ChartPie,\n ChartScatter,\n ChartSpline,\n FolderKanban,\n Kanban,\n SquareChartGantt,\n SquareDashedKanban,\n SquareKanban,\n TrendingDown,\n TrendingUp,\n TrendingUpDown,\n} from \"lucide-react\";\n\n/** Use IconName.* so users discover available icons. Values match registry keys. */\nexport enum IconName {\n Search = \"search\",\n CircleAlert = \"circle-alert\",\n CheckCircle = \"check-circle\",\n TriangleAlert = \"triangle-alert\",\n Loader2 = \"loader-2\",\n ChevronDown = \"chevron-down\",\n ChevronLeft = \"chevron-left\",\n ChevronRight = \"chevron-right\",\n BarChart2 = \"bar-chart-2\",\n Shield = \"shield\",\n ArrowLeft = \"arrow-left\",\n ArrowUp = \"arrow-up\",\n ArrowDown = \"arrow-down\",\n ArrowUpDown = \"arrow-up-down\",\n EllipsisVertical = \"ellipsis-vertical\",\n Sun = \"sun\",\n Moon = \"moon\",\n LogOut = \"log-out\",\n Settings = \"settings\",\n User = \"user\",\n FileText = \"file-text\",\n LockOpen = \"lock-open\",\n Calendar = \"calendar\",\n ChartArea = \"chart-area\",\n ChartBar = \"chart-bar\",\n ChartBarBig = \"chart-bar-big\",\n ChartBarDecreasing = \"chart-bar-decreasing\",\n ChartBarIncreasing = \"chart-bar-increasing\",\n ChartBarStacked = \"chart-bar-stacked\",\n ChartCandlestick = \"chart-candlestick\",\n ChartColumn = \"chart-column\",\n ChartColumnBig = \"chart-column-big\",\n ChartColumnDecreasing = \"chart-column-decreasing\",\n ChartColumnIncreasing = \"chart-column-increasing\",\n ChartColumnStacked = \"chart-column-stacked\",\n ChartGantt = \"chart-gantt\",\n ChartLine = \"chart-line\",\n ChartNetwork = \"chart-network\",\n ChartNoAxesColumn = \"chart-no-axes-column\",\n ChartNoAxesColumnDecreasing = \"chart-no-axes-column-decreasing\",\n ChartNoAxesColumnIncreasing = \"chart-no-axes-column-increasing\",\n ChartNoAxesCombined = \"chart-no-axes-combined\",\n ChartNoAxesGantt = \"chart-no-axes-gantt\",\n ChartPie = \"chart-pie\",\n ChartScatter = \"chart-scatter\",\n ChartSpline = \"chart-spline\",\n FolderKanban = \"folder-kanban\",\n Kanban = \"kanban\",\n SquareChartGantt = \"square-chart-gantt\",\n SquareDashedKanban = \"square-dashed-kanban\",\n SquareKanban = \"square-kanban\",\n TrendingDown = \"trending-down\",\n TrendingUp = \"trending-up\",\n TrendingUpDown = \"trending-up-down\",\n}\n\nexport const iconRegistry: Record<IconName, LucideIcon> = {\n [IconName.Search]: Search,\n [IconName.CircleAlert]: CircleAlert,\n [IconName.CheckCircle]: CheckCircle,\n [IconName.TriangleAlert]: TriangleAlert,\n [IconName.Loader2]: Loader2,\n [IconName.ChevronDown]: ChevronDown,\n [IconName.ChevronLeft]: ChevronLeft,\n [IconName.ChevronRight]: ChevronRight,\n [IconName.BarChart2]: BarChart2,\n [IconName.Shield]: Shield,\n [IconName.ArrowLeft]: ArrowLeft,\n [IconName.ArrowUp]: ArrowUp,\n [IconName.ArrowDown]: ArrowDown,\n [IconName.ArrowUpDown]: ArrowUpDown,\n [IconName.EllipsisVertical]: EllipsisVertical,\n [IconName.Sun]: Sun,\n [IconName.Moon]: Moon,\n [IconName.LogOut]: LogOut,\n [IconName.Settings]: Settings,\n [IconName.User]: User,\n [IconName.FileText]: FileText,\n [IconName.LockOpen]: LockOpen,\n [IconName.Calendar]: Calendar,\n [IconName.ChartArea]: ChartArea,\n [IconName.ChartBar]: ChartBar,\n [IconName.ChartBarBig]: ChartBarBig,\n [IconName.ChartBarDecreasing]: ChartBarDecreasing,\n [IconName.ChartBarIncreasing]: ChartBarIncreasing,\n [IconName.ChartBarStacked]: ChartBarStacked,\n [IconName.ChartCandlestick]: ChartCandlestick,\n [IconName.ChartColumn]: ChartColumn,\n [IconName.ChartColumnBig]: ChartColumnBig,\n [IconName.ChartColumnDecreasing]: ChartColumnDecreasing,\n [IconName.ChartColumnIncreasing]: ChartColumnIncreasing,\n [IconName.ChartColumnStacked]: ChartColumnStacked,\n [IconName.ChartGantt]: ChartGantt,\n [IconName.ChartLine]: ChartLine,\n [IconName.ChartNetwork]: ChartNetwork,\n [IconName.ChartNoAxesColumn]: ChartNoAxesColumn,\n [IconName.ChartNoAxesColumnDecreasing]: ChartNoAxesColumnDecreasing,\n [IconName.ChartNoAxesColumnIncreasing]: ChartNoAxesColumnIncreasing,\n [IconName.ChartNoAxesCombined]: ChartNoAxesCombined,\n [IconName.ChartNoAxesGantt]: ChartNoAxesGantt,\n [IconName.ChartPie]: ChartPie,\n [IconName.ChartScatter]: ChartScatter,\n [IconName.ChartSpline]: ChartSpline,\n [IconName.FolderKanban]: FolderKanban,\n [IconName.Kanban]: Kanban,\n [IconName.SquareChartGantt]: SquareChartGantt,\n [IconName.SquareDashedKanban]: SquareDashedKanban,\n [IconName.SquareKanban]: SquareKanban,\n [IconName.TrendingDown]: TrendingDown,\n [IconName.TrendingUp]: TrendingUp,\n [IconName.TrendingUpDown]: TrendingUpDown,\n};\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n","import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","import * as React from \"react\";\nimport {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n} from \"./dropdown\";\nimport { DropdownTriggerVariant } from \"../../constants/enum\";\nimport { Button } from \"../button\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { Icon, IconName } from \"../../icon\";\nimport type {\n DropdownButtonProps,\n DropdownButtonItem,\n DropdownButtonVariant,\n} from \"./dropdown.types\";\n\nfunction mapVariant(\n v: DropdownButtonVariant | undefined\n): DropdownTriggerVariant {\n return v === \"ghost\"\n ? DropdownTriggerVariant.Ghost\n : DropdownTriggerVariant.Default;\n}\n\nfunction renderItems(items: DropdownButtonItem[]): React.ReactNode {\n return items.map((item) => {\n if (item.type === \"label\") {\n return <DropdownLabel key={item.key}>{item.label}</DropdownLabel>;\n }\n if (item.type === \"separator\") {\n return <DropdownSeparator key={item.key} />;\n }\n if (item.type === \"submenu\") {\n return (\n <DropdownSub key={item.key}>\n <DropdownSubTrigger disabled={item.disabled} startIcon={item.icon}>\n {item.label}\n </DropdownSubTrigger>\n <DropdownSubContent>{renderItems(item.items)}</DropdownSubContent>\n </DropdownSub>\n );\n }\n const it = item as Extract<DropdownButtonItem, { type?: \"item\" }>;\n return (\n <DropdownItem\n key={it.key}\n disabled={it.disabled}\n onSelect={() => {\n it.onSelect?.();\n }}\n startIcon={it.icon}\n shortcut={it.shortcut}\n >\n {it.label}\n </DropdownItem>\n );\n });\n}\n\nconst DropdownButton: React.FC<DropdownButtonProps> = ({\n trigger,\n items,\n align = \"center\",\n side = \"bottom\",\n sideOffset = 4,\n disabled = false,\n contentClassName,\n}) => {\n const triggerVariant = mapVariant(trigger.variant);\n const showChevron = trigger.showChevron !== false;\n const iconOnly = trigger.iconOnly === true;\n const triggerContent = iconOnly ? (\n <Button\n variant={ButtonVariant.Ghost}\n size={ButtonSize.Sm}\n aspectRatio={ButtonAspectRatio.Square}\n aria-label={trigger.ariaLabel ?? \"Actions\"}\n >\n <Icon\n name={IconName.EllipsisVertical}\n size=\"sm\"\n color=\"currentColor\"\n aria-hidden\n />\n </Button>\n ) : trigger.icon != null ? (\n <>\n {trigger.icon}\n {trigger.label != null ? trigger.label : null}\n </>\n ) : (\n trigger.label\n );\n\n return (\n <Dropdown>\n <DropdownTrigger\n variant={triggerVariant}\n showChevron={!iconOnly && showChevron}\n disabled={disabled}\n className={trigger.className}\n asChild={iconOnly}\n >\n {triggerContent}\n </DropdownTrigger>\n <DropdownContent\n align={align}\n side={side}\n sideOffset={sideOffset}\n className={contentClassName}\n >\n {renderItems(items)}\n </DropdownContent>\n </Dropdown>\n );\n};\n\nDropdownButton.displayName = \"DropdownButton\";\n\nexport { DropdownButton };\n"],"mappings":"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","names":["React","import_lucide_react","DropdownTriggerVariant","import_jsx_runtime","React","import_lucide_react","import_jsx_runtime","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/dropdown/index.ts","../src/components/dropdown/dropdown.tsx","../src/utils/cn.ts","../src/icon/Icon.tsx","../src/icon/icon-registry.tsx","../src/icon/icon-sizes.ts","../src/constants/enum.ts","../src/components/button/Button.tsx","../src/components/button/button.variants.ts","../src/components/dropdown/DropdownButton.tsx"],"sourcesContent":["export {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownCheckboxItem,\n DropdownRadioGroup,\n DropdownRadioItem,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n} from \"./dropdown\";\nexport type { DropdownTriggerProps } from \"./dropdown\";\nexport { DropdownButton } from \"./DropdownButton\";\nexport { DropdownTriggerVariant } from \"../../constants/enum\";\nexport type {\n DropdownButtonProps,\n DropdownButtonTrigger,\n DropdownButtonItem,\n DropdownButtonVariant,\n DropdownButtonAlign,\n DropdownButtonSide,\n} from \"./dropdown.types\";\n","import * as React from \"react\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport { Check, ChevronRight, Circle } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { Icon, IconName } from \"../../icon\";\nimport { DropdownTriggerVariant } from \"../../constants/enum\";\n\nconst Dropdown = DropdownMenuPrimitive.Root;\n\nexport interface DropdownTriggerProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Trigger\n> {\n variant?: DropdownTriggerVariant;\n\n showChevron?: boolean;\n\n startIcon?: React.ReactNode;\n\n endIcon?: React.ReactNode;\n}\n\nconst DropdownTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Trigger>,\n DropdownTriggerProps\n>(\n (\n {\n asChild = false,\n disabled,\n className,\n variant = DropdownTriggerVariant.Default,\n showChevron = true,\n startIcon,\n endIcon,\n children,\n ...props\n },\n ref\n ) => {\n const isGhost = variant === DropdownTriggerVariant.Ghost;\n const triggerContent = asChild ? (\n children\n ) : (\n <>\n {startIcon ? (\n <span className=\"kz-dropdown-trigger-icon-start\">{startIcon}</span>\n ) : null}\n {children}\n {endIcon ? (\n <span className=\"kz-dropdown-trigger-icon-end\">{endIcon}</span>\n ) : null}\n {showChevron ? (\n <Icon\n name={IconName.ChevronDown}\n className=\"kz-dropdown-trigger-chevron\"\n size=\"sm\"\n aria-hidden\n />\n ) : null}\n </>\n );\n\n return (\n <DropdownMenuPrimitive.Trigger\n ref={ref}\n asChild={asChild}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-trigger\",\n isGhost && \"kz-dropdown-trigger-ghost\",\n className\n )}\n {...props}\n >\n {triggerContent}\n </DropdownMenuPrimitive.Trigger>\n );\n }\n);\nDropdownTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;\n\ninterface DropdownContentProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Content\n> {\n className?: string;\n align?: \"start\" | \"center\" | \"end\";\n side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n sideOffset?: number;\n alignOffset?: number;\n avoidCollisions?: boolean;\n}\n\nconst DropdownContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Content>,\n DropdownContentProps\n>(\n (\n {\n className,\n align = \"center\",\n side = \"bottom\",\n sideOffset = 4,\n alignOffset = 0,\n avoidCollisions = true,\n ...props\n },\n ref\n ) => (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Content\n ref={ref}\n align={align}\n side={side}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n avoidCollisions={avoidCollisions}\n className={cn(\"kz-dropdown-content\", className)}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n )\n);\nDropdownContent.displayName = DropdownMenuPrimitive.Content.displayName;\n\ninterface DropdownItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Item\n> {\n onSelect?: (event: Event) => void;\n disabled?: boolean;\n destructive?: boolean;\n inset?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n shortcut?: string;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n DropdownItemProps\n>(\n (\n {\n className,\n onSelect,\n disabled,\n destructive,\n inset,\n startIcon,\n endIcon,\n shortcut,\n children,\n ...props\n },\n ref\n ) => (\n <DropdownMenuPrimitive.Item\n ref={ref}\n onSelect={onSelect}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-item\",\n inset && \"kz-dropdown-item-inset\",\n destructive && \"kz-dropdown-item-destructive\",\n className\n )}\n {...props}\n >\n {startIcon ? (\n <span className=\"kz-dropdown-item-icon-start\">{startIcon}</span>\n ) : null}\n <span className=\"kz-dropdown-item-text\">{children}</span>\n {shortcut ? (\n <span className=\"kz-dropdown-item-shortcut\">{shortcut}</span>\n ) : null}\n {endIcon ? (\n <span className=\"kz-dropdown-item-icon-end\">{endIcon}</span>\n ) : null}\n </DropdownMenuPrimitive.Item>\n )\n);\nDropdownItem.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DropdownSeparator = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Separator>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator> & {\n className?: string;\n }\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.Separator\n ref={ref}\n className={cn(\"kz-dropdown-separator\", className)}\n {...props}\n />\n));\nDropdownSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;\n\ninterface DropdownLabelProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.Label\n> {\n inset?: boolean;\n className?: string;\n}\n\nconst DropdownLabel = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.Label>,\n DropdownLabelProps\n>(({ className, inset, ...props }, ref) => (\n <DropdownMenuPrimitive.Label\n ref={ref}\n className={cn(\n \"kz-dropdown-label\",\n inset && \"kz-dropdown-label-inset\",\n className\n )}\n {...props}\n />\n));\nDropdownLabel.displayName = DropdownMenuPrimitive.Label.displayName;\n\ninterface DropdownCheckboxItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.CheckboxItem\n> {\n checked?: boolean | \"indeterminate\";\n onCheckedChange?: (checked: boolean) => void;\n disabled?: boolean;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownCheckboxItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n DropdownCheckboxItemProps\n>(\n (\n { className, checked, onCheckedChange, disabled, children, ...props },\n ref\n ) => (\n <DropdownMenuPrimitive.CheckboxItem\n ref={ref}\n checked={checked}\n onCheckedChange={onCheckedChange}\n disabled={disabled}\n className={cn(\"kz-dropdown-checkbox-item\", className)}\n {...props}\n >\n <DropdownMenuPrimitive.ItemIndicator className=\"kz-dropdown-item-indicator\">\n {checked === \"indeterminate\" ? (\n <span className=\"kz-dropdown-item-indicator-minus\">−</span>\n ) : (\n <Check className=\"kz-dropdown-item-indicator-check\" />\n )}\n </DropdownMenuPrimitive.ItemIndicator>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n )\n);\nDropdownCheckboxItem.displayName =\n DropdownMenuPrimitive.CheckboxItem.displayName;\n\nconst DropdownRadioGroup = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioGroup>,\n React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioGroup\n ref={ref}\n className={cn(\"kz-dropdown-radio-group\", className)}\n {...props}\n />\n));\nDropdownRadioGroup.displayName = DropdownMenuPrimitive.RadioGroup.displayName;\n\ninterface DropdownRadioItemProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.RadioItem\n> {\n value: string;\n disabled?: boolean;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownRadioItem = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,\n DropdownRadioItemProps\n>(({ className, value, disabled, children, ...props }, ref) => (\n <DropdownMenuPrimitive.RadioItem\n ref={ref}\n value={value}\n disabled={disabled}\n className={cn(\"kz-dropdown-radio-item\", className)}\n {...props}\n >\n <DropdownMenuPrimitive.ItemIndicator className=\"kz-dropdown-item-indicator\">\n <Circle className=\"kz-dropdown-item-indicator-dot\" />\n </DropdownMenuPrimitive.ItemIndicator>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n));\nDropdownRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;\n\nconst DropdownSub = DropdownMenuPrimitive.Sub;\n\ninterface DropdownSubTriggerProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubTrigger\n> {\n inset?: boolean;\n disabled?: boolean;\n startIcon?: React.ReactNode;\n endIcon?: React.ReactNode;\n className?: string;\n children: React.ReactNode;\n}\n\nconst DropdownSubTrigger = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,\n DropdownSubTriggerProps\n>(\n (\n { className, inset, disabled, startIcon, endIcon, children, ...props },\n ref\n ) => (\n <DropdownMenuPrimitive.SubTrigger\n ref={ref}\n disabled={disabled}\n className={cn(\n \"kz-dropdown-sub-trigger\",\n inset && \"kz-dropdown-sub-trigger-inset\",\n className\n )}\n {...props}\n >\n {startIcon ? (\n <span className=\"kz-dropdown-item-icon-start\">{startIcon}</span>\n ) : null}\n <span className=\"kz-dropdown-item-text\">{children}</span>\n {endIcon ?? (\n <ChevronRight className=\"kz-dropdown-sub-trigger-chevron\" aria-hidden />\n )}\n </DropdownMenuPrimitive.SubTrigger>\n )\n);\nDropdownSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;\n\ninterface DropdownSubContentProps extends React.ComponentPropsWithoutRef<\n typeof DropdownMenuPrimitive.SubContent\n> {\n className?: string;\n sideOffset?: number;\n alignOffset?: number;\n children: React.ReactNode;\n}\n\nconst DropdownSubContent = React.forwardRef<\n React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,\n DropdownSubContentProps\n>(({ className, sideOffset = 8, alignOffset, children, ...props }, ref) => (\n <DropdownMenuPrimitive.SubContent\n ref={ref}\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n className={cn(\"kz-dropdown-sub-content\", className)}\n {...props}\n >\n {children}\n </DropdownMenuPrimitive.SubContent>\n));\nDropdownSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;\n\nexport {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownCheckboxItem,\n DropdownRadioGroup,\n DropdownRadioItem,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n};\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import * as React from \"react\";\nimport { iconRegistry, IconName } from \"./icon-registry\";\nimport { iconSize, type IconSizeKey } from \"./icon-sizes\";\nimport { cn } from \"../utils/cn\";\n\nexport interface IconProps extends Omit<\n React.SVGAttributes<SVGSVGElement>,\n \"color\"\n> {\n name: IconName;\n size?: IconSizeKey | number;\n color?: string;\n className?: string;\n}\n\nconst Icon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ name, size = \"md\", color, className, ...props }, ref) => {\n const Component = iconRegistry[name];\n if (!Component) return null;\n const sizePx = typeof size === \"number\" ? size : iconSize[size];\n const resolvedColor = color ?? \"var(--kz-color-icon-default, currentColor)\";\n return (\n <Component\n ref={ref}\n size={sizePx}\n color={resolvedColor}\n className={cn(\"shrink-0\", className)}\n {...props}\n />\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n\nexport { Icon, iconRegistry, iconSize, IconName };\nexport type { IconSizeKey };\n","import type { LucideIcon } from \"lucide-react\";\nimport {\n Search,\n CircleAlert,\n CheckCircle,\n TriangleAlert,\n Loader2,\n ChevronDown,\n ChevronLeft,\n ChevronRight,\n BarChart2,\n Shield,\n ArrowLeft,\n ArrowUp,\n ArrowDown,\n ArrowUpDown,\n EllipsisVertical,\n Sun,\n Moon,\n Settings,\n LogOut,\n User,\n FileText,\n LockOpen,\n Calendar,\n ChartArea,\n ChartBar,\n ChartBarBig,\n ChartBarDecreasing,\n ChartBarIncreasing,\n ChartBarStacked,\n ChartCandlestick,\n ChartColumn,\n ChartColumnBig,\n ChartColumnDecreasing,\n ChartColumnIncreasing,\n ChartColumnStacked,\n ChartGantt,\n ChartLine,\n ChartNetwork,\n ChartNoAxesColumn,\n ChartNoAxesColumnDecreasing,\n ChartNoAxesColumnIncreasing,\n ChartNoAxesCombined,\n ChartNoAxesGantt,\n ChartPie,\n ChartScatter,\n ChartSpline,\n FolderKanban,\n Kanban,\n SquareChartGantt,\n SquareDashedKanban,\n SquareKanban,\n TrendingDown,\n TrendingUp,\n TrendingUpDown,\n} from \"lucide-react\";\n\n/** Use IconName.* so users discover available icons. Values match registry keys. */\nexport enum IconName {\n Search = \"search\",\n CircleAlert = \"circle-alert\",\n CheckCircle = \"check-circle\",\n TriangleAlert = \"triangle-alert\",\n Loader2 = \"loader-2\",\n ChevronDown = \"chevron-down\",\n ChevronLeft = \"chevron-left\",\n ChevronRight = \"chevron-right\",\n BarChart2 = \"bar-chart-2\",\n Shield = \"shield\",\n ArrowLeft = \"arrow-left\",\n ArrowUp = \"arrow-up\",\n ArrowDown = \"arrow-down\",\n ArrowUpDown = \"arrow-up-down\",\n EllipsisVertical = \"ellipsis-vertical\",\n Sun = \"sun\",\n Moon = \"moon\",\n LogOut = \"log-out\",\n Settings = \"settings\",\n User = \"user\",\n FileText = \"file-text\",\n LockOpen = \"lock-open\",\n Calendar = \"calendar\",\n ChartArea = \"chart-area\",\n ChartBar = \"chart-bar\",\n ChartBarBig = \"chart-bar-big\",\n ChartBarDecreasing = \"chart-bar-decreasing\",\n ChartBarIncreasing = \"chart-bar-increasing\",\n ChartBarStacked = \"chart-bar-stacked\",\n ChartCandlestick = \"chart-candlestick\",\n ChartColumn = \"chart-column\",\n ChartColumnBig = \"chart-column-big\",\n ChartColumnDecreasing = \"chart-column-decreasing\",\n ChartColumnIncreasing = \"chart-column-increasing\",\n ChartColumnStacked = \"chart-column-stacked\",\n ChartGantt = \"chart-gantt\",\n ChartLine = \"chart-line\",\n ChartNetwork = \"chart-network\",\n ChartNoAxesColumn = \"chart-no-axes-column\",\n ChartNoAxesColumnDecreasing = \"chart-no-axes-column-decreasing\",\n ChartNoAxesColumnIncreasing = \"chart-no-axes-column-increasing\",\n ChartNoAxesCombined = \"chart-no-axes-combined\",\n ChartNoAxesGantt = \"chart-no-axes-gantt\",\n ChartPie = \"chart-pie\",\n ChartScatter = \"chart-scatter\",\n ChartSpline = \"chart-spline\",\n FolderKanban = \"folder-kanban\",\n Kanban = \"kanban\",\n SquareChartGantt = \"square-chart-gantt\",\n SquareDashedKanban = \"square-dashed-kanban\",\n SquareKanban = \"square-kanban\",\n TrendingDown = \"trending-down\",\n TrendingUp = \"trending-up\",\n TrendingUpDown = \"trending-up-down\",\n}\n\nexport const iconRegistry: Record<IconName, LucideIcon> = {\n [IconName.Search]: Search,\n [IconName.CircleAlert]: CircleAlert,\n [IconName.CheckCircle]: CheckCircle,\n [IconName.TriangleAlert]: TriangleAlert,\n [IconName.Loader2]: Loader2,\n [IconName.ChevronDown]: ChevronDown,\n [IconName.ChevronLeft]: ChevronLeft,\n [IconName.ChevronRight]: ChevronRight,\n [IconName.BarChart2]: BarChart2,\n [IconName.Shield]: Shield,\n [IconName.ArrowLeft]: ArrowLeft,\n [IconName.ArrowUp]: ArrowUp,\n [IconName.ArrowDown]: ArrowDown,\n [IconName.ArrowUpDown]: ArrowUpDown,\n [IconName.EllipsisVertical]: EllipsisVertical,\n [IconName.Sun]: Sun,\n [IconName.Moon]: Moon,\n [IconName.LogOut]: LogOut,\n [IconName.Settings]: Settings,\n [IconName.User]: User,\n [IconName.FileText]: FileText,\n [IconName.LockOpen]: LockOpen,\n [IconName.Calendar]: Calendar,\n [IconName.ChartArea]: ChartArea,\n [IconName.ChartBar]: ChartBar,\n [IconName.ChartBarBig]: ChartBarBig,\n [IconName.ChartBarDecreasing]: ChartBarDecreasing,\n [IconName.ChartBarIncreasing]: ChartBarIncreasing,\n [IconName.ChartBarStacked]: ChartBarStacked,\n [IconName.ChartCandlestick]: ChartCandlestick,\n [IconName.ChartColumn]: ChartColumn,\n [IconName.ChartColumnBig]: ChartColumnBig,\n [IconName.ChartColumnDecreasing]: ChartColumnDecreasing,\n [IconName.ChartColumnIncreasing]: ChartColumnIncreasing,\n [IconName.ChartColumnStacked]: ChartColumnStacked,\n [IconName.ChartGantt]: ChartGantt,\n [IconName.ChartLine]: ChartLine,\n [IconName.ChartNetwork]: ChartNetwork,\n [IconName.ChartNoAxesColumn]: ChartNoAxesColumn,\n [IconName.ChartNoAxesColumnDecreasing]: ChartNoAxesColumnDecreasing,\n [IconName.ChartNoAxesColumnIncreasing]: ChartNoAxesColumnIncreasing,\n [IconName.ChartNoAxesCombined]: ChartNoAxesCombined,\n [IconName.ChartNoAxesGantt]: ChartNoAxesGantt,\n [IconName.ChartPie]: ChartPie,\n [IconName.ChartScatter]: ChartScatter,\n [IconName.ChartSpline]: ChartSpline,\n [IconName.FolderKanban]: FolderKanban,\n [IconName.Kanban]: Kanban,\n [IconName.SquareChartGantt]: SquareChartGantt,\n [IconName.SquareDashedKanban]: SquareDashedKanban,\n [IconName.SquareKanban]: SquareKanban,\n [IconName.TrendingDown]: TrendingDown,\n [IconName.TrendingUp]: TrendingUp,\n [IconName.TrendingUpDown]: TrendingUpDown,\n};\n","/** Preset icon sizes (px). Use with Icon size prop. */\nexport const iconSize = {\n xs: 12,\n sm: 16,\n md: 24,\n lg: 32,\n xl: 40,\n} as const;\n\nexport type IconSizeKey = keyof typeof iconSize;\n","export enum Theme {\n Light = \"light\",\n Dark = \"dark\",\n}\n\nexport enum ThemeStyle {\n Enterprise = \"enterprise\",\n Neumorphic = \"neumorphic\",\n Standard = \"standard\",\n Glassmorphic = \"glassmorphic\",\n}\n\nexport enum KezelVariant {\n Standard = \"standard\",\n Neumorphic = \"neumorphic\",\n}\n\nexport enum KezelMode {\n Light,\n Dark,\n}\n\nexport enum ButtonVariant {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Outline = \"outline\",\n Ghost = \"ghost\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum ButtonType {\n Button = \"button\",\n Submit = \"submit\",\n Reset = \"reset\",\n}\n\nexport enum ButtonAspectRatio {\n Auto = \"auto\",\n Square = \"square\",\n}\n\nexport enum DropdownTriggerVariant {\n Default = \"default\",\n Ghost = \"ghost\",\n}\n\nexport enum TypographyVariant {\n H1 = \"h1\",\n H2 = \"h2\",\n H3 = \"h3\",\n Body = \"body\",\n Small = \"small\",\n Caption = \"caption\",\n Label = \"label\",\n Link = \"link\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TypographyTone {\n Primary = \"primary\",\n Secondary = \"secondary\",\n Muted = \"muted\",\n Disabled = \"disabled\",\n Inverse = \"inverse\",\n Link = \"link\",\n}\n\nexport enum TypographyAlign {\n Left = \"left\",\n Center = \"center\",\n Right = \"right\",\n}\n\nexport enum TypographyWeight {\n Regular = \"regular\",\n Medium = \"medium\",\n Semibold = \"semibold\",\n Bold = \"bold\",\n}\n\nexport enum TokenCategory {\n Color = \"color\",\n Shadow = \"shadow\",\n Length = \"length\",\n Number = \"number\",\n LineHeight = \"lineHeight\",\n FontFamily = \"fontFamily\",\n FontWeight = \"fontWeight\",\n Duration = \"duration\",\n Easing = \"easing\",\n}\n\nexport enum OverrideMode {\n Safe = \"safe\",\n Strict = \"strict\",\n}\n\nexport enum TextInputVariant {\n Default = \"default\",\n Container = \"container\",\n Ghost = \"ghost\",\n}\n\nexport enum TextInputSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TextInputState {\n Default = \"default\",\n Error = \"error\",\n Success = \"success\",\n Warning = \"warning\",\n}\n\nexport enum TooltipSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum TooltipPosition {\n Top = \"top\",\n Right = \"right\",\n Bottom = \"bottom\",\n Left = \"left\",\n}\n\nexport enum TooltipAlign {\n Start = \"start\",\n Center = \"center\",\n End = \"end\",\n}\n\nexport enum TooltipColor {\n Default = \"default\",\n Inverse = \"inverse\",\n Success = \"success\",\n Warning = \"warning\",\n Error = \"error\",\n}\n\nexport enum ToggleButtonVariant {\n Default = \"default\",\n Primary = \"primary\",\n Container = \"container\",\n}\n\nexport enum ToggleButtonSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum CheckboxVariant {\n Default = \"default\",\n Container = \"container\",\n}\n\nexport enum RadioSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n}\n\nexport enum AvatarSize {\n Sm = \"sm\",\n Md = \"md\",\n Lg = \"lg\",\n Xl = \"xl\",\n}\n\nexport enum AvatarStatus {\n Online = \"online\",\n Busy = \"busy\",\n Away = \"away\",\n Offline = \"offline\",\n}\n","import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonType,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { buttonVariants, type ButtonVariants } from \"./button.variants\";\nimport { Loader2 } from \"lucide-react\";\nimport { iconSize } from \"../../icon/icon-sizes\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface ButtonProps extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"children\" | \"onClick\"\n> {\n variant: ButtonVariant;\n size: ButtonSize;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n asChild?: boolean;\n children: React.ReactNode;\n type?: ButtonType;\n loading?: boolean;\n aspectRatio?: ButtonAspectRatio;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n variant,\n size,\n onClick,\n asChild = false,\n children,\n type = ButtonType.Button,\n loading = false,\n aspectRatio = ButtonAspectRatio.Auto,\n disabled,\n ...props\n },\n ref\n ) => {\n const Comp = asChild ? Slot : \"button\";\n const isDisabled = disabled || loading;\n\n const buttonClassName = cn(\n buttonVariants({ variant, size }),\n loading && \"opacity-[var(--kz-component-button-loading-opacity,0.8)]\",\n aspectRatio === ButtonAspectRatio.Square && \"kz-button--aspect-1-1\",\n className\n );\n\n if (asChild) {\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {children}\n </Comp>\n );\n }\n\n return (\n <Comp\n ref={ref}\n type={type}\n className={buttonClassName}\n onClick={onClick}\n disabled={isDisabled}\n aria-busy={loading}\n {...props}\n >\n {loading && (\n <Loader2\n className=\"kz-button-spinner\"\n size={iconSize.md}\n color=\"currentColor\"\n />\n )}\n {children}\n </Comp>\n );\n }\n);\n\nButton.displayName = \"Button\";\n\nexport { Button, buttonVariants };\nexport type { ButtonVariants };\n","import { cva, type VariantProps } from \"class-variance-authority\";\nimport { ButtonVariant, ButtonSize } from \"../../constants/enum\";\n\nconst base = [\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium\",\n \"transition-all duration-150 ease-out\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--kz-color-border-focus)]\",\n \"disabled:pointer-events-none disabled:opacity-[var(--kz-component-button-disabled-opacity,0.5)]\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n].join(\" \");\n\nexport const buttonVariants = cva(base, {\n variants: {\n variant: {\n primary: [\n \"bg-[var(--kz-component-button-primary-bg)]\",\n \"text-[var(--kz-component-button-primary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-primary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-primary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-primary-shadow-hover,var(--kz-component-button-primary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-primary-bg-active)]\",\n ].join(\" \"),\n secondary: [\n \"bg-[var(--kz-component-button-secondary-bg)]\",\n \"text-[var(--kz-component-button-secondary-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-secondary-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-secondary-bg-hover)]\",\n \"hover:[box-shadow:var(--kz-component-button-secondary-shadow-hover,var(--kz-component-button-secondary-shadow,none))]\",\n \"active:bg-[var(--kz-component-button-secondary-bg-active)]\",\n ].join(\" \"),\n outline: [\n \"bg-[var(--kz-component-button-outline-bg)]\",\n \"text-[var(--kz-component-button-outline-text)]\",\n \"border border-[var(--kz-component-button-outline-border)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-outline-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-outline-bg-hover,var(--kz-component-button-outline-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-outline-shadow-hover,var(--kz-component-button-outline-shadow,none))]\",\n ].join(\" \"),\n ghost: [\n \"bg-[var(--kz-component-button-ghost-bg)]\",\n \"text-[var(--kz-component-button-ghost-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"border border-transparent\",\n \"[box-shadow:none]\",\n \"hover:bg-[var(--kz-component-button-ghost-bg-hover,transparent)]\",\n \"active:opacity-80\",\n ].join(\" \"),\n success: [\n \"bg-[var(--kz-component-button-success-bg)]\",\n \"text-[var(--kz-component-button-success-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-success-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-success-bg-hover,var(--kz-component-button-success-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-success-shadow-hover,var(--kz-component-button-success-shadow,none))]\",\n ].join(\" \"),\n warning: [\n \"bg-[var(--kz-component-button-warning-bg)]\",\n \"text-[var(--kz-component-button-warning-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-warning-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-warning-bg-hover,var(--kz-component-button-warning-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-warning-shadow-hover,var(--kz-component-button-warning-shadow,none))]\",\n ].join(\" \"),\n error: [\n \"bg-[var(--kz-component-button-error-bg)]\",\n \"text-[var(--kz-component-button-error-text)]\",\n \"rounded-[var(--kz-component-button-radius,8px)]\",\n \"[box-shadow:var(--kz-component-button-error-shadow,none)]\",\n \"hover:bg-[var(--kz-component-button-error-bg-hover,var(--kz-component-button-error-bg))]\",\n \"hover:[box-shadow:var(--kz-component-button-error-shadow-hover,var(--kz-component-button-error-shadow,none))]\",\n ].join(\" \"),\n },\n size: {\n sm: [\n \"h-[var(--kz-component-button-height-sm,2rem)]\",\n \"px-[var(--kz-component-button-px-sm,0.75rem)]\",\n \"text-[length:var(--kz-component-button-text-sm,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-sm,1rem)]\",\n ].join(\" \"),\n md: [\n \"h-[var(--kz-component-button-height-md,2.5rem)]\",\n \"px-[var(--kz-component-button-px-md,1rem)]\",\n \"text-[length:var(--kz-component-button-text-md,0.875rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-md,1rem)]\",\n ].join(\" \"),\n lg: [\n \"h-[var(--kz-component-button-height-lg,3rem)]\",\n \"px-[var(--kz-component-button-px-lg,1.25rem)]\",\n \"text-[length:var(--kz-component-button-text-lg,1rem)]\",\n \"[&_svg]:size-[var(--kz-component-button-icon-lg,1.25rem)]\",\n ].join(\" \"),\n },\n },\n defaultVariants: {\n variant: ButtonVariant.Primary,\n size: ButtonSize.Md,\n },\n});\n\nexport type ButtonVariants = VariantProps<typeof buttonVariants>;\n","import * as React from \"react\";\nimport {\n Dropdown,\n DropdownTrigger,\n DropdownContent,\n DropdownItem,\n DropdownSeparator,\n DropdownLabel,\n DropdownSub,\n DropdownSubTrigger,\n DropdownSubContent,\n} from \"./dropdown\";\nimport { DropdownTriggerVariant } from \"../../constants/enum\";\nimport { Button } from \"../button\";\nimport {\n ButtonVariant,\n ButtonSize,\n ButtonAspectRatio,\n} from \"../../constants/enum\";\nimport { Icon, IconName } from \"../../icon\";\nimport type {\n DropdownButtonProps,\n DropdownButtonItem,\n DropdownButtonVariant,\n} from \"./dropdown.types\";\n\nfunction mapVariant(\n v: DropdownButtonVariant | undefined\n): DropdownTriggerVariant {\n return v === \"ghost\"\n ? DropdownTriggerVariant.Ghost\n : DropdownTriggerVariant.Default;\n}\n\nfunction renderItems(items: DropdownButtonItem[]): React.ReactNode {\n return items.map((item) => {\n if (item.type === \"label\") {\n return <DropdownLabel key={item.key}>{item.label}</DropdownLabel>;\n }\n if (item.type === \"separator\") {\n return <DropdownSeparator key={item.key} />;\n }\n if (item.type === \"submenu\") {\n return (\n <DropdownSub key={item.key}>\n <DropdownSubTrigger\n disabled={item.disabled}\n startIcon={item.icon}\n endIcon={item.endIcon}\n >\n {item.label}\n </DropdownSubTrigger>\n <DropdownSubContent>{renderItems(item.items)}</DropdownSubContent>\n </DropdownSub>\n );\n }\n const it = item as Extract<DropdownButtonItem, { type?: \"item\" }>;\n return (\n <DropdownItem\n key={it.key}\n disabled={it.disabled}\n onSelect={() => {\n it.onSelect?.();\n }}\n startIcon={it.icon}\n endIcon={it.endIcon}\n shortcut={it.shortcut}\n >\n {it.label}\n </DropdownItem>\n );\n });\n}\n\nconst DropdownButton: React.FC<DropdownButtonProps> = ({\n trigger,\n items,\n align = \"center\",\n side = \"bottom\",\n sideOffset = 4,\n disabled = false,\n contentClassName,\n}) => {\n const triggerVariant = mapVariant(trigger.variant);\n const showChevron = trigger.showChevron !== false;\n const iconOnly = trigger.iconOnly === true;\n const triggerContent = iconOnly ? (\n <Button\n variant={ButtonVariant.Ghost}\n size={ButtonSize.Sm}\n aspectRatio={ButtonAspectRatio.Square}\n aria-label={trigger.ariaLabel ?? \"Actions\"}\n >\n <Icon\n name={IconName.EllipsisVertical}\n size=\"sm\"\n color=\"currentColor\"\n aria-hidden\n />\n </Button>\n ) : trigger.icon != null ? (\n <>\n {trigger.icon}\n {trigger.label != null ? trigger.label : null}\n </>\n ) : (\n trigger.label\n );\n\n return (\n <Dropdown>\n <DropdownTrigger\n variant={triggerVariant}\n showChevron={!iconOnly && showChevron}\n disabled={disabled}\n className={trigger.className}\n asChild={iconOnly}\n >\n {triggerContent}\n </DropdownTrigger>\n <DropdownContent\n align={align}\n side={side}\n sideOffset={sideOffset}\n className={contentClassName}\n >\n {renderItems(items)}\n </DropdownContent>\n </Dropdown>\n );\n};\n\nDropdownButton.displayName = \"DropdownButton\";\n\nexport { DropdownButton };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,SAAuB;AACvB,4BAAuC;AACvC,IAAAC,uBAA4C;;;ACF5C,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ACLA,YAAuB;;;ACCvB,0BAuDO;AA4DA,IAAM,eAA6C;AAAA,EACxD,CAAC,qBAAe,GAAG;AAAA,EACnB,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,oCAAsB,GAAG;AAAA,EAC1B,CAAC,wBAAgB,GAAG;AAAA,EACpB,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,6BAAkB,GAAG;AAAA,EACtB,CAAC,qBAAe,GAAG;AAAA,EACnB,CAAC,4BAAkB,GAAG;AAAA,EACtB,CAAC,wBAAgB,GAAG;AAAA,EACpB,CAAC,4BAAkB,GAAG;AAAA,EACtB,CAAC,iCAAoB,GAAG;AAAA,EACxB,CAAC,0CAAyB,GAAG;AAAA,EAC7B,CAAC,eAAY,GAAG;AAAA,EAChB,CAAC,iBAAa,GAAG;AAAA,EACjB,CAAC,sBAAe,GAAG;AAAA,EACnB,CAAC,yBAAiB,GAAG;AAAA,EACrB,CAAC,iBAAa,GAAG;AAAA,EACjB,CAAC,0BAAiB,GAAG;AAAA,EACrB,CAAC,0BAAiB,GAAG;AAAA,EACrB,CAAC,yBAAiB,GAAG;AAAA,EACrB,CAAC,4BAAkB,GAAG;AAAA,EACtB,CAAC,0BAAiB,GAAG;AAAA,EACrB,CAAC,iCAAoB,GAAG;AAAA,EACxB,CAAC,+CAA2B,GAAG;AAAA,EAC/B,CAAC,+CAA2B,GAAG;AAAA,EAC/B,CAAC,yCAAwB,GAAG;AAAA,EAC5B,CAAC,0CAAyB,GAAG;AAAA,EAC7B,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,uCAAuB,GAAG;AAAA,EAC3B,CAAC,qDAA8B,GAAG;AAAA,EAClC,CAAC,qDAA8B,GAAG;AAAA,EAClC,CAAC,+CAA2B,GAAG;AAAA,EAC/B,CAAC,8BAAmB,GAAG;AAAA,EACvB,CAAC,4BAAkB,GAAG;AAAA,EACtB,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,8CAA0B,GAAG;AAAA,EAC9B,CAAC,mEAAoC,GAAG;AAAA,EACxC,CAAC,mEAAoC,GAAG;AAAA,EACxC,CAAC,kDAA4B,GAAG;AAAA,EAChC,CAAC,4CAAyB,GAAG;AAAA,EAC7B,CAAC,0BAAiB,GAAG;AAAA,EACrB,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,gCAAoB,GAAG;AAAA,EACxB,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,qBAAe,GAAG;AAAA,EACnB,CAAC,2CAAyB,GAAG;AAAA,EAC7B,CAAC,+CAA2B,GAAG;AAAA,EAC/B,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,kCAAqB,GAAG;AAAA,EACzB,CAAC,8BAAmB,GAAG;AAAA,EACvB,CAAC,uCAAuB,GAAG;AAC7B;;;AC1KO,IAAM,WAAW;AAAA,EACtB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;;;AFeM;AAPN,IAAM,OAAa;AAAA,EACjB,CAAC,EAAE,MAAM,OAAO,MAAM,OAAO,WAAW,GAAG,MAAM,GAAG,QAAQ;AAC1D,UAAM,YAAY,aAAa,IAAI;AACnC,QAAI,CAAC,UAAW,QAAO;AACvB,UAAM,SAAS,OAAO,SAAS,WAAW,OAAO,SAAS,IAAI;AAC9D,UAAM,gBAAgB,SAAS;AAC/B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM;AAAA,QACN,OAAO;AAAA,QACP,WAAW,GAAG,YAAY,SAAS;AAAA,QAClC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;;;AGgBZ,IAAK,yBAAL,kBAAKC,4BAAL;AACL,EAAAA,wBAAA,aAAU;AACV,EAAAA,wBAAA,WAAQ;AAFE,SAAAA;AAAA,GAAA;;;ALNN,IAAAC,sBAAA;AApCN,IAAM,WAAiC;AAcvC,IAAM,kBAAwB;AAAA,EAI5B,CACE;AAAA,IACE,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,UAAU;AAChB,UAAM,iBAAiB,UACrB,WAEA,8EACG;AAAA,kBACC,6CAAC,UAAK,WAAU,kCAAkC,qBAAU,IAC1D;AAAA,MACH;AAAA,MACA,UACC,6CAAC,UAAK,WAAU,gCAAgC,mBAAQ,IACtD;AAAA,MACH,cACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAU;AAAA,UACV,MAAK;AAAA,UACL,eAAW;AAAA;AAAA,MACb,IACE;AAAA,OACN;AAGF,WACE;AAAA,MAAuB;AAAA,MAAtB;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,WAAW;AAAA,UACX;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAoC,8BAAQ;AAa5D,IAAM,kBAAwB;AAAA,EAI5B,CACE;AAAA,IACE;AAAA,IACA,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,aAAa;AAAA,IACb,cAAc;AAAA,IACd,kBAAkB;AAAA,IAClB,GAAG;AAAA,EACL,GACA,QAEA,6CAAuB,8BAAtB,EACC;AAAA,IAAuB;AAAA,IAAtB;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,GAAG,uBAAuB,SAAS;AAAA,MAC7C,GAAG;AAAA;AAAA,EACN,GACF;AAEJ;AACA,gBAAgB,cAAoC,8BAAQ;AAgB5D,IAAM,eAAqB;AAAA,EAIzB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QAEA;AAAA,IAAuB;AAAA,IAAtB;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,SAAS;AAAA,QACT,eAAe;AAAA,QACf;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,oBACC,6CAAC,UAAK,WAAU,+BAA+B,qBAAU,IACvD;AAAA,QACJ,6CAAC,UAAK,WAAU,yBAAyB,UAAS;AAAA,QACjD,WACC,6CAAC,UAAK,WAAU,6BAA6B,oBAAS,IACpD;AAAA,QACH,UACC,6CAAC,UAAK,WAAU,6BAA6B,mBAAQ,IACnD;AAAA;AAAA;AAAA,EACN;AAEJ;AACA,aAAa,cAAoC,2BAAK;AAEtD,IAAM,oBAA0B,kBAK9B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAuB;AAAA,EAAtB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,yBAAyB,SAAS;AAAA,IAC/C,GAAG;AAAA;AACN,CACD;AACD,kBAAkB,cAAoC,gCAAU;AAShE,IAAM,gBAAsB,kBAG1B,CAAC,EAAE,WAAW,OAAO,GAAG,MAAM,GAAG,QACjC;AAAA,EAAuB;AAAA,EAAtB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA,SAAS;AAAA,MACT;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,cAAc,cAAoC,4BAAM;AAYxD,IAAM,uBAA6B;AAAA,EAIjC,CACE,EAAE,WAAW,SAAS,iBAAiB,UAAU,UAAU,GAAG,MAAM,GACpE,QAEA;AAAA,IAAuB;AAAA,IAAtB;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW,GAAG,6BAA6B,SAAS;AAAA,MACnD,GAAG;AAAA,MAEJ;AAAA,qDAAuB,qCAAtB,EAAoC,WAAU,8BAC5C,sBAAY,kBACX,6CAAC,UAAK,WAAU,oCAAmC,oBAAC,IAEpD,6CAAC,8BAAM,WAAU,oCAAmC,GAExD;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;AACA,qBAAqB,cACG,mCAAa;AAErC,IAAM,qBAA2B,kBAG/B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAuB;AAAA,EAAtB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,IACjD,GAAG;AAAA;AACN,CACD;AACD,mBAAmB,cAAoC,iCAAW;AAWlE,IAAM,oBAA0B,kBAG9B,CAAC,EAAE,WAAW,OAAO,UAAU,UAAU,GAAG,MAAM,GAAG,QACrD;AAAA,EAAuB;AAAA,EAAtB;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,GAAG,0BAA0B,SAAS;AAAA,IAChD,GAAG;AAAA,IAEJ;AAAA,mDAAuB,qCAAtB,EAAoC,WAAU,8BAC7C,uDAAC,+BAAO,WAAU,kCAAiC,GACrD;AAAA,MACC;AAAA;AAAA;AACH,CACD;AACD,kBAAkB,cAAoC,gCAAU;AAEhE,IAAM,cAAoC;AAa1C,IAAM,qBAA2B;AAAA,EAI/B,CACE,EAAE,WAAW,OAAO,UAAU,WAAW,SAAS,UAAU,GAAG,MAAM,GACrE,QAEA;AAAA,IAAuB;AAAA,IAAtB;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,SAAS;AAAA,QACT;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,oBACC,6CAAC,UAAK,WAAU,+BAA+B,qBAAU,IACvD;AAAA,QACJ,6CAAC,UAAK,WAAU,yBAAyB,UAAS;AAAA,QACjD,WACC,6CAAC,qCAAa,WAAU,mCAAkC,eAAW,MAAC;AAAA;AAAA;AAAA,EAE1E;AAEJ;AACA,mBAAmB,cAAoC,iCAAW;AAWlE,IAAM,qBAA2B,kBAG/B,CAAC,EAAE,WAAW,aAAa,GAAG,aAAa,UAAU,GAAG,MAAM,GAAG,QACjE;AAAA,EAAuB;AAAA,EAAtB;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,IACjD,GAAG;AAAA,IAEH;AAAA;AACH,CACD;AACD,mBAAmB,cAAoC,iCAAW;;;AM/WlE,IAAAC,SAAuB;AACvB,wBAAqB;;;ACDrB,sCAAuC;AAGvC,IAAM,OAAO;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,EAAE,KAAK,GAAG;AAEH,IAAM,qBAAiB,qCAAI,MAAM;AAAA,EACtC,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,SAAS;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,SAAS;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,SAAS;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,IACA,MAAM;AAAA,MACJ,IAAI;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,IAAI;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,MACV,IAAI;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,EAAE,KAAK,GAAG;AAAA,IACZ;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf;AAAA,IACA;AAAA,EACF;AACF,CAAC;;;AD3FD,IAAAC,uBAAwB;AA+ChB,IAAAC,sBAAA;AA7BR,IAAM,SAAe;AAAA,EACnB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,OAAO,UAAU,yBAAO;AAC9B,UAAM,aAAa,YAAY;AAE/B,UAAM,kBAAkB;AAAA,MACtB,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,MAChC,WAAW;AAAA,MACX,yCAA4C;AAAA,MAC5C;AAAA,IACF;AAEA,QAAI,SAAS;AACX,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,MAAM,UAAU,SAAY;AAAA,UAC5B,WAAW;AAAA,UACX;AAAA,UACA,UAAU;AAAA,UACV,aAAW;AAAA,UACV,GAAG;AAAA,UAEH;AAAA;AAAA,MACH;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QACA,UAAU;AAAA,QACV,aAAW;AAAA,QACV,GAAG;AAAA,QAEH;AAAA,qBACC;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAM,SAAS;AAAA,cACf,OAAM;AAAA;AAAA,UACR;AAAA,UAED;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;;;AExDR,IAAAC,sBAAA;AAXb,SAAS,WACP,GACwB;AACxB,SAAO,MAAM;AAGf;AAEA,SAAS,YAAY,OAA8C;AACjE,SAAO,MAAM,IAAI,CAAC,SAAS;AACzB,QAAI,KAAK,SAAS,SAAS;AACzB,aAAO,6CAAC,iBAA8B,eAAK,SAAhB,KAAK,GAAiB;AAAA,IACnD;AACA,QAAI,KAAK,SAAS,aAAa;AAC7B,aAAO,6CAAC,uBAAuB,KAAK,GAAK;AAAA,IAC3C;AACA,QAAI,KAAK,SAAS,WAAW;AAC3B,aACE,8CAAC,eACC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,UAAU,KAAK;AAAA,YACf,WAAW,KAAK;AAAA,YAChB,SAAS,KAAK;AAAA,YAEb,eAAK;AAAA;AAAA,QACR;AAAA,QACA,6CAAC,sBAAoB,sBAAY,KAAK,KAAK,GAAE;AAAA,WAR7B,KAAK,GASvB;AAAA,IAEJ;AACA,UAAM,KAAK;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,UAAU,GAAG;AAAA,QACb,UAAU,MAAM;AACd,aAAG,WAAW;AAAA,QAChB;AAAA,QACA,WAAW,GAAG;AAAA,QACd,SAAS,GAAG;AAAA,QACZ,UAAU,GAAG;AAAA,QAEZ,aAAG;AAAA;AAAA,MATC,GAAG;AAAA,IAUV;AAAA,EAEJ,CAAC;AACH;AAEA,IAAM,iBAAgD,CAAC;AAAA,EACrD;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb,WAAW;AAAA,EACX;AACF,MAAM;AACJ,QAAM,iBAAiB,WAAW,QAAQ,OAAO;AACjD,QAAM,cAAc,QAAQ,gBAAgB;AAC5C,QAAM,WAAW,QAAQ,aAAa;AACtC,QAAM,iBAAiB,WACrB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,cAAY,QAAQ,aAAa;AAAA,MAEjC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,MAAK;AAAA,UACL,OAAM;AAAA,UACN,eAAW;AAAA;AAAA,MACb;AAAA;AAAA,EACF,IACE,QAAQ,QAAQ,OAClB,8EACG;AAAA,YAAQ;AAAA,IACR,QAAQ,SAAS,OAAO,QAAQ,QAAQ;AAAA,KAC3C,IAEA,QAAQ;AAGV,SACE,8CAAC,YACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,aAAa,CAAC,YAAY;AAAA,QAC1B;AAAA,QACA,WAAW,QAAQ;AAAA,QACnB,SAAS;AAAA,QAER;AAAA;AAAA,IACH;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QAEV,sBAAY,KAAK;AAAA;AAAA,IACpB;AAAA,KACF;AAEJ;AAEA,eAAe,cAAc;","names":["React","import_lucide_react","DropdownTriggerVariant","import_jsx_runtime","React","import_lucide_react","import_jsx_runtime","import_jsx_runtime"]}
|
package/dist/dropdown.mjs
CHANGED
|
@@ -175,13 +175,17 @@ var DropdownTrigger = React2.forwardRef(
|
|
|
175
175
|
className,
|
|
176
176
|
variant = "default" /* Default */,
|
|
177
177
|
showChevron = true,
|
|
178
|
+
startIcon,
|
|
179
|
+
endIcon,
|
|
178
180
|
children,
|
|
179
181
|
...props
|
|
180
182
|
}, ref) => {
|
|
181
183
|
const isGhost = variant === "ghost" /* Ghost */;
|
|
182
|
-
const triggerContent = asChild
|
|
184
|
+
const triggerContent = asChild ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
185
|
+
startIcon ? /* @__PURE__ */ jsx2("span", { className: "kz-dropdown-trigger-icon-start", children: startIcon }) : null,
|
|
183
186
|
children,
|
|
184
|
-
/* @__PURE__ */ jsx2(
|
|
187
|
+
endIcon ? /* @__PURE__ */ jsx2("span", { className: "kz-dropdown-trigger-icon-end", children: endIcon }) : null,
|
|
188
|
+
showChevron ? /* @__PURE__ */ jsx2(
|
|
185
189
|
Icon,
|
|
186
190
|
{
|
|
187
191
|
name: "chevron-down" /* ChevronDown */,
|
|
@@ -189,7 +193,7 @@ var DropdownTrigger = React2.forwardRef(
|
|
|
189
193
|
size: "sm",
|
|
190
194
|
"aria-hidden": true
|
|
191
195
|
}
|
|
192
|
-
)
|
|
196
|
+
) : null
|
|
193
197
|
] });
|
|
194
198
|
return /* @__PURE__ */ jsx2(
|
|
195
199
|
DropdownMenuPrimitive.Trigger,
|
|
@@ -553,7 +557,15 @@ function renderItems(items) {
|
|
|
553
557
|
}
|
|
554
558
|
if (item.type === "submenu") {
|
|
555
559
|
return /* @__PURE__ */ jsxs3(DropdownSub, { children: [
|
|
556
|
-
/* @__PURE__ */ jsx4(
|
|
560
|
+
/* @__PURE__ */ jsx4(
|
|
561
|
+
DropdownSubTrigger,
|
|
562
|
+
{
|
|
563
|
+
disabled: item.disabled,
|
|
564
|
+
startIcon: item.icon,
|
|
565
|
+
endIcon: item.endIcon,
|
|
566
|
+
children: item.label
|
|
567
|
+
}
|
|
568
|
+
),
|
|
557
569
|
/* @__PURE__ */ jsx4(DropdownSubContent, { children: renderItems(item.items) })
|
|
558
570
|
] }, item.key);
|
|
559
571
|
}
|
|
@@ -566,6 +578,7 @@ function renderItems(items) {
|
|
|
566
578
|
it.onSelect?.();
|
|
567
579
|
},
|
|
568
580
|
startIcon: it.icon,
|
|
581
|
+
endIcon: it.endIcon,
|
|
569
582
|
shortcut: it.shortcut,
|
|
570
583
|
children: it.label
|
|
571
584
|
},
|