@medusajs/ui 2.4.1 → 2.4.2-next-20240221072935
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/cjs/components/alert/alert.js.map +1 -1
- package/dist/cjs/components/badge/badge.d.ts +1 -1
- package/dist/cjs/components/badge/badge.js +58 -4
- package/dist/cjs/components/badge/badge.js.map +1 -1
- package/dist/cjs/components/currency-input/currency-input.js +2 -2
- package/dist/cjs/components/currency-input/currency-input.js.map +1 -1
- package/dist/esm/components/alert/alert.js.map +1 -1
- package/dist/esm/components/badge/badge.d.ts +1 -1
- package/dist/esm/components/badge/badge.js +58 -4
- package/dist/esm/components/badge/badge.js.map +1 -1
- package/dist/esm/components/currency-input/currency-input.js +2 -2
- package/dist/esm/components/currency-input/currency-input.js.map +1 -1
- package/package.json +2 -2
|
@@ -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,
|
|
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"]}
|
|
@@ -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 | {
|
|
@@ -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
|
-
|
|
30
|
-
|
|
31
|
-
|
|
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",
|
|
@@ -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;
|
|
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"]}
|
|
@@ -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
|
});
|
|
@@ -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"]}
|
|
@@ -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,
|
|
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"]}
|
|
@@ -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 | {
|
|
@@ -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
|
-
|
|
25
|
-
|
|
26
|
-
|
|
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",
|
|
@@ -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,
|
|
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"]}
|
|
@@ -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
|
});
|
|
@@ -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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@medusajs/ui",
|
|
3
|
-
"version": "2.4.
|
|
3
|
+
"version": "2.4.2-next-20240221072935",
|
|
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": "
|
|
83
|
+
"@medusajs/icons": "1.2.1-next-20240221072935",
|
|
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",
|