@refinn/core-ui 0.1.17 → 0.1.18

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/index.cjs CHANGED
@@ -376,15 +376,15 @@ var import_react4 = require("react");
376
376
  var import_jsx_runtime4 = require("react/jsx-runtime");
377
377
  var sizeClasses2 = {
378
378
  xs: "h-24 w-24",
379
- s: "h-32 w-32",
380
- m: "h-40 w-40",
381
- l: "h-48 w-48"
379
+ sm: "h-32 w-32",
380
+ md: "h-40 w-40",
381
+ lg: "h-48 w-48"
382
382
  };
383
383
  var iconSizeClasses = {
384
384
  xs: "h-16 w-16",
385
- s: "h-20 w-20",
386
- m: "h-24 w-24",
387
- l: "h-24 w-24"
385
+ sm: "h-20 w-20",
386
+ md: "h-24 w-24",
387
+ lg: "h-24 w-24"
388
388
  };
389
389
  var surfaceBackgroundClasses = {
390
390
  default: {
@@ -424,7 +424,7 @@ var IconButton = (0, import_react4.forwardRef)(
424
424
  (_a, ref) => {
425
425
  var _b = _a, {
426
426
  icon,
427
- size = "s",
427
+ size = "sm",
428
428
  surface = "default",
429
429
  transparent = false,
430
430
  danger = false,
@@ -581,7 +581,7 @@ var AlertBanner = (0, import_react5.forwardRef)(
581
581
  onClose && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
582
582
  IconButton,
583
583
  {
584
- size: "s",
584
+ size: "sm",
585
585
  surface: closeButtonSurface,
586
586
  transparent: true,
587
587
  onClick: onClose,
@@ -911,21 +911,21 @@ function IndeterminateIcon({ className }) {
911
911
  );
912
912
  }
913
913
  var boxSizeClasses = {
914
- s: "h-20 w-20",
915
- m: "h-24 w-24"
914
+ sm: "h-20 w-20",
915
+ md: "h-24 w-24"
916
916
  };
917
917
  var labelTextClasses = {
918
- s: "text-label-medium",
919
- m: "text-label-large"
918
+ sm: "text-label-medium",
919
+ md: "text-label-large"
920
920
  };
921
921
  var descriptionPaddingClasses = {
922
- s: "pl-24",
923
- m: "pl-28"
922
+ sm: "pl-24",
923
+ md: "pl-28"
924
924
  };
925
925
  var Checkbox = (0, import_react9.forwardRef)(
926
926
  (_a, ref) => {
927
927
  var _b = _a, {
928
- size = "s",
928
+ size = "sm",
929
929
  label,
930
930
  description,
931
931
  error = false,
@@ -1206,7 +1206,7 @@ var TextField = (0, import_react11.forwardRef)(
1206
1206
  ]);
1207
1207
  const [isFocused, setIsFocused] = (0, import_react11.useState)(false);
1208
1208
  const isActive = isFocused && !!value;
1209
- const iconButtonSize = size === "lg" ? "m" : "s";
1209
+ const iconButtonSize = size === "lg" ? "md" : "sm";
1210
1210
  const inputRef = (0, import_react11.useRef)(null);
1211
1211
  (0, import_react11.useImperativeHandle)(ref, () => inputRef.current);
1212
1212
  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "w-full flex flex-col gap-4 font-sans", children: [
@@ -1603,7 +1603,7 @@ var Dialog = (0, import_react13.forwardRef)(
1603
1603
  IconButton,
1604
1604
  {
1605
1605
  icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CloseIcon2, { className: "h-24 w-24" }),
1606
- size: "m",
1606
+ size: "md",
1607
1607
  surface: "dark",
1608
1608
  "aria-label": "\u0E1B\u0E34\u0E14",
1609
1609
  onClick: handleClose
@@ -1624,7 +1624,7 @@ var Dialog = (0, import_react13.forwardRef)(
1624
1624
  IconButton,
1625
1625
  {
1626
1626
  icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CloseIcon2, { className: "h-20 w-20" }),
1627
- size: "s",
1627
+ size: "sm",
1628
1628
  "aria-label": "\u0E1B\u0E34\u0E14",
1629
1629
  onClick: handleClose,
1630
1630
  className: "lg:hidden!"
@@ -1634,7 +1634,7 @@ var Dialog = (0, import_react13.forwardRef)(
1634
1634
  IconButton,
1635
1635
  {
1636
1636
  icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CloseIcon2, { className: "h-24 w-24" }),
1637
- size: "m",
1637
+ size: "md",
1638
1638
  "aria-label": "\u0E1B\u0E34\u0E14",
1639
1639
  onClick: handleClose,
1640
1640
  className: "hidden! lg:inline-flex!"
@@ -1728,6 +1728,7 @@ var Drawer = (0, import_react14.forwardRef)(
1728
1728
  dismiss,
1729
1729
  secondary,
1730
1730
  confirm,
1731
+ noPadding = false,
1731
1732
  className = ""
1732
1733
  } = _b, rest = __objRest(_b, [
1733
1734
  "open",
@@ -1743,6 +1744,7 @@ var Drawer = (0, import_react14.forwardRef)(
1743
1744
  "dismiss",
1744
1745
  "secondary",
1745
1746
  "confirm",
1747
+ "noPadding",
1746
1748
  "className"
1747
1749
  ]);
1748
1750
  const { mounted, animate } = useMountTransition2(open);
@@ -1794,12 +1796,12 @@ var Drawer = (0, import_react14.forwardRef)(
1794
1796
  onMouseDown: (e) => e.stopPropagation()
1795
1797
  }, rest), {
1796
1798
  children: [
1797
- showHeader && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
1799
+ showHeader && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-col w-full items-center border-b border-border-subtle bg-dialog-background-primary", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
1798
1800
  "div",
1799
1801
  {
1800
1802
  className: [
1801
- "flex shrink-0 items-center gap-8 border-b border-border-subtle bg-dialog-background-primary px-16 pb-12 pt-16",
1802
- fullScreen ? "lg:gap-16 lg:px-112 lg:py-24" : "lg:px-24 lg:pb-16 lg:pt-20"
1803
+ "flex shrink-0 items-center gap-8 px-16 pb-12 pt-16 w-full",
1804
+ fullScreen ? "lg:gap-16 lg:px-0 lg:py-24 lg:max-w-1216" : "lg:px-24 lg:pb-16 lg:pt-20"
1803
1805
  ].join(" "),
1804
1806
  children: [
1805
1807
  /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
@@ -1811,7 +1813,7 @@ var Drawer = (0, import_react14.forwardRef)(
1811
1813
  IconButton,
1812
1814
  {
1813
1815
  icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CloseIcon3, { className: "h-20 w-20" }),
1814
- size: "s",
1816
+ size: "sm",
1815
1817
  "aria-label": "\u0E1B\u0E34\u0E14",
1816
1818
  onClick: handleClose,
1817
1819
  className: "lg:hidden!"
@@ -1821,7 +1823,7 @@ var Drawer = (0, import_react14.forwardRef)(
1821
1823
  IconButton,
1822
1824
  {
1823
1825
  icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CloseIcon3, { className: "h-24 w-24" }),
1824
- size: fullScreen ? "l" : "m",
1826
+ size: fullScreen ? "lg" : "md",
1825
1827
  "aria-label": "\u0E1B\u0E34\u0E14",
1826
1828
  onClick: handleClose,
1827
1829
  className: "hidden! lg:inline-flex!"
@@ -1830,24 +1832,24 @@ var Drawer = (0, import_react14.forwardRef)(
1830
1832
  ] })
1831
1833
  ]
1832
1834
  }
1833
- ),
1835
+ ) }),
1834
1836
  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1835
1837
  "div",
1836
1838
  {
1837
1839
  className: [
1838
- "flex-1 overflow-y-auto p-16 text-body-regular text-dialog-text-primary",
1839
- background === "secondary" ? "bg-drawer-background-secondary" : "bg-dialog-background-primary",
1840
- fullScreen ? "lg:px-112 lg:py-24" : "lg:p-24"
1840
+ "flex-1 overflow-y-auto text-body-regular text-dialog-text-primary",
1841
+ !noPadding && "p-16",
1842
+ background === "secondary" ? "bg-drawer-background-secondary" : "bg-dialog-background-primary"
1841
1843
  ].join(" "),
1842
1844
  children
1843
1845
  }
1844
1846
  ),
1845
- showFooter && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1847
+ showFooter && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: `flex shrink-0 w-full flex-col items-center border-t border-border-subtle bg-dialog-background-primary`, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1846
1848
  "div",
1847
1849
  {
1848
1850
  className: [
1849
- "flex shrink-0 flex-col gap-8 border-t border-border-subtle bg-dialog-background-primary px-16 pb-16 pt-12 lg:flex-row lg:items-center lg:justify-end",
1850
- fullScreen ? "lg:gap-16 lg:px-112 lg:py-24" : "lg:px-24 lg:pb-24 lg:pt-16"
1851
+ "flex shrink-0 flex-col gap-8 px-16 pb-16 pt-12 lg:flex-row lg:items-center lg:justify-end",
1852
+ fullScreen ? "lg:gap-16 lg:px-0 lg:max-w-1216 lg:py-24" : "lg:px-24 lg:pb-24 lg:pt-16"
1851
1853
  ].join(" "),
1852
1854
  children: allActions ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
1853
1855
  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DrawerAction, { action: dismiss, variant: "tertiary", orderClass: "order-3 lg:order-1" }),
@@ -1861,7 +1863,7 @@ var Drawer = (0, import_react14.forwardRef)(
1861
1863
  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DrawerAction, { action: dismiss, variant: "tertiary", orderClass: "order-3 lg:order-1" })
1862
1864
  ] })
1863
1865
  }
1864
- )
1866
+ ) })
1865
1867
  ]
