@medusajs/ui 2.4.1 → 2.4.2-next-20240305095805

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 (17) hide show
  1. package/dist/cjs/components/alert/alert.js.map +1 -1
  2. package/dist/cjs/components/badge/badge.d.ts +1 -1
  3. package/dist/cjs/components/badge/badge.js +58 -4
  4. package/dist/cjs/components/badge/badge.js.map +1 -1
  5. package/dist/cjs/components/currency-input/currency-input.js +2 -2
  6. package/dist/cjs/components/currency-input/currency-input.js.map +1 -1
  7. package/dist/cjs/components/radio-group/radio-group.js +2 -2
  8. package/dist/cjs/components/radio-group/radio-group.js.map +1 -1
  9. package/dist/esm/components/alert/alert.js.map +1 -1
  10. package/dist/esm/components/badge/badge.d.ts +1 -1
  11. package/dist/esm/components/badge/badge.js +58 -4
  12. package/dist/esm/components/badge/badge.js.map +1 -1
  13. package/dist/esm/components/currency-input/currency-input.js +2 -2
  14. package/dist/esm/components/currency-input/currency-input.js.map +1 -1
  15. package/dist/esm/components/radio-group/radio-group.js +2 -2
  16. package/dist/esm/components/radio-group/radio-group.js.map +1 -1
  17. package/package.json +2 -2
package/dist/cjs/components/alert/alert.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../../src/components/alert/alert.tsx"],"names":[],"mappings":";;;;AAAA,qCAAiC;AACjC,2CAMwB;AACxB,qDAA8B;AAE9B,0DAAqD;AAOrD;;;;GAIG;AACU,QAAA,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE;AACE;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvD,MAAM,IAAI,GAAG;QACX,IAAI,EAAE,8BAAsB;QAC5B,KAAK,EAAE,oBAAY;QACnB,OAAO,EAAE,wBAAgB;QACzB,OAAO,EAAE,8BAAsB;KAChC,CAAC,OAAO,CAAC,CAAA;IAEV,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,IAAI,SAAS,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,8FAA8F,EAC9F;YACE,sBAAsB,EAAE,CAAC,WAAW;YACpC,2BAA2B,EAAE,WAAW;SACzC,EACD,SAAS,CACV,KACG,KAAK;QAET,oBAAC,IAAI,IACH,SAAS,EAAE,IAAA,SAAG,EAAC;gBACb,sBAAsB,EAAE,OAAO,KAAK,OAAO;gBAC3C,wBAAwB,EAAE,OAAO,KAAK,SAAS;gBAC/C,yBAAyB,EAAE,OAAO,KAAK,SAAS;gBAChD,0BAA0B,EAAE,OAAO,KAAK,MAAM;aAC/C,CAAC,GACF;QACF,iCAAM,QAAQ,CAAO;QACpB,WAAW,IAAI,CACd,oBAAC,wBAAU,IACT,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,aAAa;YAEtB,oBAAC,iBAAS,IAAC,SAAS,EAAC,kBAAkB,GAAG,CAC/B,CACd,CACG,CACP,CAAA;AACH,CAAC,CACF,CAAA","sourcesContent":["import { clx } from \"@/utils/clx\"\nimport {\n CheckCircleSolid,\n ExclamationCircleSolid,\n InformationCircleSolid,\n XCircleSolid,\n XMarkMini,\n} from \"@medusajs/icons\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\n\ninterface AlertProps extends React.ComponentPropsWithoutRef<\"div\"> {\n variant?: \"error\" | \"success\" | \"warning\" | \"info\"\n dismissible?: boolean\n}\n\n/**\n * This component is based on the div element and supports all of its props\n *\n * @excludeExternal\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n (\n {\n /**\n * The variant of the alert\n */\n variant = \"info\",\n /**\n * Whether the alert is dismissible\n */\n dismissible = false,\n className,\n children,\n ...props\n },\n ref\n ) => {\n const [dismissed, setDismissed] = React.useState(false)\n\n const Icon = {\n info: InformationCircleSolid,\n error: XCircleSolid,\n success: CheckCircleSolid,\n warning: ExclamationCircleSolid,\n }[variant]\n\n const handleDismiss = () => {\n setDismissed(true)\n }\n\n if (dismissed) {\n return null\n }\n\n return (\n <div\n ref={ref}\n className={clx(\n \"bg-ui-bg-subtle text-pretty txt-compact-small grid items-start gap-x-3 rounded-lg border p-3\",\n {\n \"grid-cols-[20px_1fr]\": !dismissible,\n \"grid-cols-[20px_1fr_20px]\": dismissible,\n },\n className\n )}\n {...props}\n >\n <Icon\n className={clx({\n \"text-ui-tag-red-icon\": variant === \"error\",\n \"text-ui-tag-green-icon\": variant === \"success\",\n \"text-ui-tag-orange-icon\": variant === \"warning\",\n \"text-ui-tag-neutral-icon\": variant === \"info\",\n })}\n />\n <div>{children}</div>\n {dismissible && (\n <IconButton\n size=\"2xsmall\"\n variant=\"transparent\"\n type=\"button\"\n onClick={handleDismiss}\n >\n <XMarkMini className=\"text-ui-fg-muted\" />\n </IconButton>\n )}\n </div>\n )\n }\n)\n"]}
1
+ {"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../../src/components/alert/alert.tsx"],"names":[],"mappings":";;;;AAAA,qCAAiC;AACjC,2CAMwB;AACxB,qDAA8B;AAE9B,0DAAqD;AAOrD;;;;GAIG;AACU,QAAA,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE;AACE;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACG,EACb,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvD,MAAM,IAAI,GAAG;QACX,IAAI,EAAE,8BAAsB;QAC5B,KAAK,EAAE,oBAAY;QACnB,OAAO,EAAE,wBAAgB;QACzB,OAAO,EAAE,8BAAsB;KAChC,CAAC,OAAO,CAAC,CAAA;IAEV,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,IAAI,SAAS,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,8FAA8F,EAC9F;YACE,sBAAsB,EAAE,CAAC,WAAW;YACpC,2BAA2B,EAAE,WAAW;SACzC,EACD,SAAS,CACV,KACG,KAAK;QAET,oBAAC,IAAI,IACH,SAAS,EAAE,IAAA,SAAG,EAAC;gBACb,sBAAsB,EAAE,OAAO,KAAK,OAAO;gBAC3C,wBAAwB,EAAE,OAAO,KAAK,SAAS;gBAC/C,yBAAyB,EAAE,OAAO,KAAK,SAAS;gBAChD,0BAA0B,EAAE,OAAO,KAAK,MAAM;aAC/C,CAAC,GACF;QACF,iCAAM,QAAQ,CAAO;QACpB,WAAW,IAAI,CACd,oBAAC,wBAAU,IACT,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,aAAa;YAEtB,oBAAC,iBAAS,IAAC,SAAS,EAAC,kBAAkB,GAAG,CAC/B,CACd,CACG,CACP,CAAA;AACH,CAAC,CACF,CAAA","sourcesContent":["import { clx } from \"@/utils/clx\"\nimport {\n CheckCircleSolid,\n ExclamationCircleSolid,\n InformationCircleSolid,\n XCircleSolid,\n XMarkMini,\n} from \"@medusajs/icons\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\n\ninterface AlertProps extends React.ComponentPropsWithoutRef<\"div\"> {\n variant?: \"error\" | \"success\" | \"warning\" | \"info\"\n dismissible?: boolean\n}\n\n/**\n * This component is based on the div element and supports all of its props\n *\n * @excludeExternal\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n (\n {\n /**\n * The variant of the alert\n */\n variant = \"info\",\n /**\n * Whether the alert is dismissible\n */\n dismissible = false,\n className,\n children,\n ...props\n }: AlertProps,\n ref\n ) => {\n const [dismissed, setDismissed] = React.useState(false)\n\n const Icon = {\n info: InformationCircleSolid,\n error: XCircleSolid,\n success: CheckCircleSolid,\n warning: ExclamationCircleSolid,\n }[variant]\n\n const handleDismiss = () => {\n setDismissed(true)\n }\n\n if (dismissed) {\n return null\n }\n\n return (\n <div\n ref={ref}\n className={clx(\n \"bg-ui-bg-subtle text-pretty txt-compact-small grid items-start gap-x-3 rounded-lg border p-3\",\n {\n \"grid-cols-[20px_1fr]\": !dismissible,\n \"grid-cols-[20px_1fr_20px]\": dismissible,\n },\n className\n )}\n {...props}\n >\n <Icon\n className={clx({\n \"text-ui-tag-red-icon\": variant === \"error\",\n \"text-ui-tag-green-icon\": variant === \"success\",\n \"text-ui-tag-orange-icon\": variant === \"warning\",\n \"text-ui-tag-neutral-icon\": variant === \"info\",\n })}\n />\n <div>{children}</div>\n {dismissible && (\n <IconButton\n size=\"2xsmall\"\n variant=\"transparent\"\n type=\"button\"\n onClick={handleDismiss}\n >\n <XMarkMini className=\"text-ui-fg-muted\" />\n </IconButton>\n )}\n </div>\n )\n }\n)\n"]}
package/dist/cjs/components/badge/badge.d.ts CHANGED
@@ -58,7 +58,7 @@ declare const badgeColorVariants: (props?: ({
58
58
  } | null | undefined;
59
59
  })) | undefined) => string;
