@particle-academy/react-fancy 5.54.0 → 5.54.1

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 (84) hide show
  1. package/CHANGELOG.md +55 -0
  2. package/dist/button.cjs +4 -4
  3. package/dist/button.js +2 -2
  4. package/dist/chat-drawer.cjs +3 -3
  5. package/dist/chat-drawer.js +2 -2
  6. package/dist/chunk-2O5UXH5R.cjs +191 -0
  7. package/dist/chunk-2O5UXH5R.cjs.map +1 -0
  8. package/dist/{chunk-26JZ47BJ.js → chunk-45JO5BEZ.js} +17 -11
  9. package/dist/chunk-45JO5BEZ.js.map +1 -0
  10. package/dist/{chunk-TFKG5FSG.cjs → chunk-4I4Y5MZO.cjs} +4 -4
  11. package/dist/{chunk-TFKG5FSG.cjs.map → chunk-4I4Y5MZO.cjs.map} +1 -1
  12. package/dist/{chunk-2KFHSFFY.cjs → chunk-6GKR5OAW.cjs} +4 -4
  13. package/dist/{chunk-2KFHSFFY.cjs.map → chunk-6GKR5OAW.cjs.map} +1 -1
  14. package/dist/{chunk-X7H75WVP.cjs → chunk-BJKKW77L.cjs} +17 -8
  15. package/dist/chunk-BJKKW77L.cjs.map +1 -0
  16. package/dist/chunk-DXZCKDYS.js +189 -0
  17. package/dist/chunk-DXZCKDYS.js.map +1 -0
  18. package/dist/{chunk-EJ6P7K4G.js → chunk-EULOJOTU.js} +3 -3
  19. package/dist/{chunk-EJ6P7K4G.js.map → chunk-EULOJOTU.js.map} +1 -1
  20. package/dist/chunk-I27K6NLX.cjs +15 -0
  21. package/dist/chunk-I27K6NLX.cjs.map +1 -0
  22. package/dist/{chunk-N7ABDCQ6.cjs → chunk-I2TBENUQ.cjs} +11 -11
  23. package/dist/{chunk-N7ABDCQ6.cjs.map → chunk-I2TBENUQ.cjs.map} +1 -1
  24. package/dist/{chunk-IVRYSSM7.js → chunk-J3A4Z2P7.js} +2 -2
  25. package/dist/chunk-J3A4Z2P7.js.map +1 -0
  26. package/dist/{chunk-EEFWVFKO.js → chunk-KUJ5XRBD.js} +7 -4
  27. package/dist/chunk-KUJ5XRBD.js.map +1 -0
  28. package/dist/{chunk-QKFOJKVE.cjs → chunk-MXWR3T3N.cjs} +2 -2
  29. package/dist/chunk-MXWR3T3N.cjs.map +1 -0
  30. package/dist/{chunk-G4M3MCJO.cjs → chunk-ONHT2PDW.cjs} +4 -4
  31. package/dist/{chunk-G4M3MCJO.cjs.map → chunk-ONHT2PDW.cjs.map} +1 -1
  32. package/dist/{chunk-2MUGEPRD.js → chunk-REKY2CM6.js} +5 -5
  33. package/dist/{chunk-2MUGEPRD.js.map → chunk-REKY2CM6.js.map} +1 -1
  34. package/dist/chunk-SV5BW3IA.js +13 -0
  35. package/dist/chunk-SV5BW3IA.js.map +1 -0
  36. package/dist/{chunk-OC5OUZSD.js → chunk-TBXZ3NGR.js} +4 -4
  37. package/dist/{chunk-OC5OUZSD.js.map → chunk-TBXZ3NGR.js.map} +1 -1
  38. package/dist/{chunk-VP7MT7LH.cjs → chunk-TCW72JBU.cjs} +17 -17
  39. package/dist/{chunk-VP7MT7LH.cjs.map → chunk-TCW72JBU.cjs.map} +1 -1
  40. package/dist/{chunk-CF5KRDN4.js → chunk-TGBLDJ72.js} +18 -9
  41. package/dist/chunk-TGBLDJ72.js.map +1 -0
  42. package/dist/{chunk-QFC736WY.js → chunk-WE5WGVVX.js} +3 -3
  43. package/dist/{chunk-QFC736WY.js.map → chunk-WE5WGVVX.js.map} +1 -1
  44. package/dist/{chunk-YVTFODCJ.cjs → chunk-WUG646R4.cjs} +6 -3
  45. package/dist/chunk-WUG646R4.cjs.map +1 -0
  46. package/dist/{chunk-CAMQ5B3V.cjs → chunk-XOXA3QZR.cjs} +21 -15
  47. package/dist/chunk-XOXA3QZR.cjs.map +1 -0
  48. package/dist/{chunk-Y6LL3B5P.js → chunk-ZFU4FY3Q.js} +3 -3
  49. package/dist/{chunk-Y6LL3B5P.js.map → chunk-ZFU4FY3Q.js.map} +1 -1
  50. package/dist/icon.cjs +7 -7
  51. package/dist/icon.js +1 -1
  52. package/dist/index.cjs +40 -39
  53. package/dist/index.cjs.map +1 -1
  54. package/dist/index.js +11 -10
  55. package/dist/index.js.map +1 -1
  56. package/dist/inputs.cjs +5 -4
  57. package/dist/inputs.js +3 -2
  58. package/dist/json-editor.cjs +15 -15
  59. package/dist/json-editor.js +4 -4
  60. package/dist/magic-wand.cjs +4 -4
  61. package/dist/magic-wand.js +3 -3
  62. package/dist/multi-switch.cjs +3 -2
  63. package/dist/multi-switch.js +2 -1
  64. package/dist/prompt-input.cjs +6 -5
  65. package/dist/prompt-input.js +5 -4
  66. package/dist/reason-tag.cjs +4 -4
  67. package/dist/reason-tag.js +3 -3
  68. package/dist/switch.cjs +2 -2
  69. package/dist/switch.js +1 -1
  70. package/dist/tooltip.cjs +3 -2
  71. package/dist/tooltip.js +2 -1
  72. package/package.json +1 -1
  73. package/dist/chunk-26JZ47BJ.js.map +0 -1
  74. package/dist/chunk-CAMQ5B3V.cjs.map +0 -1
  75. package/dist/chunk-CF5KRDN4.js.map +0 -1
  76. package/dist/chunk-EEFWVFKO.js.map +0 -1
  77. package/dist/chunk-IVRYSSM7.js.map +0 -1
  78. package/dist/chunk-QKFOJKVE.cjs.map +0 -1
  79. package/dist/chunk-RVBTDXPD.cjs +0 -169
  80. package/dist/chunk-RVBTDXPD.cjs.map +0 -1
  81. package/dist/chunk-VQXXX6DK.js +0 -167
  82. package/dist/chunk-VQXXX6DK.js.map +0 -1
  83. package/dist/chunk-X7H75WVP.cjs.map +0 -1
  84. package/dist/chunk-YVTFODCJ.cjs.map +0 -1