1866
1868
  })
1867
1869
  )
@@ -1969,7 +1971,7 @@ var Dropdown = (0, import_react15.forwardRef)(
1969
1971
  "className"
1970
1972
  ]);
1971
1973
  const isCombobox = variant === "combobox";
1972
- const iconButtonSize = size === "lg" ? "m" : "s";
1974
+ const iconButtonSize = size === "lg" ? "md" : "sm";
1973
1975
  const [isOpen, setIsOpen] = (0, import_react15.useState)(false);
1974
1976
  const [isFocused, setIsFocused] = (0, import_react15.useState)(false);
1975
1977
  const [query, setQuery] = (0, import_react15.useState)(value.label || "");
@@ -2386,17 +2388,11 @@ var linkVariantClasses = {
2386
2388
  lg: "text-link-large gap-4"
2387
2389
  };
2388
2390
  var iconVariantClasses = {
2389
- xs: "w-20 h-20",
2390
- sm: "w-20 h-20",
2391
- md: "w-20 h-20",
2392
- lg: "w-24 h-24"
2391
+ xs: "w-20 h-20 text-[20px]",
2392
+ sm: "w-20 h-20 text-[20px]",
2393
+ md: "w-20 h-20 text-[20px]",
2394
+ lg: "w-24 h-24 text-[24px]"
2393
2395
  };