60
60
  declare const badgeSizeVariants: (props?: ({
61
- size?: "small" | "base" | "large" | undefined;
61
+ size?: "2xsmall" | "xsmall" | "small" | "base" | "large" | undefined;
62
62
  rounded?: "base" | "full" | undefined;
63
63
  } & ({
64
64
  class?: string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | any | {
package/dist/cjs/components/badge/badge.js CHANGED
@@ -23,18 +23,72 @@ const badgeColorVariants = (0, cva_1.cva)({
23
23
  });
24
24
  exports.badgeColorVariants = badgeColorVariants;
25
25
  const badgeSizeVariants = (0, cva_1.cva)({
26
- base: "inline-flex items-center gap-x-0.5 border",
26
+ base: "inline-flex items-center gap-x-0.5 border box-border",
27
27
  variants: {
28
28
  size: {
29
- small: "txt-compact-xsmall-plus px-1.5",
30
- base: "txt-compact-small-plus px-2 py-0.5",
31
- large: "txt-compact-medium-plus px-2.5 py-1",
29
+ "2xsmall": "txt-compact-xsmall-plus h-5",
30
+ xsmall: "txt-compact-xsmall-plus py-px h-6",
31
+ small: "txt-compact-xsmall-plus py-[3px] h-7",
32
+ base: "txt-compact-small-plus py-[5px] h-8",
33
+ large: "txt-compact-medium-plus py-[7px] h-10",
32
34
  },
33
35
  rounded: {
34
36
  base: "rounded-md",
35
37
  full: "rounded-full",
36
38
  },
37
39
  },
40
+ compoundVariants: [
41
+ {
42
+ size: "2xsmall",
43
+ rounded: "full",
44
+ className: "px-1.5",
45
+ },
46
+ {
47
+ size: "2xsmall",
48
+ rounded: "base",
49
+ className: "px-1",
50
+ },
51
+ {
52
+ size: "xsmall",
53
+ rounded: "full",
54
+ className: "px-2",
55
+ },
56
+ {
57
+ size: "xsmall",
58
+ rounded: "base",
59
+ className: "px-1.5",
60
+ },
61
+ {
62
+ size: "small",
63
+ rounded: "full",
64
+ className: "px-2.5",
65
+ },
66
+ {
67
+ size: "small",
68
+ rounded: "base",
69
+ className: "px-2",
70
+ },
71
+ {
72
+ size: "base",
73
+ rounded: "full",
74
+ className: "px-3",
75
+ },
76
+ {
77
+ size: "base",
78
+ rounded: "base",
79
+ className: "px-2.5",
80
+ },
81
+ {
82
+ size: "large",
83
+ rounded: "full",
84
+ className: "px-3.5",
85
+ },
86
+ {
87
+ size: "large",
88
+ rounded: "base",
89
+ className: "px-3",
90
+ },
91
+ ],
38
92
  defaultVariants: {
39
93
  size: "base",
40
94
  rounded: "base",
package/dist/cjs/components/badge/badge.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../../src/components/badge/badge.tsx"],"names":[],"mappings":";;;;AAAA,qDAA2C;AAC3C,6BAAuC;AACvC,qDAA8B;AAE9B,qCAAiC;AAEjC,MAAM,kBAAkB,GAAG,IAAA,SAAG,EAAC;IAC7B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,KAAK,EACH,qGAAqG;YACvG,GAAG,EAAE,6FAA6F;YAClG,IAAI,EAAE,iGAAiG;YACvG,MAAM,EACJ,yGAAyG;YAC3G,IAAI,EAAE,6GAA6G;YACnH,MAAM,EACJ,yGAAyG;SAC5G;KACF;IACD,eAAe,EAAE;QACf,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAA;AAyEc,gDAAkB;AAvElC,MAAM,iBAAiB,GAAG,IAAA,SAAG,EAAC;IAC5B,IAAI,EAAE,2CAA2C;IACjD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,KAAK,EAAE,gCAAgC;YACvC,IAAI,EAAE,oCAAoC;YAC1C,KAAK,EAAE,qCAAqC;SAC7C;QACD,OAAO,EAAE;YACP,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,cAAc;SACrB;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC,CAAA;AASF;;GAEG;AACH,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAC5B,CACE,EACE,SAAS;AACT;;GAEG;AACH,IAAI,GAAG,MAAM;AACb;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,KAAK,GAAG,MAAM;AACd;;;GAGG;AACH,OAAO,GAAG,KAAK,EACf,GAAG,KAAK,EACG,EACb,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,MAAM,CAAA;IAEzC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,kBAAkB,CAAC,EAAE,KAAK,EAAE,CAAC,EAC7B,iBAAiB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EACpC,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAGQ,sBAAK;AAFd,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA","sourcesContent":["import { Slot } from \"@radix-ui/react-slot\"\nimport { VariantProps, cva } from \"cva\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\nconst badgeColorVariants = cva({\n variants: {\n color: {\n green:\n \"bg-ui-tag-green-bg text-ui-tag-green-text [&_svg]:text-ui-tag-green-icon border-ui-tag-green-border\",\n red: \"bg-ui-tag-red-bg text-ui-tag-red-text [&_svg]:text-ui-tag-red-icon border-ui-tag-red-border\",\n blue: \"bg-ui-tag-blue-bg text-ui-tag-blue-text [&_svg]:text-ui-tag-blue-icon border-ui-tag-blue-border\",\n orange:\n \"bg-ui-tag-orange-bg text-ui-tag-orange-text [&_svg]:text-ui-tag-orange-icon border-ui-tag-orange-border\",\n grey: \"bg-ui-tag-neutral-bg text-ui-tag-neutral-text [&_svg]:text-ui-tag-neutral-icon border-ui-tag-neutral-border\",\n purple:\n \"bg-ui-tag-purple-bg text-ui-tag-purple-text [&_svg]:text-ui-tag-purple-icon border-ui-tag-purple-border\",\n },\n },\n defaultVariants: {\n color: \"grey\",\n },\n})\n\nconst badgeSizeVariants = cva({\n base: \"inline-flex items-center gap-x-0.5 border\",\n variants: {\n size: {\n small: \"txt-compact-xsmall-plus px-1.5\",\n base: \"txt-compact-small-plus px-2 py-0.5\",\n large: \"txt-compact-medium-plus px-2.5 py-1\",\n },\n rounded: {\n base: \"rounded-md\",\n full: \"rounded-full\",\n },\n },\n defaultVariants: {\n size: \"base\",\n rounded: \"base\",\n },\n})\n\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\">,\n VariantProps<typeof badgeSizeVariants>,\n VariantProps<typeof badgeColorVariants> {\n asChild?: boolean\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n (\n {\n className,\n /**\n * The badge's size.\n */\n size = \"base\",\n /**\n * The style of the badge's border radius.\n */\n rounded = \"base\",\n /**\n * The badge's color.\n */\n color = \"grey\",\n /**\n * Whether to remove the wrapper `span` element and use the\n * passed child element instead.\n */\n asChild = false,\n ...props\n }: BadgeProps,\n ref\n ) => {\n const Component = asChild ? Slot : \"span\"\n\n return (\n <Component\n ref={ref}\n className={clx(\n badgeColorVariants({ color }),\n badgeSizeVariants({ size, rounded }),\n className\n )}\n {...props}\n />\n )\n }\n)\nBadge.displayName = \"Badge\"\n\nexport { Badge, badgeColorVariants }\n"]}
1
+ {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../../src/components/badge/badge.tsx"],"names":[],"mappings":";;;;AAAA,qDAA2C;AAC3C,6BAAuC;AACvC,qDAA8B;AAE9B,qCAAiC;AAEjC,MAAM,kBAAkB,GAAG,IAAA,SAAG,EAAC;IAC7B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,KAAK,EACH,qGAAqG;YACvG,GAAG,EAAE,6FAA6F;YAClG,IAAI,EAAE,iGAAiG;YACvG,MAAM,EACJ,yGAAyG;YAC3G,IAAI,EAAE,6GAA6G;YACnH,MAAM,EACJ,yGAAyG;SAC5G;KACF;IACD,eAAe,EAAE;QACf,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAA;AA+Hc,gDAAkB;AA7HlC,MAAM,iBAAiB,GAAG,IAAA,SAAG,EAAC;IAC5B,IAAI,EAAE,sDAAsD;IAC5D,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,SAAS,EAAE,6BAA6B;YACxC,MAAM,EAAE,mCAAmC;YAC3C,KAAK,EAAE,sCAAsC;YAC7C,IAAI,EAAE,qCAAqC;YAC3C,KAAK,EAAE,uCAAuC;SAC/C;QACD,OAAO,EAAE;YACP,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,cAAc;SACrB;KACF;IACD,gBAAgB,EAAE;QAChB;YACE,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,QAAQ;SACpB;QACD;YACE,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,MAAM;SAClB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,MAAM;SAClB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,QAAQ;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,QAAQ;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,MAAM;SAClB;QACD;YACE,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,MAAM;SAClB;QACD;YACE,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,QAAQ;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,QAAQ;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,MAAM;SAClB;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC,CAAA;AASF;;GAEG;AACH,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAC5B,CACE,EACE,SAAS;AACT;;GAEG;AACH,IAAI,GAAG,MAAM;AACb;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,KAAK,GAAG,MAAM;AACd;;;GAGG;AACH,OAAO,GAAG,KAAK,EACf,GAAG,KAAK,EACG,EACb,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,iBAAI,CAAC,CAAC,CAAC,MAAM,CAAA;IAEzC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,SAAG,EACZ,kBAAkB,CAAC,EAAE,KAAK,EAAE,CAAC,EAC7B,iBAAiB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EACpC,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CACF,CAAA;AAGQ,sBAAK;AAFd,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA","sourcesContent":["import { Slot } from \"@radix-ui/react-slot\"\nimport { VariantProps, cva } from \"cva\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\nconst badgeColorVariants = cva({\n variants: {\n color: {\n green:\n \"bg-ui-tag-green-bg text-ui-tag-green-text [&_svg]:text-ui-tag-green-icon border-ui-tag-green-border\",\n red: \"bg-ui-tag-red-bg text-ui-tag-red-text [&_svg]:text-ui-tag-red-icon border-ui-tag-red-border\",\n blue: \"bg-ui-tag-blue-bg text-ui-tag-blue-text [&_svg]:text-ui-tag-blue-icon border-ui-tag-blue-border\",\n orange:\n \"bg-ui-tag-orange-bg text-ui-tag-orange-text [&_svg]:text-ui-tag-orange-icon border-ui-tag-orange-border\",\n grey: \"bg-ui-tag-neutral-bg text-ui-tag-neutral-text [&_svg]:text-ui-tag-neutral-icon border-ui-tag-neutral-border\",\n purple:\n \"bg-ui-tag-purple-bg text-ui-tag-purple-text [&_svg]:text-ui-tag-purple-icon border-ui-tag-purple-border\",\n },\n },\n defaultVariants: {\n color: \"grey\",\n },\n})\n\nconst badgeSizeVariants = cva({\n base: \"inline-flex items-center gap-x-0.5 border box-border\",\n variants: {\n size: {\n \"2xsmall\": \"txt-compact-xsmall-plus h-5\",\n xsmall: \"txt-compact-xsmall-plus py-px h-6\",\n small: \"txt-compact-xsmall-plus py-[3px] h-7\",\n base: \"txt-compact-small-plus py-[5px] h-8\",\n large: \"txt-compact-medium-plus py-[7px] h-10\",\n },\n rounded: {\n base: \"rounded-md\",\n full: \"rounded-full\",\n },\n },\n compoundVariants: [\n {\n size: \"2xsmall\",\n rounded: \"full\",\n className: \"px-1.5\",\n },\n {\n size: \"2xsmall\",\n rounded: \"base\",\n className: \"px-1\",\n },\n {\n size: \"xsmall\",\n rounded: \"full\",\n className: \"px-2\",\n },\n {\n size: \"xsmall\",\n rounded: \"base\",\n className: \"px-1.5\",\n },\n {\n size: \"small\",\n rounded: \"full\",\n className: \"px-2.5\",\n },\n {\n size: \"small\",\n rounded: \"base\",\n className: \"px-2\",\n },\n {\n size: \"base\",\n rounded: \"full\",\n className: \"px-3\",\n },\n {\n size: \"base\",\n rounded: \"base\",\n className: \"px-2.5\",\n },\n {\n size: \"large\",\n rounded: \"full\",\n className: \"px-3.5\",\n },\n {\n size: \"large\",\n rounded: \"base\",\n className: \"px-3\",\n },\n ],\n defaultVariants: {\n size: \"base\",\n rounded: \"base\",\n },\n})\n\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\">,\n VariantProps<typeof badgeSizeVariants>,\n VariantProps<typeof badgeColorVariants> {\n asChild?: boolean\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n (\n {\n className,\n /**\n * The badge's size.\n */\n size = \"base\",\n /**\n * The style of the badge's border radius.\n */\n rounded = \"base\",\n /**\n * The badge's color.\n */\n color = \"grey\",\n /**\n * Whether to remove the wrapper `span` element and use the\n * passed child element instead.\n */\n asChild = false,\n ...props\n }: BadgeProps,\n ref\n ) => {\n const Component = asChild ? Slot : \"span\"\n\n return (\n <Component\n ref={ref}\n className={clx(\n badgeColorVariants({ color }),\n badgeSizeVariants({ size, rounded }),\n className\n )}\n {...props}\n />\n )\n }\n)\nBadge.displayName = \"Badge\"\n\nexport { Badge, badgeColorVariants }\n"]}
package/dist/cjs/components/currency-input/currency-input.js CHANGED
@@ -59,7 +59,7 @@ code, disabled, onInvalid, className, ...props }, ref) => {
59
59
  "py-[9px]": size === "base",
60
60
  "py-[5px]": size === "small",
61
61
  }), role: "presentation" },
62
- React.createElement(text_1.Text, { className: (0, clx_1.clx)("text-ui-fg-muted pointer-events-none select-none uppercase", {
62
+ React.createElement(text_1.Text, { size: "small", leading: "compact", className: (0, clx_1.clx)("text-ui-fg-muted pointer-events-none select-none uppercase", {
63
63
  "text-ui-fg-disabled": disabled,
64
64
  }) }, code)),
65
65
  React.createElement(react_currency_input_field_1.default, { className: "h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed", disabled: disabled, onInvalid: onInnerInvalid, ref: innerRef, ...props }),
@@ -67,7 +67,7 @@ code, disabled, onInvalid, className, ...props }, ref) => {
67
67
  "py-[9px]": size === "base",
68
68
  "py-[5px]": size === "small",
69
69
  }), role: "presentation" },
