@pittorica/checkbox-group-react 0.22.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Davide Di Criscito
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,24 @@
+# @pittorica/checkbox-group-react
+
+The `CheckboxGroup` component.
+
+## Installation
+
+```bash
+npm install @pittorica/checkbox-group-react
+```
+
+## Usage
+
+```jsx
+import { CheckboxGroup } from '@pittorica/checkbox-group-react';
+// TODO: Add usage example
+```
+
+## License
+
+This project is licensed under the MIT License.
+
+**Copyright (c) 2025 Davide Di Criscito**
+
+For the full details, see the [LICENSE](LICENSE) file.

package/dist/CheckboxGroup.d.ts

@@ -0,0 +1,18 @@
+import { type BoxProps } from '@pittorica/box-react';
+import { type CheckboxProps } from '@pittorica/checkbox-react';
+import type { PittoricaColor } from '@pittorica/text-react';
+export interface CheckboxGroupRootProps extends Omit<BoxProps, 'onChange'> {
+    value?: string[];
+    defaultValue?: string[];
+    onValueChange?: (value: string[]) => void;
+    orientation?: 'horizontal' | 'vertical';
+    color?: PittoricaColor;
+    disabled?: boolean;
+}
+export interface CheckboxGroupItemProps extends Omit<CheckboxProps, 'value'> {
+    value: string;
+}
+export declare const CheckboxGroup: (({ value: controlledValue, defaultValue, onValueChange, orientation, color, disabled, children, className, ...props }: CheckboxGroupRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Item: ({ value, ...props }: CheckboxGroupItemProps) => import("react/jsx-runtime").JSX.Element;
+};
+//# sourceMappingURL=CheckboxGroup.d.ts.map

package/dist/CheckboxGroup.d.ts.map

@@ -0,0 +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;AAa5D,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;CACpB;AAiDD,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,aAAa,EAAE,OAAO,CAAC;IAC1E,KAAK,EAAE,MAAM,CAAC;CACf;AAsBD,eAAO,MAAM,aAAa,0HA7DvB,sBAAsB;gCAyCuB,sBAAsB;CAsBpE,CAAC"}

package/dist/CheckboxGroup.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { CheckboxGroup } from './CheckboxGroup';
+declare const meta: Meta<typeof CheckboxGroup>;
+export default meta;
+export declare const Vertical: StoryObj<typeof CheckboxGroup>;
+export declare const Horizontal: StoryObj<typeof CheckboxGroup>;
+//# sourceMappingURL=CheckboxGroup.stories.d.ts.map

package/dist/CheckboxGroup.stories.d.ts.map

@@ -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

@@ -0,0 +1,5 @@
+/**
+ * @vitest-environment jsdom
+ */
+import '@testing-library/jest-dom';
+//# sourceMappingURL=CheckboxGroup.test.d.ts.map

package/dist/CheckboxGroup.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxGroup.test.d.ts","sourceRoot":"","sources":["../src/CheckboxGroup.test.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,2BAA2B,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export type { CheckboxGroupItemProps, CheckboxGroupRootProps, } from './CheckboxGroup.js';
+export { CheckboxGroup } from './CheckboxGroup.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +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"}

package/dist/index.js

@@ -0,0 +1,473 @@
+import { jsx as y, jsxs as M } from "react/jsx-runtime";
+import D, { forwardRef as H, createElement as F, createContext as J, useState as K, use as P } from "react";
+function R(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = R(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function Q() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = R(r)) && (t && (t += " "), t += i);
+  return t;
+}
+function z(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = z(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function U() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = z(r)) && (t && (t += " "), t += i);
+  return t;
+}
+const I = ({
+  ref: r,
+  as: i = "div",
+  children: e,
+  display: t,
+  m: o,
+  mt: c,
+  mr: s,
+  mb: f,
+  ml: h,
+  p: g,
+  pt: l,
+  pr: p,
+  pb: n,
+  pl: u,
+  width: d,
+  height: m,
+  position: v,
+  style: b,
+  className: $,
+  href: x,
+  target: k,
+  rel: w,
+  htmlFor: N,
+  type: C,
+  disabled: A,
+  ...j
+}) => {
+  const a = {};
+  t && (a.display = t), d && (a.width = d), m && (a.height = m), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), c && (a.marginTop = `var(--pittorica-space-${c})`), s && (a.marginRight = `var(--pittorica-space-${s})`), f && (a.marginBottom = `var(--pittorica-space-${f})`), h && (a.marginLeft = `var(--pittorica-space-${h})`), g && (a.padding = `var(--pittorica-space-${g})`), l && (a.paddingTop = `var(--pittorica-space-${l})`), p && (a.paddingRight = `var(--pittorica-space-${p})`), n && (a.paddingBottom = `var(--pittorica-space-${n})`), u && (a.paddingLeft = `var(--pittorica-space-${u})`);
+  const B = {
+    ...b,
+    ...a
+  };
+  return /* @__PURE__ */ y(
+    i,
+    {
+      ref: r,
+      className: U("pittorica-box", $),
+      style: B,
+      href: x,
+      target: k,
+      rel: w,
+      htmlFor: N,
+      type: C,
+      disabled: A,
+      ...j,
+      children: e
+    }
+  );
+};
+I.displayName = "Box";
+function L(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = L(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function Z() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = L(r)) && (t && (t += " "), t += i);
+  return t;
+}
+/**
+ * @license @tabler/icons-react v3.36.1 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+var _ = {
+  outline: {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  },
+  filled: {
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 24,
+    height: 24,
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    stroke: "none"
+  }
+};
+/**
+ * @license @tabler/icons-react v3.36.1 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const T = (r, i, e, t) => {
+  const o = H(
+    ({ color: c = "currentColor", size: s = 24, stroke: f = 2, title: h, className: g, children: l, ...p }, n) => F(
+      "svg",
+      {
+        ref: n,
+        ..._[r],
+        width: s,
+        height: s,
+        className: ["tabler-icon", `tabler-icon-${i}`, g].join(" "),
+        ...r === "filled" ? {
+          fill: c
+        } : {
+          strokeWidth: f,
+          stroke: c
+        },
+        ...p
+      },
+      [
+        h && F("title", { key: "svg-title" }, h),
+        ...t.map(([u, d]) => F(u, d)),
+        ...Array.isArray(l) ? l : [l]
+      ]
+    )
+  );
+  return o.displayName = `${e}`, o;
+};
+/**
+ * @license @tabler/icons-react v3.36.1 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const X = [["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" }]], Y = T("outline", "square", "Square", X);
+/**
+ * @license @tabler/icons-react v3.36.1 - MIT
+ *
+ * This source code is licensed under the MIT license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const V = [["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" }]], tt = T("filled", "square-check-filled", "SquareCheckFilled", V);
+function q(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = q(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function rt() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = q(r)) && (t && (t += " "), t += i);
+  return t;
+}
+const G = ({
+  ref: r,
+  as: i = "div",
+  children: e,
+  display: t,
+  m: o,
+  mt: c,
+  mr: s,
+  mb: f,
+  ml: h,
+  p: g,
+  pt: l,
+  pr: p,
+  pb: n,
+  pl: u,
+  width: d,
+  height: m,
+  position: v,
+  style: b,
+  className: $,
+  href: x,
+  target: k,
+  rel: w,
+  htmlFor: N,
+  type: C,
+  disabled: A,
+  ...j
+}) => {
+  const a = {};
+  t && (a.display = t), d && (a.width = d), m && (a.height = m), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), c && (a.marginTop = `var(--pittorica-space-${c})`), s && (a.marginRight = `var(--pittorica-space-${s})`), f && (a.marginBottom = `var(--pittorica-space-${f})`), h && (a.marginLeft = `var(--pittorica-space-${h})`), g && (a.padding = `var(--pittorica-space-${g})`), l && (a.paddingTop = `var(--pittorica-space-${l})`), p && (a.paddingRight = `var(--pittorica-space-${p})`), n && (a.paddingBottom = `var(--pittorica-space-${n})`), u && (a.paddingLeft = `var(--pittorica-space-${u})`);
+  const B = {
+    ...b,
+    ...a
+  };
+  return /* @__PURE__ */ y(
+    i,
+    {
+      ref: r,
+      className: rt("pittorica-box", $),
+      style: B,
+      href: x,
+      target: k,
+      rel: w,
+      htmlFor: N,
+      type: C,
+      disabled: A,
+      ...j,
+      children: e
+    }
+  );
+};
+G.displayName = "Box";
+function W(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = W(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function et() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = W(r)) && (t && (t += " "), t += i);
+  return t;
+}
+function S(r) {
+  var i, e, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (i = 0; i < o; i++) r[i] && (e = S(r[i])) && (t && (t += " "), t += e);
+  } else for (e in r) r[e] && (t && (t += " "), t += e);
+  return t;
+}
+function it() {
+  for (var r, i, e = 0, t = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (i = S(r)) && (t && (t += " "), t += i);
+  return t;
+}
+const E = ({
+  ref: r,
+  as: i = "div",
+  children: e,
+  display: t,
+  m: o,
+  mt: c,
+  mr: s,
+  mb: f,
+  ml: h,
+  p: g,
+  pt: l,
+  pr: p,
+  pb: n,
+  pl: u,
+  width: d,
+  height: m,
+  position: v,
+  style: b,
+  className: $,
+  href: x,
+  target: k,
+  rel: w,
+  htmlFor: N,
+  type: C,
+  disabled: A,
+  ...j
+}) => {
+  const a = {};
+  t && (a.display = t), d && (a.width = d), m && (a.height = m), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), c && (a.marginTop = `var(--pittorica-space-${c})`), s && (a.marginRight = `var(--pittorica-space-${s})`), f && (a.marginBottom = `var(--pittorica-space-${f})`), h && (a.marginLeft = `var(--pittorica-space-${h})`), g && (a.padding = `var(--pittorica-space-${g})`), l && (a.paddingTop = `var(--pittorica-space-${l})`), p && (a.paddingRight = `var(--pittorica-space-${p})`), n && (a.paddingBottom = `var(--pittorica-space-${n})`), u && (a.paddingLeft = `var(--pittorica-space-${u})`);
+  const B = {
+    ...b,
+    ...a
+  };
+  return /* @__PURE__ */ y(
+    i,
+    {
+      ref: r,
+      className: it("pittorica-box", $),
+      style: B,
+      href: x,
+      target: k,
+      rel: w,
+      htmlFor: N,
+      type: C,
+      disabled: A,
+      ...j,
+      children: e
+    }
+  );
+};
+E.displayName = "Box";
+const at = (r, i) => i ? typeof i == "string" ? [`pittorica-text--${r}-${i}`] : Object.entries(i).filter(([e, t]) => t !== void 0).map(
+  ([e, t]) => e === "initial" ? `pittorica-text--${r}-${t}` : `pittorica-text--${e}-${r}-${t}`
+) : [], ot = ({
+  children: r,
+  as: i = "span",
+  size: e = "3",
+  weight: t = "regular",
+  align: o,
+  truncate: c = !1,
+  color: s,
+  className: f,
+  style: h,
+  href: g,
+  target: l,
+  rel: p,
+  htmlFor: n,
+  ...u
+}) => {
+  const d = (s == null ? void 0 : s.startsWith("#")) || (s == null ? void 0 : s.startsWith("rgb")), m = [
+    "danger",
+    "success",
+    "error",
+    "info",
+    "indigo",
+    "crimson",
+    "teal",
+    "amber",
+    "slate",
+    "blue",
+    "red"
+  ].includes(s), v = (() => {
+    if (s) {
+      if (s === "inherit") return "inherit";
+      if (d) return s;
+      if (m) return `var(--pittorica-${s}-9)`;
+    }
+  })(), b = {
+    ...h,
+    textAlign: o,
+    color: v
+  }, $ = at("size", e);
+  return /* @__PURE__ */ y(
+    E,
+    {
+      as: i,
+      className: et(
+        "pittorica-text",
+        { "pittorica-text--truncate": c },
+        $,
+        f
+      ),
+      "data-weight": t,
+      style: b,
+      href: g,
+      target: l,
+      rel: p,
+      htmlFor: n,
+      ...u,
+      children: r
+    }
+  );
+}, st = ({
+  checked: r,
+  defaultChecked: i,
+  onChange: e,
+  color: t = "indigo",
+  disabled: o = !1,
+  label: c,
+  className: s,
+  style: f,
+  ...h
+}) => {
+  const [g, l] = D.useState(
+    i ?? !1
+  ), p = r === void 0 ? g : r, n = t !== "inherit" && !(t != null && t.startsWith("#")) && !(t != null && t.startsWith("rgb")) ? `var(--pittorica-${t}-9)` : t, u = (d) => {
+    if (o) return;
+    const m = d.target.checked;
+    l(m), e == null || e(m);
+  };
+  return /* @__PURE__ */ M(
+    G,
+    {
+      as: "label",
+      className: Z("pittorica-checkbox-root", s),
+      "data-disabled": o,
+      style: { "--_checkbox-color": n, ...f },
+      children: [
+        /* @__PURE__ */ y(
+          "input",
+          {
+            type: "checkbox",
+            className: "pittorica-checkbox-input",
+            checked: p,
+            disabled: o,
+            onChange: u,
+            ...h
+          }
+        ),
+        /* @__PURE__ */ y("div", { className: "pittorica-checkbox-control", children: p ? /* @__PURE__ */ y(tt, { size: 20 }) : /* @__PURE__ */ y(Y, { size: 20, stroke: 1.5 }) }),
+        c && /* @__PURE__ */ y(ot, { size: "2", weight: "medium", style: { color: "inherit" }, children: c })
+      ]
+    }
+  );
+}, O = J(
+  null
+), nt = ({
+  value: r,
+  defaultValue: i = [],
+  onValueChange: e,
+  orientation: t = "vertical",
+  color: o,
+  disabled: c,
+  children: s,
+  className: f,
+  ...h
+}) => {
+  const [g, l] = K(i), p = r !== void 0, n = p ? r : g;
+  return /* @__PURE__ */ y(
+    O,
+    {
+      value: {
+        value: n,
+        onItemChange: (d) => {
+          const m = n.includes(d) ? n.filter((v) => v !== d) : [...n, d];
+          p || l(m), e == null || e(m);
+        },
+        color: o,
+        disabled: c
+      },
+      children: /* @__PURE__ */ y(
+        I,
+        {
+          className: Q("pittorica-checkbox-group-root", f),
+          "data-orientation": t,
+          role: "group",
+          ...h,
+          children: s
+        }
+      )
+    }
+  );
+}, ct = ({ value: r, ...i }) => {
+  const e = P(O);
+  if (!e)
+    throw new Error(
+      "CheckboxGroup.Item must be used within CheckboxGroup.Root"
+    );
+  return /* @__PURE__ */ y(
+    st,
+    {
+      ...i,
+      checked: e.value.includes(r),
+      onChange: () => e.onItemChange(r),
+      color: i.color || e.color,
+      disabled: i.disabled || e.disabled
+    }
+  );
+}, dt = Object.assign(nt, {
+  Item: ct
+});
+export {
+  dt as CheckboxGroup
+};

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@pittorica/checkbox-group-react",
+  "version": "0.22.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "@pittorica/box-react": "0.22.0",
+    "@pittorica/text-react": "0.22.0",
+    "@pittorica/checkbox-react": "0.22.0"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^14.0.0",
+    "@types/react": "^19.2.3",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^4.0.0",
+    "jsdom": "^22.0.0",
+    "typescript": "^5.0.0",
+    "vite": "^5.0.0",
+    "vitest": "^2.1.9",
+    "pittorica": "0.22.0",
+    "@pittorica/theme-react": "0.22.0"
+  },
+  "peerDependencies": {
+    "react": ">=19",
+    "react-dom": ">=19"
+  },
+  "scripts": {
+    "build": "npm run clean && npm run build:js && npm run build:types",
+    "build:js": "vite build",
+    "build:types": "tsc -p tsconfig.json",
+    "clean": "rm -rf dist",
+    "dev": "vite",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  }
+}