@lerianstudio/sindarian-ui 1.0.0-beta.1 → 1.0.0-beta.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (107) hide show
  1. package/dist/components/breadcrumb/index.js +2 -2
  2. package/dist/components/card/account-card/index.d.ts +32 -0
  3. package/dist/components/card/account-card/index.d.ts.map +1 -0
  4. package/dist/components/card/account-card/index.js +69 -0
  5. package/dist/components/card/basic-card/index.d.ts +6 -0
  6. package/dist/components/card/basic-card/index.d.ts.map +1 -0
  7. package/dist/components/card/basic-card/index.js +20 -0
  8. package/dist/components/card/dashboard-card/index.d.ts +5 -0
  9. package/dist/components/card/dashboard-card/index.d.ts.map +1 -0
  10. package/dist/components/card/dashboard-card/index.js +20 -0
  11. package/dist/components/card/entity-card/index.d.ts +21 -0
  12. package/dist/components/card/entity-card/index.d.ts.map +1 -0
  13. package/dist/components/card/entity-card/index.js +60 -0
  14. package/dist/components/card/index.d.ts +5 -0
  15. package/dist/components/card/index.d.ts.map +1 -0
  16. package/dist/components/card/index.js +20 -0
  17. package/dist/components/dialog/confirmation-dialog/index.d.ts +15 -0
  18. package/dist/components/dialog/confirmation-dialog/index.d.ts.map +1 -0
  19. package/dist/components/dialog/confirmation-dialog/index.js +28 -0
  20. package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.d.ts +31 -0
  21. package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.d.ts.map +1 -0
  22. package/dist/components/dialog/confirmation-dialog/use-confirm-dialog.js +55 -0
  23. package/dist/components/dialog/index.d.ts +4 -0
  24. package/dist/components/dialog/index.d.ts.map +1 -0
  25. package/dist/components/dialog/index.js +19 -0
  26. package/dist/components/dialog/large-dialog/index.d.ts +11 -0
  27. package/dist/components/dialog/large-dialog/index.d.ts.map +1 -0
  28. package/dist/components/dialog/large-dialog/index.js +21 -0
  29. package/dist/components/form/input-field/index.d.ts +3 -1
  30. package/dist/components/form/input-field/index.d.ts.map +1 -1
  31. package/dist/components/form/input-field/index.js +2 -2
  32. package/dist/components/form/password-field/index.d.ts +4 -4
  33. package/dist/components/form/password-field/index.d.ts.map +1 -1
  34. package/dist/components/form/password-field/index.js +8 -7
  35. package/dist/components/page-header/index.js +1 -1
  36. package/dist/components/pagination/index.js +1 -1
  37. package/dist/components/ui/alert/index.d.ts +5 -1
  38. package/dist/components/ui/alert/index.d.ts.map +1 -1
  39. package/dist/components/ui/alert/index.js +22 -8
  40. package/dist/components/ui/alert/styles.css +68 -0
  41. package/dist/components/ui/badge/index.d.ts +1 -1
  42. package/dist/components/ui/breadcrumb/index.d.ts.map +1 -1
  43. package/dist/components/ui/breadcrumb/index.js +5 -5
  44. package/dist/components/ui/breadcrumb/styles.css +27 -0
  45. package/dist/components/ui/button/index.d.ts +3 -2
  46. package/dist/components/ui/button/index.d.ts.map +1 -1
  47. package/dist/components/ui/button/index.js +19 -28
  48. package/dist/components/ui/button/styles.css +64 -0
  49. package/dist/components/ui/card/index.js +1 -1
  50. package/dist/components/ui/dialog/index.d.ts.map +1 -1
  51. package/dist/components/ui/dialog/index.js +6 -6
  52. package/dist/components/ui/dialog/styles.css +34 -0
  53. package/dist/components/ui/form.d.ts.map +1 -1
  54. package/dist/components/ui/form.js +1 -0
  55. package/dist/components/ui/icon-button/index.d.ts +13 -0
  56. package/dist/components/ui/icon-button/index.d.ts.map +1 -0
  57. package/dist/components/ui/icon-button/index.js +35 -0
  58. package/dist/components/ui/icon-button/styles.css +33 -0
  59. package/dist/components/ui/input/adornment.d.ts +9 -0
  60. package/dist/components/ui/input/adornment.d.ts.map +1 -0
  61. package/dist/components/ui/input/adornment.js +21 -0
  62. package/dist/components/ui/input/index.d.ts +16 -2
  63. package/dist/components/ui/input/index.d.ts.map +1 -1
  64. package/dist/components/ui/input/index.js +90 -2
  65. package/dist/components/ui/input/styles.css +68 -0
  66. package/dist/components/ui/multiple-select/index.d.ts +6 -6
  67. package/dist/components/ui/paper-collapsible/index.d.ts +9 -0
  68. package/dist/components/ui/paper-collapsible/index.d.ts.map +1 -0
  69. package/dist/components/ui/paper-collapsible/index.js +24 -0
  70. package/dist/components/ui/progress/index.d.ts +1 -1
  71. package/dist/components/ui/progress/index.d.ts.map +1 -1
  72. package/dist/components/ui/select/index.d.ts +1 -2
  73. package/dist/components/ui/select/index.d.ts.map +1 -1
  74. package/dist/components/ui/select/index.js +9 -18
  75. package/dist/components/ui/select/styles.css +57 -0
  76. package/dist/components/ui/stepper/index.d.ts.map +1 -1
  77. package/dist/components/ui/stepper/index.js +4 -4
  78. package/dist/components/ui/stepper/styles.css +41 -0
  79. package/dist/components/ui/tabs/index.d.ts.map +1 -1
  80. package/dist/components/ui/tabs/index.js +4 -4
  81. package/dist/components/ui/tabs/styles.css +31 -0
  82. package/dist/components/ui/toast/toaster.js +1 -1
  83. package/dist/globals.css +234 -0
  84. package/dist/hooks/use-time.d.ts +6 -0
  85. package/dist/hooks/use-time.d.ts.map +1 -0
  86. package/dist/hooks/use-time.js +20 -0
  87. package/dist/index.d.ts +4 -1
  88. package/dist/index.d.ts.map +1 -1
  89. package/dist/index.js +5 -1
  90. package/dist/public/arm.gif +0 -0
  91. package/dist/public/clap.gif +0 -0
  92. package/dist/public/confetti-ball.gif +0 -0
  93. package/dist/public/countries.json +21200 -21200
  94. package/dist/public/dizzy.gif +0 -0
  95. package/dist/public/electricity.gif +0 -0
  96. package/dist/public/gear.gif +0 -0
  97. package/dist/public/gem.gif +0 -0
  98. package/dist/public/pencil.gif +0 -0
  99. package/dist/public/robot.gif +0 -0
  100. package/dist/public/rocket.gif +0 -0
  101. package/dist/public/software.gif +0 -0
  102. package/dist/public/solar-system.gif +0 -0
  103. package/dist/public/unicorn.gif +0 -0
  104. package/package.json +22 -19
  105. package/dist/components/ui/input-with-icon/index.d.ts +0 -12
  106. package/dist/components/ui/input-with-icon/index.d.ts.map +0 -1
  107. package/dist/components/ui/input-with-icon/index.js +0 -57