70
- React.createElement(text_1.Text, { className: (0, clx_1.clx)("text-ui-fg-muted pointer-events-none select-none", {
70
+ React.createElement(text_1.Text, { size: "small", leading: "compact", className: (0, clx_1.clx)("text-ui-fg-muted pointer-events-none select-none", {
71
71
  "text-ui-fg-disabled": disabled,
72
72
  }) }, symbol))));
73
73
  });
package/dist/cjs/components/currency-input/currency-input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"currency-input.js","sourceRoot":"","sources":["../../../../src/components/currency-input/currency-input.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AAEZ,qDAA8B;AAC9B,oGAAkD;AAElD,4CAAwC;AACxC,qCAAiC;AACjC,6BAAuC;AAEvC,MAAM,qBAAqB,GAAG,IAAA,SAAG,EAAC;IAChC,IAAI,EAAE,IAAA,SAAG,EACP,2BAA2B,EAC3B,mJAAmJ,EACnJ,qDAAqD,CACtD;IACD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,IAAI,EAAE,wBAAwB;YAC9B,KAAK,EAAE,uBAAuB;SAC/B;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,MAAM;KACb;CACF,CAAC,CAAA;AAYF;;;;GAIG;AACH,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CACpC,CACE;AACE;;GAEG;AACH,IAAI,GAAG,MAAM;AACb;;GAEG;AACH,MAAM;AACN;;GAEG;AACH,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,SAAS,EACT,GAAG,KAAK,EACW,EACrB,GAAG,EACH,EAAE;IACF,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAA;IAErD,KAAK,CAAC,mBAAmB,CACvB,GAAG,EACH,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CACvB,CAAA;IAED,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAE9C,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CAAC,KAAwC,EAAE,EAAE;QAC3C,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;QAE5C,IAAI,SAAS,EAAE;YACb,SAAS,CAAC,KAAK,CAAC,CAAA;SACjB;IACH,CAAC,EACD,CAAC,SAAS,CAAC,CACZ,CAAA;IAED,OAAO,CACL,6BACE,OAAO,EAAE,GAAG,EAAE;YACZ,IAAI,QAAQ,CAAC,OAAO,EAAE;gBACpB,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;aACzB;QACH,CAAC,EACD,SAAS,EAAE,IAAA,SAAG,EACZ,oDAAoD,EACpD,qBAAqB,CAAC,EAAE,IAAI,EAAE,CAAC,EAC/B;YACE,+GAA+G,EAC7G,QAAQ;YACV,qDAAqD,EACnD,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK;SAClC,EACD,SAAS,CACV;QAED,8BACE,SAAS,EAAE,IAAA,SAAG,EAAC,kCAAkC,EAAE;gBACjD,UAAU,EAAE,IAAI,KAAK,MAAM;gBAC3B,UAAU,EAAE,IAAI,KAAK,OAAO;aAC7B,CAAC,EACF,IAAI,EAAC,cAAc;YAEnB,oBAAC,WAAI,IACH,SAAS,EAAE,IAAA,SAAG,EACZ,4DAA4D,EAC5D;oBACE,qBAAqB,EAAE,QAAQ;iBAChC,CACF,IAEA,IAAI,CACA,CACF;QACP,oBAAC,oCAAS,IACR,SAAS,EAAC,0GAA0G,EACpH,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,cAAc,EACzB,GAAG,EAAE,QAAQ,KACT,KAAK,GACT;QACF,8BACE,SAAS,EAAE,IAAA,SAAG,EACZ,8EAA8E,EAC9E;gBACE,UAAU,EAAE,IAAI,KAAK,MAAM;gBAC3B,UAAU,EAAE,IAAI,KAAK,OAAO;aAC7B,CACF,EACD,IAAI,EAAC,cAAc;YAEnB,oBAAC,WAAI,IACH,SAAS,EAAE,IAAA,SAAG,EAAC,kDAAkD,EAAE;oBACjE,qBAAqB,EAAE,QAAQ;iBAChC,CAAC,IAED,MAAM,CACF,CACF,CACH,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAGQ,sCAAa;AAFtB,aAAa,CAAC,WAAW,GAAG,eAAe,CAAA","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport Primitive from \"react-currency-input-field\"\n\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\nimport { VariantProps, cva } from \"cva\"\n\nconst currencyInputVariants = cva({\n base: clx(\n \"flex items-center gap-x-1\",\n \"bg-ui-bg-field hover:bg-ui-bg-field-hover shadow-buttons-neutral placeholder-ui-fg-muted text-ui-fg-base transition-fg relative w-full rounded-md\",\n \"focus-within:shadow-borders-interactive-with-active\"\n ),\n variants: {\n size: {\n base: \"txt-compact-medium h-8\",\n small: \"txt-compact-small h-7\",\n },\n },\n defaultVariants: {\n size: \"base\",\n },\n})\n\ninterface CurrencyInputProps\n extends Omit<\n React.ComponentPropsWithoutRef<typeof Primitive>,\n \"prefix\" | \"suffix\" | \"size\"\n >,\n VariantProps<typeof currencyInputVariants> {\n symbol: string\n code: string\n}\n\n/**\n * This component is based on the input element and supports all of its props\n *\n * @excludeExternal\n */\nconst CurrencyInput = React.forwardRef<HTMLInputElement, CurrencyInputProps>(\n (\n {\n /**\n * The input's size.\n */\n size = \"base\",\n /**\n * The symbol to show in the input.\n */\n symbol,\n /**\n * The currency code to show in the input.\n */\n code,\n disabled,\n onInvalid,\n className,\n ...props\n }: CurrencyInputProps,\n ref\n ) => {\n const innerRef = React.useRef<HTMLInputElement>(null)\n\n React.useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n ref,\n () => innerRef.current\n )\n\n const [valid, setValid] = React.useState(true)\n\n const onInnerInvalid = React.useCallback(\n (event: React.FormEvent<HTMLInputElement>) => {\n setValid(event.currentTarget.validity.valid)\n\n if (onInvalid) {\n onInvalid(event)\n }\n },\n [onInvalid]\n )\n\n return (\n <div\n onClick={() => {\n if (innerRef.current) {\n innerRef.current.focus()\n }\n }}\n className={clx(\n \"w-full cursor-text justify-between overflow-hidden\",\n currencyInputVariants({ size }),\n {\n \"text-ui-fg-disabled !bg-ui-bg-disabled !shadow-buttons-neutral !placeholder-ui-fg-disabled cursor-not-allowed\":\n disabled,\n \"!shadow-borders-error invalid:!shadow-borders-error\":\n props[\"aria-invalid\"] || !valid,\n },\n className\n )}\n >\n <span\n className={clx(\"w-fit min-w-[32px] border-r px-2\", {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n })}\n role=\"presentation\"\n >\n <Text\n className={clx(\n \"text-ui-fg-muted pointer-events-none select-none uppercase\",\n {\n \"text-ui-fg-disabled\": disabled,\n }\n )}\n >\n {code}\n </Text>\n </span>\n <Primitive\n className=\"h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed\"\n disabled={disabled}\n onInvalid={onInnerInvalid}\n ref={innerRef}\n {...props}\n />\n <span\n className={clx(\n \"flex w-fit min-w-[32px] items-center justify-center border-l px-2 text-right\",\n {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n }\n )}\n role=\"presentation\"\n >\n <Text\n className={clx(\"text-ui-fg-muted pointer-events-none select-none\", {\n \"text-ui-fg-disabled\": disabled,\n })}\n >\n {symbol}\n </Text>\n </span>\n </div>\n )\n }\n)\nCurrencyInput.displayName = \"CurrencyInput\"\n\nexport { CurrencyInput }\n"]}
1
+ {"version":3,"file":"currency-input.js","sourceRoot":"","sources":["../../../../src/components/currency-input/currency-input.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport Primitive from \"react-currency-input-field\"\n\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\nimport { VariantProps, cva } from \"cva\"\n\nconst currencyInputVariants = cva({\n base: clx(\n \"flex items-center gap-x-1\",\n \"bg-ui-bg-field hover:bg-ui-bg-field-hover shadow-buttons-neutral placeholder-ui-fg-muted text-ui-fg-base transition-fg relative w-full rounded-md\",\n \"focus-within:shadow-borders-interactive-with-active\"\n ),\n variants: {\n size: {\n base: \"txt-compact-medium h-8\",\n small: \"txt-compact-small h-7\",\n },\n },\n defaultVariants: {\n size: \"base\",\n },\n})\n\ninterface CurrencyInputProps\n extends Omit<\n React.ComponentPropsWithoutRef<typeof Primitive>,\n \"prefix\" | \"suffix\" | \"size\"\n >,\n VariantProps<typeof currencyInputVariants> {\n symbol: string\n code: string\n}\n\n/**\n * This component is based on the input element and supports all of its props\n *\n * @excludeExternal\n */\nconst CurrencyInput = React.forwardRef<HTMLInputElement, CurrencyInputProps>(\n (\n {\n /**\n * The input's size.\n */\n size = \"base\",\n /**\n * The symbol to show in the input.\n */\n symbol,\n /**\n * The currency code to show in the input.\n */\n code,\n disabled,\n onInvalid,\n className,\n ...props\n }: CurrencyInputProps,\n ref\n ) => {\n const innerRef = React.useRef<HTMLInputElement>(null)\n\n React.useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n ref,\n () => innerRef.current\n )\n\n const [valid, setValid] = React.useState(true)\n\n const onInnerInvalid = React.useCallback(\n (event: React.FormEvent<HTMLInputElement>) => {\n setValid(event.currentTarget.validity.valid)\n\n if (onInvalid) {\n onInvalid(event)\n }\n },\n [onInvalid]\n )\n\n return (\n <div\n onClick={() => {\n if (innerRef.current) {\n innerRef.current.focus()\n }\n }}\n className={clx(\n \"w-full cursor-text justify-between overflow-hidden\",\n currencyInputVariants({ size }),\n {\n \"text-ui-fg-disabled !bg-ui-bg-disabled !shadow-buttons-neutral !placeholder-ui-fg-disabled cursor-not-allowed\":\n disabled,\n \"!shadow-borders-error invalid:!shadow-borders-error\":\n props[\"aria-invalid\"] || !valid,\n },\n className\n )}\n >\n <span\n className={clx(\"w-fit min-w-[32px] border-r px-2\", {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n })}\n role=\"presentation\"\n >\n <Text\n size=\"small\"\n leading=\"compact\"\n className={clx(\n \"text-ui-fg-muted pointer-events-none select-none uppercase\",\n {\n \"text-ui-fg-disabled\": disabled,\n }\n )}\n >\n {code}\n </Text>\n </span>\n <Primitive\n className=\"h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed\"\n disabled={disabled}\n onInvalid={onInnerInvalid}\n ref={innerRef}\n {...props}\n />\n <span\n className={clx(\n \"flex w-fit min-w-[32px] items-center justify-center border-l px-2 text-right\",\n {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n }\n )}\n role=\"presentation\"\n >\n <Text\n size=\"small\"\n leading=\"compact\"\n className={clx(\"text-ui-fg-muted pointer-events-none select-none\", {\n \"text-ui-fg-disabled\": disabled,\n })}\n >\n {symbol}\n </Text>\n </span>\n </div>\n )\n }\n)\nCurrencyInput.displayName = \"CurrencyInput\"\n\nexport { CurrencyInput }\n"]}
package/dist/cjs/components/radio-group/radio-group.js CHANGED
@@ -37,8 +37,8 @@ const ChoiceBox = React.forwardRef(({ className, id, label, description, ...prop
37
37
  React.createElement("div", { className: "shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full" },
38
38
  React.createElement(Indicator, null))),
39
39
  React.createElement("div", { className: "flex flex-col items-start" },
40
- React.createElement(label_1.Label, { htmlFor: id, size: "base", weight: "plus", className: "group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed" }, label),
41
- React.createElement(hint_1.Hint, { className: "txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled", id: descriptionId }, description))));
40
+ React.createElement(label_1.Label, { htmlFor: id, size: "small", weight: "plus", className: "group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed" }, label),
41
+ React.createElement(hint_1.Hint, { className: "txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled text-left", id: descriptionId }, description))));
42
42
  });