2394
- function SuccessIcon3({ className }) {
2395
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
2396
- /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
2397
- /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
2398
- ] });
2399
- }
2400
2396
  var Link = (0, import_react18.forwardRef)(
2401
2397
  (_a, ref) => {
2402
2398
  var _b = _a, {
@@ -2405,7 +2401,7 @@ var Link = (0, import_react18.forwardRef)(
2405
2401
  linkStyle = "brand",
2406
2402
  text,
2407
2403
  href,
2408
- icon = true,
2404
+ icon,
2409
2405
  className = "",
2410
2406
  children
2411
2407
  } = _b, rest = __objRest(_b, [
@@ -2418,6 +2414,7 @@ var Link = (0, import_react18.forwardRef)(
2418
2414
  "className",
2419
2415
  "children"
2420
2416
  ]);
2417
+ var _a2;
2421
2418
  const styleClass = linkStyleClasses[linkStyle];
2422
2419
  const variantClass = linkVariantClasses[variant];
2423
2420
  const iconClass = iconVariantClasses[variant];
@@ -2428,9 +2425,11 @@ var Link = (0, import_react18.forwardRef)(
2428
2425
  variantClass,
2429
2426
  className
2430
2427
  ].filter(Boolean).join(" ");
2431
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", __spreadProps(__spreadValues({ ref, role: "link", className: classes }, rest), { children: [
2428
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", __spreadProps(__spreadValues({ ref, role: "link", className: classes }, rest), { children: [
2432
2429
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("a", { href, target: "_blank", rel: "noopener noreferrer", children: text }),
2433
- icon && !isInline ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SuccessIcon3, { className: iconClass }) : null
2430
+ icon && (0, import_react18.cloneElement)(icon, {
2431
+ className: `${(_a2 = icon.props.className) != null ? _a2 : ""} ${iconClass}`
2432
+ })
2434
2433
  ] }));