@@ -1,15 +1,16 @@
1
1
  "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
2
5
  Object.defineProperty(exports, "__esModule", { value: true });
3
6
  exports.PasswordField = PasswordField;
4
7
  const jsx_runtime_1 = require("react/jsx-runtime");
5
- const react_1 = require("react");
8
+ const react_1 = __importDefault(require("react"));
6
9
  const form_1 = require("../../../components/ui/form");
7
10
  const input_1 = require("../../../components/ui/input");
8
11
  const lucide_react_1 = require("lucide-react");
9
- function PasswordField({ name, label, tooltip, control, required = false, disabled = false }) {
10
- const [showPassword, setShowPassword] = (0, react_1.useState)(false);
11
- return ((0, jsx_runtime_1.jsx)(form_1.FormField, { control: control, name: name, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [(0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : undefined, children: label }), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [(0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(input_1.Input, { ...field, type: showPassword ? 'text' : 'password', disabled: disabled, className: "pr-10" }) }), (0, jsx_runtime_1.jsx)("button", { type: "button", className: "absolute inset-y-0 right-0 flex items-center px-3 text-gray-400 hover:text-gray-500 focus:outline-hidden", tabIndex: -1, onMouseDown: (e) => {
12
- e.preventDefault();
13
- setShowPassword(!showPassword);
14
- }, children: showPassword ? (0, jsx_runtime_1.jsx)(lucide_react_1.EyeOffIcon, { size: 20 }) : (0, jsx_runtime_1.jsx)(lucide_react_1.EyeIcon, { size: 20 }) })] }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {})] })) }));
12
+ const icon_button_1 = require("../../../components/ui/icon-button");
13
+ function PasswordField({ name, label, tooltip, placeholder, control, required = false, disabled = false }) {
14
+ const [show, setShow] = react_1.default.useState(false);
15
+ return ((0, jsx_runtime_1.jsx)(form_1.FormField, { control: control, name: name, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [(0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : undefined, children: label }), (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(input_1.Input, { ...field, type: show ? 'text' : 'password', placeholder: placeholder, endAdornment: (0, jsx_runtime_1.jsx)(input_1.InputAdornment, { position: "end", children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", rounded: true, onClick: () => setShow(!show), children: show ? (0, jsx_runtime_1.jsx)(lucide_react_1.EyeOff, {}) : (0, jsx_runtime_1.jsx)(lucide_react_1.Eye, {}) }) }), disabled: disabled, className: "pr-10" }) }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {})] })) }));
15
16
  }
@@ -43,5 +43,5 @@ function PageHeaderCollapsibleInfoTrigger({ question }) {
43
43
  return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-header-collapsible-info-trigger", children: (0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "link", className: "flex gap-2 pr-0", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-sm font-medium text-[#3f3f46]", children: question }), (0, jsx_runtime_1.jsx)(lucide_react_1.HelpCircle, { className: "h-4 w-4" })] }) }) }));
44
44
  }
45
45
  function PageHeaderCollapsibleInfo({ question, answer, seeMore, href }) {
46
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-header-collapsible-info", children: (0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleContent, { children: (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mt-12 flex flex-col gap-3", children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-xl font-bold text-[#3f3f46]", children: question }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-shadcn-500 text-sm leading-none font-medium", children: answer }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("a", { target: "_blank", rel: "noopener noreferrer", href: href, className: "text-shadcn-600 justify-start text-sm font-medium underline underline-offset-4", children: seeMore }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { size: 16 })] })] })] }), (0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", className: "cursor-pointer self-start", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronUp, { size: 24, className: "text-shadcn-500" }) }) })] }) }) }));
46
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-header-collapsible-info", children: (0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleContent, { children: (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mt-12 flex flex-col gap-3", children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-xl font-bold text-[#3f3f46]", children: question }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-3", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-shadcn-500 text-sm leading-none font-medium", children: answer }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("a", { target: "_blank", rel: "noopener noreferrer", href: href, className: "text-shadcn-600 justify-start text-sm font-medium underline underline-offset-4", children: seeMore }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { size: 16 })] })] })] }), (0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "link", className: "cursor-pointer self-start", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronUp, { size: 24, className: "text-shadcn-500" }) }) })] }) }) }));
47
47
  }
@@ -5,6 +5,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const button_1 = require("../ui/button");
6
6
  const lucide_react_1 = require("lucide-react");
7
7
  const Pagination = ({ page, limit, total = 0, previousLabel, nextLabel, nextPage, previousPage }) => {
8
- return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-end space-x-2", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "sm", onClick: previousPage, disabled: page <= 1, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { size: 16 }), iconPlacement: "start", children: previousLabel }), (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "sm", onClick: nextPage, disabled: total < limit, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 }), iconPlacement: "end", children: nextLabel })] }));
8
+ return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-end space-x-2", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "small", onClick: previousPage, disabled: page <= 1, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { size: 16 }), iconPlacement: "start", children: previousLabel }), (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", size: "small", onClick: nextPage, disabled: total < limit, icon: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { size: 16 }), iconPlacement: "end", children: nextLabel })] }));
9
9
  };