43
43
  ChoiceBox.displayName = "RadioGroup.ChoiceBox";
44
44
  const RadioGroup = Object.assign(Root, { Item, ChoiceBox });
package/dist/cjs/components/radio-group/radio-group.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../src/components/radio-group/radio-group.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as Primitives from \"@radix-ui/react-radio-group\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\nimport { Hint } from \"../hint\"\nimport { Label } from \"../label\"\n\n/**\n * This component is based on the [Radix UI Radio Group](https://www.radix-ui.com/primitives/docs/components/radio-group) primitives.\n */\nconst Root = React.forwardRef<\n React.ElementRef<typeof Primitives.Root>,\n React.ComponentPropsWithoutRef<typeof Primitives.Root>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Root\n className={clx(\"grid gap-2\", className)}\n {...props}\n ref={ref}\n />\n )\n})\nRoot.displayName = \"RadioGroup\"\n\nconst Indicator = React.forwardRef<\n React.ElementRef<typeof Primitives.Indicator>,\n React.ComponentPropsWithoutRef<typeof Primitives.Indicator>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Indicator\n ref={ref}\n className={clx(\"flex items-center justify-center\", className)}\n {...props}\n >\n <div\n className={clx(\n \"bg-ui-bg-base shadow-details-contrast-on-bg-interactive group-disabled:bg-ui-fg-disabled h-1.5 w-1.5 rounded-full group-disabled:shadow-none\"\n )}\n />\n </Primitives.Indicator>\n )\n})\nIndicator.displayName = \"RadioGroup.Indicator\"\n\nconst Item = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n React.ComponentPropsWithoutRef<typeof Primitives.Item>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"group relative flex h-5 w-5 items-center justify-center outline-none\",\n className\n )}\n {...props}\n >\n <div\n className={clx(\n \"shadow-borders-base bg-ui-bg-base transition-fg flex h-[14px] w-[14px] items-center justify-center rounded-full\",\n \"group-hover:bg-ui-bg-base-hover\",\n \"group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow\",\n \"group-focus-visible:!shadow-borders-interactive-with-focus\",\n \"group-disabled:!bg-ui-bg-disabled group-disabled:!shadow-borders-base\"\n )}\n >\n <Indicator />\n </div>\n </Primitives.Item>\n )\n})\nItem.displayName = \"RadioGroup.Item\"\n\ninterface ChoiceBoxProps\n extends React.ComponentPropsWithoutRef<typeof Primitives.Item> {\n label: string\n description: string\n}\n\nconst ChoiceBox = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n ChoiceBoxProps\n>(({ className, id, label, description, ...props }, ref) => {\n const generatedId = React.useId()\n\n if (!id) {\n id = generatedId\n }\n\n const descriptionId = `${id}-description`\n\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"shadow-borders-base bg-ui-bg-base focus-visible:shadow-borders-interactive-with-focus transition-fg disabled:bg-ui-bg-disabled group flex items-start gap-x-2 rounded-lg p-3 disabled:cursor-not-allowed\",\n className\n )}\n {...props}\n id={id}\n aria-describedby={descriptionId}\n >\n <div className=\"flex h-5 w-5 items-center justify-center\">\n <div className=\"shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full\">\n <Indicator />\n </div>\n </div>\n <div className=\"flex flex-col items-start\">\n <Label\n htmlFor={id}\n size=\"base\"\n weight=\"plus\"\n className=\"group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed\"\n >\n {label}\n </Label>\n <Hint\n className=\"txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled\"\n id={descriptionId}\n >\n {description}\n </Hint>\n </div>\n </Primitives.Item>\n )\n})\nChoiceBox.displayName = \"RadioGroup.ChoiceBox\"\n\nconst RadioGroup = Object.assign(Root, { Item, ChoiceBox })\n\nexport { RadioGroup }\n"]}
1
+ {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../src/components/radio-group/radio-group.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as Primitives from \"@radix-ui/react-radio-group\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\nimport { Hint } from \"../hint\"\nimport { Label } from \"../label\"\n\n/**\n * This component is based on the [Radix UI Radio Group](https://www.radix-ui.com/primitives/docs/components/radio-group) primitives.\n */\nconst Root = React.forwardRef<\n React.ElementRef<typeof Primitives.Root>,\n React.ComponentPropsWithoutRef<typeof Primitives.Root>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Root\n className={clx(\"grid gap-2\", className)}\n {...props}\n ref={ref}\n />\n )\n})\nRoot.displayName = \"RadioGroup\"\n\nconst Indicator = React.forwardRef<\n React.ElementRef<typeof Primitives.Indicator>,\n React.ComponentPropsWithoutRef<typeof Primitives.Indicator>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Indicator\n ref={ref}\n className={clx(\"flex items-center justify-center\", className)}\n {...props}\n >\n <div\n className={clx(\n \"bg-ui-bg-base shadow-details-contrast-on-bg-interactive group-disabled:bg-ui-fg-disabled h-1.5 w-1.5 rounded-full group-disabled:shadow-none\"\n )}\n />\n </Primitives.Indicator>\n )\n})\nIndicator.displayName = \"RadioGroup.Indicator\"\n\nconst Item = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n React.ComponentPropsWithoutRef<typeof Primitives.Item>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"group relative flex h-5 w-5 items-center justify-center outline-none\",\n className\n )}\n {...props}\n >\n <div\n className={clx(\n \"shadow-borders-base bg-ui-bg-base transition-fg flex h-[14px] w-[14px] items-center justify-center rounded-full\",\n \"group-hover:bg-ui-bg-base-hover\",\n \"group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow\",\n \"group-focus-visible:!shadow-borders-interactive-with-focus\",\n \"group-disabled:!bg-ui-bg-disabled group-disabled:!shadow-borders-base\"\n )}\n >\n <Indicator />\n </div>\n </Primitives.Item>\n )\n})\nItem.displayName = \"RadioGroup.Item\"\n\ninterface ChoiceBoxProps\n extends React.ComponentPropsWithoutRef<typeof Primitives.Item> {\n label: string\n description: string\n}\n\nconst ChoiceBox = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n ChoiceBoxProps\n>(({ className, id, label, description, ...props }, ref) => {\n const generatedId = React.useId()\n\n if (!id) {\n id = generatedId\n }\n\n const descriptionId = `${id}-description`\n\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"shadow-borders-base bg-ui-bg-base focus-visible:shadow-borders-interactive-with-focus transition-fg disabled:bg-ui-bg-disabled group flex items-start gap-x-2 rounded-lg p-3 disabled:cursor-not-allowed\",\n className\n )}\n {...props}\n id={id}\n aria-describedby={descriptionId}\n >\n <div className=\"flex h-5 w-5 items-center justify-center\">\n <div className=\"shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full\">\n <Indicator />\n </div>\n </div>\n <div className=\"flex flex-col items-start\">\n <Label\n htmlFor={id}\n size=\"small\"\n weight=\"plus\"\n className=\"group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed\"\n >\n {label}\n </Label>\n <Hint\n className=\"txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled text-left\"\n id={descriptionId}\n >\n {description}\n </Hint>\n </div>\n </Primitives.Item>\n )\n})\nChoiceBox.displayName = \"RadioGroup.ChoiceBox\"\n\nconst RadioGroup = Object.assign(Root, { Item, ChoiceBox })\n\nexport { RadioGroup }\n"]}
package/dist/esm/components/alert/alert.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../../src/components/alert/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA;AACjC,OAAO,EACL,gBAAgB,EAChB,sBAAsB,EACtB,sBAAsB,EACtB,YAAY,EACZ,SAAS,GACV,MAAM,iBAAiB,CAAA;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAOrD;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE;AACE;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvD,MAAM,IAAI,GAAG;QACX,IAAI,EAAE,sBAAsB;QAC5B,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,gBAAgB;QACzB,OAAO,EAAE,sBAAsB;KAChC,CAAC,OAAO,CAAC,CAAA;IAEV,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,IAAI,SAAS,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CACZ,8FAA8F,EAC9F;YACE,sBAAsB,EAAE,CAAC,WAAW;YACpC,2BAA2B,EAAE,WAAW;SACzC,EACD,SAAS,CACV,KACG,KAAK;QAET,oBAAC,IAAI,IACH,SAAS,EAAE,GAAG,CAAC;gBACb,sBAAsB,EAAE,OAAO,KAAK,OAAO;gBAC3C,wBAAwB,EAAE,OAAO,KAAK,SAAS;gBAC/C,yBAAyB,EAAE,OAAO,KAAK,SAAS;gBAChD,0BAA0B,EAAE,OAAO,KAAK,MAAM;aAC/C,CAAC,GACF;QACF,iCAAM,QAAQ,CAAO;QACpB,WAAW,IAAI,CACd,oBAAC,UAAU,IACT,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,aAAa;YAEtB,oBAAC,SAAS,IAAC,SAAS,EAAC,kBAAkB,GAAG,CAC/B,CACd,CACG,CACP,CAAA;AACH,CAAC,CACF,CAAA","sourcesContent":["import { clx } from \"@/utils/clx\"\nimport {\n CheckCircleSolid,\n ExclamationCircleSolid,\n InformationCircleSolid,\n XCircleSolid,\n XMarkMini,\n} from \"@medusajs/icons\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\n\ninterface AlertProps extends React.ComponentPropsWithoutRef<\"div\"> {\n variant?: \"error\" | \"success\" | \"warning\" | \"info\"\n dismissible?: boolean\n}\n\n/**\n * This component is based on the div element and supports all of its props\n *\n * @excludeExternal\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n (\n {\n /**\n * The variant of the alert\n */\n variant = \"info\",\n /**\n * Whether the alert is dismissible\n */\n dismissible = false,\n className,\n children,\n ...props\n },\n ref\n ) => {\n const [dismissed, setDismissed] = React.useState(false)\n\n const Icon = {\n info: InformationCircleSolid,\n error: XCircleSolid,\n success: CheckCircleSolid,\n warning: ExclamationCircleSolid,\n }[variant]\n\n const handleDismiss = () => {\n setDismissed(true)\n }\n\n if (dismissed) {\n return null\n }\n\n return (\n <div\n ref={ref}\n className={clx(\n \"bg-ui-bg-subtle text-pretty txt-compact-small grid items-start gap-x-3 rounded-lg border p-3\",\n {\n \"grid-cols-[20px_1fr]\": !dismissible,\n \"grid-cols-[20px_1fr_20px]\": dismissible,\n },\n className\n )}\n {...props}\n >\n <Icon\n className={clx({\n \"text-ui-tag-red-icon\": variant === \"error\",\n \"text-ui-tag-green-icon\": variant === \"success\",\n \"text-ui-tag-orange-icon\": variant === \"warning\",\n \"text-ui-tag-neutral-icon\": variant === \"info\",\n })}\n />\n <div>{children}</div>\n {dismissible && (\n <IconButton\n size=\"2xsmall\"\n variant=\"transparent\"\n type=\"button\"\n onClick={handleDismiss}\n >\n <XMarkMini className=\"text-ui-fg-muted\" />\n </IconButton>\n )}\n </div>\n )\n }\n)\n"]}
1
+ {"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../../src/components/alert/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA;AACjC,OAAO,EACL,gBAAgB,EAChB,sBAAsB,EACtB,sBAAsB,EACtB,YAAY,EACZ,SAAS,GACV,MAAM,iBAAiB,CAAA;AACxB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAOrD;;;;GAIG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE;AACE;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACG,EACb,GAAG,EACH,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAEvD,MAAM,IAAI,GAAG;QACX,IAAI,EAAE,sBAAsB;QAC5B,KAAK,EAAE,YAAY;QACnB,OAAO,EAAE,gBAAgB;QACzB,OAAO,EAAE,sBAAsB;KAChC,CAAC,OAAO,CAAC,CAAA;IAEV,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,IAAI,SAAS,EAAE;QACb,OAAO,IAAI,CAAA;KACZ;IAED,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CACZ,8FAA8F,EAC9F;YACE,sBAAsB,EAAE,CAAC,WAAW;YACpC,2BAA2B,EAAE,WAAW;SACzC,EACD,SAAS,CACV,KACG,KAAK;QAET,oBAAC,IAAI,IACH,SAAS,EAAE,GAAG,CAAC;gBACb,sBAAsB,EAAE,OAAO,KAAK,OAAO;gBAC3C,wBAAwB,EAAE,OAAO,KAAK,SAAS;gBAC/C,yBAAyB,EAAE,OAAO,KAAK,SAAS;gBAChD,0BAA0B,EAAE,OAAO,KAAK,MAAM;aAC/C,CAAC,GACF;QACF,iCAAM,QAAQ,CAAO;QACpB,WAAW,IAAI,CACd,oBAAC,UAAU,IACT,IAAI,EAAC,SAAS,EACd,OAAO,EAAC,aAAa,EACrB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,aAAa;YAEtB,oBAAC,SAAS,IAAC,SAAS,EAAC,kBAAkB,GAAG,CAC/B,CACd,CACG,CACP,CAAA;AACH,CAAC,CACF,CAAA","sourcesContent":["import { clx } from \"@/utils/clx\"\nimport {\n CheckCircleSolid,\n ExclamationCircleSolid,\n InformationCircleSolid,\n XCircleSolid,\n XMarkMini,\n} from \"@medusajs/icons\"\nimport * as React from \"react\"\n\nimport { IconButton } from \"@/components/icon-button\"\n\ninterface AlertProps extends React.ComponentPropsWithoutRef<\"div\"> {\n variant?: \"error\" | \"success\" | \"warning\" | \"info\"\n dismissible?: boolean\n}\n\n/**\n * This component is based on the div element and supports all of its props\n *\n * @excludeExternal\n */\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n (\n {\n /**\n * The variant of the alert\n */\n variant = \"info\",\n /**\n * Whether the alert is dismissible\n */\n dismissible = false,\n className,\n children,\n ...props\n }: AlertProps,\n ref\n ) => {\n const [dismissed, setDismissed] = React.useState(false)\n\n const Icon = {\n info: InformationCircleSolid,\n error: XCircleSolid,\n success: CheckCircleSolid,\n warning: ExclamationCircleSolid,\n }[variant]\n\n const handleDismiss = () => {\n setDismissed(true)\n }\n\n if (dismissed) {\n return null\n }\n\n return (\n <div\n ref={ref}\n className={clx(\n \"bg-ui-bg-subtle text-pretty txt-compact-small grid items-start gap-x-3 rounded-lg border p-3\",\n {\n \"grid-cols-[20px_1fr]\": !dismissible,\n \"grid-cols-[20px_1fr_20px]\": dismissible,\n },\n className\n )}\n {...props}\n >\n <Icon\n className={clx({\n \"text-ui-tag-red-icon\": variant === \"error\",\n \"text-ui-tag-green-icon\": variant === \"success\",\n \"text-ui-tag-orange-icon\": variant === \"warning\",\n \"text-ui-tag-neutral-icon\": variant === \"info\",\n })}\n />\n <div>{children}</div>\n {dismissible && (\n <IconButton\n size=\"2xsmall\"\n variant=\"transparent\"\n type=\"button\"\n onClick={handleDismiss}\n >\n <XMarkMini className=\"text-ui-fg-muted\" />\n </IconButton>\n )}\n </div>\n )\n }\n)\n"]}
package/dist/esm/components/badge/badge.d.ts CHANGED
@@ -58,7 +58,7 @@ declare const badgeColorVariants: (props?: ({
58
58
  } | null | undefined;
59
59
  })) | undefined) => string;