2435
2434
  }
2436
2435
  );
@@ -2963,7 +2962,7 @@ var TextArea = (0, import_react23.forwardRef)(
2963
2962
  pending ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Loading, { size: "sm", className: "shrink-0 absolute right-12 top-12" }) : clearable && isFocused && value ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
2964
2963
  IconButton,
2965
2964
  {
2966
- size: "s",
2965
+ size: "sm",
2967
2966
  transparent: true,
2968
2967
  "aria-label": "\u0E25\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21",
2969
2968
  className: "absolute right-6 top-6",
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import react__default, { HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
2
+ import react__default, { HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, ReactElement, TextareaHTMLAttributes } from 'react';
3
3
 
4
4
  interface AccordionItemData {
5
5
  id?: string;
@@ -80,7 +80,7 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
80
80
  }
81
81
  declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
82
82
 
83
- type CheckboxSize = "s" | "m";
83
+ type CheckboxSize = "sm" | "md";
84
84
  interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
85
85
  size?: CheckboxSize;
86
86
  label?: ReactNode;
@@ -182,6 +182,7 @@ interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
182
182
  dismiss?: DrawerActionProps;
183
183
  secondary?: DrawerActionProps;
184
184
  confirm?: DrawerActionProps;
185
+ noPadding?: boolean;
185
186
  }
186
187
  declare const Drawer: react.ForwardRefExoticComponent<DrawerProps & react.RefAttributes<HTMLDivElement>>;
187
188
 
@@ -233,7 +234,7 @@ interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
233
234
  }
234
235
  declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<HTMLSpanElement>>;
235
236
 
236
- type IconButtonSize = 'xs' | 's' | 'm' | 'l';
237
+ type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';
237
238
  type IconButtonSurface = 'default' | 'dark' | 'light';
238
239
  interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
239
240
  icon: ReactNode;
@@ -249,15 +250,17 @@ declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & reac
249
250
 
250
251
  type LinkVariant = 'xs' | 'sm' | 'md' | 'lg';
251
252
  type LinkStyle = 'brand' | 'white' | 'black' | 'brandLooped' | 'whiteLooped' | 'blackLooped';
252
- interface LinkProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
253
+ interface LinkProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'title'> {
253
254
  variant?: LinkVariant;
254
255
  isInline?: boolean;
255
256
  linkStyle?: LinkStyle;
256
257
  text?: ReactNode;
257
258
  href?: string;
258
- icon?: boolean;
259
+ icon?: ReactElement<{
260
+ className?: string;
261
+ }>;
259
262
  }
260
- declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLDivElement>>;
263
+ declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLSpanElement>>;
261
264
 
262
265
  type LoadingSize = "sm" | "lg";
263
266
  interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import react__default, { HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from 'react';
2
+ import react__default, { HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, ReactElement, TextareaHTMLAttributes } from 'react';
3
3
 
4
4
  interface AccordionItemData {
5
5
  id?: string;
@@ -80,7 +80,7 @@ interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
80
80
  }
81
81
  declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
82
82
 
83
- type CheckboxSize = "s" | "m";
83
+ type CheckboxSize = "sm" | "md";
84
84
  interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
85
85
  size?: CheckboxSize;
86
86
  label?: ReactNode;
@@ -182,6 +182,7 @@ interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
182
182
  dismiss?: DrawerActionProps;
183
183
  secondary?: DrawerActionProps;
184
184
  confirm?: DrawerActionProps;
185
+ noPadding?: boolean;
185
186
  }