10
10
  exports.Pagination = Pagination;
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { type VariantProps } from 'class-variance-authority';
3
+ import { IconButton } from '../icon-button';
3
4
  declare const alertVariants: (props?: ({
4
5
  variant?: "default" | "informative" | "destructive" | "warning" | "success" | null | undefined;
5
6
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -7,5 +8,8 @@ export type AlertProps = React.ComponentProps<'div'> & VariantProps<typeof alert
7
8
  declare function Alert({ className, variant, ...props }: AlertProps): import("react/jsx-runtime").JSX.Element;
8
9
  declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
9
10
  declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
10
- export { Alert, AlertTitle, AlertDescription };
11
+ declare function AlertActions({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
12
+ declare function AlertTopAction({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
13
+ declare function AlertClose({ className, ...props }: React.ComponentProps<typeof IconButton>): import("react/jsx-runtime").JSX.Element;
14
+ export { Alert, AlertTitle, AlertDescription, AlertActions, AlertTopAction, AlertClose };
11
15
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,aAAa;;8EAoBlB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAClD,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAEpC,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CAS1D;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQvE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAG3C,QAAA,MAAM,aAAa;;8EAajB,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAClD,YAAY,CAAC,OAAO,aAAa,CAAC,CAAA;AAEpC,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CAS1D;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQvE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ3E;AAED,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,2CAczC;AAED,OAAO,EACL,KAAK,EACL,UAAU,EACV,gBAAgB,EAChB,YAAY,EACZ,cAAc,EACd,UAAU,EACX,CAAA"}
@@ -3,17 +3,22 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.Alert = Alert;
4
4
  exports.AlertTitle = AlertTitle;
5
5
  exports.AlertDescription = AlertDescription;
6
+ exports.AlertActions = AlertActions;
7
+ exports.AlertTopAction = AlertTopAction;
8
+ exports.AlertClose = AlertClose;
6
9
  const jsx_runtime_1 = require("react/jsx-runtime");
7
10
  const class_variance_authority_1 = require("class-variance-authority");
8
11
  const utils_1 = require("../../../lib/utils");
9
- const alertVariants = (0, class_variance_authority_1.cva)('relative w-full rounded-lg border border-slate-200 p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-slate-950 dark:border-slate-800 dark:[&>svg]:text-slate-50', {
12
+ const icon_button_1 = require("../icon-button");
13
+ const lucide_react_1 = require("lucide-react");
14
+ const alertVariants = (0, class_variance_authority_1.cva)('alert', {
10
15
  variants: {
11
16
  variant: {
12
- default: 'bg-white text-slate-950 dark:bg-slate-950 dark:text-slate-50',
13
- informative: 'bg-[#EFF6FF] border-opacity-50 border-[#2563eb] text-[#1E40AF] dark:bg-blue-900 dark:text-blue-50 [&>svg]:text-blue-600',
14
- destructive: 'border-red-500/50 text-red-500 dark:border-red-500 [&>svg]:text-red-500 dark:border-red-900/50 dark:text-red-900 dark:dark:border-red-900 dark:[&>svg]:text-red-900',
15
- warning: 'bg-yellow-50 border-yellow-200 text-yellow-800 [&>svg]:text-yellow-500 dark:bg-yellow-900 dark:border-yellow-700 dark:text-yellow-200 dark:[&>svg]:text-yellow-400',
16
- success: 'bg-[#F0FDF4] border-green-500/50 text-green-800 [&>svg]:text-green-600'
17
+ default: '',
18
+ informative: 'alert-informative',
19
+ destructive: 'alert-destructive',
20
+ warning: 'alert-warning',
21
+ success: 'alert-success'
17
22
  }
18
23
  },
19
24
  defaultVariants: {
@@ -24,8 +29,17 @@ function Alert({ className, variant, ...props }) {
24
29
  return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert", role: "alert", className: (0, utils_1.cn)(alertVariants({ variant }), className), ...props }));
25
30
  }
26
31
  function AlertTitle({ className, ...props }) {
27
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-title", className: (0, utils_1.cn)('mb-1 leading-none font-medium tracking-tight', className), ...props }));
32
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-title", className: (0, utils_1.cn)('alert-title', className), ...props }));
28
33
  }
29
34
  function AlertDescription({ className, ...props }) {
30
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-description", className: (0, utils_1.cn)('text-sm [&_p]:leading-relaxed', className), ...props }));
35
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-description", className: (0, utils_1.cn)('alert-description', className), ...props }));
36
+ }
37
+ function AlertActions({ className, ...props }) {
38
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-actions", className: (0, utils_1.cn)('alert-actions', className), ...props }));
39
+ }
40
+ function AlertTopAction({ className, ...props }) {
41
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "alert-top-action", className: (0, utils_1.cn)('alert-top-action', className), ...props }));
42
+ }
43
+ function AlertClose({ className, ...props }) {
44
+ return ((0, jsx_runtime_1.jsx)(AlertTopAction, { children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { className: (0, utils_1.cn)('alert-close', className), variant: "outline", size: "small", rounded: true, ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, {}) }) }));
31
45
  }
@@ -0,0 +1,68 @@
1
+ @theme {
2
+ --spacing-alert-p: --spacing(4.5);
3
+ --text-alert-title: var(--text-sm);
4
+ --text-alert-description: 13px;
5
+ --spacing-alert-icon-size: --spacing(5);
6
+
7
+ /* Variants */
8
+ --color-alert-text: var(--color-zinc-700);
9
+ --color-alert-informative: var(--color-blue-50);
10
+ --color-alert-informative-border: var(--color-blue-600);
11
+ --color-alert-informative-text: var(--color-blue-800);
12
+ --color-alert-warning: var(--color-yellow-50);
13
+ --color-alert-warning-border: var(--color-yellow-500);
14
+ --color-alert-warning-text: var(--color-yellow-800);
15
+ --color-alert-success: var(--color-green-50);
16
+ --color-alert-success-border: var(--color-green-600);
17
+ --color-alert-success-text: var(--color-green-800);
18
+ --color-alert-destructive: var(--color-red-50);
19
+ --color-alert-destructive-border: var(--color-red-600);
20
+ --color-alert-destructive-text: var(--color-red-800);
21
+ }
22
+
23
+ @layer components {
24
+ .alert {
25
+ @apply relative w-full rounded-lg bg-white p-alert-p text-alert-text;
26
+ @apply [&>svg]:size-alert-icon-size [&>svg~*]:pl-9.5 [&>svg]:absolute [&>svg]:left-4.5 [&>svg]:top-4.5 [&>svg]:text-alert-text;
27
+ }
28
+
29
+ .alert-informative {
30
+ @apply bg-alert-informative border border-alert-informative-border/50 text-alert-informative-text;
31
+ @apply [&>svg]:text-alert-informative-border [&>div:nth-child(3)]:text-alert-informative-text/70;
32
+ }
33
+
34
+ .alert-warning {
35
+ @apply bg-alert-warning border border-alert-warning-border/50 text-alert-warning-text;
36
+ @apply [&>svg]:text-alert-warning-border [&>div:nth-child(3)]:text-alert-warning-text/70;
37
+ }
38
+
39
+ .alert-success {
40
+ @apply bg-alert-success border border-alert-success-border/50 text-alert-success-text;
41
+ @apply [&>svg]:text-alert-success-border [&>div:nth-child(3)]:text-alert-success-text/70;
42
+ }
43
+
44
+ .alert-destructive {
45
+ @apply bg-alert-destructive border border-alert-destructive-border/50 text-alert-destructive-text;
46
+ @apply [&>svg]:text-alert-destructive-border [&>div:nth-child(3)]:text-alert-destructive-text/70;
47
+ }
48
+
49
+ .alert-title {
50
+ @apply text-alert-title font-medium mb-2 leading-none tracking-tight;
51
+ }
52
+
53
+ .alert-description {
54
+ @apply text-alert-description font-normal [&_p]:leading-relaxed;
55
+ }
56
+
57
+ .alert-actions {
58
+ @apply flex mt-3.5 gap-5;
59
+ }
60
+
61
+ .alert-top-action {
62
+ @apply !pl-0 absolute top-2 right-2 flex gap-2;
63
+ }
64
+
65
+ .alert-close {
66
+ @apply text-inherit;
67
+ }
68
+ }
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { type VariantProps } from 'class-variance-authority';
3
3
  declare const badgeVariants: (props?: ({
4
- variant?: "default" | "destructive" | "active" | "inactive" | "secondary" | "outline" | null | undefined;
4
+ variant?: "default" | "secondary" | "outline" | "destructive" | "active" | "inactive" | null | undefined;
5
5
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
6
6
  export type BadgeProps = React.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
7
7
  asChild?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/breadcrumb/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAE5D;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAW1E;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAQ1E;AAED,iBAAS,cAAc,CAAC,EACtB,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAaA;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAc5E;AAED,iBAAS,mBAAmB,CAAC,EAC3B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAY5B;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAa9B;AAED,OAAO,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EACnB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/breadcrumb/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,iBAAS,UAAU,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAE5D;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAQ1E;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAQ1E;AAED,iBAAS,cAAc,CAAC,EACtB,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAUA;AAED,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAW5E;AAED,iBAAS,mBAAmB,CAAC,EAC3B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAY5B;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAa9B;AAED,OAAO,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EACnB,CAAA"}
@@ -15,20 +15,20 @@ function Breadcrumb({ ...props }) {
15
15
  return (0, jsx_runtime_1.jsx)("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
16
16
  }
17
17
  function BreadcrumbList({ className, ...props }) {
18
- return ((0, jsx_runtime_1.jsx)("ol", { "data-slot": "breadcrumb-list", className: (0, utils_1.cn)('flex flex-wrap items-center gap-1.5 text-sm break-words text-slate-500 sm:gap-2.5 dark:text-slate-400', className), ...props }));
18
+ return ((0, jsx_runtime_1.jsx)("ol", { "data-slot": "breadcrumb-list", className: (0, utils_1.cn)('breadcrumb-list', className), ...props }));
19
19
  }
20
20
  function BreadcrumbItem({ className, ...props }) {
21
- return ((0, jsx_runtime_1.jsx)("li", { "data-slot": "breadcrumb-item", className: (0, utils_1.cn)('inline-flex items-center gap-1.5', className), ...props }));
21
+ return ((0, jsx_runtime_1.jsx)("li", { "data-slot": "breadcrumb-item", className: (0, utils_1.cn)('breadcrumb-item', className), ...props }));
22
22
  }
23
23
  function BreadcrumbLink({ asChild, className, ...props }) {
24
24
  const Comp = asChild ? react_slot_1.Slot : 'a';
25
- return ((0, jsx_runtime_1.jsx)(Comp, { "data-slot": "breadcrumb-link", className: (0, utils_1.cn)('font-medium text-[#3f3f46] underline transition-colors hover:text-slate-950 dark:hover:text-slate-50', className), ...props }));
25
+ return ((0, jsx_runtime_1.jsx)(Comp, { "data-slot": "breadcrumb-link", className: (0, utils_1.cn)('breadcrumb-link', className), ...props }));
26
26
  }
27
27
  function BreadcrumbPage({ className, ...props }) {
28
- return ((0, jsx_runtime_1.jsx)("span", { "data-slot": "breadcrumb-page", role: "link", "aria-disabled": "true", "aria-current": "page", className: (0, utils_1.cn)('text-shadcn-400 text-sm font-normal dark:text-slate-50', className), ...props }));
28
+ return ((0, jsx_runtime_1.jsx)("span", { "data-slot": "breadcrumb-page", role: "link", "aria-disabled": "true", "aria-current": "page", className: (0, utils_1.cn)('breadcrumb-page', className), ...props }));
29
29
  }
30
30
  function BreadcrumbSeparator({ children, className, ...props }) {
31
- return ((0, jsx_runtime_1.jsx)("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: (0, utils_1.cn)('text-shadcn-400 [&>svg]:size-3.5', className), ...props, children: children ?? (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, {}) }));
31
+ return ((0, jsx_runtime_1.jsx)("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: (0, utils_1.cn)('breadcrumb-separator', className), ...props, children: children ?? (0, jsx_runtime_1.jsx)(lucide_react_1.Slash, {}) }));
32
32
  }
33
33
  function BreadcrumbEllipsis({ className, ...props }) {
34
34
  return ((0, jsx_runtime_1.jsxs)("span", { "data-slot": "breadcrumb-ellipsis", role: "presentation", "aria-hidden": "true", className: (0, utils_1.cn)('flex h-9 w-9 items-center justify-center', className), ...props, children: [(0, jsx_runtime_1.jsx)(lucide_react_1.MoreHorizontal, { className: "h-4 w-4" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "More" })] }));
@@ -0,0 +1,27 @@
1
+ @theme {
2
+ --color-breadcrumb-link-foreground: var(--color-zinc-700);
3
+ --color-breadcrumb-link-foreground-hover: var(--color-zinc-900);
4
+ --color-breadcrumb-muted-foreground: var(--color-shadcn-400);
5
+ }
6
+
7
+ @layer components {
8
+ .breadcrumb-list {
9
+ @apply flex flex-wrap items-center gap-2 text-xs font-medium break-words sm:gap-2.5;
10
+ }
11
+
12
+ .breadcrumb-item {
13
+ @apply inline-flex items-center gap-1.5;
14
+ }
15
+
16
+ .breadcrumb-link {
17
+ @apply text-breadcrumb-link-foreground underline cursor-pointer hover:text-breadcrumb-link-foreground-hover transition-colors;
18
+ }
19
+
20
+ .breadcrumb-page {
21
+ @apply text-breadcrumb-muted-foreground;
22
+ }
23
+
24
+ .breadcrumb-separator {
25
+ @apply text-breadcrumb-muted-foreground [&>svg]:size-2.5;
26
+ }
27
+ }
@@ -1,8 +1,9 @@
1
1
  import * as React from 'react';
2
2
  import { type VariantProps } from 'class-variance-authority';
3
3
  declare const buttonVariants: (props?: ({
4
- variant?: "default" | "destructive" | "link" | "secondary" | "outline" | "plain" | "white" | "activeLink" | "hoverLink" | "ghost" | null | undefined;
5
- size?: "default" | "link" | "sm" | "lg" | "icon" | "xl" | null | undefined;
4
+ variant?: "default" | "plain" | "hoverLink" | "primary" | "secondary" | "tertiary" | "outline" | "link" | null | undefined;
5
+ fullWidth?: boolean | null | undefined;
6
+ size?: "default" | "small" | null | undefined;
6
7
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
7
8
  export type ButtonProps = React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
8
9
  asChild?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EAmCnB,CAAA;AAuBD,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GACtD,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,GAAG;IACF,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAEH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,IAAI,EACJ,aAAuB,EACvB,SAAiB,EACjB,QAAgB,EAChB,OAAO,EACP,GAAG,KAAK,EACT,EAAE,WAAW,2CAyCb;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;;8EA0BlB,CAAA;AAoBF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GACtD,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,GAAG;IACF,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,SAAS,CAAA;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAEH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,IAAI,EACJ,aAAuB,EACvB,SAAiB,EACjB,QAAgB,EAChB,OAAO,EACP,GAAG,KAAK,EACT,EAAE,WAAW,2CAgCb;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
@@ -6,27 +6,25 @@ const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const react_slot_1 = require("@radix-ui/react-slot");
7
7
  const class_variance_authority_1 = require("class-variance-authority");
8
8
  const utils_1 = require("../../../lib/utils");
9
- const buttonVariants = (0, class_variance_authority_1.cva)('relative flex inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50', {
9
+ const buttonVariants = (0, class_variance_authority_1.cva)('button-base button-disabled button-read-only', {
10
10
  variants: {
11
11
  variant: {
12
- plain: '',
13
- white: 'bg-white text-black font-semibold',
14
- activeLink: 'bg-shadcn-100 text-black font-medium',
12
+ plain: 'button-plain',
15
13
  hoverLink: 'hover:bg-accent text-black hover:text-accent-foreground font-normal',
16
- default: 'bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs disabled:bg-shadcn-200 disabled:text-shadcn-600',
17
- destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
18
- outline: 'border border-shadcn-300 bg-background hover:bg-accent hover:text-accent-foreground shadow-xs',
19
- secondary: 'border border-shadcn-300 bg-background hover:bg-primary/5 text-secondary-foreground shadow-xs',
20
- ghost: 'hover:bg-shadcn-300',
21
- link: 'text-shadcn-600 underline-offset-4 underline text-sm font-normal justify-start font-medium'
14
+ default: 'button-primary',
15
+ primary: 'button-primary',
16
+ secondary: 'button-secondary',
17
+ tertiary: 'button-tertiary',
18
+ outline: 'button-outline',
19
+ link: 'button-link'
20
+ },
21
+ fullWidth: {
22
+ true: 'w-full',
23
+ false: 'w-fit'
22
24
  },
23
25
  size: {
24
- default: 'h-10 px-4 py-2',
25
- sm: 'h-8 rounded-md px-3 py-2',
26
- lg: 'h-12 rounded-md px-8',
27
- icon: 'h-10 w-10',
28
- link: 'p-0 w-auto h-auto',
29
- xl: 'h-14 p-4'
26
+ default: '',
27
+ small: 'button-small'
30
28
  }
31
29
  },
32
30
  defaultVariants: {
@@ -43,16 +41,13 @@ const iconVariants = (0, class_variance_authority_1.cva)('', {
43
41
  'far-end': 'absolute right-2'
44
42
  },
45
43
  size: {
46
- default: 'h-10',
47
- sm: 'h-8',
48
- lg: 'h-12',
49
- icon: 'h-10',
50
- link: 'h-6',
51
- xl: 'h-14'
44
+ default: '[&>*]:size-6',
45
+ small: '[&>*]:size-4'
52
46
  }
53
47
  },
54
48
  defaultVariants: {
55
- position: 'start'
49
+ position: 'start',
50
+ size: 'default'
56
51
  }
57
52
  });
58
53
  function Button({ className, variant, size, asChild = false, icon, iconPlacement = 'start', fullWidth = false, readOnly = false, onClick, ...props }) {
@@ -64,9 +59,5 @@ function Button({ className, variant, size, asChild = false, icon, iconPlacement
64
59
  }
65
60
  onClick?.(e);
66
61
  };
67
- return ((0, jsx_runtime_1.jsxs)(Comp, { className: (0, utils_1.cn)(buttonVariants({ variant, size, className }), {
68
- 'w-full': fullWidth
69
- }, {
70
- 'data-read-only:bg-shadcn-200 data-read-only:text-shadcn-600 data-read-only:cursor-default data-read-only:opacity-50 data-read-only:focus:ring-0 data-read-only:focus:outline-hidden': readOnly
71
- }), "data-read-only": readOnly, "data-slot": "button", ...props, onClick: handleClick, children: [icon && iconPlacement === 'start' && ((0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)(iconVariants({ position: iconPlacement })), children: icon })), props.children, icon && iconPlacement !== 'start' && ((0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)(iconVariants({ position: iconPlacement })), children: icon }))] }));
62
+ return ((0, jsx_runtime_1.jsxs)(Comp, { className: (0, utils_1.cn)(buttonVariants({ variant, size, fullWidth }), className), "data-read-only": readOnly, "data-slot": "button", ...props, onClick: handleClick, children: [icon && iconPlacement === 'start' && ((0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)(iconVariants({ position: iconPlacement, size })), children: icon })), props.children, icon && iconPlacement !== 'start' && ((0, jsx_runtime_1.jsx)("span", { className: (0, utils_1.cn)(iconVariants({ position: iconPlacement, size })), children: icon }))] }));
72
63
  }
@@ -0,0 +1,64 @@
1
+ @theme {
2
+ /* Button */
3
+ --text-button: var(--font-size-sm);
4
+ --spacing-button-px: --spacing(4);
5
+ --spacing-button-py: --spacing(3);
6
+ --spacing-button-px-small: --spacing(3);
7
+ --spacing-button-py-small: --spacing(2);
8
+ --spacing-button-h: --spacing(10);
9
+ --spacing-button-h-small: --spacing(8);
10
+
11
+ --color-button-primary: var(--color-shadcn-600);
12
+ --color-button-primary-foreground: var(--color-white);
13
+ --color-button-primary-disabled: var(--color-shadcn-200);
14
+ --color-button-primary-foreground-disabled: var(--color-shadcn-600);
15
+ --color-button-secondary: var(--color-white);
16
+ --color-button-secondary-hover: var(--color-shadcn-100);
17
+ --color-button-secondary-foreground: var(--color-zinc-600);
18
+ --color-button-border: var(--color-shadcn-300);
19
+ --color-button-tertiary: var(--color-accent);
20
+ --color-button-tertiary-foreground: var(--color-accent-foreground);
21
+ --color-button-outline-foreground: var(--color-zinc-600);
22
+ }
23
+
24
+ @layer components {
25
+ .button-base {
26
+ @apply relative inline-flex items-center justify-center rounded-lg shadow-sm text-sm font-medium transition-colors cursor-pointer whitespace-nowrap h-button-h px-button-px py-button-py;
27
+ }
28
+
29
+ .button-plain {
30
+ @apply bg-transparent text-inherit shadow-none hover:bg-black/5;
31
+ }
32
+
33
+ .button-primary {
34
+ @apply bg-button-primary text-button-primary-foreground hover:bg-button-primary/80 disabled:bg-button-primary-disabled disabled:text-button-primary-foreground-disabled;
35
+ }
36
+
37
+ .button-secondary {
38
+ @apply bg-button-secondary text-button-secondary-foreground border border-button-border hover:bg-button-secondary-hover disabled:bg-button-secondary-hover;
39
+ }
40
+
41
+ .button-tertiary {
42
+ @apply bg-button-tertiary text-button-tertiary-foreground hover:bg-button-tertiary/70;
43
+ }
44
+
45
+ .button-outline {
46
+ @apply text-button-outline-foreground shadow-none border border-transparent hover:border-button-border;
47
+ }
48
+
49
+ .button-link {
50
+ @apply !p-0 !px-0 !py-0 !h-4 !text-[13px] underline shadow-none;
51
+ }
52
+
53
+ .button-disabled {
54
+ @apply disabled:pointer-events-none disabled:opacity-50 disabled:border-transparent disabled:shadow-none;
55
+ }
56
+
57
+ .button-read-only {
58
+ @apply data-[read-only=true]:cursor-default data-[read-only=true]:opacity-50 data-[read-only=true]:focus:ring-0 data-[read-only=true]:focus:outline-hidden data-[read-only=true]:border-transparent data-[read-only=true]:shadow-none;
59
+ }
60
+
61
+ .button-small {
62
+ @apply h-button-h-small px-button-px-small py-button-py-small;
63
+ }
64
+ }
@@ -16,7 +16,7 @@ function CardHeader({ className, ...props }) {
16
16
  return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "card-header", className: (0, utils_1.cn)('flex flex-col space-y-1.5', className), ...props }));
17
17
  }
18
18
  function CardTitle({ className, ...props }) {
19
- return ((0, jsx_runtime_1.jsx)("h3", { "data-slot": "card-title", className: (0, utils_1.cn)('text-sm leading-none font-medium tracking-tight uppercase', className), ...props }));
19
+ return ((0, jsx_runtime_1.jsx)("h3", { "data-slot": "card-title", className: (0, utils_1.cn)('text-sm leading-none font-medium tracking-tight', className), ...props }));
20
20
  }
21
21
  function CardDescription({ className, ...props }) {
22
22
  return ((0, jsx_runtime_1.jsx)("p", { "data-slot": "card-description", className: (0, utils_1.cn)('text-muted-foreground text-sm', className), ...props }));
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAEtD;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAErD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAWtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CAwBA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWzE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWzE;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAWpD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EAClB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAKzD,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAEtD;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAErD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAQtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CAwBA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQzE;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQpD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EAClB,CAAA"}
@@ -61,20 +61,20 @@ function DialogClose({ ...props }) {
61
61
  return (0, jsx_runtime_1.jsx)(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
62
62
  }
63
63
  function DialogOverlay({ className, ...props }) {
64
- return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: (0, utils_1.cn)('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80', className), ...props }));
64
+ return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: (0, utils_1.cn)('dialog-overlay', className), ...props }));
65
65
  }
66
66
  function DialogContent({ className, children, showCloseButton = true, ...props }) {
67
- return ((0, jsx_runtime_1.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [(0, jsx_runtime_1.jsx)(DialogOverlay, {}), (0, jsx_runtime_1.jsxs)(DialogPrimitive.Content, { "data-slot": "dialog-content", className: (0, utils_1.cn)('bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:max-w-[425px] sm:rounded-lg', !showCloseButton && '*:data-radix-dialog-close:hidden', className), ...props, children: [children, (0, jsx_runtime_1.jsxs)(DialogPrimitive.Close, { "data-slot": "dialog-close", className: "data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "h-4 w-4" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "Close" })] })] })] }));
67
+ return ((0, jsx_runtime_1.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [(0, jsx_runtime_1.jsx)(DialogOverlay, {}), (0, jsx_runtime_1.jsxs)(DialogPrimitive.Content, { "data-slot": "dialog-content", className: (0, utils_1.cn)('dialog-content', !showCloseButton && '*:data-radix-dialog-close:hidden', className), ...props, children: [children, (0, jsx_runtime_1.jsxs)(DialogPrimitive.Close, { "data-slot": "dialog-close", className: "dialog-close", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "size-4" }), (0, jsx_runtime_1.jsx)("span", { className: "sr-only", children: "Close" })] })] })] }));
68
68
  }
69
69
  function DialogHeader({ className, ...props }) {
70
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "dialog-header", className: (0, utils_1.cn)('flex flex-col gap-4 space-y-1.5 text-center sm:text-left', className), ...props }));
70
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "dialog-header", className: (0, utils_1.cn)('dialog-header', className), ...props }));
71
71
  }
72
72
  function DialogFooter({ className, ...props }) {
73
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "dialog-footer", className: (0, utils_1.cn)('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className), ...props }));
73
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "dialog-footer", className: (0, utils_1.cn)('dialog-footer', className), ...props }));
74
74
  }
75
75
  function DialogTitle({ className, ...props }) {
76
- return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Title, { "data-slot": "dialog-title", className: (0, utils_1.cn)('text-lg leading-none font-semibold tracking-tight', className), ...props }));
76
+ return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Title, { "data-slot": "dialog-title", className: (0, utils_1.cn)('dialog-title', className), ...props }));
77
77
  }
78
78
  function DialogDescription({ className, ...props }) {
79
- return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Description, { "data-slot": "dialog-description", className: (0, utils_1.cn)('text-muted-foreground text-xs font-medium', className), ...props }));
79
+ return ((0, jsx_runtime_1.jsx)(DialogPrimitive.Description, { "data-slot": "dialog-description", className: (0, utils_1.cn)('dialog-description', className), ...props }));
80
80
  }