60
60
  declare const badgeSizeVariants: (props?: ({
61
- size?: "small" | "base" | "large" | undefined;
61
+ size?: "2xsmall" | "xsmall" | "small" | "base" | "large" | undefined;
62
62
  rounded?: "base" | "full" | undefined;
63
63
  } & ({
64
64
  class?: string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | (string | number | boolean | any | {
package/dist/esm/components/badge/badge.js CHANGED
@@ -18,18 +18,72 @@ const badgeColorVariants = cva({
18
18
  },
19
19
  });
20
20
  const badgeSizeVariants = cva({
21
- base: "inline-flex items-center gap-x-0.5 border",
21
+ base: "inline-flex items-center gap-x-0.5 border box-border",
22
22
  variants: {
23
23
  size: {
24
- small: "txt-compact-xsmall-plus px-1.5",
25
- base: "txt-compact-small-plus px-2 py-0.5",
26
- large: "txt-compact-medium-plus px-2.5 py-1",
24
+ "2xsmall": "txt-compact-xsmall-plus h-5",
25
+ xsmall: "txt-compact-xsmall-plus py-px h-6",
26
+ small: "txt-compact-xsmall-plus py-[3px] h-7",
27
+ base: "txt-compact-small-plus py-[5px] h-8",
28
+ large: "txt-compact-medium-plus py-[7px] h-10",
27
29
  },
28
30
  rounded: {
29
31
  base: "rounded-md",
30
32
  full: "rounded-full",
31
33
  },
32
34
  },
35
+ compoundVariants: [
36
+ {
37
+ size: "2xsmall",
38
+ rounded: "full",
39
+ className: "px-1.5",
40
+ },
41
+ {
42
+ size: "2xsmall",
43
+ rounded: "base",
44
+ className: "px-1",
45
+ },
46
+ {
47
+ size: "xsmall",
48
+ rounded: "full",
49
+ className: "px-2",
50
+ },
51
+ {
52
+ size: "xsmall",
53
+ rounded: "base",
54
+ className: "px-1.5",
55
+ },
56
+ {
57
+ size: "small",
58
+ rounded: "full",
59
+ className: "px-2.5",
60
+ },
61
+ {
62
+ size: "small",
63
+ rounded: "base",
64
+ className: "px-2",
65
+ },
66
+ {
67
+ size: "base",
68
+ rounded: "full",
69
+ className: "px-3",
70
+ },
71
+ {
72
+ size: "base",
73
+ rounded: "base",
74
+ className: "px-2.5",
75
+ },
76
+ {
77
+ size: "large",
78
+ rounded: "full",
79
+ className: "px-3.5",
80
+ },
81
+ {
82
+ size: "large",
83
+ rounded: "base",
84
+ className: "px-3",
85
+ },
86
+ ],
33
87
  defaultVariants: {
34
88
  size: "base",
35
89
  rounded: "base",
package/dist/esm/components/badge/badge.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../../src/components/badge/badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAgB,GAAG,EAAE,MAAM,KAAK,CAAA;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA;AAEjC,MAAM,kBAAkB,GAAG,GAAG,CAAC;IAC7B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,KAAK,EACH,qGAAqG;YACvG,GAAG,EAAE,6FAA6F;YAClG,IAAI,EAAE,iGAAiG;YACvG,MAAM,EACJ,yGAAyG;YAC3G,IAAI,EAAE,6GAA6G;YACnH,MAAM,EACJ,yGAAyG;SAC5G;KACF;IACD,eAAe,EAAE;QACf,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAA;AAEF,MAAM,iBAAiB,GAAG,GAAG,CAAC;IAC5B,IAAI,EAAE,2CAA2C;IACjD,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,KAAK,EAAE,gCAAgC;YACvC,IAAI,EAAE,oCAAoC;YAC1C,KAAK,EAAE,qCAAqC;SAC7C;QACD,OAAO,EAAE;YACP,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,cAAc;SACrB;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC,CAAA;AASF;;GAEG;AACH,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAC5B,CACE,EACE,SAAS;AACT;;GAEG;AACH,IAAI,GAAG,MAAM;AACb;;GAEG;AACH,OAAO,GAAG,MAAM;AAChB;;GAEG;AACH,KAAK,GAAG,MAAM;AACd;;;GAGG;AACH,OAAO,GAAG,KAAK,EACf,GAAG,KAAK,EACG,EACb,GAAG,EACH,EAAE;IACF,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAA;IAEzC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CACZ,kBAAkB,CAAC,EAAE,KAAK,EAAE,CAAC,EAC7B,iBAAiB,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EACpC,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC,CACF,CAAA;AACD,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA;AAE3B,OAAO,EAAE,KAAK,EAAE,kBAAkB,EAAE,CAAA","sourcesContent":["import { Slot } from \"@radix-ui/react-slot\"\nimport { VariantProps, cva } from \"cva\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\nconst badgeColorVariants = cva({\n variants: {\n color: {\n green:\n \"bg-ui-tag-green-bg text-ui-tag-green-text [&_svg]:text-ui-tag-green-icon border-ui-tag-green-border\",\n red: \"bg-ui-tag-red-bg text-ui-tag-red-text [&_svg]:text-ui-tag-red-icon border-ui-tag-red-border\",\n blue: \"bg-ui-tag-blue-bg text-ui-tag-blue-text [&_svg]:text-ui-tag-blue-icon border-ui-tag-blue-border\",\n orange:\n \"bg-ui-tag-orange-bg text-ui-tag-orange-text [&_svg]:text-ui-tag-orange-icon border-ui-tag-orange-border\",\n grey: \"bg-ui-tag-neutral-bg text-ui-tag-neutral-text [&_svg]:text-ui-tag-neutral-icon border-ui-tag-neutral-border\",\n purple:\n \"bg-ui-tag-purple-bg text-ui-tag-purple-text [&_svg]:text-ui-tag-purple-icon border-ui-tag-purple-border\",\n },\n },\n defaultVariants: {\n color: \"grey\",\n },\n})\n\nconst badgeSizeVariants = cva({\n base: \"inline-flex items-center gap-x-0.5 border\",\n variants: {\n size: {\n small: \"txt-compact-xsmall-plus px-1.5\",\n base: \"txt-compact-small-plus px-2 py-0.5\",\n large: \"txt-compact-medium-plus px-2.5 py-1\",\n },\n rounded: {\n base: \"rounded-md\",\n full: \"rounded-full\",\n },\n },\n defaultVariants: {\n size: \"base\",\n rounded: \"base\",\n },\n})\n\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\">,\n VariantProps<typeof badgeSizeVariants>,\n VariantProps<typeof badgeColorVariants> {\n asChild?: boolean\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n (\n {\n className,\n /**\n * The badge's size.\n */\n size = \"base\",\n /**\n * The style of the badge's border radius.\n */\n rounded = \"base\",\n /**\n * The badge's color.\n */\n color = \"grey\",\n /**\n * Whether to remove the wrapper `span` element and use the\n * passed child element instead.\n */\n asChild = false,\n ...props\n }: BadgeProps,\n ref\n ) => {\n const Component = asChild ? Slot : \"span\"\n\n return (\n <Component\n ref={ref}\n className={clx(\n badgeColorVariants({ color }),\n badgeSizeVariants({ size, rounded }),\n className\n )}\n {...props}\n />\n )\n }\n)\nBadge.displayName = \"Badge\"\n\nexport { Badge, badgeColorVariants }\n"]}
1
+ {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../../src/components/badge/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Slot } from \"@radix-ui/react-slot\"\nimport { VariantProps, cva } from \"cva\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\n\nconst badgeColorVariants = cva({\n variants: {\n color: {\n green:\n \"bg-ui-tag-green-bg text-ui-tag-green-text [&_svg]:text-ui-tag-green-icon border-ui-tag-green-border\",\n red: \"bg-ui-tag-red-bg text-ui-tag-red-text [&_svg]:text-ui-tag-red-icon border-ui-tag-red-border\",\n blue: \"bg-ui-tag-blue-bg text-ui-tag-blue-text [&_svg]:text-ui-tag-blue-icon border-ui-tag-blue-border\",\n orange:\n \"bg-ui-tag-orange-bg text-ui-tag-orange-text [&_svg]:text-ui-tag-orange-icon border-ui-tag-orange-border\",\n grey: \"bg-ui-tag-neutral-bg text-ui-tag-neutral-text [&_svg]:text-ui-tag-neutral-icon border-ui-tag-neutral-border\",\n purple:\n \"bg-ui-tag-purple-bg text-ui-tag-purple-text [&_svg]:text-ui-tag-purple-icon border-ui-tag-purple-border\",\n },\n },\n defaultVariants: {\n color: \"grey\",\n },\n})\n\nconst badgeSizeVariants = cva({\n base: \"inline-flex items-center gap-x-0.5 border box-border\",\n variants: {\n size: {\n \"2xsmall\": \"txt-compact-xsmall-plus h-5\",\n xsmall: \"txt-compact-xsmall-plus py-px h-6\",\n small: \"txt-compact-xsmall-plus py-[3px] h-7\",\n base: \"txt-compact-small-plus py-[5px] h-8\",\n large: \"txt-compact-medium-plus py-[7px] h-10\",\n },\n rounded: {\n base: \"rounded-md\",\n full: \"rounded-full\",\n },\n },\n compoundVariants: [\n {\n size: \"2xsmall\",\n rounded: \"full\",\n className: \"px-1.5\",\n },\n {\n size: \"2xsmall\",\n rounded: \"base\",\n className: \"px-1\",\n },\n {\n size: \"xsmall\",\n rounded: \"full\",\n className: \"px-2\",\n },\n {\n size: \"xsmall\",\n rounded: \"base\",\n className: \"px-1.5\",\n },\n {\n size: \"small\",\n rounded: \"full\",\n className: \"px-2.5\",\n },\n {\n size: \"small\",\n rounded: \"base\",\n className: \"px-2\",\n },\n {\n size: \"base\",\n rounded: \"full\",\n className: \"px-3\",\n },\n {\n size: \"base\",\n rounded: \"base\",\n className: \"px-2.5\",\n },\n {\n size: \"large\",\n rounded: \"full\",\n className: \"px-3.5\",\n },\n {\n size: \"large\",\n rounded: \"base\",\n className: \"px-3\",\n },\n ],\n defaultVariants: {\n size: \"base\",\n rounded: \"base\",\n },\n})\n\ninterface BadgeProps\n extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"color\">,\n VariantProps<typeof badgeSizeVariants>,\n VariantProps<typeof badgeColorVariants> {\n asChild?: boolean\n}\n\n/**\n * This component is based on the `div` element and supports all of its props\n */\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n (\n {\n className,\n /**\n * The badge's size.\n */\n size = \"base\",\n /**\n * The style of the badge's border radius.\n */\n rounded = \"base\",\n /**\n * The badge's color.\n */\n color = \"grey\",\n /**\n * Whether to remove the wrapper `span` element and use the\n * passed child element instead.\n */\n asChild = false,\n ...props\n }: BadgeProps,\n ref\n ) => {\n const Component = asChild ? Slot : \"span\"\n\n return (\n <Component\n ref={ref}\n className={clx(\n badgeColorVariants({ color }),\n badgeSizeVariants({ size, rounded }),\n className\n )}\n {...props}\n />\n )\n }\n)\nBadge.displayName = \"Badge\"\n\nexport { Badge, badgeColorVariants }\n"]}
package/dist/esm/components/currency-input/currency-input.js CHANGED
@@ -55,7 +55,7 @@ code, disabled, onInvalid, className, ...props }, ref) => {
55
55
  "py-[9px]": size === "base",
56
56
  "py-[5px]": size === "small",
57
57
  }), role: "presentation" },