@@ -1,169 +0,0 @@
1
- 'use strict';
2
-
3
- var chunkO3F6DYWR_cjs = require('./chunk-O3F6DYWR.cjs');
4
- var chunkKJ22KE56_cjs = require('./chunk-KJ22KE56.cjs');
5
- var chunkL3V3BYVS_cjs = require('./chunk-L3V3BYVS.cjs');
6
- var chunkSNHU2AI4_cjs = require('./chunk-SNHU2AI4.cjs');
7
- var chunkZU5Q77OT_cjs = require('./chunk-ZU5Q77OT.cjs');
8
- var react = require('react');
9
- var jsxRuntime = require('react/jsx-runtime');
10
-
11
- // src/components/inputs/Switch/Switch.colors.ts
12
- var switchTrack = {
13
- // The host's colour, from CSS variables -- no dark: variant, because a
14
- // host that themes per mode scopes the variables themselves.
15
- brand: "bg-brand",
16
- slate: "bg-slate-500",
17
- gray: "bg-gray-500",
18
- zinc: "bg-zinc-500",
19
- neutral: "bg-neutral-500",
20
- stone: "bg-stone-500",
21
- red: "bg-red-500",
22
- orange: "bg-orange-500",
23
- amber: "bg-amber-500",
24
- yellow: "bg-yellow-500",
25
- lime: "bg-lime-500",
26
- green: "bg-green-500",
27
- emerald: "bg-emerald-500",
28
- teal: "bg-teal-500",
29
- cyan: "bg-cyan-500",
30
- sky: "bg-sky-500",
31
- blue: "bg-blue-500",
32
- indigo: "bg-indigo-500",
33
- violet: "bg-violet-500",
34
- purple: "bg-purple-500",
35
- fuchsia: "bg-fuchsia-500",
36
- pink: "bg-pink-500",
37
- rose: "bg-rose-500"
38
- };
39
- var Switch = react.forwardRef(
40
- ({
41
- size = "md",
42
- dirty,
43
- error,
44
- label,
45
- description,
46
- required,
47
- disabled,
48
- className,
49
- id,
50
- name,
51
- checked: controlledChecked,
52
- defaultChecked = false,
53
- onCheckedChange,
54
- color = "blue",
55
- mode,
56
- ...rest
57
- }, ref) => {
58
- const autoId = react.useId();
59
- const switchId = id ?? autoId;
60
- const resolvedMode = chunkL3V3BYVS_cjs.useFieldMode(mode);
61
- const { showControl, interactive, enterEdit, exitEdit } = chunkKJ22KE56_cjs.useInlineEdit(resolvedMode, disabled);
62
- const [checked, setChecked] = chunkSNHU2AI4_cjs.useControllableState(
63
- controlledChecked,
64
- defaultChecked,
65
- onCheckedChange
66
- );
67
- const trackSizes = {
68
- xs: "h-3.5 w-6",
69
- sm: "h-4 w-7",
70
- md: "h-5 w-9",
71
- lg: "h-6 w-11",
72
- xl: "h-7 w-[52px]"
73
- }[size];
74
- const knobSizes = {
75
- xs: "h-2.5 w-2.5",
76
- sm: "h-3 w-3",
77
- md: "h-4 w-4",
78
- lg: "h-5 w-5",
79
- xl: "h-6 w-6"
80
- }[size];
81
- const translateOn = {
82
- xs: "translate-x-2.5",
83
- sm: "translate-x-3",
84
- md: "translate-x-4",
85
- lg: "translate-x-5",
86
- xl: "translate-x-6"
87
- }[size];
88
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...rest, "data-react-fancy-switch": "", className: chunkZU5Q77OT_cjs.cn("flex items-start gap-2", className), children: [
89
- !showControl ? /* @__PURE__ */ jsxRuntime.jsx(
90
- "span",
91
- {
92
- "data-react-fancy-display": "",
93
- "data-mode": "view",
94
- role: interactive ? "button" : void 0,
95
- tabIndex: interactive ? 0 : void 0,
96
- title: interactive ? "Click to edit" : void 0,
97
- onClick: interactive ? enterEdit : void 0,
98
- onKeyDown: interactive ? (e) => {
99
- if (e.key === "Enter" || e.key === " ") {
100
- e.preventDefault();
101
- enterEdit();
102
- }
103
- } : void 0,
104
- className: chunkZU5Q77OT_cjs.cn(
105
- "text-sm font-medium text-zinc-700 dark:text-zinc-200",
106
- interactive && "cursor-pointer rounded-md outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white"
107
- ),
108
- children: checked ? "On" : "Off"
109
- }
110
- ) : /* @__PURE__ */ jsxRuntime.jsx(
111
- "button",
112
- {
113
- ref,
114
- id: switchId,
115
- type: "button",
116
- role: "switch",
117
- "aria-checked": checked,
118
- disabled,
119
- autoFocus: interactive,
120
- onBlur: () => {
121
- if (interactive) exitEdit();
122
- },
123
- onClick: () => setChecked(!checked),
124
- className: chunkZU5Q77OT_cjs.cn(
125
- "relative inline-flex shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
126
- trackSizes,
127
- checked ? switchTrack[color] : "bg-zinc-200 dark:bg-zinc-600",
128
- chunkO3F6DYWR_cjs.dirtyRingClasses(dirty),
129
- error && "ring-2 ring-red-500/50"
130
- ),
131
- children: /* @__PURE__ */ jsxRuntime.jsx(
132
- "span",
133
- {
134
- className: chunkZU5Q77OT_cjs.cn(
135
- "pointer-events-none inline-block rounded-full bg-white shadow-sm transition-transform",
136
- knobSizes,
137
- checked ? translateOn : "translate-x-0"
138
- )
139
- }
140
- )
141
- }
142
- ),
143
- name && /* @__PURE__ */ jsxRuntime.jsx("input", { type: "hidden", name, value: checked ? "1" : "0" }),
144
- (label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
145
- label && /* @__PURE__ */ jsxRuntime.jsxs(
146
- "label",
147
- {
148
- htmlFor: switchId,
149
- className: chunkZU5Q77OT_cjs.cn(
150
- "cursor-pointer text-sm text-zinc-700 dark:text-zinc-100",
151
- disabled && "cursor-not-allowed opacity-50"
152
- ),
153
- children: [
154
- label,
155
- required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-0.5 text-red-500", children: "*" })
156
- ]
157
- }
158
- ),
159
- description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]", children: description }),
160
- error && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-red-500", children: error })
161
- ] })
162
- ] });
163
- }
164
- );
165
- Switch.displayName = "Switch";
166
-
167
- exports.Switch = Switch;
168
- //# sourceMappingURL=chunk-RVBTDXPD.cjs.map
169
- //# sourceMappingURL=chunk-RVBTDXPD.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/inputs/Switch/Switch.colors.ts","../src/components/inputs/Switch/Switch.tsx"],"names":["forwardRef","useId","useFieldMode","useInlineEdit","useControllableState","jsxs","cn","jsx","dirtyRingClasses"],"mappings":"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","file":"chunk-RVBTDXPD.cjs","sourcesContent":["// AUTO-GENERATED by scripts/gen-switch-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../../utils/types\";\n\nexport const switchTrack: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-brand\",\n slate: \"bg-slate-500\",\n gray: \"bg-gray-500\",\n zinc: \"bg-zinc-500\",\n neutral: \"bg-neutral-500\",\n stone: \"bg-stone-500\",\n red: \"bg-red-500\",\n orange: \"bg-orange-500\",\n amber: \"bg-amber-500\",\n yellow: \"bg-yellow-500\",\n lime: \"bg-lime-500\",\n green: \"bg-green-500\",\n emerald: \"bg-emerald-500\",\n teal: \"bg-teal-500\",\n cyan: \"bg-cyan-500\",\n sky: \"bg-sky-500\",\n blue: \"bg-blue-500\",\n indigo: \"bg-indigo-500\",\n violet: \"bg-violet-500\",\n purple: \"bg-purple-500\",\n fuchsia: \"bg-fuchsia-500\",\n pink: \"bg-pink-500\",\n rose: \"bg-rose-500\",\n};\n","import { forwardRef, useId } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { dirtyRingClasses } from \"../inputs.utils\";\nimport type { SwitchProps } from \"./Switch.types\";\nimport { switchTrack } from \"./Switch.colors\";\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n (\n {\n size = \"md\",\n dirty,\n error,\n label,\n description,\n required,\n disabled,\n className,\n id,\n name,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n color = \"blue\",\n mode,\n ...rest\n },\n ref,\n ) => {\n const autoId = useId();\n const switchId = id ?? autoId;\n const resolvedMode = useFieldMode(mode);\n const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n const [checked, setChecked] = useControllableState(\n controlledChecked,\n defaultChecked,\n onCheckedChange,\n );\n\n const trackSizes = {\n xs: \"h-3.5 w-6\",\n sm: \"h-4 w-7\",\n md: \"h-5 w-9\",\n lg: \"h-6 w-11\",\n xl: \"h-7 w-[52px]\",\n }[size];\n\n const knobSizes = {\n xs: \"h-2.5 w-2.5\",\n sm: \"h-3 w-3\",\n md: \"h-4 w-4\",\n lg: \"h-5 w-5\",\n xl: \"h-6 w-6\",\n }[size];\n\n const translateOn = {\n xs: \"translate-x-2.5\",\n sm: \"translate-x-3\",\n md: \"translate-x-4\",\n lg: \"translate-x-5\",\n xl: \"translate-x-6\",\n }[size];\n\n return (\n <div {...rest} data-react-fancy-switch=\"\" className={cn(\"flex items-start gap-2\", className)}>\n {!showControl ? (\n <span\n data-react-fancy-display=\"\"\n data-mode=\"view\"\n role={interactive ? \"button\" : undefined}\n tabIndex={interactive ? 0 : undefined}\n title={interactive ? \"Click to edit\" : undefined}\n onClick={interactive ? enterEdit : undefined}\n onKeyDown={\n interactive\n ? (e) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n enterEdit();\n }\n }\n : undefined\n }\n className={cn(\n \"text-sm font-medium text-zinc-700 dark:text-zinc-200\",\n interactive &&\n \"cursor-pointer rounded-md outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white\",\n )}\n >\n {checked ? \"On\" : \"Off\"}\n </span>\n ) : (\n <button\n ref={ref}\n id={switchId}\n type=\"button\"\n role=\"switch\"\n aria-checked={checked}\n disabled={disabled}\n autoFocus={interactive}\n onBlur={() => {\n if (interactive) exitEdit();\n }}\n onClick={() => setChecked(!checked)}\n className={cn(\n \"relative inline-flex shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\",\n trackSizes,\n checked ? switchTrack[color] : \"bg-zinc-200 dark:bg-zinc-600\",\n dirtyRingClasses(dirty),\n error && \"ring-2 ring-red-500/50\",\n )}\n >\n <span\n className={cn(\n \"pointer-events-none inline-block rounded-full bg-white shadow-sm transition-transform\",\n knobSizes,\n checked ? translateOn : \"translate-x-0\",\n )}\n />\n </button>\n )}\n {name && (\n <input type=\"hidden\" name={name} value={checked ? \"1\" : \"0\"} />\n )}\n {(label || description) && (\n <div className=\"flex flex-col\">\n {label && (\n <label\n htmlFor={switchId}\n className={cn(\n \"cursor-pointer text-sm text-zinc-700 dark:text-zinc-100\",\n disabled && \"cursor-not-allowed opacity-50\",\n )}\n >\n {label}\n {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n </label>\n )}\n {description && (\n <span className=\"text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\">\n {description}\n </span>\n )}\n {error && <span className=\"text-xs text-red-500\">{error}</span>}\n </div>\n )}\n </div>\n );\n },\n);\n\nSwitch.displayName = \"Switch\";\n"]}
@@ -1,167 +0,0 @@
1
- import { dirtyRingClasses } from './chunk-USWQAMI3.js';
2
- import { useInlineEdit } from './chunk-OL53XYHF.js';
3
- import { useFieldMode } from './chunk-NRXK42LO.js';
4
- import { useControllableState } from './chunk-EDYAXGUM.js';
5
- import { cn } from './chunk-MMW2JGKZ.js';
6
- import { forwardRef, useId } from 'react';
7
- import { jsxs, jsx } from 'react/jsx-runtime';
8
-
9
- // src/components/inputs/Switch/Switch.colors.ts
10
- var switchTrack = {
11
- // The host's colour, from CSS variables -- no dark: variant, because a
12
- // host that themes per mode scopes the variables themselves.
13
- brand: "bg-brand",
14
- slate: "bg-slate-500",
15
- gray: "bg-gray-500",
16
- zinc: "bg-zinc-500",
17
- neutral: "bg-neutral-500",
18
- stone: "bg-stone-500",
19
- red: "bg-red-500",
20
- orange: "bg-orange-500",
21
- amber: "bg-amber-500",
22
- yellow: "bg-yellow-500",
23
- lime: "bg-lime-500",
24
- green: "bg-green-500",
25
- emerald: "bg-emerald-500",
26
- teal: "bg-teal-500",
27
- cyan: "bg-cyan-500",
28
- sky: "bg-sky-500",
29
- blue: "bg-blue-500",
30
- indigo: "bg-indigo-500",
31
- violet: "bg-violet-500",
32
- purple: "bg-purple-500",
33
- fuchsia: "bg-fuchsia-500",
34
- pink: "bg-pink-500",
35
- rose: "bg-rose-500"
36
- };
37
- var Switch = forwardRef(
38
- ({
39
- size = "md",
40
- dirty,
41
- error,
42
- label,
43
- description,
44
- required,
45
- disabled,
46
- className,
47
- id,
48
- name,
49
- checked: controlledChecked,
50
- defaultChecked = false,
51
- onCheckedChange,
52
- color = "blue",
53
- mode,
54
- ...rest
55
- }, ref) => {
56
- const autoId = useId();
57
- const switchId = id ?? autoId;
58
- const resolvedMode = useFieldMode(mode);
59
- const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);
60
- const [checked, setChecked] = useControllableState(
61
- controlledChecked,
62
- defaultChecked,
63
- onCheckedChange
64
- );
65
- const trackSizes = {
66
- xs: "h-3.5 w-6",
67
- sm: "h-4 w-7",
68
- md: "h-5 w-9",
69
- lg: "h-6 w-11",
70
- xl: "h-7 w-[52px]"
71
- }[size];
72
- const knobSizes = {
73
- xs: "h-2.5 w-2.5",
74
- sm: "h-3 w-3",
75
- md: "h-4 w-4",
76
- lg: "h-5 w-5",
77
- xl: "h-6 w-6"
78
- }[size];
79
- const translateOn = {
80
- xs: "translate-x-2.5",
81
- sm: "translate-x-3",
82
- md: "translate-x-4",
83
- lg: "translate-x-5",
84
- xl: "translate-x-6"
85
- }[size];
86
- return /* @__PURE__ */ jsxs("div", { ...rest, "data-react-fancy-switch": "", className: cn("flex items-start gap-2", className), children: [
87
- !showControl ? /* @__PURE__ */ jsx(
88
- "span",
89
- {
90
- "data-react-fancy-display": "",
91
- "data-mode": "view",
92
- role: interactive ? "button" : void 0,
93
- tabIndex: interactive ? 0 : void 0,
94
- title: interactive ? "Click to edit" : void 0,
95
- onClick: interactive ? enterEdit : void 0,
96
- onKeyDown: interactive ? (e) => {
97
- if (e.key === "Enter" || e.key === " ") {
98
- e.preventDefault();
99
- enterEdit();
100
- }
101
- } : void 0,
102
- className: cn(
103
- "text-sm font-medium text-zinc-700 dark:text-zinc-200",
104
- interactive && "cursor-pointer rounded-md outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white"
105
- ),
106
- children: checked ? "On" : "Off"
107
- }
108
- ) : /* @__PURE__ */ jsx(
109
- "button",
110
- {
111
- ref,
112
- id: switchId,
113
- type: "button",
114
- role: "switch",
115
- "aria-checked": checked,
116
- disabled,
117
- autoFocus: interactive,
118
- onBlur: () => {
119
- if (interactive) exitEdit();
120
- },
121
- onClick: () => setChecked(!checked),
122
- className: cn(
123
- "relative inline-flex shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
124
- trackSizes,
125
- checked ? switchTrack[color] : "bg-zinc-200 dark:bg-zinc-600",
126
- dirtyRingClasses(dirty),
127
- error && "ring-2 ring-red-500/50"
128
- ),
129
- children: /* @__PURE__ */ jsx(
130
- "span",
131
- {
132
- className: cn(
133
- "pointer-events-none inline-block rounded-full bg-white shadow-sm transition-transform",
134
- knobSizes,
135
- checked ? translateOn : "translate-x-0"
136
- )
137
- }
138
- )
139
- }
140
- ),
141
- name && /* @__PURE__ */ jsx("input", { type: "hidden", name, value: checked ? "1" : "0" }),
142
- (label || description) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
143
- label && /* @__PURE__ */ jsxs(
144
- "label",
145
- {
146
- htmlFor: switchId,
147
- className: cn(
148
- "cursor-pointer text-sm text-zinc-700 dark:text-zinc-100",
149
- disabled && "cursor-not-allowed opacity-50"
150
- ),
151
- children: [
152
- label,
153
- required && /* @__PURE__ */ jsx("span", { className: "ml-0.5 text-red-500", children: "*" })
154
- ]
155
- }
156
- ),
157
- description && /* @__PURE__ */ jsx("span", { className: "text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]", children: description }),
158
- error && /* @__PURE__ */ jsx("span", { className: "text-xs text-red-500", children: error })
159
- ] })
160
- ] });
161
- }
162
- );
163
- Switch.displayName = "Switch";
164
-
165
- export { Switch };
166
- //# sourceMappingURL=chunk-VQXXX6DK.js.map
167
- //# sourceMappingURL=chunk-VQXXX6DK.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/inputs/Switch/Switch.colors.ts","../src/components/inputs/Switch/Switch.tsx"],"names":[],"mappings":"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","file":"chunk-VQXXX6DK.js","sourcesContent":["// AUTO-GENERATED by scripts/gen-switch-colors — do not edit by hand.\n// Literal Tailwind class strings for every color in the v4 palette so the\n// scanner can detect them in the published dist (template-built names are\n// invisible to Tailwind's JIT). Regenerate after changing the palette.\nimport type { Color } from \"../../../utils/types\";\n\nexport const switchTrack: Record<Color, string> = {\n // The host's colour, from CSS variables -- no dark: variant, because a\n // host that themes per mode scopes the variables themselves.\n brand: \"bg-brand\",\n slate: \"bg-slate-500\",\n gray: \"bg-gray-500\",\n zinc: \"bg-zinc-500\",\n neutral: \"bg-neutral-500\",\n stone: \"bg-stone-500\",\n red: \"bg-red-500\",\n orange: \"bg-orange-500\",\n amber: \"bg-amber-500\",\n yellow: \"bg-yellow-500\",\n lime: \"bg-lime-500\",\n green: \"bg-green-500\",\n emerald: \"bg-emerald-500\",\n teal: \"bg-teal-500\",\n cyan: \"bg-cyan-500\",\n sky: \"bg-sky-500\",\n blue: \"bg-blue-500\",\n indigo: \"bg-indigo-500\",\n violet: \"bg-violet-500\",\n purple: \"bg-purple-500\",\n fuchsia: \"bg-fuchsia-500\",\n pink: \"bg-pink-500\",\n rose: \"bg-rose-500\",\n};\n","import { forwardRef, useId } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { dirtyRingClasses } from \"../inputs.utils\";\nimport type { SwitchProps } from \"./Switch.types\";\nimport { switchTrack } from \"./Switch.colors\";\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n (\n {\n size = \"md\",\n dirty,\n error,\n label,\n description,\n required,\n disabled,\n className,\n id,\n name,\n checked: controlledChecked,\n defaultChecked = false,\n onCheckedChange,\n color = \"blue\",\n mode,\n ...rest\n },\n ref,\n ) => {\n const autoId = useId();\n const switchId = id ?? autoId;\n const resolvedMode = useFieldMode(mode);\n const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n const [checked, setChecked] = useControllableState(\n controlledChecked,\n defaultChecked,\n onCheckedChange,\n );\n\n const trackSizes = {\n xs: \"h-3.5 w-6\",\n sm: \"h-4 w-7\",\n md: \"h-5 w-9\",\n lg: \"h-6 w-11\",\n xl: \"h-7 w-[52px]\",\n }[size];\n\n const knobSizes = {\n xs: \"h-2.5 w-2.5\",\n sm: \"h-3 w-3\",\n md: \"h-4 w-4\",\n lg: \"h-5 w-5\",\n xl: \"h-6 w-6\",\n }[size];\n\n const translateOn = {\n xs: \"translate-x-2.5\",\n sm: \"translate-x-3\",\n md: \"translate-x-4\",\n lg: \"translate-x-5\",\n xl: \"translate-x-6\",\n }[size];\n\n return (\n <div {...rest} data-react-fancy-switch=\"\" className={cn(\"flex items-start gap-2\", className)}>\n {!showControl ? (\n <span\n data-react-fancy-display=\"\"\n data-mode=\"view\"\n role={interactive ? \"button\" : undefined}\n tabIndex={interactive ? 0 : undefined}\n title={interactive ? \"Click to edit\" : undefined}\n onClick={interactive ? enterEdit : undefined}\n onKeyDown={\n interactive\n ? (e) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n enterEdit();\n }\n }\n : undefined\n }\n className={cn(\n \"text-sm font-medium text-zinc-700 dark:text-zinc-200\",\n interactive &&\n \"cursor-pointer rounded-md outline-none transition-colors hover:text-zinc-900 focus-visible:ring-2 focus-visible:ring-blue-500/40 dark:hover:text-white\",\n )}\n >\n {checked ? \"On\" : \"Off\"}\n </span>\n ) : (\n <button\n ref={ref}\n id={switchId}\n type=\"button\"\n role=\"switch\"\n aria-checked={checked}\n disabled={disabled}\n autoFocus={interactive}\n onBlur={() => {\n if (interactive) exitEdit();\n }}\n onClick={() => setChecked(!checked)}\n className={cn(\n \"relative inline-flex shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500/40 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\",\n trackSizes,\n checked ? switchTrack[color] : \"bg-zinc-200 dark:bg-zinc-600\",\n dirtyRingClasses(dirty),\n error && \"ring-2 ring-red-500/50\",\n )}\n >\n <span\n className={cn(\n \"pointer-events-none inline-block rounded-full bg-white shadow-sm transition-transform\",\n knobSizes,\n checked ? translateOn : \"translate-x-0\",\n )}\n />\n </button>\n )}\n {name && (\n <input type=\"hidden\" name={name} value={checked ? \"1\" : \"0\"} />\n )}\n {(label || description) && (\n <div className=\"flex flex-col\">\n {label && (\n <label\n htmlFor={switchId}\n className={cn(\n \"cursor-pointer text-sm text-zinc-700 dark:text-zinc-100\",\n disabled && \"cursor-not-allowed opacity-50\",\n )}\n >\n {label}\n {required && <span className=\"ml-0.5 text-red-500\">*</span>}\n </label>\n )}\n {description && (\n <span className=\"text-xs text-[color:var(--fancy-text-muted,var(--color-zinc-500))] dark:text-[color:var(--fancy-text-muted-dark,var(--color-zinc-400))]\">\n {description}\n </span>\n )}\n {error && <span className=\"text-xs text-red-500\">{error}</span>}\n </div>\n )}\n </div>\n );\n },\n);\n\nSwitch.displayName = \"Switch\";\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/Tooltip/Tooltip.tsx"],"names":["forwardRef","Tooltip","useState","useRef","useFloatingPosition","useCallback","cloneElement","jsxs","Fragment","Portal","cn","jsx"],"mappings":";;;;;;;;AAaO,IAAM,OAAA,GAAUA,gBAAA;AAAA,EACrB,SAASC,QAAAA,CACP,EAAE,QAAA,EAAU,OAAA,EAAS,SAAA,GAAY,KAAA,EAAO,KAAA,GAAQ,GAAA,EAAK,MAAA,GAAS,CAAA,EAAG,SAAA,IACjE,IAAA,EACA;AACA,IAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,eAAS,KAAK,CAAA;AACtC,IAAA,MAAM,SAAA,GAAYC,aAAoB,IAAI,CAAA;AAC1C,IAAA,MAAM,WAAA,GAAcA,aAAuB,IAAI,CAAA;AAC/C,IAAA,MAAM,UAAA,GAAaA,aAAsC,MAAS,CAAA;AAElE,IAAA,MAAM,QAAA,GAAWC,qCAAA,CAAoB,SAAA,EAAW,WAAA,EAAa;AAAA,MAC3D,SAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA,EAAS;AAAA,KACV,CAAA;AAED,IAAA,MAAM,IAAA,GAAOC,kBAAY,MAAM;AAC7B,MAAA,UAAA,CAAW,UAAU,UAAA,CAAW,MAAM,OAAA,CAAQ,IAAI,GAAG,KAAK,CAAA;AAAA,IAC5D,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,IAAA,MAAM,IAAA,GAAOA,kBAAY,MAAM;AAC7B,MAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAC/B,MAAA,OAAA,CAAQ,KAAK,CAAA;AAAA,IACf,CAAA,EAAG,EAAE,CAAA;AAEL,IAAA,MAAM,OAAA,GAAUC,mBAAa,QAAA,EAAmD;AAAA,MAC9E,GAAA,EAAK,SAAA;AAAA,MACL,YAAA,EAAc,IAAA;AAAA,MACd,YAAA,EAAc,IAAA;AAAA,MACd,OAAA,EAAS,IAAA;AAAA,MACT,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,uBACEC,eAAA,CAAAC,mBAAA,EAAA,EACG,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACA,IAAA,mCACEC,wBAAA,EAAA,EACC,QAAA,kBAAAF,eAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,GAAA,EAAK,WAAA;AAAA,UACL,0BAAA,EAAyB,EAAA;AAAA,UACzB,IAAA,EAAK,SAAA;AAAA,UACL,SAAA,EAAWG,oBAAA;AAAA,YACT,2JAAA;AAAA,YACA;AAAA,WACF;AAAA,UACA,OAAO,EAAE,IAAA,EAAM,SAAS,CAAA,EAAG,GAAA,EAAK,SAAS,CAAA,EAAE;AAAA,UAE1C,QAAA,EAAA;AAAA,YAAA,OAAA;AAAA,4BACDC,cAAA;AAAA,cAAC,KAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAWD,oBAAA;AAAA;AAAA;AAAA;AAAA,kBAIT,uCAAA;AAAA,kBACA,QAAA,CAAS,SAAA,CAAU,UAAA,CAAW,KAAK,CAAA,IACjC,yCAAA;AAAA,kBACF,QAAA,CAAS,SAAA,CAAU,UAAA,CAAW,QAAQ,CAAA,IACpC,sCAAA;AAAA,kBACF,QAAA,CAAS,SAAA,CAAU,UAAA,CAAW,MAAM,CAAA,IAClC,uCAAA;AAAA,kBACF,QAAA,CAAS,SAAA,CAAU,UAAA,CAAW,OAAO,CAAA,IACnC;AAAA;AACJ;AAAA;AACF;AAAA;AAAA,OACF,EACF;AAAA,KAAA,EAEJ,CAAA;AAAA,EAEJ;AACF;AAEA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-X7H75WVP.cjs","sourcesContent":["import {\n cloneElement,\n forwardRef,\n useCallback,\n useRef,\n useState,\n type ReactElement,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport type { TooltipProps } from \"./Tooltip.types\";\n\nexport const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(\n function Tooltip(\n { children, content, placement = \"top\", delay = 200, offset = 8, className },\n _ref,\n ) {\n const [open, setOpen] = useState(false);\n const anchorRef = useRef<HTMLElement>(null);\n const floatingRef = useRef<HTMLDivElement>(null);\n const timeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n const position = useFloatingPosition(anchorRef, floatingRef, {\n placement,\n offset,\n enabled: open,\n });\n\n const show = useCallback(() => {\n timeoutRef.current = setTimeout(() => setOpen(true), delay);\n }, [delay]);\n\n const hide = useCallback(() => {\n clearTimeout(timeoutRef.current);\n setOpen(false);\n }, []);\n\n const trigger = cloneElement(children as ReactElement<Record<string, unknown>>, {\n ref: anchorRef,\n onMouseEnter: show,\n onMouseLeave: hide,\n onFocus: show,\n onBlur: hide,\n });\n\n return (\n <>\n {trigger}\n {open && (\n <Portal>\n <div\n ref={floatingRef}\n data-react-fancy-tooltip=\"\"\n role=\"tooltip\"\n className={cn(\n \"fancy-fade-in pointer-events-none fixed z-50 max-w-xs rounded-lg bg-zinc-900 px-3 py-1.5 text-sm text-white shadow-lg dark:bg-zinc-700 dark:text-zinc-100\",\n className,\n )}\n style={{ left: position.x, top: position.y }}\n >\n {content}\n <div\n className={cn(\n // `bg-inherit`, not a colour of its own: a `className` that\n // restyles the bubble would otherwise leave a dark arrow\n // pointing out of a light one.\n \"absolute h-2 w-2 rotate-45 bg-inherit\",\n position.placement.startsWith(\"top\") &&\n \"bottom-[-4px] left-1/2 -translate-x-1/2\",\n position.placement.startsWith(\"bottom\") &&\n \"top-[-4px] left-1/2 -translate-x-1/2\",\n position.placement.startsWith(\"left\") &&\n \"right-[-4px] top-1/2 -translate-y-1/2\",\n position.placement.startsWith(\"right\") &&\n \"left-[-4px] top-1/2 -translate-y-1/2\",\n )}\n />\n </div>\n </Portal>\n )}\n </>\n );\n },\n);\n\nTooltip.displayName = \"Tooltip\";\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/inputs/MultiSwitch/MultiSwitch.tsx"],"names":["useId","resolveOption","useFieldMode","useInlineEdit","useControllableState","useRef","useState","useCallback","useEffect","DisplayValue","jsxs","cn","jsx","Field"],"mappings":"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","file":"chunk-YVTFODCJ.cjs","sourcesContent":["import { useRef, useState, useEffect, useCallback, useId } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { useControllableState } from \"../../../hooks/use-controllable-state\";\nimport { Field } from \"../Field\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { DisplayValue } from \"../mode/DisplayValue\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport { resolveOption } from \"../inputs.utils\";\nimport type { Size } from \"../../../utils/types\";\nimport type { MultiSwitchProps } from \"./MultiSwitch.types\";\n\nconst sizeClasses: Record<Size, string> = {\n xs: \"px-2 py-1 text-xs\",\n sm: \"px-2.5 py-1.5 text-sm\",\n md: \"px-3 py-2 text-sm\",\n lg: \"px-4 py-2.5 text-base\",\n xl: \"px-5 py-3 text-lg\",\n};\n\nexport function MultiSwitch<V = string>({\n size = \"md\",\n dirty,\n error,\n label,\n labelHidden,\n description,\n required,\n disabled,\n className,\n id,\n name,\n list,\n value: controlledValue,\n defaultValue,\n onValueChange,\n linear,\n mode,\n ...rest\n}: MultiSwitchProps<V>) {\n const reactId = useId();\n // A `<label for>` cannot name a div[role=\"radiogroup\"], so the group points at\n // the label instead. Needs an id the label and the group both agree on.\n const labelId = label ? `${id ?? reactId}-label` : undefined;\n\n const resolvedOptions = list.map(resolveOption);\n const fallback = defaultValue ?? resolvedOptions[0]?.value;\n const resolvedMode = useFieldMode(mode);\n const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n const [value, setValue] = useControllableState(controlledValue, fallback as V, onValueChange);\n\n const containerRef = useRef<HTMLDivElement>(null);\n const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n const [indicator, setIndicator] = useState<{ left: number; width: number } | null>(null);\n\n const selectedIndex = resolvedOptions.findIndex(\n (o) => o.value === value,\n );\n\n const updateIndicator = useCallback(() => {\n const container = containerRef.current;\n const activeItem = itemRefs.current[selectedIndex];\n if (!container || !activeItem) {\n setIndicator(null);\n return;\n }\n const containerRect = container.getBoundingClientRect();\n const itemRect = activeItem.getBoundingClientRect();\n setIndicator({\n left: itemRect.left - containerRect.left,\n width: itemRect.width,\n });\n }, [selectedIndex]);\n\n useEffect(() => {\n updateIndicator();\n }, [updateIndicator]);\n\n const control = !showControl ? (\n <DisplayValue size={size} interactive={interactive} onActivate={enterEdit}>\n {resolvedOptions.find((o) => o.value === value)?.label}\n </DisplayValue>\n ) : (\n <div\n ref={containerRef}\n {...rest}\n data-react-fancy-multi-switch=\"\"\n role=\"radiogroup\"\n id={id}\n aria-labelledby={labelId}\n onBlur={(e) => {\n if (interactive && !e.currentTarget.contains(e.relatedTarget as Node)) exitEdit();\n }}\n className={cn(\n \"relative inline-flex rounded-lg border border-[color:var(--fancy-border-strong,var(--color-zinc-300))] bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))]\",\n dirty && \"ring-2 ring-amber-400/50\",\n error && \"ring-2 ring-red-500/50\",\n disabled && \"opacity-50 cursor-not-allowed\",\n className,\n )}\n >\n {indicator && (\n <span\n className=\"absolute top-0 bottom-0 rounded-lg bg-blue-600 transition-all duration-200 ease-out\"\n style={{ left: indicator.left, width: indicator.width }}\n />\n )}\n {resolvedOptions.map((option, index) => {\n const isSelected = option.value === value;\n return (\n <button\n key={String(option.value)}\n ref={(el) => { itemRefs.current[index] = el; }}\n type=\"button\"\n role=\"radio\"\n aria-checked={isSelected}\n disabled={disabled || option.disabled}\n autoFocus={interactive && (selectedIndex === -1 ? index === 0 : isSelected)}\n onClick={() => {\n if (linear) {\n const nextIndex = (selectedIndex + 1) % resolvedOptions.length;\n setValue(resolvedOptions[nextIndex].value as V);\n } else {\n setValue(option.value as V);\n }\n }}\n className={cn(\n \"relative z-10 font-medium transition-colors duration-200\",\n sizeClasses[size],\n isSelected\n ? \"text-white\"\n : \"text-[color:var(--fancy-text-subtle,var(--color-zinc-600))] hover:text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-subtle-dark,var(--color-zinc-400))] dark:hover:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\",\n (disabled || option.disabled) && \"cursor-not-allowed\",\n )}\n >\n {option.label}\n </button>\n );\n })}\n {name && <input type=\"hidden\" name={name} value={String(value)} />}\n </div>\n );\n\n if (label || error || description) {\n return (\n <Field\n label={label}\n labelHidden={labelHidden}\n labelId={labelId}\n description={description}\n error={error}\n required={required}\n htmlFor={id}\n size={size}\n >\n {control}\n </Field>\n );\n }\n\n return control;\n}\n\nMultiSwitch.displayName = \"MultiSwitch\";\n"]}