@@ -0,0 +1,34 @@
1
+ @theme {
2
+ --color-dialog-title-text: var(--color-zinc-600);
3
+ --color-dialog-description-text: var(--color-shadcn-400);
4
+ }
5
+
6
+ @layer components {
7
+ .dialog-overlay {
8
+ @apply data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50;
9
+ }
10
+
11
+ .dialog-content {
12
+ @apply bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-8 border p-6 shadow-lg duration-200 sm:max-w-[425px] sm:rounded-lg;
13
+ }
14
+
15
+ .dialog-close {
16
+ @apply data-[state=open]:bg-accent absolute top-4 right-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 disabled:pointer-events-none data-[state=open]:text-gray-400;
17
+ }
18
+
19
+ .dialog-header {
20
+ @apply flex flex-col gap-4 space-y-1.5 text-center sm:text-left;
21
+ }
22
+
23
+ .dialog-footer {
24
+ @apply flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2;
25
+ }
26
+
27
+ .dialog-title {
28
+ @apply text-lg leading-none font-bold tracking-tight text-dialog-title-text;
29
+ }
30
+
31
+ .dialog-description {
32
+ @apply text-dialog-description-text text-sm font-medium;
33
+ }
34
+ }
@@ -1 +1 @@
1
- {"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/ui/form.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAEL,eAAe,EACf,SAAS,EACT,WAAW,EAGZ,MAAM,iBAAiB,CAAA;AAKxB,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAS9D,QAAA,MAAM,IAAI,4MAAe,CAAA;AAazB,QAAA,MAAM,SAAS,GACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,4CAMtC,CAAA;AAED,QAAA,MAAM,YAAY;;;;;;;;;;;;CAsBjB,CAAA;AAWD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,QAAQ;eAHD,OAAO;wCAanB,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,wBAAwB,CACzD,OAAO,cAAc,CAAC,IAAI,CAC3B,GAAG;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,QAAA,MAAM,SAAS;YAHL,KAAK,CAAC,SAAS;0CA2BvB,CAAA;AAGF,eAAO,MAAM,WAAW,GAAI,yBAAyB,oBAAoB,4CASxE,CAAA;AAED,QAAA,MAAM,WAAW,8JAmBf,CAAA;AAGF,QAAA,MAAM,eAAe,yHAcnB,CAAA;AAGF,QAAA,MAAM,WAAW,yHAqBf,CAAA;AAGF,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,EACV,CAAA"}
1
+ {"version":3,"file":"form.d.ts","sourceRoot":"","sources":["../../../src/components/ui/form.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAEL,eAAe,EACf,SAAS,EACT,WAAW,EAGZ,MAAM,iBAAiB,CAAA;AAKxB,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAS9D,QAAA,MAAM,IAAI,4MAAe,CAAA;AAazB,QAAA,MAAM,SAAS,GACb,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,cAEC,eAAe,CAAC,YAAY,EAAE,KAAK,CAAC,4CAMtC,CAAA;AAED,QAAA,MAAM,YAAY;;;;;;;;;;;;CAsBjB,CAAA;AAWD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,QAAQ;eAHD,OAAO;wCAanB,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,wBAAwB,CACzD,OAAO,cAAc,CAAC,IAAI,CAC3B,GAAG;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACxB,CAAA;AAED,QAAA,MAAM,SAAS;YAHL,KAAK,CAAC,SAAS;0CA2BvB,CAAA;AAGF,eAAO,MAAM,WAAW,GAAI,yBAAyB,oBAAoB,4CASxE,CAAA;AAED,QAAA,MAAM,WAAW,8JAmBf,CAAA;AAGF,QAAA,MAAM,eAAe,yHAcnB,CAAA;AAGF,QAAA,MAAM,WAAW,yHAqBf,CAAA;AAGF,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,EACV,CAAA"}
@@ -1,3 +1,4 @@
1
+ 'use client';
1
2
  "use strict";
2
3
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
4
  if (k2 === undefined) k2 = k;
@@ -0,0 +1,13 @@
1
+ import { type VariantProps } from 'class-variance-authority';
2
+ import { buttonVariants } from '../button';
3
+ export declare const iconButtonVariants: (props?: ({
4
+ rounded?: boolean | null | undefined;
5
+ size?: "default" | "small" | null | undefined;
6
+ } & import("class-variance-authority/types").ClassProp) | undefined) => string;
7
+ export type IconButtonProps = React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
8
+ rounded?: boolean;
9
+ asChild?: boolean;
10
+ readOnly?: boolean;
11
+ };
12
+ export declare function IconButton({ className, variant, rounded, size, asChild, readOnly, onClick, ...props }: IconButtonProps): import("react/jsx-runtime").JSX.Element;
13
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/icon-button/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAG1C,eAAO,MAAM,kBAAkB;;;8EAiB9B,CAAA;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC1D,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAEH,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,OAAO,EACP,OAAO,EACP,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,eAAe,2CAwBjB"}
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.iconButtonVariants = void 0;
4
+ exports.IconButton = IconButton;
5
+ const jsx_runtime_1 = require("react/jsx-runtime");
6
+ const react_slot_1 = require("@radix-ui/react-slot");
7
+ const class_variance_authority_1 = require("class-variance-authority");
8
+ const button_1 = require("../button");
9
+ const utils_1 = require("../../../lib/utils");
10
+ exports.iconButtonVariants = (0, class_variance_authority_1.cva)('icon-button-base icon-button-read-only icon-button-disabled', {
11
+ variants: {
12
+ rounded: {
13
+ true: 'icon-button-rounded',
14
+ false: ''
15
+ },
16
+ size: {
17
+ default: '',
18
+ small: 'icon-button-small'
19
+ }
20
+ },
21
+ defaultVariants: {
22
+ size: 'default'
23
+ }
24
+ });
25
+ function IconButton({ className, variant, rounded, size, asChild, readOnly, onClick, ...props }) {
26
+ const Comp = asChild ? react_slot_1.Slot : 'button';
27
+ const handleClick = (e) => {
28
+ if (readOnly) {
29
+ e.preventDefault();
30
+ return;
31
+ }
32
+ onClick?.(e);
33
+ };
34
+ return ((0, jsx_runtime_1.jsx)(Comp, { className: (0, utils_1.cn)((0, button_1.buttonVariants)({ variant, size }), (0, exports.iconButtonVariants)({ rounded, size }), className), "data-read-only": readOnly, "data-slot": "button", ...props, onClick: handleClick }));
35
+ }