58
- React.createElement(Text, { className: clx("text-ui-fg-muted pointer-events-none select-none uppercase", {
58
+ React.createElement(Text, { size: "small", leading: "compact", className: clx("text-ui-fg-muted pointer-events-none select-none uppercase", {
59
59
  "text-ui-fg-disabled": disabled,
60
60
  }) }, code)),
61
61
  React.createElement(Primitive, { className: "h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed", disabled: disabled, onInvalid: onInnerInvalid, ref: innerRef, ...props }),
@@ -63,7 +63,7 @@ code, disabled, onInvalid, className, ...props }, ref) => {
63
63
  "py-[9px]": size === "base",
64
64
  "py-[5px]": size === "small",
65
65
  }), role: "presentation" },
66
- React.createElement(Text, { className: clx("text-ui-fg-muted pointer-events-none select-none", {
66
+ React.createElement(Text, { size: "small", leading: "compact", className: clx("text-ui-fg-muted pointer-events-none select-none", {
67
67
  "text-ui-fg-disabled": disabled,
68
68
  }) }, symbol))));
69
69
  });
package/dist/esm/components/currency-input/currency-input.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"currency-input.js","sourceRoot":"","sources":["../../../../src/components/currency-input/currency-input.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport Primitive from \"react-currency-input-field\"\n\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\nimport { VariantProps, cva } from \"cva\"\n\nconst currencyInputVariants = cva({\n base: clx(\n \"flex items-center gap-x-1\",\n \"bg-ui-bg-field hover:bg-ui-bg-field-hover shadow-buttons-neutral placeholder-ui-fg-muted text-ui-fg-base transition-fg relative w-full rounded-md\",\n \"focus-within:shadow-borders-interactive-with-active\"\n ),\n variants: {\n size: {\n base: \"txt-compact-medium h-8\",\n small: \"txt-compact-small h-7\",\n },\n },\n defaultVariants: {\n size: \"base\",\n },\n})\n\ninterface CurrencyInputProps\n extends Omit<\n React.ComponentPropsWithoutRef<typeof Primitive>,\n \"prefix\" | \"suffix\" | \"size\"\n >,\n VariantProps<typeof currencyInputVariants> {\n symbol: string\n code: string\n}\n\n/**\n * This component is based on the input element and supports all of its props\n *\n * @excludeExternal\n */\nconst CurrencyInput = React.forwardRef<HTMLInputElement, CurrencyInputProps>(\n (\n {\n /**\n * The input's size.\n */\n size = \"base\",\n /**\n * The symbol to show in the input.\n */\n symbol,\n /**\n * The currency code to show in the input.\n */\n code,\n disabled,\n onInvalid,\n className,\n ...props\n }: CurrencyInputProps,\n ref\n ) => {\n const innerRef = React.useRef<HTMLInputElement>(null)\n\n React.useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n ref,\n () => innerRef.current\n )\n\n const [valid, setValid] = React.useState(true)\n\n const onInnerInvalid = React.useCallback(\n (event: React.FormEvent<HTMLInputElement>) => {\n setValid(event.currentTarget.validity.valid)\n\n if (onInvalid) {\n onInvalid(event)\n }\n },\n [onInvalid]\n )\n\n return (\n <div\n onClick={() => {\n if (innerRef.current) {\n innerRef.current.focus()\n }\n }}\n className={clx(\n \"w-full cursor-text justify-between overflow-hidden\",\n currencyInputVariants({ size }),\n {\n \"text-ui-fg-disabled !bg-ui-bg-disabled !shadow-buttons-neutral !placeholder-ui-fg-disabled cursor-not-allowed\":\n disabled,\n \"!shadow-borders-error invalid:!shadow-borders-error\":\n props[\"aria-invalid\"] || !valid,\n },\n className\n )}\n >\n <span\n className={clx(\"w-fit min-w-[32px] border-r px-2\", {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n })}\n role=\"presentation\"\n >\n <Text\n className={clx(\n \"text-ui-fg-muted pointer-events-none select-none uppercase\",\n {\n \"text-ui-fg-disabled\": disabled,\n }\n )}\n >\n {code}\n </Text>\n </span>\n <Primitive\n className=\"h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed\"\n disabled={disabled}\n onInvalid={onInnerInvalid}\n ref={innerRef}\n {...props}\n />\n <span\n className={clx(\n \"flex w-fit min-w-[32px] items-center justify-center border-l px-2 text-right\",\n {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n }\n )}\n role=\"presentation\"\n >\n <Text\n className={clx(\"text-ui-fg-muted pointer-events-none select-none\", {\n \"text-ui-fg-disabled\": disabled,\n })}\n >\n {symbol}\n </Text>\n </span>\n </div>\n )\n }\n)\nCurrencyInput.displayName = \"CurrencyInput\"\n\nexport { CurrencyInput }\n"]}
1
+ {"version":3,"file":"currency-input.js","sourceRoot":"","sources":["../../../../src/components/currency-input/currency-input.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport Primitive from \"react-currency-input-field\"\n\nimport { Text } from \"@/components/text\"\nimport { clx } from \"@/utils/clx\"\nimport { VariantProps, cva } from \"cva\"\n\nconst currencyInputVariants = cva({\n base: clx(\n \"flex items-center gap-x-1\",\n \"bg-ui-bg-field hover:bg-ui-bg-field-hover shadow-buttons-neutral placeholder-ui-fg-muted text-ui-fg-base transition-fg relative w-full rounded-md\",\n \"focus-within:shadow-borders-interactive-with-active\"\n ),\n variants: {\n size: {\n base: \"txt-compact-medium h-8\",\n small: \"txt-compact-small h-7\",\n },\n },\n defaultVariants: {\n size: \"base\",\n },\n})\n\ninterface CurrencyInputProps\n extends Omit<\n React.ComponentPropsWithoutRef<typeof Primitive>,\n \"prefix\" | \"suffix\" | \"size\"\n >,\n VariantProps<typeof currencyInputVariants> {\n symbol: string\n code: string\n}\n\n/**\n * This component is based on the input element and supports all of its props\n *\n * @excludeExternal\n */\nconst CurrencyInput = React.forwardRef<HTMLInputElement, CurrencyInputProps>(\n (\n {\n /**\n * The input's size.\n */\n size = \"base\",\n /**\n * The symbol to show in the input.\n */\n symbol,\n /**\n * The currency code to show in the input.\n */\n code,\n disabled,\n onInvalid,\n className,\n ...props\n }: CurrencyInputProps,\n ref\n ) => {\n const innerRef = React.useRef<HTMLInputElement>(null)\n\n React.useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(\n ref,\n () => innerRef.current\n )\n\n const [valid, setValid] = React.useState(true)\n\n const onInnerInvalid = React.useCallback(\n (event: React.FormEvent<HTMLInputElement>) => {\n setValid(event.currentTarget.validity.valid)\n\n if (onInvalid) {\n onInvalid(event)\n }\n },\n [onInvalid]\n )\n\n return (\n <div\n onClick={() => {\n if (innerRef.current) {\n innerRef.current.focus()\n }\n }}\n className={clx(\n \"w-full cursor-text justify-between overflow-hidden\",\n currencyInputVariants({ size }),\n {\n \"text-ui-fg-disabled !bg-ui-bg-disabled !shadow-buttons-neutral !placeholder-ui-fg-disabled cursor-not-allowed\":\n disabled,\n \"!shadow-borders-error invalid:!shadow-borders-error\":\n props[\"aria-invalid\"] || !valid,\n },\n className\n )}\n >\n <span\n className={clx(\"w-fit min-w-[32px] border-r px-2\", {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n })}\n role=\"presentation\"\n >\n <Text\n size=\"small\"\n leading=\"compact\"\n className={clx(\n \"text-ui-fg-muted pointer-events-none select-none uppercase\",\n {\n \"text-ui-fg-disabled\": disabled,\n }\n )}\n >\n {code}\n </Text>\n </span>\n <Primitive\n className=\"h-full min-w-0 flex-1 appearance-none bg-transparent text-right outline-none disabled:cursor-not-allowed\"\n disabled={disabled}\n onInvalid={onInnerInvalid}\n ref={innerRef}\n {...props}\n />\n <span\n className={clx(\n \"flex w-fit min-w-[32px] items-center justify-center border-l px-2 text-right\",\n {\n \"py-[9px]\": size === \"base\",\n \"py-[5px]\": size === \"small\",\n }\n )}\n role=\"presentation\"\n >\n <Text\n size=\"small\"\n leading=\"compact\"\n className={clx(\"text-ui-fg-muted pointer-events-none select-none\", {\n \"text-ui-fg-disabled\": disabled,\n })}\n >\n {symbol}\n </Text>\n </span>\n </div>\n )\n }\n)\nCurrencyInput.displayName = \"CurrencyInput\"\n\nexport { CurrencyInput }\n"]}
package/dist/esm/components/radio-group/radio-group.js CHANGED
@@ -33,8 +33,8 @@ const ChoiceBox = React.forwardRef(({ className, id, label, description, ...prop
33
33
  React.createElement("div", { className: "shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full" },
34
34
  React.createElement(Indicator, null))),
35
35
  React.createElement("div", { className: "flex flex-col items-start" },
36
- React.createElement(Label, { htmlFor: id, size: "base", weight: "plus", className: "group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed" }, label),
37
- React.createElement(Hint, { className: "txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled", id: descriptionId }, description))));
36
+ React.createElement(Label, { htmlFor: id, size: "small", weight: "plus", className: "group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed" }, label),
37
+ React.createElement(Hint, { className: "txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled text-left", id: descriptionId }, description))));
38
38
  });
