@pittorica/checkbox-group-react 0.24.0 → 0.26.0

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 (10) hide show
  1. package/dist/CheckboxGroup.d.ts +20 -6
  2. package/dist/CheckboxGroup.d.ts.map +1 -1
  3. package/dist/index.d.ts +1 -2
  4. package/dist/index.d.ts.map +1 -1
  5. package/dist/index.js +321 -326
  6. package/package.json +10 -10
  7. package/dist/CheckboxGroup.stories.d.ts +0 -7
  8. package/dist/CheckboxGroup.stories.d.ts.map +0 -1
  9. package/dist/CheckboxGroup.test.d.ts +0 -5
  10. package/dist/CheckboxGroup.test.d.ts.map +0 -1
package/dist/CheckboxGroup.d.ts CHANGED
@@ -1,7 +1,11 @@
1
+ import { type ElementType } from 'react';
1
2
  import { type BoxProps } from '@pittorica/box-react';
2
3
  import { type CheckboxProps } from '@pittorica/checkbox-react';
3
4
  import type { PittoricaColor } from '@pittorica/text-react';
4
- export interface CheckboxGroupRootProps extends Omit<BoxProps, 'onChange'> {
5
+ /**
6
+ * Fix TS2314: Use 'type' for intersection with polymorphic BoxProps<E>.
7
+ */
8
+ export type CheckboxGroupRootProps<E extends ElementType = 'div'> = Omit<BoxProps<E>, 'onChange' | 'value' | 'defaultValue'> & {
5
9
  value?: string[];
6
10
  defaultValue?: string[];
7
11
  onValueChange?: (value: string[]) => void;
@@ -9,11 +13,21 @@ export interface CheckboxGroupRootProps extends Omit<BoxProps, 'onChange'> {
9
13
  color?: PittoricaColor;
10
14
  disabled?: boolean;
11
15
  name?: string;
12
- }
13
- export interface CheckboxGroupItemProps extends Omit<CheckboxProps, 'value'> {
16
+ required?: boolean;
17
+ };
18
+ /**
19
+ * Fix TS2314: Extend CheckboxProps with generic E.
20
+ */
21
+ export type CheckboxGroupItemProps<E extends ElementType = 'label'> = Omit<CheckboxProps<E>, 'value'> & {
14
22
  value: string;
15
- }
16
- export declare const CheckboxGroup: (({ value: controlledValue, defaultValue, onValueChange, orientation, color, disabled, name, children, className, ...props }: CheckboxGroupRootProps) => import("react/jsx-runtime").JSX.Element) & {
17
- Item: ({ value, ...props }: CheckboxGroupItemProps) => import("react/jsx-runtime").JSX.Element;
23
+ };
24
+ export declare const CheckboxGroup: {
25
+ <E extends ElementType = "div">({ value: controlledValue, defaultValue, onValueChange, orientation, color, disabled, name, required, children, className, as, ...props }: CheckboxGroupRootProps<E>): import("react/jsx-runtime").JSX.Element;
26
+ displayName: string;
27
+ } & {
28
+ Item: {
29
+ <E extends ElementType = "label">({ value, as, ...props }: CheckboxGroupItemProps<E>): import("react/jsx-runtime").JSX.Element;
30
+ displayName: string;
31
+ };
18
32
  };
19
33
  //# sourceMappingURL=CheckboxGroup.d.ts.map
package/dist/CheckboxGroup.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["../src/CheckboxGroup.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAc5D,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC;IACxE,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAmDD,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAC;CACf;AAwBD,eAAO,MAAM,aAAa,gIAhEvB,sBAAsB;gCA0CuB,sBAAsB;CAwBpE,CAAC"}
1
+ {"version":3,"file":"CheckboxGroup.d.ts","sourceRoot":"","sources":["../src/CheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,WAAW,EAA0B,MAAM,OAAO,CAAC;AAIhF,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,2BAA2B,CAAC;AACzE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAiB5D;;GAEG;AACH,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,WAAW,GAAG,KAAK,IAAI,IAAI,CACtE,QAAQ,CAAC,CAAC,CAAC,EACX,UAAU,GAAG,OAAO,GAAG,cAAc,CACtC,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AA8DF;;GAEG;AACH,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,WAAW,GAAG,OAAO,IAAI,IAAI,CACxE,aAAa,CAAC,CAAC,CAAC,EAChB,OAAO,CACR,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAgCF,eAAO,MAAM,aAAa;KApGC,CAAC,SAAS,WAAW,oJAa7C,sBAAsB,CAAC,CAAC,CAAC;;;;SAyDD,CAAC,SAAS,WAAW,qCAI7C,sBAAsB,CAAC,CAAC,CAAC;;;CA4B1B,CAAC"}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,2 @@
1
- export type { CheckboxGroupItemProps, CheckboxGroupRootProps, } from './CheckboxGroup.js';
2
- export { CheckboxGroup } from './CheckboxGroup.js';
1
+ export * from './CheckboxGroup.js';
3
2
  //# sourceMappingURL=index.d.ts.map
package/dist/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,sBAAsB,EACtB,sBAAsB,GACvB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}
package/dist/index.js CHANGED
@@ -1,96 +1,88 @@
1
- import { jsx as b, jsxs as _ } from "react/jsx-runtime";
2
- import D, { forwardRef as H, createElement as R, createContext as J, useState as K, use as P } from "react";
3
- function L(r) {
4
- var a, e, t = "";
5
- if (typeof r == "string" || typeof r == "number") t += r;
6
- else if (typeof r == "object") if (Array.isArray(r)) {
7
- var o = r.length;
8
- for (a = 0; a < o; a++) r[a] && (e = L(r[a])) && (t && (t += " "), t += e);
9
- } else for (e in r) r[e] && (t && (t += " "), t += e);
1
+ import { jsx as b, jsxs as z } from "react/jsx-runtime";
2
+ import Q, { forwardRef as U, createElement as B, createContext as D, useState as X, useMemo as Y, use as Z } from "react";
3
+ function L(a) {
4
+ var i, r, t = "";
5
+ if (typeof a == "string" || typeof a == "number") t += a;
6
+ else if (typeof a == "object") if (Array.isArray(a)) {
7
+ var o = a.length;
8
+ for (i = 0; i < o; i++) a[i] && (r = L(a[i])) && (t && (t += " "), t += r);
9
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
10
10
  return t;
11
11
  }
12
- function Q() {
13
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = L(r)) && (t && (t += " "), t += a);
12
+ function V() {
13
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = L(a)) && (t && (t += " "), t += i);
14
14
  return t;
15
15
  }
16
- function I(r) {
17
- var a, e, t = "";
18
- if (typeof r == "string" || typeof r == "number") t += r;
19
- else if (typeof r == "object") if (Array.isArray(r)) {
20
- var o = r.length;
21
- for (a = 0; a < o; a++) r[a] && (e = I(r[a])) && (t && (t += " "), t += e);
22
- } else for (e in r) r[e] && (t && (t += " "), t += e);
16
+ function j(a) {
17
+ var i, r, t = "";
18
+ if (typeof a == "string" || typeof a == "number") t += a;
19
+ else if (typeof a == "object") if (Array.isArray(a)) {
20
+ var o = a.length;
21
+ for (i = 0; i < o; i++) a[i] && (r = j(a[i])) && (t && (t += " "), t += r);
22
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
23
23
  return t;
24
24
  }
25
- function U() {
26
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = I(r)) && (t && (t += " "), t += a);
25
+ function tt() {
26
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = j(a)) && (t && (t += " "), t += i);
27
27
  return t;
28
28
  }
29
- const W = ({
30
- ref: r,
31
- as: a = "div",
32
- children: e,
33
- display: t,
34
- m: o,
35
- mt: n,
36
- mr: l,
37
- mb: h,
38
- ml: p,
39
- p: m,
40
- pt: c,
41
- pr: g,
42
- pb: d,
43
- pl: s,
44
- width: u,
45
- height: f,
46
- position: v,
47
- style: y,
48
- className: x,
49
- href: $,
50
- target: k,
51
- rel: w,
52
- htmlFor: N,
53
- type: C,
54
- name: A,
55
- disabled: j,
56
- ...B
29
+ const G = ({
30
+ as: a,
31
+ children: i,
32
+ display: r,
33
+ m: t,
34
+ mt: o,
35
+ mr: p,
36
+ mb: c,
37
+ ml: g,
38
+ mx: n,
39
+ my: l,
40
+ p: d,
41
+ pt: h,
42
+ pr: u,
43
+ pb: v,
44
+ pl: m,
45
+ px: s,
46
+ py: f,
47
+ width: $,
48
+ height: x,
49
+ position: y,
50
+ style: k,
51
+ className: w,
52
+ disabled: N,
53
+ required: C,
54
+ ...T
57
55
  }) => {
58
- const i = {};
59
- t && (i.display = t), u && (i.width = u), f && (i.height = f), v && (i.position = v), o && (i.margin = `var(--pittorica-space-${o})`), n && (i.marginTop = `var(--pittorica-space-${n})`), l && (i.marginRight = `var(--pittorica-space-${l})`), h && (i.marginBottom = `var(--pittorica-space-${h})`), p && (i.marginLeft = `var(--pittorica-space-${p})`), m && (i.padding = `var(--pittorica-space-${m})`), c && (i.paddingTop = `var(--pittorica-space-${c})`), g && (i.paddingRight = `var(--pittorica-space-${g})`), d && (i.paddingBottom = `var(--pittorica-space-${d})`), s && (i.paddingLeft = `var(--pittorica-space-${s})`);
60
- const F = {
61
- ...y,
62
- ...i
56
+ const q = a || "div", e = {};
57
+ r && (e.display = r), $ && (e.width = $), x && (e.height = x), y && (e.position = y), t && (e.margin = `var(--pittorica-space-${t})`), o && (e.marginTop = `var(--pittorica-space-${o})`), p && (e.marginRight = `var(--pittorica-space-${p})`), c && (e.marginBottom = `var(--pittorica-space-${c})`), g && (e.marginLeft = `var(--pittorica-space-${g})`), n && (e.marginLeft = `var(--pittorica-space-${n})`, e.marginRight = `var(--pittorica-space-${n})`), l && (e.marginTop = `var(--pittorica-space-${l})`, e.marginBottom = `var(--pittorica-space-${l})`), d && (e.padding = `var(--pittorica-space-${d})`), h && (e.paddingTop = `var(--pittorica-space-${h})`), u && (e.paddingRight = `var(--pittorica-space-${u})`), v && (e.paddingBottom = `var(--pittorica-space-${v})`), m && (e.paddingLeft = `var(--pittorica-space-${m})`), s && (e.paddingLeft = `var(--pittorica-space-${s})`, e.paddingRight = `var(--pittorica-space-${s})`), f && (e.paddingTop = `var(--pittorica-space-${f})`, e.paddingBottom = `var(--pittorica-space-${f})`);
58
+ const R = {
59
+ ...k,
60
+ ...e
63
61
  };
64
62
  return /* @__PURE__ */ b(
65
- a,
63
+ q,
66
64
  {
67
- ref: r,
68
- className: U("pittorica-box", x),
69
- style: F,
70
- href: $,
71
- target: k,
72
- rel: w,
73
- htmlFor: N,
74
- type: C,
75
- name: A,
76
- disabled: j,
77
- ...B,
78
- children: e
65
+ className: tt("pittorica-box", w),
66
+ style: R,
67
+ disabled: N,
68
+ required: C,
69
+ ...T,
70
+ children: i
79
71
  }
80
72
  );
81
73
  };
82
- W.displayName = "Box";
83
- function q(r) {
84
- var a, e, t = "";
85
- if (typeof r == "string" || typeof r == "number") t += r;
86
- else if (typeof r == "object") if (Array.isArray(r)) {
87
- var o = r.length;
88
- for (a = 0; a < o; a++) r[a] && (e = q(r[a])) && (t && (t += " "), t += e);
89
- } else for (e in r) r[e] && (t && (t += " "), t += e);
74
+ G.displayName = "Box";
75
+ function I(a) {
76
+ var i, r, t = "";
77
+ if (typeof a == "string" || typeof a == "number") t += a;
78
+ else if (typeof a == "object") if (Array.isArray(a)) {
79
+ var o = a.length;
80
+ for (i = 0; i < o; i++) a[i] && (r = I(a[i])) && (t && (t += " "), t += r);
81
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
90
82
  return t;
91
83
  }
92
- function Z() {
93
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = q(r)) && (t && (t += " "), t += a);
84
+ function at() {
85
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = I(a)) && (t && (t += " "), t += i);
94
86
  return t;
95
87
  }
96
88
  /**
@@ -99,7 +91,7 @@ function Z() {
99
91
  * This source code is licensed under the MIT license.
100
92
  * See the LICENSE file in the root directory of this source tree.
101
93
  */
102
- var X = {
94
+ var rt = {
103
95
  outline: {
104
96
  xmlns: "http://www.w3.org/2000/svg",
105
97
  width: 24,
@@ -126,32 +118,32 @@ var X = {
126
118
  * This source code is licensed under the MIT license.
127
119
  * See the LICENSE file in the root directory of this source tree.
128
120
  */
129
- const G = (r, a, e, t) => {
130
- const o = H(
131
- ({ color: n = "currentColor", size: l = 24, stroke: h = 2, title: p, className: m, children: c, ...g }, d) => R(
121
+ const W = (a, i, r, t) => {
122
+ const o = U(
123
+ ({ color: p = "currentColor", size: c = 24, stroke: g = 2, title: n, className: l, children: d, ...h }, u) => B(
132
124
  "svg",
133
125
  {
134
- ref: d,
135
- ...X[r],
136
- width: l,
137
- height: l,
138
- className: ["tabler-icon", `tabler-icon-${a}`, m].join(" "),
139
- ...r === "filled" ? {
140
- fill: n
126
+ ref: u,
127
+ ...rt[a],
128
+ width: c,
129
+ height: c,
130
+ className: ["tabler-icon", `tabler-icon-${i}`, l].join(" "),
131
+ ...a === "filled" ? {
132
+ fill: p
141
133
  } : {
142
- strokeWidth: h,
143
- stroke: n
134
+ strokeWidth: g,
135
+ stroke: p
144
136
  },
145
- ...g
137
+ ...h
146
138
  },
147
139
  [
148
- p && R("title", { key: "svg-title" }, p),
149
- ...t.map(([s, u]) => R(s, u)),
150
- ...Array.isArray(c) ? c : [c]
140
+ n && B("title", { key: "svg-title" }, n),
141
+ ...t.map(([v, m]) => B(v, m)),
142
+ ...Array.isArray(d) ? d : [d]
151
143
  ]
152
144
  )
153
145
  );
154
- return o.displayName = `${e}`, o;
146
+ return o.displayName = `${r}`, o;
155
147
  };
156
148
  /**
157
149
  * @license @tabler/icons-react v3.36.1 - MIT
@@ -159,178 +151,158 @@ const G = (r, a, e, t) => {
159
151
  * This source code is licensed under the MIT license.
160
152
  * See the LICENSE file in the root directory of this source tree.
161
153
  */
162
- const Y = [["path", { d: "M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14", key: "svg-0" }]], V = G("outline", "square", "Square", Y);
154
+ const et = [["path", { d: "M3 5a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v14a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-14", key: "svg-0" }]], it = W("outline", "square", "Square", et);
163
155
  /**
164
156
  * @license @tabler/icons-react v3.36.1 - MIT
165
157
  *
166
158
  * This source code is licensed under the MIT license.
167
159
  * See the LICENSE file in the root directory of this source tree.
168
160
  */
169
- const tt = [["path", { d: "M18.333 2c1.96 0 3.56 1.537 3.662 3.472l.005 .195v12.666c0 1.96 -1.537 3.56 -3.472 3.662l-.195 .005h-12.666a3.667 3.667 0 0 1 -3.662 -3.472l-.005 -.195v-12.666c0 -1.96 1.537 -3.56 3.472 -3.662l.195 -.005h12.666zm-2.626 7.293a1 1 0 0 0 -1.414 0l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.32 1.497l2 2l.094 .083a1 1 0 0 0 1.32 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z", key: "svg-0" }]], rt = G("filled", "square-check-filled", "SquareCheckFilled", tt);
170
- function T(r) {
171
- var a, e, t = "";
172
- if (typeof r == "string" || typeof r == "number") t += r;
173
- else if (typeof r == "object") if (Array.isArray(r)) {
174
- var o = r.length;
175
- for (a = 0; a < o; a++) r[a] && (e = T(r[a])) && (t && (t += " "), t += e);
176
- } else for (e in r) r[e] && (t && (t += " "), t += e);
161
+ const ot = [["path", { d: "M18.333 2c1.96 0 3.56 1.537 3.662 3.472l.005 .195v12.666c0 1.96 -1.537 3.56 -3.472 3.662l-.195 .005h-12.666a3.667 3.667 0 0 1 -3.662 -3.472l-.005 -.195v-12.666c0 -1.96 1.537 -3.56 3.472 -3.662l.195 -.005h12.666zm-2.626 7.293a1 1 0 0 0 -1.414 0l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.32 1.497l2 2l.094 .083a1 1 0 0 0 1.32 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z", key: "svg-0" }]], ct = W("filled", "square-check-filled", "SquareCheckFilled", ot);
162
+ function S(a) {
163
+ var i, r, t = "";
164
+ if (typeof a == "string" || typeof a == "number") t += a;
165
+ else if (typeof a == "object") if (Array.isArray(a)) {
166
+ var o = a.length;
167
+ for (i = 0; i < o; i++) a[i] && (r = S(a[i])) && (t && (t += " "), t += r);
168
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
177
169
  return t;
178
170
  }
179
- function et() {
180
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = T(r)) && (t && (t += " "), t += a);
171
+ function st() {
172
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = S(a)) && (t && (t += " "), t += i);
181
173
  return t;
182
174
  }
183
- const z = ({
184
- ref: r,
185
- as: a = "div",
186
- children: e,
187
- display: t,
188
- m: o,
189
- mt: n,
190
- mr: l,
191
- mb: h,
192
- ml: p,
193
- p: m,
194
- pt: c,
195
- pr: g,
196
- pb: d,
197
- pl: s,
198
- width: u,
199
- height: f,
200
- position: v,
201
- style: y,
202
- className: x,
203
- href: $,
204
- target: k,
205
- rel: w,
206
- htmlFor: N,
207
- type: C,
208
- name: A,
209
- disabled: j,
210
- ...B
175
+ const M = ({
176
+ as: a,
177
+ children: i,
178
+ display: r,
179
+ m: t,
180
+ mt: o,
181
+ mr: p,
182
+ mb: c,
183
+ ml: g,
184
+ mx: n,
185
+ my: l,
186
+ p: d,
187
+ pt: h,
188
+ pr: u,
189
+ pb: v,
190
+ pl: m,
191
+ px: s,
192
+ py: f,
193
+ width: $,
194
+ height: x,
195
+ position: y,
196
+ style: k,
197
+ className: w,
198
+ disabled: N,
199
+ required: C,
200
+ ...T
211
201
  }) => {
212
- const i = {};
213
- t && (i.display = t), u && (i.width = u), f && (i.height = f), v && (i.position = v), o && (i.margin = `var(--pittorica-space-${o})`), n && (i.marginTop = `var(--pittorica-space-${n})`), l && (i.marginRight = `var(--pittorica-space-${l})`), h && (i.marginBottom = `var(--pittorica-space-${h})`), p && (i.marginLeft = `var(--pittorica-space-${p})`), m && (i.padding = `var(--pittorica-space-${m})`), c && (i.paddingTop = `var(--pittorica-space-${c})`), g && (i.paddingRight = `var(--pittorica-space-${g})`), d && (i.paddingBottom = `var(--pittorica-space-${d})`), s && (i.paddingLeft = `var(--pittorica-space-${s})`);
214
- const F = {
215
- ...y,
216
- ...i
202
+ const q = a || "div", e = {};
203
+ r && (e.display = r), $ && (e.width = $), x && (e.height = x), y && (e.position = y), t && (e.margin = `var(--pittorica-space-${t})`), o && (e.marginTop = `var(--pittorica-space-${o})`), p && (e.marginRight = `var(--pittorica-space-${p})`), c && (e.marginBottom = `var(--pittorica-space-${c})`), g && (e.marginLeft = `var(--pittorica-space-${g})`), n && (e.marginLeft = `var(--pittorica-space-${n})`, e.marginRight = `var(--pittorica-space-${n})`), l && (e.marginTop = `var(--pittorica-space-${l})`, e.marginBottom = `var(--pittorica-space-${l})`), d && (e.padding = `var(--pittorica-space-${d})`), h && (e.paddingTop = `var(--pittorica-space-${h})`), u && (e.paddingRight = `var(--pittorica-space-${u})`), v && (e.paddingBottom = `var(--pittorica-space-${v})`), m && (e.paddingLeft = `var(--pittorica-space-${m})`), s && (e.paddingLeft = `var(--pittorica-space-${s})`, e.paddingRight = `var(--pittorica-space-${s})`), f && (e.paddingTop = `var(--pittorica-space-${f})`, e.paddingBottom = `var(--pittorica-space-${f})`);
204
+ const R = {
205
+ ...k,
206
+ ...e
217
207
  };
218
208
  return /* @__PURE__ */ b(
219
- a,
209
+ q,
220
210
  {
221
- ref: r,
222
- className: et("pittorica-box", x),
223
- style: F,
224
- href: $,
225
- target: k,
226
- rel: w,
227
- htmlFor: N,
228
- type: C,
229
- name: A,
230
- disabled: j,
231
- ...B,
232
- children: e
211
+ className: st("pittorica-box", w),
212
+ style: R,
213
+ disabled: N,
214
+ required: C,
215
+ ...T,
216
+ children: i
233
217
  }
234
218
  );
235
219
  };
236
- z.displayName = "Box";
237
- function S(r) {
238
- var a, e, t = "";
239
- if (typeof r == "string" || typeof r == "number") t += r;
240
- else if (typeof r == "object") if (Array.isArray(r)) {
241
- var o = r.length;
242
- for (a = 0; a < o; a++) r[a] && (e = S(r[a])) && (t && (t += " "), t += e);
243
- } else for (e in r) r[e] && (t && (t += " "), t += e);
220
+ M.displayName = "Box";
221
+ function E(a) {
222
+ var i, r, t = "";
223
+ if (typeof a == "string" || typeof a == "number") t += a;
224
+ else if (typeof a == "object") if (Array.isArray(a)) {
225
+ var o = a.length;
226
+ for (i = 0; i < o; i++) a[i] && (r = E(a[i])) && (t && (t += " "), t += r);
227
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
244
228
  return t;
245
229
  }
246
- function at() {
247
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = S(r)) && (t && (t += " "), t += a);
230
+ function A() {
231
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = E(a)) && (t && (t += " "), t += i);
248
232
  return t;
249
233
  }
250
- function M(r) {
251
- var a, e, t = "";
252
- if (typeof r == "string" || typeof r == "number") t += r;
253
- else if (typeof r == "object") if (Array.isArray(r)) {
254
- var o = r.length;
255
- for (a = 0; a < o; a++) r[a] && (e = M(r[a])) && (t && (t += " "), t += e);
256
- } else for (e in r) r[e] && (t && (t += " "), t += e);
234
+ function F(a) {
235
+ var i, r, t = "";
236
+ if (typeof a == "string" || typeof a == "number") t += a;
237
+ else if (typeof a == "object") if (Array.isArray(a)) {
238
+ var o = a.length;
239
+ for (i = 0; i < o; i++) a[i] && (r = F(a[i])) && (t && (t += " "), t += r);
240
+ } else for (r in a) a[r] && (t && (t += " "), t += r);
257
241
  return t;
258
242
  }
259
- function it() {
260
- for (var r, a, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (a = M(r)) && (t && (t += " "), t += a);
243
+ function nt() {
244
+ for (var a, i, r = 0, t = "", o = arguments.length; r < o; r++) (a = arguments[r]) && (i = F(a)) && (t && (t += " "), t += i);
261
245
  return t;
262
246
  }
263
- const E = ({
264
- ref: r,
265
- as: a = "div",
266
- children: e,
267
- display: t,
268
- m: o,
269
- mt: n,
270
- mr: l,
271
- mb: h,
272
- ml: p,
273
- p: m,
274
- pt: c,
275
- pr: g,
276
- pb: d,
277
- pl: s,
278
- width: u,
279
- height: f,
280
- position: v,
281
- style: y,
282
- className: x,
283
- href: $,
284
- target: k,
285
- rel: w,
286
- htmlFor: N,
287
- type: C,
288
- name: A,
289
- disabled: j,
290
- ...B
247
+ const O = ({
248
+ as: a,
249
+ children: i,
250
+ display: r,
251
+ m: t,
252
+ mt: o,
253
+ mr: p,
254
+ mb: c,
255
+ ml: g,
256
+ mx: n,
257
+ my: l,
258
+ p: d,
259
+ pt: h,
260
+ pr: u,
261
+ pb: v,
262
+ pl: m,
263
+ px: s,
264
+ py: f,
265
+ width: $,
266
+ height: x,
267
+ position: y,
268
+ style: k,
269
+ className: w,
270
+ disabled: N,
271
+ required: C,
272
+ ...T
291
273
  }) => {
292
- const i = {};
293
- t && (i.display = t), u && (i.width = u), f && (i.height = f), v && (i.position = v), o && (i.margin = `var(--pittorica-space-${o})`), n && (i.marginTop = `var(--pittorica-space-${n})`), l && (i.marginRight = `var(--pittorica-space-${l})`), h && (i.marginBottom = `var(--pittorica-space-${h})`), p && (i.marginLeft = `var(--pittorica-space-${p})`), m && (i.padding = `var(--pittorica-space-${m})`), c && (i.paddingTop = `var(--pittorica-space-${c})`), g && (i.paddingRight = `var(--pittorica-space-${g})`), d && (i.paddingBottom = `var(--pittorica-space-${d})`), s && (i.paddingLeft = `var(--pittorica-space-${s})`);
294
- const F = {
295
- ...y,
296
- ...i
274
+ const q = a || "div", e = {};
275
+ r && (e.display = r), $ && (e.width = $), x && (e.height = x), y && (e.position = y), t && (e.margin = `var(--pittorica-space-${t})`), o && (e.marginTop = `var(--pittorica-space-${o})`), p && (e.marginRight = `var(--pittorica-space-${p})`), c && (e.marginBottom = `var(--pittorica-space-${c})`), g && (e.marginLeft = `var(--pittorica-space-${g})`), n && (e.marginLeft = `var(--pittorica-space-${n})`, e.marginRight = `var(--pittorica-space-${n})`), l && (e.marginTop = `var(--pittorica-space-${l})`, e.marginBottom = `var(--pittorica-space-${l})`), d && (e.padding = `var(--pittorica-space-${d})`), h && (e.paddingTop = `var(--pittorica-space-${h})`), u && (e.paddingRight = `var(--pittorica-space-${u})`), v && (e.paddingBottom = `var(--pittorica-space-${v})`), m && (e.paddingLeft = `var(--pittorica-space-${m})`), s && (e.paddingLeft = `var(--pittorica-space-${s})`, e.paddingRight = `var(--pittorica-space-${s})`), f && (e.paddingTop = `var(--pittorica-space-${f})`, e.paddingBottom = `var(--pittorica-space-${f})`);
276
+ const R = {
277
+ ...k,
278
+ ...e
297
279
  };
298
280
  return /* @__PURE__ */ b(
299
- a,
281
+ q,
300
282
  {
301
- ref: r,
302
- className: it("pittorica-box", x),
303
- style: F,
304
- href: $,
305
- target: k,
306
- rel: w,
307
- htmlFor: N,
308
- type: C,
309
- name: A,
310
- disabled: j,
311
- ...B,
312
- children: e
283
+ className: nt("pittorica-box", w),
284
+ style: R,
285
+ disabled: N,
286
+ required: C,
287
+ ...T,
288
+ children: i
313
289
  }
314
290
  );
315
291
  };
316
- E.displayName = "Box";
317
- const ot = ({
318
- children: r,
319
- as: a = "span",
320
- weight: e = "regular",
321
- align: t,
322
- truncate: o = !1,
323
- color: n,
324
- className: l,
325
- style: h,
326
- href: p,
327
- target: m,
328
- rel: c,
329
- htmlFor: g,
330
- name: d,
331
- ...s
292
+ O.displayName = "Box";
293
+ const _ = ({
294
+ children: a,
295
+ as: i,
296
+ size: r,
297
+ weight: t = "regular",
298
+ align: o,
299
+ truncate: p = !1,
300
+ color: c,
301
+ className: g,
302
+ style: n,
303
+ ...l
332
304
  }) => {
333
- const u = (n == null ? void 0 : n.startsWith("#")) || (n == null ? void 0 : n.startsWith("rgb")) || (n == null ? void 0 : n.startsWith("hsl")), f = /* @__PURE__ */ new Set([
305
+ const d = i || "span", h = (c == null ? void 0 : c.startsWith("#")) || (c == null ? void 0 : c.startsWith("rgb")) || (c == null ? void 0 : c.startsWith("hsl")), u = /* @__PURE__ */ new Set([
334
306
  "danger",
335
307
  "success",
336
308
  "error",
@@ -343,140 +315,163 @@ const ot = ({
343
315
  "blue",
344
316
  "red"
345
317
  ]), v = (() => {
346
- if (n)
347
- return n === "inherit" ? "inherit" : u ? n : f.has(n) ? `var(--pittorica-${n}-9)` : n;
348
- })(), y = {
349
- ...h,
350
- textAlign: t,
318
+ if (c)
319
+ return c === "inherit" ? "inherit" : h ? c : u.has(c) ? `var(--pittorica-${c}-9)` : c;
320
+ })(), m = r ? typeof r == "string" ? `pittorica-text--size-${r}` : A({
321
+ [`pittorica-text--size-${r.initial}`]: r.initial,
322
+ [`pittorica-text--xs-size-${r.xs}`]: r.xs,
323
+ [`pittorica-text--sm-size-${r.sm}`]: r.sm,
324
+ [`pittorica-text--md-size-${r.md}`]: r.md,
325
+ [`pittorica-text--lg-size-${r.lg}`]: r.lg,
326
+ [`pittorica-text--xl-size-${r.xl}`]: r.xl
327
+ }) : null, s = {
328
+ ...n,
329
+ textAlign: o,
351
330
  color: v
352
331
  };
353
332
  return /* @__PURE__ */ b(
354
- E,
333
+ O,
355
334
  {
356
- as: a,
357
- className: at(
335
+ as: d,
336
+ className: A(
358
337
  "pittorica-text",
359
- { "pittorica-text--truncate": o },
360
- l
338
+ m,
339
+ { "pittorica-text--truncate": p },
340
+ g
361
341
  ),
362
- "data-weight": e,
363
- style: y,
364
- href: p,
365
- target: m,
366
- rel: c,
367
- htmlFor: g,
368
- name: d,
369
- ...s,
370
- children: r
342
+ "data-weight": t,
343
+ style: s,
344
+ ...l,
345
+ children: a
371
346
  }
372
347
  );
373
- }, nt = ({
374
- checked: r,
375
- defaultChecked: a,
376
- onChange: e,
377
- color: t = "indigo",
348
+ };
349
+ _.displayName = "Text";
350
+ const H = ({
351
+ checked: a,
352
+ defaultChecked: i,
353
+ onChange: r,
354
+ color: t = "source",
378
355
  disabled: o = !1,
379
- label: n,
380
- name: l,
381
- value: h,
382
- className: p,
383
- style: m,
384
- ...c
356
+ label: p,
357
+ name: c,
358
+ value: g,
359
+ className: n,
360
+ style: l,
361
+ required: d = !1,
362
+ as: h,
363
+ ...u
385
364
  }) => {
386
- const [g, d] = D.useState(
387
- a ?? !1
388
- ), s = r === void 0 ? g : r, u = t !== "inherit" && !(t != null && t.startsWith("#")) && !(t != null && t.startsWith("rgb")) ? `var(--pittorica-${t}-9)` : t, f = (v) => {
365
+ const [v, m] = Q.useState(
366
+ i ?? !1
367
+ ), s = a === void 0 ? v : a, f = t !== "inherit" && !(t != null && t.startsWith("#")) && !(t != null && t.startsWith("rgb")) ? `var(--pittorica-${t}-9)` : t, $ = (x) => {
389
368
  if (o) return;
390
- const y = v.target.checked;
391
- d(y), e == null || e(y);
369
+ const y = x.target.checked;
370
+ m(y), r == null || r(y);
392
371
  };
393
- return /* @__PURE__ */ _(
394
- z,
372
+ return /* @__PURE__ */ z(
373
+ M,
395
374
  {
396
- as: "label",
397
- className: Z("pittorica-checkbox-root", p),
375
+ as: h || "label",
376
+ className: at("pittorica-checkbox-root", n),
398
377
  "data-disabled": o,
399
- style: { "--_checkbox-color": u, ...m },
378
+ style: { "--_checkbox-color": f, ...l },
379
+ ...u,
400
380
  children: [
401
381
  /* @__PURE__ */ b(
402
382
  "input",
403
383
  {
404
384
  type: "checkbox",
405
385
  className: "pittorica-checkbox-input",
406
- name: l,
407
- value: h,
386
+ name: c,
387
+ value: g,
408
388
  checked: s,
409
389
  disabled: o,
410
- onChange: f,
411
- ...c
390
+ required: d,
391
+ onChange: $
412
392
  }
413
393
  ),
414
- /* @__PURE__ */ b("div", { className: "pittorica-checkbox-control", children: s ? /* @__PURE__ */ b(rt, { size: 20 }) : /* @__PURE__ */ b(V, { size: 20, stroke: 1.5 }) }),
415
- n && /* @__PURE__ */ b(ot, { weight: "medium", style: { color: "inherit" }, children: n })
394
+ /* @__PURE__ */ b("div", { className: "pittorica-checkbox-control", "aria-hidden": "true", children: s ? /* @__PURE__ */ b(ct, { size: 20 }) : /* @__PURE__ */ b(it, { size: 20, stroke: 1.5 }) }),
395
+ p && /* @__PURE__ */ z(_, { weight: "medium", style: { color: "inherit" }, children: [
396
+ p,
397
+ " ",
398
+ d && /* @__PURE__ */ b("span", { "aria-hidden": "true", children: "*" })
399
+ ] })
416
400
  ]
417
401
  }
418
402
  );
419
- }, O = J(
403
+ };
404
+ H.displayName = "Checkbox";
405
+ const J = D(
420
406
  null
421
- ), st = ({
422
- value: r,
423
- defaultValue: a = [],
424
- onValueChange: e,
407
+ ), K = ({
408
+ value: a,
409
+ defaultValue: i = [],
410
+ onValueChange: r,
425
411
  orientation: t = "vertical",
426
412
  color: o,
427
- disabled: n,
428
- name: l,
429
- children: h,
430
- className: p,
431
- ...m
413
+ disabled: p,
414
+ name: c,
415
+ required: g,
416
+ children: n,
417
+ className: l,
418
+ as: d,
419
+ ...h
432
420
  }) => {
433
- const [c, g] = K(a), d = r !== void 0, s = d ? r : c;
434
- return /* @__PURE__ */ b(
435
- O,
421
+ const [u, v] = X(i), m = a !== void 0, s = m ? a : u, f = (y) => {
422
+ const k = s.includes(y) ? s.filter((w) => w !== y) : [...s, y];
423
+ m || v(k), r == null || r(k);
424
+ }, $ = Y(
425
+ () => ({
426
+ value: s,
427
+ onItemChange: f,
428
+ color: o,
429
+ disabled: p,
430
+ name: c,
431
+ required: g
432
+ }),
433
+ [s, o, p, c, g]
434
+ );
435
+ return /* @__PURE__ */ b(J, { value: $, children: /* @__PURE__ */ b(
436
+ G,
436
437
  {
437
- value: {
438
- value: s,
439
- onItemChange: (f) => {
440
- const v = s.includes(f) ? s.filter((y) => y !== f) : [...s, f];
441
- d || g(v), e == null || e(v);
442
- },
443
- color: o,
444
- disabled: n,
445
- name: l
446
- },
447
- children: /* @__PURE__ */ b(
448
- W,
449
- {
450
- className: Q("pittorica-checkbox-group-root", p),
451
- "data-orientation": t,
452
- role: "group",
453
- ...m,
454
- children: h
455
- }
456
- )
438
+ as: d || "div",
439
+ className: V("pittorica-checkbox-group-root", l),
440
+ "data-orientation": t,
441
+ role: "group",
442
+ ...h,
443
+ children: n
457
444
  }
458
- );
459
- }, ct = ({ value: r, ...a }) => {
460
- const e = P(O);
461
- if (!e)
445
+ ) });
446
+ }, P = ({
447
+ value: a,
448
+ as: i,
449
+ ...r
450
+ }) => {
451
+ const t = Z(J);
452
+ if (!t)
462
453
  throw new Error(
463
454
  "CheckboxGroup.Item must be used within CheckboxGroup.Root"
464
455
  );
465
456
  return /* @__PURE__ */ b(
466
- nt,
457
+ H,
467
458
  {
468
- ...a,
469
- name: e.name,
470
- value: r,
471
- checked: e.value.includes(r),
472
- onChange: () => e.onItemChange(r),
473
- color: a.color || e.color,
474
- disabled: a.disabled || e.disabled
459
+ as: i || "label",
460
+ ...r,
461
+ name: t.name,
462
+ value: a,
463
+ checked: t.value.includes(a),
464
+ onChange: () => t.onItemChange(a),
465
+ color: r.color || t.color,
466
+ disabled: r.disabled || t.disabled,
467
+ required: r.required || t.required
475
468
  }
476
469
  );
477
- }, dt = Object.assign(st, {
478
- Item: ct
470
+ }, dt = Object.assign(K, {
471
+ Item: P
479
472
  });
473
+ K.displayName = "CheckboxGroup.Root";
474
+ P.displayName = "CheckboxGroup.Item";
480
475
  export {
481
476
  dt as CheckboxGroup
482
477
  };
package/package.json CHANGED
@@ -1,6 +1,7 @@
1
1
  {
2
2
  "name": "@pittorica/checkbox-group-react",
3
- "version": "0.24.0",
3
+ "version": "0.26.0",
4
+ "homepage": "https://pittorica.dcdavidev.me",
4
5
  "type": "module",
5
6
  "main": "./dist/index.js",
6
7
  "module": "./dist/index.js",
@@ -10,9 +11,9 @@
10
11
  ],
11
12
  "dependencies": {
12
13
  "clsx": "^2.1.1",
13
- "@pittorica/text-react": "0.24.0",
14
- "@pittorica/checkbox-react": "0.24.0",
15
- "@pittorica/box-react": "0.24.0"
14
+ "@pittorica/box-react": "0.26.0",
15
+ "@pittorica/checkbox-react": "0.26.0",
16
+ "@pittorica/text-react": "0.26.0"
16
17
  },
17
18
  "devDependencies": {
18
19
  "@testing-library/jest-dom": "^6.9.1",
@@ -22,10 +23,10 @@
22
23
  "@vitejs/plugin-react": "^4.0.0",
23
24
  "jsdom": "^22.0.0",
24
25
  "typescript": "^5.0.0",
25
- "vite": "^5.0.0",
26
- "vitest": "^2.1.9",
27
- "@pittorica/theme-react": "0.24.0",
28
- "pittorica": "0.24.0"
26
+ "vite": "^6.4.1",
27
+ "vitest": "^3.2.4",
28
+ "@pittorica/theme-react": "0.26.0",
29
+ "pittorica": "0.26.0"
29
30
  },
30
31
  "peerDependencies": {
31
32
  "react": ">=19",
@@ -35,8 +36,7 @@
35
36
  "build": "npm run clean && npm run build:js && npm run build:types",
36
37
  "build:js": "vite build",
37
38
  "build:types": "tsc -p tsconfig.json",
38
- "clean": "rm -rf dist",
39
- "dev": "vite",
39
+ "clean": "rm -rf dist *.tsbuildinfo",
40
40
  "test": "vitest run",
41
41
  "test:watch": "vitest"
42
42
  }
package/dist/CheckboxGroup.stories.d.ts DELETED
@@ -1,7 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import { CheckboxGroup } from './CheckboxGroup';
3
- declare const meta: Meta<typeof CheckboxGroup>;
4
- export default meta;
5
- export declare const Vertical: StoryObj<typeof CheckboxGroup>;
6
- export declare const Horizontal: StoryObj<typeof CheckboxGroup>;
7
- //# sourceMappingURL=CheckboxGroup.stories.d.ts.map
package/dist/CheckboxGroup.stories.d.ts.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"CheckboxGroup.stories.d.ts","sourceRoot":"","sources":["../src/CheckboxGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAIpC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,QAAQ,EAAE,QAAQ,CAAC,OAAO,aAAa,CAQnD,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAC,OAAO,aAAa,CASrD,CAAC"}
package/dist/CheckboxGroup.test.d.ts DELETED
@@ -1,5 +0,0 @@
1
- /**
2
- * @vitest-environment jsdom
3
- */
4
- import '@testing-library/jest-dom';
5
- //# sourceMappingURL=CheckboxGroup.test.d.ts.map
package/dist/CheckboxGroup.test.d.ts.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"CheckboxGroup.test.d.ts","sourceRoot":"","sources":["../src/CheckboxGroup.test.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,2BAA2B,CAAC"}