186
187
  declare const Drawer: react.ForwardRefExoticComponent<DrawerProps & react.RefAttributes<HTMLDivElement>>;
187
188
 
@@ -233,7 +234,7 @@ interface IconProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'children'> {
233
234
  }
234
235
  declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<HTMLSpanElement>>;
235
236
 
236
- type IconButtonSize = 'xs' | 's' | 'm' | 'l';
237
+ type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';
237
238
  type IconButtonSurface = 'default' | 'dark' | 'light';
238
239
  interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
239
240
  icon: ReactNode;
@@ -249,15 +250,17 @@ declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & reac
249
250
 
250
251
  type LinkVariant = 'xs' | 'sm' | 'md' | 'lg';
251
252
  type LinkStyle = 'brand' | 'white' | 'black' | 'brandLooped' | 'whiteLooped' | 'blackLooped';
252
- interface LinkProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
253
+ interface LinkProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'title'> {
253
254
  variant?: LinkVariant;
254
255
  isInline?: boolean;
255
256
  linkStyle?: LinkStyle;
256
257
  text?: ReactNode;
257
258
  href?: string;
258
- icon?: boolean;
259
+ icon?: ReactElement<{
260
+ className?: string;
261
+ }>;
259
262
  }
260
- declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLDivElement>>;
263
+ declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLSpanElement>>;
261
264
 
262
265
  type LoadingSize = "sm" | "lg";
263
266
  interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
package/dist/index.js CHANGED
@@ -333,15 +333,15 @@ import { forwardRef as forwardRef4 } from "react";
333
333
  import { jsx as jsx4 } from "react/jsx-runtime";
334
334
  var sizeClasses2 = {
335
335
  xs: "h-24 w-24",
336
- s: "h-32 w-32",
337
- m: "h-40 w-40",
338
- l: "h-48 w-48"
336
+ sm: "h-32 w-32",
337
+ md: "h-40 w-40",
338
+ lg: "h-48 w-48"
339
339
  };
340
340
  var iconSizeClasses = {
341
341
  xs: "h-16 w-16",
342
- s: "h-20 w-20",
343
- m: "h-24 w-24",
344
- l: "h-24 w-24"
342
+ sm: "h-20 w-20",
343
+ md: "h-24 w-24",
344
+ lg: "h-24 w-24"
345
345
  };