39
39
  ChoiceBox.displayName = "RadioGroup.ChoiceBox";
40
40
  const RadioGroup = Object.assign(Root, { Item, ChoiceBox });
package/dist/esm/components/radio-group/radio-group.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../src/components/radio-group/radio-group.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as Primitives from \"@radix-ui/react-radio-group\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\nimport { Hint } from \"../hint\"\nimport { Label } from \"../label\"\n\n/**\n * This component is based on the [Radix UI Radio Group](https://www.radix-ui.com/primitives/docs/components/radio-group) primitives.\n */\nconst Root = React.forwardRef<\n React.ElementRef<typeof Primitives.Root>,\n React.ComponentPropsWithoutRef<typeof Primitives.Root>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Root\n className={clx(\"grid gap-2\", className)}\n {...props}\n ref={ref}\n />\n )\n})\nRoot.displayName = \"RadioGroup\"\n\nconst Indicator = React.forwardRef<\n React.ElementRef<typeof Primitives.Indicator>,\n React.ComponentPropsWithoutRef<typeof Primitives.Indicator>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Indicator\n ref={ref}\n className={clx(\"flex items-center justify-center\", className)}\n {...props}\n >\n <div\n className={clx(\n \"bg-ui-bg-base shadow-details-contrast-on-bg-interactive group-disabled:bg-ui-fg-disabled h-1.5 w-1.5 rounded-full group-disabled:shadow-none\"\n )}\n />\n </Primitives.Indicator>\n )\n})\nIndicator.displayName = \"RadioGroup.Indicator\"\n\nconst Item = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n React.ComponentPropsWithoutRef<typeof Primitives.Item>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"group relative flex h-5 w-5 items-center justify-center outline-none\",\n className\n )}\n {...props}\n >\n <div\n className={clx(\n \"shadow-borders-base bg-ui-bg-base transition-fg flex h-[14px] w-[14px] items-center justify-center rounded-full\",\n \"group-hover:bg-ui-bg-base-hover\",\n \"group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow\",\n \"group-focus-visible:!shadow-borders-interactive-with-focus\",\n \"group-disabled:!bg-ui-bg-disabled group-disabled:!shadow-borders-base\"\n )}\n >\n <Indicator />\n </div>\n </Primitives.Item>\n )\n})\nItem.displayName = \"RadioGroup.Item\"\n\ninterface ChoiceBoxProps\n extends React.ComponentPropsWithoutRef<typeof Primitives.Item> {\n label: string\n description: string\n}\n\nconst ChoiceBox = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n ChoiceBoxProps\n>(({ className, id, label, description, ...props }, ref) => {\n const generatedId = React.useId()\n\n if (!id) {\n id = generatedId\n }\n\n const descriptionId = `${id}-description`\n\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"shadow-borders-base bg-ui-bg-base focus-visible:shadow-borders-interactive-with-focus transition-fg disabled:bg-ui-bg-disabled group flex items-start gap-x-2 rounded-lg p-3 disabled:cursor-not-allowed\",\n className\n )}\n {...props}\n id={id}\n aria-describedby={descriptionId}\n >\n <div className=\"flex h-5 w-5 items-center justify-center\">\n <div className=\"shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full\">\n <Indicator />\n </div>\n </div>\n <div className=\"flex flex-col items-start\">\n <Label\n htmlFor={id}\n size=\"base\"\n weight=\"plus\"\n className=\"group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed\"\n >\n {label}\n </Label>\n <Hint\n className=\"txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled\"\n id={descriptionId}\n >\n {description}\n </Hint>\n </div>\n </Primitives.Item>\n )\n})\nChoiceBox.displayName = \"RadioGroup.ChoiceBox\"\n\nconst RadioGroup = Object.assign(Root, { Item, ChoiceBox })\n\nexport { RadioGroup }\n"]}
1
+ {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../src/components/radio-group/radio-group.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,UAAU,MAAM,6BAA6B,CAAA;AACzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAA;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC;;GAEG;AACH,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAG3B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,oBAAC,UAAU,CAAC,IAAI,IACd,SAAS,EAAE,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,KACnC,KAAK,EACT,GAAG,EAAE,GAAG,GACR,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AACF,IAAI,CAAC,WAAW,GAAG,YAAY,CAAA;AAE/B,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAGhC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,oBAAC,UAAU,CAAC,SAAS,IACnB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CAAC,kCAAkC,EAAE,SAAS,CAAC,KACzD,KAAK;QAET,6BACE,SAAS,EAAE,GAAG,CACZ,8IAA8I,CAC/I,GACD,CACmB,CACxB,CAAA;AACH,CAAC,CAAC,CAAA;AACF,SAAS,CAAC,WAAW,GAAG,sBAAsB,CAAA;AAE9C,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAG3B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,OAAO,CACL,oBAAC,UAAU,CAAC,IAAI,IACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CACZ,sEAAsE,EACtE,SAAS,CACV,KACG,KAAK;QAET,6BACE,SAAS,EAAE,GAAG,CACZ,iHAAiH,EACjH,iCAAiC,EACjC,mHAAmH,EACnH,4DAA4D,EAC5D,uEAAuE,CACxE;YAED,oBAAC,SAAS,OAAG,CACT,CACU,CACnB,CAAA;AACH,CAAC,CAAC,CAAA;AACF,IAAI,CAAC,WAAW,GAAG,iBAAiB,CAAA;AAQpC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAGhC,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACzD,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,EAAE,CAAA;IAEjC,IAAI,CAAC,EAAE,EAAE;QACP,EAAE,GAAG,WAAW,CAAA;KACjB;IAED,MAAM,aAAa,GAAG,GAAG,EAAE,cAAc,CAAA;IAEzC,OAAO,CACL,oBAAC,UAAU,CAAC,IAAI,IACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,GAAG,CACZ,0MAA0M,EAC1M,SAAS,CACV,KACG,KAAK,EACT,EAAE,EAAE,EAAE,sBACY,aAAa;QAE/B,6BAAK,SAAS,EAAC,0CAA0C;YACvD,6BAAK,SAAS,EAAC,mUAAmU;gBAChV,oBAAC,SAAS,OAAG,CACT,CACF;QACN,6BAAK,SAAS,EAAC,2BAA2B;YACxC,oBAAC,KAAK,IACJ,OAAO,EAAE,EAAE,EACX,IAAI,EAAC,OAAO,EACZ,MAAM,EAAC,MAAM,EACb,SAAS,EAAC,qFAAqF,IAE9F,KAAK,CACA;YACR,oBAAC,IAAI,IACH,SAAS,EAAC,mFAAmF,EAC7F,EAAE,EAAE,aAAa,IAEhB,WAAW,CACP,CACH,CACU,CACnB,CAAA;AACH,CAAC,CAAC,CAAA;AACF,SAAS,CAAC,WAAW,GAAG,sBAAsB,CAAA;AAE9C,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAA;AAE3D,OAAO,EAAE,UAAU,EAAE,CAAA","sourcesContent":["\"use client\"\n\nimport * as Primitives from \"@radix-ui/react-radio-group\"\nimport * as React from \"react\"\n\nimport { clx } from \"@/utils/clx\"\nimport { Hint } from \"../hint\"\nimport { Label } from \"../label\"\n\n/**\n * This component is based on the [Radix UI Radio Group](https://www.radix-ui.com/primitives/docs/components/radio-group) primitives.\n */\nconst Root = React.forwardRef<\n React.ElementRef<typeof Primitives.Root>,\n React.ComponentPropsWithoutRef<typeof Primitives.Root>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Root\n className={clx(\"grid gap-2\", className)}\n {...props}\n ref={ref}\n />\n )\n})\nRoot.displayName = \"RadioGroup\"\n\nconst Indicator = React.forwardRef<\n React.ElementRef<typeof Primitives.Indicator>,\n React.ComponentPropsWithoutRef<typeof Primitives.Indicator>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Indicator\n ref={ref}\n className={clx(\"flex items-center justify-center\", className)}\n {...props}\n >\n <div\n className={clx(\n \"bg-ui-bg-base shadow-details-contrast-on-bg-interactive group-disabled:bg-ui-fg-disabled h-1.5 w-1.5 rounded-full group-disabled:shadow-none\"\n )}\n />\n </Primitives.Indicator>\n )\n})\nIndicator.displayName = \"RadioGroup.Indicator\"\n\nconst Item = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n React.ComponentPropsWithoutRef<typeof Primitives.Item>\n>(({ className, ...props }, ref) => {\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"group relative flex h-5 w-5 items-center justify-center outline-none\",\n className\n )}\n {...props}\n >\n <div\n className={clx(\n \"shadow-borders-base bg-ui-bg-base transition-fg flex h-[14px] w-[14px] items-center justify-center rounded-full\",\n \"group-hover:bg-ui-bg-base-hover\",\n \"group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow\",\n \"group-focus-visible:!shadow-borders-interactive-with-focus\",\n \"group-disabled:!bg-ui-bg-disabled group-disabled:!shadow-borders-base\"\n )}\n >\n <Indicator />\n </div>\n </Primitives.Item>\n )\n})\nItem.displayName = \"RadioGroup.Item\"\n\ninterface ChoiceBoxProps\n extends React.ComponentPropsWithoutRef<typeof Primitives.Item> {\n label: string\n description: string\n}\n\nconst ChoiceBox = React.forwardRef<\n React.ElementRef<typeof Primitives.Item>,\n ChoiceBoxProps\n>(({ className, id, label, description, ...props }, ref) => {\n const generatedId = React.useId()\n\n if (!id) {\n id = generatedId\n }\n\n const descriptionId = `${id}-description`\n\n return (\n <Primitives.Item\n ref={ref}\n className={clx(\n \"shadow-borders-base bg-ui-bg-base focus-visible:shadow-borders-interactive-with-focus transition-fg disabled:bg-ui-bg-disabled group flex items-start gap-x-2 rounded-lg p-3 disabled:cursor-not-allowed\",\n className\n )}\n {...props}\n id={id}\n aria-describedby={descriptionId}\n >\n <div className=\"flex h-5 w-5 items-center justify-center\">\n <div className=\"shadow-borders-base bg-ui-bg-base group-data-[state=checked]:bg-ui-bg-interactive group-data-[state=checked]:shadow-borders-interactive-with-shadow transition-fg group-disabled:!bg-ui-bg-disabled group-hover:bg-ui-bg-base-hover group-disabled:!shadow-borders-base flex h-3.5 w-3.5 items-center justify-center rounded-full\">\n <Indicator />\n </div>\n </div>\n <div className=\"flex flex-col items-start\">\n <Label\n htmlFor={id}\n size=\"small\"\n weight=\"plus\"\n className=\"group-disabled:text-ui-fg-disabled cursor-pointer group-disabled:cursor-not-allowed\"\n >\n {label}\n </Label>\n <Hint\n className=\"txt-compact-medium text-ui-fg-subtle group-disabled:text-ui-fg-disabled text-left\"\n id={descriptionId}\n >\n {description}\n </Hint>\n </div>\n </Primitives.Item>\n )\n})\nChoiceBox.displayName = \"RadioGroup.ChoiceBox\"\n\nconst RadioGroup = Object.assign(Root, { Item, ChoiceBox })\n\nexport { RadioGroup }\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@medusajs/ui",
3
- "version": "2.4.1",
3
+ "version": "2.4.2-next-20240305095805",
4
4
  "author": "Kasper Kristensen <kasper@medusajs.com>",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -80,7 +80,7 @@
80
80
  "vitest": "^0.32.2"
81
81
  },
82
82
  "dependencies": {
83
- "@medusajs/icons": "^1.2.0",
83
+ "@medusajs/icons": "1.2.1-next-20240305095805",
84
84
  "@radix-ui/react-accordion": "^1.1.2",
85
85
  "@radix-ui/react-alert-dialog": "^1.0.4",
86
86
  "@radix-ui/react-avatar": "^1.0.3",