346
346
  var surfaceBackgroundClasses = {
347
347
  default: {
@@ -381,7 +381,7 @@ var IconButton = forwardRef4(
381
381
  (_a, ref) => {
382
382
  var _b = _a, {
383
383
  icon,
384
- size = "s",
384
+ size = "sm",
385
385
  surface = "default",
386
386
  transparent = false,
387
387
  danger = false,
@@ -538,7 +538,7 @@ var AlertBanner = forwardRef5(
538
538
  onClose && /* @__PURE__ */ jsx5(
539
539
  IconButton,
540
540
  {
541
- size: "s",
541
+ size: "sm",
542
542
  surface: closeButtonSurface,
543
543
  transparent: true,
544
544
  onClick: onClose,
@@ -874,21 +874,21 @@ function IndeterminateIcon({ className }) {
874
874
  );
875
875
  }
876
876
  var boxSizeClasses = {
877
- s: "h-20 w-20",
878
- m: "h-24 w-24"
877
+ sm: "h-20 w-20",
878
+ md: "h-24 w-24"
879
879
  };
880
880
  var labelTextClasses = {
881
- s: "text-label-medium",
882
- m: "text-label-large"
881
+ sm: "text-label-medium",
882
+ md: "text-label-large"
883
883
  };
884
884
  var descriptionPaddingClasses = {
885
- s: "pl-24",
886
- m: "pl-28"
885
+ sm: "pl-24",
886
+ md: "pl-28"
887
887
  };
888
888
  var Checkbox = forwardRef9(
889
889
  (_a, ref) => {
890
890
  var _b = _a, {
891
- size = "s",
891
+ size = "sm",
892
892
  label,
893
893
  description,
894
894
  error = false,
@@ -1184,7 +1184,7 @@ var TextField = forwardRef11(
1184
1184
  ]);
1185
1185
  const [isFocused, setIsFocused] = useState4(false);
1186
1186
  const isActive = isFocused && !!value;
1187
- const iconButtonSize = size === "lg" ? "m" : "s";
1187
+ const iconButtonSize = size === "lg" ? "md" : "sm";
1188
1188
  const inputRef = useRef(null);
1189
1189
  useImperativeHandle(ref, () => inputRef.current);
1190
1190
  return /* @__PURE__ */ jsxs10("div", { className: "w-full flex flex-col gap-4 font-sans", children: [
@@ -1585,7 +1585,7 @@ var Dialog = forwardRef13(
1585
1585
  IconButton,
1586
1586
  {
1587
1587
  icon: /* @__PURE__ */ jsx13(CloseIcon2, { className: "h-24 w-24" }),
1588
- size: "m",
1588
+ size: "md",
1589
1589
  surface: "dark",
1590
1590
  "aria-label": "\u0E1B\u0E34\u0E14",
1591
1591
  onClick: handleClose
@@ -1606,7 +1606,7 @@ var Dialog = forwardRef13(
1606
1606
  IconButton,
1607
1607
  {
1608
1608
  icon: /* @__PURE__ */ jsx13(CloseIcon2, { className: "h-20 w-20" }),
1609
- size: "s",
1609
+ size: "sm",
1610
1610
  "aria-label": "\u0E1B\u0E34\u0E14",
1611
1611
  onClick: handleClose,
1612
1612
  className: "lg:hidden!"
@@ -1616,7 +1616,7 @@ var Dialog = forwardRef13(
1616
1616
  IconButton,
1617
1617
  {
1618
1618
  icon: /* @__PURE__ */ jsx13(CloseIcon2, { className: "h-24 w-24" }),
1619
- size: "m",
1619
+ size: "md",
1620
1620
  "aria-label": "\u0E1B\u0E34\u0E14",
1621
1621
  onClick: handleClose,
1622
1622
  className: "hidden! lg:inline-flex!"
@@ -1714,6 +1714,7 @@ var Drawer = forwardRef14(
1714
1714
  dismiss,
1715
1715
  secondary,
1716
1716
  confirm,
1717
+ noPadding = false,
1717
1718
  className = ""
1718
1719
  } = _b, rest = __objRest(_b, [
1719
1720
  "open",
@@ -1729,6 +1730,7 @@ var Drawer = forwardRef14(
1729
1730
  "dismiss",
1730
1731
  "secondary",
1731
1732
  "confirm",
1733
+ "noPadding",
1732
1734
  "className"
1733
1735
  ]);
1734
1736
  const { mounted, animate } = useMountTransition2(open);
@@ -1780,12 +1782,12 @@ var Drawer = forwardRef14(
1780
1782
  onMouseDown: (e) => e.stopPropagation()
1781
1783
  }, rest), {
1782
1784
  children: [
1783
- showHeader && /* @__PURE__ */ jsxs12(
1785
+ showHeader && /* @__PURE__ */ jsx14("div", { className: "flex flex-col w-full items-center border-b border-border-subtle bg-dialog-background-primary", children: /* @__PURE__ */ jsxs12(
1784
1786
  "div",
1785
1787
  {
1786
1788
  className: [
1787
- "flex shrink-0 items-center gap-8 border-b border-border-subtle bg-dialog-background-primary px-16 pb-12 pt-16",
1788
- fullScreen ? "lg:gap-16 lg:px-112 lg:py-24" : "lg:px-24 lg:pb-16 lg:pt-20"
1789
+ "flex shrink-0 items-center gap-8 px-16 pb-12 pt-16 w-full",
1790
+ fullScreen ? "lg:gap-16 lg:px-0 lg:py-24 lg:max-w-1216" : "lg:px-24 lg:pb-16 lg:pt-20"
1789
1791
  ].join(" "),
1790
1792
  children: [
1791
1793
  /* @__PURE__ */ jsxs12("div", { className: "flex min-w-0 flex-1 flex-col gap-2", children: [
@@ -1797,7 +1799,7 @@ var Drawer = forwardRef14(
1797
1799
  IconButton,
1798
1800
  {
1799
1801
  icon: /* @__PURE__ */ jsx14(CloseIcon3, { className: "h-20 w-20" }),
1800
- size: "s",
1802
+ size: "sm",
1801
1803
  "aria-label": "\u0E1B\u0E34\u0E14",
1802
1804
  onClick: handleClose,
1803
1805
  className: "lg:hidden!"
@@ -1807,7 +1809,7 @@ var Drawer = forwardRef14(
1807
1809
  IconButton,
1808
1810
  {
1809
1811
  icon: /* @__PURE__ */ jsx14(CloseIcon3, { className: "h-24 w-24" }),
1810
- size: fullScreen ? "l" : "m",
1812
+ size: fullScreen ? "lg" : "md",
1811
1813
  "aria-label": "\u0E1B\u0E34\u0E14",
1812
1814
  onClick: handleClose,
1813
1815
  className: "hidden! lg:inline-flex!"
@@ -1816,24 +1818,24 @@ var Drawer = forwardRef14(
1816
1818
  ] })
1817
1819
  ]
1818
1820
  }
1819
- ),
1821
+ ) }),
1820
1822
  /* @__PURE__ */ jsx14(
1821
1823
  "div",
1822
1824
  {
1823
1825
  className: [
1824
- "flex-1 overflow-y-auto p-16 text-body-regular text-dialog-text-primary",
1825
- background === "secondary" ? "bg-drawer-background-secondary" : "bg-dialog-background-primary",
1826
- fullScreen ? "lg:px-112 lg:py-24" : "lg:p-24"
1826
+ "flex-1 overflow-y-auto text-body-regular text-dialog-text-primary",
1827
+ !noPadding && "p-16",
1828
+ background === "secondary" ? "bg-drawer-background-secondary" : "bg-dialog-background-primary"
1827
1829
  ].join(" "),
1828
1830
  children
1829
1831
  }
1830
1832
  ),
1831
- showFooter && /* @__PURE__ */ jsx14(
1833
+ showFooter && /* @__PURE__ */ jsx14("div", { className: `flex shrink-0 w-full flex-col items-center border-t border-border-subtle bg-dialog-background-primary`, children: /* @__PURE__ */ jsx14(
1832
1834
  "div",
1833
1835
  {
1834
1836
  className: [
1835
- "flex shrink-0 flex-col gap-8 border-t border-border-subtle bg-dialog-background-primary px-16 pb-16 pt-12 lg:flex-row lg:items-center lg:justify-end",
1836
- fullScreen ? "lg:gap-16 lg:px-112 lg:py-24" : "lg:px-24 lg:pb-24 lg:pt-16"
1837
+ "flex shrink-0 flex-col gap-8 px-16 pb-16 pt-12 lg:flex-row lg:items-center lg:justify-end",
1838
+ fullScreen ? "lg:gap-16 lg:px-0 lg:max-w-1216 lg:py-24" : "lg:px-24 lg:pb-24 lg:pt-16"
1837
1839
  ].join(" "),
1838
1840
  children: allActions ? /* @__PURE__ */ jsxs12(Fragment3, { children: [
1839
1841
  /* @__PURE__ */ jsx14(DrawerAction, { action: dismiss, variant: "tertiary", orderClass: "order-3 lg:order-1" }),
@@ -1847,7 +1849,7 @@ var Drawer = forwardRef14(
1847
1849
  /* @__PURE__ */ jsx14(DrawerAction, { action: dismiss, variant: "tertiary", orderClass: "order-3 lg:order-1" })
1848
1850
  ] })
1849
1851
  }
1850
- )
1852
+ ) })
1851
1853
  ]
1852
1854
  })
1853
1855
  )
@@ -1961,7 +1963,7 @@ var Dropdown = forwardRef15(
1961
1963
  "className"
1962
1964
  ]);
1963
1965
  const isCombobox = variant === "combobox";
1964
- const iconButtonSize = size === "lg" ? "m" : "s";
1966
+ const iconButtonSize = size === "lg" ? "md" : "sm";
1965
1967
  const [isOpen, setIsOpen] = useState8(false);
1966
1968
  const [isFocused, setIsFocused] = useState8(false);
1967
1969
  const [query, setQuery] = useState8(value.label || "");
@@ -2361,7 +2363,7 @@ var Icon = forwardRef17(
2361
2363
  Icon.displayName = "Icon";
2362
2364
 
2363
2365
  // src/components/Link/Link.tsx
2364
- import { forwardRef as forwardRef18 } from "react";
2366
+ import { forwardRef as forwardRef18, cloneElement } from "react";
2365
2367
  import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
2366
2368
  var linkStyleClasses = {
2367
2369
  brand: "font-sans text-link-text-enabled",
@@ -2378,17 +2380,11 @@ var linkVariantClasses = {
2378
2380
  lg: "text-link-large gap-4"
2379
2381
  };
2380
2382
  var iconVariantClasses = {
2381
- xs: "w-20 h-20",
2382
- sm: "w-20 h-20",
2383
- md: "w-20 h-20",
2384
- lg: "w-24 h-24"
2383
+ xs: "w-20 h-20 text-[20px]",
2384
+ sm: "w-20 h-20 text-[20px]",
2385
+ md: "w-20 h-20 text-[20px]",
2386
+ lg: "w-24 h-24 text-[24px]"
2385
2387
  };
2386
- function SuccessIcon3({ className }) {
2387
- return /* @__PURE__ */ jsxs15("svg", { className, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
2388
- /* @__PURE__ */ jsx18("path", { d: "M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z", stroke: "currentColor", strokeWidth: "1.5" }),
2389
- /* @__PURE__ */ jsx18("path", { d: "m7 10 2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
2390
- ] });
2391
- }
2392
2388
  var Link = forwardRef18(
2393
2389
  (_a, ref) => {
2394
2390
  var _b = _a, {
@@ -2397,7 +2393,7 @@ var Link = forwardRef18(
2397
2393
  linkStyle = "brand",
2398
2394
  text,
2399
2395
  href,
2400
- icon = true,
2396
+ icon,
2401
2397
  className = "",
2402
2398
  children
2403
2399
  } = _b, rest = __objRest(_b, [
@@ -2410,6 +2406,7 @@ var Link = forwardRef18(
2410
2406
  "className",
2411
2407
  "children"
2412
2408
  ]);
2409
+ var _a2;
2413
2410
  const styleClass = linkStyleClasses[linkStyle];
2414
2411
  const variantClass = linkVariantClasses[variant];
2415
2412
  const iconClass = iconVariantClasses[variant];
@@ -2420,9 +2417,11 @@ var Link = forwardRef18(
2420
2417
  variantClass,
2421
2418
  className
2422
2419
  ].filter(Boolean).join(" ");
2423
- return /* @__PURE__ */ jsxs15("div", __spreadProps(__spreadValues({ ref, role: "link", className: classes }, rest), { children: [
2420
+ return /* @__PURE__ */ jsxs15("span", __spreadProps(__spreadValues({ ref, role: "link", className: classes }, rest), { children: [
2424
2421
  /* @__PURE__ */ jsx18("a", { href, target: "_blank", rel: "noopener noreferrer", children: text }),
2425
- icon && !isInline ? /* @__PURE__ */ jsx18(SuccessIcon3, { className: iconClass }) : null
2422
+ icon && cloneElement(icon, {
2423
+ className: `${(_a2 = icon.props.className) != null ? _a2 : ""} ${iconClass}`
2424
+ })
2426
2425
  ] }));
2427
2426
  }
2428
2427
  );
@@ -2966,7 +2965,7 @@ var TextArea = forwardRef23(
2966
2965
  pending ? /* @__PURE__ */ jsx23(Loading, { size: "sm", className: "shrink-0 absolute right-12 top-12" }) : clearable && isFocused && value ? /* @__PURE__ */ jsx23(
2967
2966
  IconButton,
2968
2967
  {
2969
- size: "s",
2968
+ size: "sm",
2970
2969
  transparent: true,
2971
2970
  "aria-label": "\u0E25\u0E49\u0E32\u0E07\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21",
2972
2971
  className: "absolute right-6 top-6",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@refinn/core-ui",
3
- "version": "0.1.17",
3
+ "version": "0.1.18",
4
4
  "description": "Refinn Design System — UI components + Tailwind v4 theme preset",
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.js",