@solibo/solibo-ui 0.3.28 → 0.3.30

package/dist/components/nav/index.js

@@ -1,23 +1,38 @@
-import { jsx as r } from "react/jsx-runtime";
-import { t as p } from "../../classix-DG18itHa.js";
-import '../../assets/index40.css';const _ = "_nav_1g1sp_1", e = "_horizontal_1g1sp_7", c = "_tabs_1g1sp_17", v = "_pills_1g1sp_38", a = {
-  nav: _,
-  horizontal: e,
-  tabs: c,
-  pills: v
-}, m = {
-  default: a.default,
-  pills: a.pills,
-  tabs: a.tabs
-}, b = ({
-  animation: s,
-  children: n,
-  className: o,
-  horizontal: t = !1,
-  variant: l = "default",
-  ...i
-}) => /* @__PURE__ */ r("nav", { className: p(o, t && a.horizontal, a.nav, m[l]), "data-animation": s, "data-orientation": t ? "horizontal" : "vertical", ...i, "data-component": "nav", children: n });
+import { jsx as m } from "react/jsx-runtime";
+import { t as _ } from "../../classix-DG18itHa.js";
+import { useRef as l } from "react";
+import { i as b } from "../../icons-DeUtqBx_.js";
+import '../../assets/index40.css';const h = "_nav_6dj6b_1", v = "_horizontal_6dj6b_7", w = "_tabs_6dj6b_17", j = "_pills_6dj6b_38", n = {
+  nav: h,
+  horizontal: v,
+  tabs: w,
+  pills: j
+}, g = {
+  default: n.default,
+  pills: n.pills,
+  tabs: n.tabs
+}, R = ({
+  animation: c,
+  children: u,
+  className: f,
+  horizontal: s = !1,
+  variant: r = "default",
+  ...p
+}) => {
+  const a = l(null), e = l(!1), d = {
+    "--icon-svg": b("chevron")
+  };
+  return /* @__PURE__ */ m("nav", { className: _(f, s && n.horizontal, n.nav, g[r]), "data-animation": c, "data-orientation": s ? "horizontal" : "vertical", onPointerDown: () => {
+    var o;
+    r !== "pills" || window.innerWidth > 960 || (e.current = !!((o = a.current) != null && o.matches(":focus-within")));
+  }, onClick: (o) => {
+    var i;
+    if (r !== "pills" || window.innerWidth > 960) return;
+    const t = (i = o.target) == null ? void 0 : i.closest("a");
+    (t == null ? void 0 : t.getAttribute("aria-current")) === "page" && !e.current || t == null || t.blur();
+  }, ref: a, style: d, ...p, "data-component": "nav", children: u });
+};
 export {
-  b as Nav
+  R as Nav
 };
 //# sourceMappingURL=index.js.map

package/dist/components/nav/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/nav/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport styles from './styles.module.css';\n\nconst variants = {\n  default: styles.default,\n  pills: styles.pills,\n  tabs: styles.tabs,\n};\n\nexport type NavProps = React.HTMLAttributes<HTMLElement> & {\n  animation?: string;\n  children?: React.ReactNode;\n  className?: string;\n  horizontal?: boolean;\n  variant?: keyof typeof variants;\n};\n\nexport const Nav = ({\n  animation,\n  children,\n  className,\n  horizontal = false,\n  variant = 'default',\n  ...props\n}: NavProps) => {\n  return (\n    <nav\n      className={cx(className, horizontal && styles.horizontal, styles.nav, variants[variant])}\n      data-animation={animation}\n      data-orientation={horizontal ? 'horizontal' : 'vertical'}\n      {...props}\n    >\n      {children}\n    </nav>\n  );\n};\n"],"names":["variants","default","styles","pills","tabs","Nav","animation","children","className","horizontal","variant","props","jsx","cx","nav"],"mappings":";;;;;;;GAIMA,IAAW;AAAA,EACfC,SAASC,EAAOD;AAAAA,EAChBE,OAAOD,EAAOC;AAAAA,EACdC,MAAMF,EAAOE;AACf,GAUaC,IAAMA,CAAC;AAAA,EAClBC,WAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA,IAAU;AAAA,EACV,GAAGC;AACK,MAEN,gBAAAC,EAAC,OAAA,EACC,WAAWC,EAAGL,GAAWC,KAAcP,EAAOO,YAAYP,EAAOY,KAAKd,EAASU,CAAO,CAAC,GACvF,kBAAgBJ,GAChB,oBAAkBG,IAAa,eAAe,YAC9C,GAAIE,GAAM,kBAAA,OAETJ,UAAAA,EAAAA,CACH;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/nav/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useRef } from 'react';\n\nimport { iconSVG } from '@/components/icon/icons.ts';\n\nimport styles from './styles.module.css';\n\nconst variants = {\n  default: styles.default,\n  pills: styles.pills,\n  tabs: styles.tabs,\n};\n\nexport type NavProps = React.HTMLAttributes<HTMLElement> & {\n  animation?: string;\n  children?: React.ReactNode;\n  className?: string;\n  horizontal?: boolean;\n  variant?: keyof typeof variants;\n};\n\nexport const Nav = ({\n  animation,\n  children,\n  className,\n  horizontal = false,\n  variant = 'default',\n  ...props\n}: NavProps) => {\n  const ref = useRef<HTMLElement>(null);\n  const wasOpenRef = useRef(false);\n  type withVars = React.CSSProperties & {\n    '--icon-svg'?: string;\n  };\n\n  const withVars: withVars = {\n    '--icon-svg': iconSVG('chevron'),\n  };\n\n  return (\n    <nav\n      className={cx(className, horizontal && styles.horizontal, styles.nav, variants[variant])}\n      data-animation={animation}\n      data-orientation={horizontal ? 'horizontal' : 'vertical'}\n      onPointerDown={() => {\n        if (variant !== 'pills' || window.innerWidth > 960) return;\n        wasOpenRef.current = !!ref.current?.matches(':focus-within');\n      }}\n      onClick={(e) => {\n        if (variant !== 'pills' || window.innerWidth > 960) return;\n\n        const link = (e.target as HTMLElement | null)?.closest('a');\n\n        const isCurrent = link?.getAttribute('aria-current') === 'page';\n        if (isCurrent && !wasOpenRef.current) {\n          return;\n        }\n\n        link?.blur();\n      }}\n      ref={ref}\n      style={withVars}\n      {...props}\n    >\n      {children}\n    </nav>\n  );\n};\n"],"names":["variants","default","styles","pills","tabs","Nav","animation","children","className","horizontal","variant","props","ref","useRef","wasOpenRef","withVars","iconSVG","jsx","cx","nav","window","innerWidth","current","matches","e","link","target","closest","getAttribute","blur"],"mappings":";;;;;;;;;GAOMA,IAAW;AAAA,EACfC,SAASC,EAAOD;AAAAA,EAChBE,OAAOD,EAAOC;AAAAA,EACdC,MAAMF,EAAOE;AACf,GAUaC,IAAMA,CAAC;AAAA,EAClBC,WAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA,IAAU;AAAA,EACV,GAAGC;AACK,MAAM;AACd,QAAMC,IAAMC,EAAoB,IAAI,GAC9BC,IAAaD,EAAO,EAAK,GAKzBE,IAAqB;AAAA,IACzB,cAAcC,EAAQ,SAAS;AAAA,EAAA;AAGjC,SACE,gBAAAC,EAAC,SACC,WAAWC,EAAGV,GAAWC,KAAcP,EAAOO,YAAYP,EAAOiB,KAAKnB,EAASU,CAAO,CAAC,GACvF,kBAAgBJ,GAChB,oBAAkBG,IAAa,eAAe,YAC9C,eAAe,MAAM;;AACnB,IAAIC,MAAY,WAAWU,OAAOC,aAAa,QAC/CP,EAAWQ,UAAU,CAAC,GAACV,IAAAA,EAAIU,YAAJV,QAAAA,EAAaW,QAAQ;AAAA,EAC9C,GACA,SAAUC,CAAAA,MAAM;;AACd,QAAId,MAAY,WAAWU,OAAOC,aAAa,IAAK;AAEpD,UAAMI,KAAQD,IAAAA,EAAEE,WAAFF,gBAAAA,EAAiCG,QAAQ;AAGvD,KADkBF,KAAAA,gBAAAA,EAAMG,aAAa,qBAAoB,UACxC,CAACd,EAAWQ,WAI7BG,KAAAA,QAAAA,EAAMI;AAAAA,EACR,GACA,KAAAjB,GACA,OAAOG,GACP,GAAIJ,GAAM,kBAAA,OAETJ,UAAAA,GACH;AAEJ;"}

package/dist/components/textarea/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index41.css');const e=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),d=require("../../utils-D_TJ8wDc.cjs"),l=require("../../styles.module--qoz6wR5.cjs"),m="_label_ec2gr_1",y="_textarea_ec2gr_5",n={label:m,textarea:y},_=({label:t,maxRows:c=12,minRows:o=3,required:s,value:a,...u})=>{const{touched:i,onBlur:x}=d.useTouched(a==="");return e.jsxs("label",{"data-component":"textarea",children:[t&&e.jsx("span",{className:r.t(n.label,s&&l.inputStyles.required),children:t}),e.jsx("textarea",{className:r.t(l.inputStyles.input,n.textarea,i&&"touched"),onBlur:x,...u,required:s,style:{"--min-rows":o,"--max-rows":c},value:a})]})};exports.Textarea=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index41.css');const e=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),y=require("../../utils-D_TJ8wDc.cjs"),l=require("../../styles.module-BuPl_9yN.cjs"),d="_label_b5yys_1",b="_textarea_b5yys_5",n={label:d,textarea:b},m=({label:t,maxRows:o=12,minRows:c=3,required:s,value:a,...u})=>{const{touched:i,onBlur:x}=y.useTouched(a==="");return e.jsxs("label",{"data-component":"textarea",children:[t&&e.jsx("span",{className:r.t(n.label,s&&l.inputStyles.required),children:t}),e.jsx("textarea",{className:r.t(l.inputStyles.input,n.textarea,i&&"touched"),onBlur:x,...u,required:s,style:{"--min-rows":c,"--max-rows":o},value:a})]})};exports.Textarea=m;
 //# sourceMappingURL=index.cjs.map

package/dist/components/textarea/index.js

@@ -1,14 +1,14 @@
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import { t as o } from "../../classix-DG18itHa.js";
+import { jsxs as p, jsx as s } from "react/jsx-runtime";
+import { t as r } from "../../classix-DG18itHa.js";
 import { u } from "../../utils-DXIJVVzz.js";
-import { i as s } from "../../styles.module-y5zmJBcz.js";
-import '../../assets/index41.css';const d = "_label_ec2gr_1", _ = "_textarea_ec2gr_5", c = {
-  label: d,
-  textarea: _
-}, g = ({
+import { i as o } from "../../styles.module-ZrsD4xw8.js";
+import '../../assets/index41.css';const y = "_label_b5yys_1", b = "_textarea_b5yys_5", l = {
+  label: y,
+  textarea: b
+}, j = ({
   label: t,
-  maxRows: l = 12,
-  minRows: n = 3,
+  maxRows: n = 12,
+  minRows: c = 3,
   required: e,
   value: a,
   ...m
@@ -18,14 +18,14 @@ import '../../assets/index41.css';const d = "_label_ec2gr_1", _ = "_textarea_ec2
     onBlur: i
   } = u(a === "");
   return /* @__PURE__ */ p("label", { "data-component": "textarea", children: [
-    t && /* @__PURE__ */ r("span", { className: o(c.label, e && s.required), children: t }),
-    /* @__PURE__ */ r("textarea", { className: o(s.input, c.textarea, x && "touched"), onBlur: i, ...m, required: e, style: {
-      "--min-rows": n,
-      "--max-rows": l
+    t && /* @__PURE__ */ s("span", { className: r(l.label, e && o.required), children: t }),
+    /* @__PURE__ */ s("textarea", { className: r(o.input, l.textarea, x && "touched"), onBlur: i, ...m, required: e, style: {
+      "--min-rows": c,
+      "--max-rows": n
     }, value: a })
   ] });
 };
 export {
-  g as Textarea
+  j as Textarea
 };
 //# sourceMappingURL=index.js.map

package/dist/components/toast/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index42.css');const a=require("react/jsx-runtime"),f=require("../../classix-5H4IWnMA.cjs"),n=require("react"),j=require("../icon/index.cjs"),h="_toast_h2jok_1",l="_active_h2jok_18",d="_error_h2jok_24",m="_info_h2jok_28",v="_success_h2jok_33",o={toast:h,active:l,error:d,info:m,success:v},k=({label:i,type:t="success",onClick:u,onExitComplete:e,open:r=!0})=>{const[_,c]=n.useState(!1);return n.useEffect(()=>{if(!r)return c(!1);const s=requestAnimationFrame(()=>c(!0));return()=>cancelAnimationFrame(s)},[r]),a.jsxs("div",{"aria-live":t==="error"?"assertive":"polite",className:f.t(o.toast,o[t],_&&o.active),onClick:u,onTransitionEnd:s=>{r||s.propertyName!=="opacity"||s.currentTarget!==s.target||e==null||e()},"data-component":"toast",children:[a.jsx(j.Icon,{name:t}),i]})};exports.Toast=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index42.css');const o=require("react/jsx-runtime"),v=require("../../classix-5H4IWnMA.cjs"),n=require("react"),f=require("../icon/index.cjs"),l="_toast_tav58_1",d="_active_tav58_18",m="_error_tav58_24",q="_info_tav58_28",T="_success_tav58_33",a={toast:l,active:d,error:m,info:q,success:T},g=({label:i,type:s="success",onClick:u,onExitComplete:e,open:r=!0})=>{const[_,c]=n.useState(!1);return n.useEffect(()=>{if(!r)return c(!1);const t=requestAnimationFrame(()=>c(!0));return()=>cancelAnimationFrame(t)},[r]),o.jsxs("div",{"aria-live":s==="error"?"assertive":"polite",className:v.t(a.toast,a[s],_&&a.active),onClick:u,onTransitionEnd:t=>{r||t.propertyName!=="opacity"||t.currentTarget!==t.target||e==null||e()},"data-component":"toast",children:[o.jsx(f.Icon,{name:s}),i]})};exports.Toast=g;
 //# sourceMappingURL=index.cjs.map

package/dist/components/toast/index.js

@@ -1,33 +1,33 @@
 import { jsxs as _, jsx as u } from "react/jsx-runtime";
 import { t as f } from "../../classix-DG18itHa.js";
-import { useState as m, useEffect as h } from "react";
-import { Icon as j } from "../icon/index.js";
-import '../../assets/index42.css';const k = "_toast_h2jok_1", v = "_active_h2jok_18", d = "_error_h2jok_24", l = "_info_h2jok_28", T = "_success_h2jok_33", a = {
-  toast: k,
-  active: v,
-  error: d,
-  info: l,
-  success: T
-}, F = ({
+import { useState as m, useEffect as v } from "react";
+import { Icon as d } from "../icon/index.js";
+import '../../assets/index42.css';const l = "_toast_tav58_1", h = "_active_tav58_18", T = "_error_tav58_24", g = "_info_tav58_28", j = "_success_tav58_33", o = {
+  toast: l,
+  active: h,
+  error: T,
+  info: g,
+  success: j
+}, N = ({
   label: c,
-  type: s = "success",
+  type: r = "success",
   onClick: n,
-  onExitComplete: t,
-  open: o = !0
+  onExitComplete: s,
+  open: a = !0
 }) => {
   const [i, e] = m(!1);
-  return h(() => {
-    if (!o) return e(!1);
-    const r = requestAnimationFrame(() => e(!0));
-    return () => cancelAnimationFrame(r);
-  }, [o]), /* @__PURE__ */ _("div", { "aria-live": s === "error" ? "assertive" : "polite", className: f(a.toast, a[s], i && a.active), onClick: n, onTransitionEnd: (r) => {
-    o || r.propertyName !== "opacity" || r.currentTarget !== r.target || t == null || t();
+  return v(() => {
+    if (!a) return e(!1);
+    const t = requestAnimationFrame(() => e(!0));
+    return () => cancelAnimationFrame(t);
+  }, [a]), /* @__PURE__ */ _("div", { "aria-live": r === "error" ? "assertive" : "polite", className: f(o.toast, o[r], i && o.active), onClick: n, onTransitionEnd: (t) => {
+    a || t.propertyName !== "opacity" || t.currentTarget !== t.target || s == null || s();
   }, "data-component": "toast", children: [
-    /* @__PURE__ */ u(j, { name: s }),
+    /* @__PURE__ */ u(d, { name: r }),
     c
   ] });
 };
 export {
-  F as Toast
+  N as Toast
 };
 //# sourceMappingURL=index.js.map

package/dist/components/toggle/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index2.css');const e=require("react/jsx-runtime"),l=require("../loading/index.cjs"),g="_toggle_1rg2x_1",r="_thumb_1rg2x_15",i="_track_1rg2x_25",t={toggle:g,thumb:r,track:i},u=({checked:n,disabled:o,isLoading:s,label:a,onChange:c})=>e.jsxs("label",{className:t.toggle,"data-component":"toggle",children:[e.jsx("input",{checked:n,disabled:o||s,onChange:c,type:"checkbox"}),e.jsx("span",{"aria-hidden":"true",className:t.track,children:s?e.jsx(l.Loading,{size:24}):e.jsx("span",{className:t.thumb})}),e.jsx("span",{className:"toggle",children:a})]});exports.Toggle=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index2.css');const e=require("react/jsx-runtime"),g=require("../loading/index.cjs"),r="_toggle_1rg2x_1",l="_thumb_1rg2x_15",i="_track_1rg2x_25",t={toggle:r,thumb:l,track:i},u=({checked:o,disabled:c,isLoading:s,label:n,onChange:a})=>e.jsxs("label",{className:t.toggle,"data-component":"toggle",children:[e.jsx("input",{checked:o,disabled:c||s,onChange:a,type:"checkbox"}),e.jsx("span",{"aria-hidden":"true",className:t.track,children:s?e.jsx(g.Loading,{size:24}):e.jsx("span",{className:t.thumb})}),n&&e.jsx("span",{className:"toggle",children:n})]});exports.Toggle=u;
 //# sourceMappingURL=index.cjs.map

package/dist/components/toggle/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import { Loading } from '../loading';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  checked?: boolean;\n  disabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({ checked, disabled, isLoading, label, onChange }: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={checked}\n        disabled={disabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        {isLoading ? <Loading size={24} /> : <span className={styles.thumb} />}\n      </span>\n      <span className='toggle'>{label}</span>\n    </label>\n  );\n};\n"],"names":["Toggle","checked","disabled","isLoading","label","onChange","styles","toggle","jsx","track","Loading","thumb"],"mappings":"gPAWaA,EAASA,CAAC,CAAEC,QAAAA,EAASC,SAAAA,EAAUC,UAAAA,EAAWC,MAAAA,EAAOC,SAAAA,CAAsB,WAE/E,QAAA,CAAM,UAAWC,EAAOC,OAAO,iBAAA,SAC9B,SAAA,CAAAC,MAAC,SACC,QAAAP,EACA,SAAUC,GAAYC,EACtB,SAAAE,EACA,KAAK,WAAU,QAEhB,OAAA,CACC,cAAY,OACZ,UAAWC,EAAOG,MAEjBN,SAAAA,EAAYK,EAAAA,IAACE,UAAA,CAAQ,KAAM,KAASF,MAAC,QAAK,UAAWF,EAAOK,MAAM,EACrE,EACAH,EAAAA,IAAC,OAAA,CAAK,UAAU,SAAUJ,SAAAA,CAAAA,CAAM,CAAA,EAClC"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import { Loading } from '../loading';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  checked?: boolean;\n  disabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({ checked, disabled, isLoading, label, onChange }: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={checked}\n        disabled={disabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        {isLoading ? <Loading size={24} /> : <span className={styles.thumb} />}\n      </span>\n      {label && <span className='toggle'>{label}</span>}\n    </label>\n  );\n};\n"],"names":["Toggle","checked","disabled","isLoading","label","onChange","styles","toggle","jsx","track","Loading","thumb"],"mappings":"gPAWaA,EAASA,CAAC,CAAEC,QAAAA,EAASC,SAAAA,EAAUC,UAAAA,EAAWC,MAAAA,EAAOC,SAAAA,CAAsB,WAE/E,QAAA,CAAM,UAAWC,EAAOC,OAAO,iBAAA,SAC9B,SAAA,CAAAC,MAAC,SACC,QAAAP,EACA,SAAUC,GAAYC,EACtB,SAAAE,EACA,KAAK,WAAU,QAEhB,OAAA,CACC,cAAY,OACZ,UAAWC,EAAOG,MAEjBN,SAAAA,EAAYK,EAAAA,IAACE,UAAA,CAAQ,KAAM,KAASF,MAAC,QAAK,UAAWF,EAAOK,MAAM,EACrE,EACCP,GAASI,EAAAA,IAAC,OAAA,CAAK,UAAU,SAAUJ,SAAAA,CAAAA,CAAM,CAAA,EAC5C"}

package/dist/components/toggle/index.js

@@ -1,19 +1,19 @@
-import { jsxs as l, jsx as t } from "react/jsx-runtime";
-import { Loading as g } from "../loading/index.js";
+import { jsxs as g, jsx as t } from "react/jsx-runtime";
+import { Loading as l } from "../loading/index.js";
 import '../../assets/index2.css';const n = "_toggle_1rg2x_1", m = "_thumb_1rg2x_15", h = "_track_1rg2x_25", e = {
   toggle: n,
   thumb: m,
   track: h
 }, _ = ({
-  checked: a,
-  disabled: o,
+  checked: o,
+  disabled: c,
   isLoading: s,
-  label: c,
+  label: a,
   onChange: r
-}) => /* @__PURE__ */ l("label", { className: e.toggle, "data-component": "toggle", children: [
-  /* @__PURE__ */ t("input", { checked: a, disabled: o || s, onChange: r, type: "checkbox" }),
-  /* @__PURE__ */ t("span", { "aria-hidden": "true", className: e.track, children: s ? /* @__PURE__ */ t(g, { size: 24 }) : /* @__PURE__ */ t("span", { className: e.thumb }) }),
-  /* @__PURE__ */ t("span", { className: "toggle", children: c })
+}) => /* @__PURE__ */ g("label", { className: e.toggle, "data-component": "toggle", children: [
+  /* @__PURE__ */ t("input", { checked: o, disabled: c || s, onChange: r, type: "checkbox" }),
+  /* @__PURE__ */ t("span", { "aria-hidden": "true", className: e.track, children: s ? /* @__PURE__ */ t(l, { size: 24 }) : /* @__PURE__ */ t("span", { className: e.thumb }) }),
+  a && /* @__PURE__ */ t("span", { className: "toggle", children: a })
 ] });
 export {
   _ as Toggle

package/dist/components/toggle/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import { Loading } from '../loading';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  checked?: boolean;\n  disabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({ checked, disabled, isLoading, label, onChange }: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={checked}\n        disabled={disabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        {isLoading ? <Loading size={24} /> : <span className={styles.thumb} />}\n      </span>\n      <span className='toggle'>{label}</span>\n    </label>\n  );\n};\n"],"names":["Toggle","checked","disabled","isLoading","label","onChange","styles","toggle","jsx","track","Loading","thumb"],"mappings":";;;;;;GAWaA,IAASA,CAAC;AAAA,EAAEC,SAAAA;AAAAA,EAASC,UAAAA;AAAAA,EAAUC,WAAAA;AAAAA,EAAWC,OAAAA;AAAAA,EAAOC,UAAAA;AAAsB,wBAE/E,SAAA,EAAM,WAAWC,EAAOC,QAAO,kBAAA,UAC9B,UAAA;AAAA,EAAA,gBAAAC,EAAC,WACC,SAAAP,GACA,UAAUC,KAAYC,GACtB,UAAAE,GACA,MAAK,YAAU;AAAA,oBAEhB,QAAA,EACC,eAAY,QACZ,WAAWC,EAAOG,OAEjBN,UAAAA,IAAY,gBAAAK,EAACE,GAAA,EAAQ,MAAM,QAAS,gBAAAF,EAAC,UAAK,WAAWF,EAAOK,OAAM,GACrE;AAAA,EACA,gBAAAH,EAAC,QAAA,EAAK,WAAU,UAAUJ,UAAAA,EAAAA,CAAM;AAAA,GAClC;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import { Loading } from '../loading';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  checked?: boolean;\n  disabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({ checked, disabled, isLoading, label, onChange }: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={checked}\n        disabled={disabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        {isLoading ? <Loading size={24} /> : <span className={styles.thumb} />}\n      </span>\n      {label && <span className='toggle'>{label}</span>}\n    </label>\n  );\n};\n"],"names":["Toggle","checked","disabled","isLoading","label","onChange","styles","toggle","jsx","track","Loading","thumb"],"mappings":";;;;;;GAWaA,IAASA,CAAC;AAAA,EAAEC,SAAAA;AAAAA,EAASC,UAAAA;AAAAA,EAAUC,WAAAA;AAAAA,EAAWC,OAAAA;AAAAA,EAAOC,UAAAA;AAAsB,wBAE/E,SAAA,EAAM,WAAWC,EAAOC,QAAO,kBAAA,UAC9B,UAAA;AAAA,EAAA,gBAAAC,EAAC,WACC,SAAAP,GACA,UAAUC,KAAYC,GACtB,UAAAE,GACA,MAAK,YAAU;AAAA,oBAEhB,QAAA,EACC,eAAY,QACZ,WAAWC,EAAOG,OAEjBN,UAAAA,IAAY,gBAAAK,EAACE,GAAA,EAAQ,MAAM,QAAS,gBAAAF,EAAC,UAAK,WAAWF,EAAOK,OAAM,GACrE;AAAA,EACCP,KAAS,gBAAAI,EAAC,QAAA,EAAK,WAAU,UAAUJ,UAAAA,EAAAA,CAAM;AAAA,GAC5C;"}

package/dist/components/toolbar/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index43.css');const a=require("react/jsx-runtime"),l=require("../../classix-5H4IWnMA.cjs"),s="_toolbar_104fz_1",n="_editor_104fz_33",o={toolbar:s,default:"_default_104fz_26",editor:n},i=({children:t,variant:e="default"})=>a.jsx("div",{className:l.t(o.toolbar,o[e]),onClick:r=>r.stopPropagation(),"data-component":"toolbar",children:t});exports.Toolbar=i;
+//# sourceMappingURL=index.cjs.map

package/dist/components/toolbar/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/toolbar/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport type { ReactNode } from 'react';\n\nimport styles from './styles.module.css';\n\nexport type ToolbarProps = {\n  children?: ReactNode;\n  variant?: 'default' | 'editor';\n};\n\nexport const Toolbar = ({ children, variant = 'default' }: ToolbarProps) => {\n  return (\n    <div\n      className={cx(styles.toolbar, styles[variant])}\n      onClick={(e) => e.stopPropagation()}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Toolbar","children","variant","cx","styles","toolbar","e","stopPropagation"],"mappings":"0PAUaA,EAAUA,CAAC,CAAEC,SAAAA,EAAUC,QAAAA,EAAU,SAAwB,UAEjE,MAAA,CACC,UAAWC,EAAAA,EAAGC,EAAOC,QAASD,EAAOF,CAAO,CAAC,EAC7C,QAAUI,GAAMA,EAAEC,kBAAkB,iBAAA,UAEnCN,SAAAA,EACH"}

package/dist/components/toolbar/index.js

@@ -0,0 +1,14 @@
+import { jsx as l } from "react/jsx-runtime";
+import { t as e } from "../../classix-DG18itHa.js";
+import '../../assets/index43.css';const s = "_toolbar_104fz_1", n = "_editor_104fz_33", o = {
+  toolbar: s,
+  default: "_default_104fz_26",
+  editor: n
+}, f = ({
+  children: t,
+  variant: r = "default"
+}) => /* @__PURE__ */ l("div", { className: e(o.toolbar, o[r]), onClick: (a) => a.stopPropagation(), "data-component": "toolbar", children: t });
+export {
+  f as Toolbar
+};
+//# sourceMappingURL=index.js.map

package/dist/components/toolbar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/toolbar/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport type { ReactNode } from 'react';\n\nimport styles from './styles.module.css';\n\nexport type ToolbarProps = {\n  children?: ReactNode;\n  variant?: 'default' | 'editor';\n};\n\nexport const Toolbar = ({ children, variant = 'default' }: ToolbarProps) => {\n  return (\n    <div\n      className={cx(styles.toolbar, styles[variant])}\n      onClick={(e) => e.stopPropagation()}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["Toolbar","children","variant","cx","styles","toolbar","e","stopPropagation"],"mappings":";;;;;;GAUaA,IAAUA,CAAC;AAAA,EAAEC,UAAAA;AAAAA,EAAUC,SAAAA,IAAU;AAAwB,wBAEjE,OAAA,EACC,WAAWC,EAAGC,EAAOC,SAASD,EAAOF,CAAO,CAAC,GAC7C,SAAUI,CAAAA,MAAMA,EAAEC,mBAAkB,kBAAA,WAEnCN,UAAAA,GACH;"}

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/index.css');const e=require("./components/_avatar/index.cjs"),n=require("./components/_card/index.cjs"),o=require("./components/_collapsible/index.cjs"),t=require("./components/_croppable/index.cjs"),r=require("./components/_dropzone/index.cjs"),i=require("./components/_editor/index.cjs"),s=require("./components/_messages/index.cjs"),c=require("./components/_portal/index.cjs"),_=require("./components/_sortable/index.cjs"),a=require("./components/_toasts/index.cjs"),d=require("./components/_widget/index.cjs"),p=require("./components/accordion/index.cjs"),u=require("./components/app-link/index.cjs"),m=require("./components/aside/index.cjs"),x=require("./components/badge/index.cjs"),l=require("./components/banner/index.cjs"),q=require("./components/branding/index.cjs"),g=require("./components/button/index.cjs"),b=require("./components/checkbox/index.cjs"),L=require("./components/controls/index.cjs"),T=require("./components/dialog/index.cjs"),C=require("./components/figure/index.cjs"),k=require("./components/file/index.cjs"),A=require("./components/footer/index.cjs"),B=require("./components/form/index.cjs"),F=require("./components/graph/index.cjs"),h=require("./components/group/index.cjs"),v=require("./components/header/index.cjs"),I=require("./components/icon/index.cjs"),S=require("./components/image/index.cjs"),f=require("./components/input/index.cjs"),y=require("./components/layout/index.cjs"),M=require("./components/link/index.cjs"),D=require("./components/list/index.cjs"),G=require("./components/loading/index.cjs"),z=require("./components/message/index.cjs"),P=require("./components/nav/index.cjs"),E=require("./components/select/index.cjs"),H=require("./components/table/index.cjs"),N=require("./components/textarea/index.cjs"),W=require("./components/toast/index.cjs"),j=require("./components/toggle/index.cjs");exports.Avatar=e.Avatar;exports.Card=n.Card;exports.Collapsible=o.Collapsible;exports.Croppable=t.Croppable;exports.Dropzone=r.Dropzone;exports.Editor=i.Editor;exports.Messages=s.Messages;exports.Portal=c.Portal;exports.Sortable=_.Sortable;exports.Toasts=a.Toasts;exports.Widget=d.Widget;exports.Accordion=p.Accordion;exports.AppLink=u.AppLink;exports.Aside=m.Aside;exports.Badge=x.Badge;exports.Banner=l.Banner;exports.Branding=q.Branding;exports.Button=g.Button;exports.Checkbox=b.Checkbox;exports.Controls=L.Controls;exports.Dialog=T.Dialog;exports.Figure=C.Figure;exports.File=k.File;exports.Footer=A.Footer;exports.Form=B.Form;exports.Graph=F.Graph;exports.Group=h.Group;exports.Header=v.Header;exports.Icon=I.Icon;exports.Image=S.Image;exports.Input=f.Input;exports.Layout=y.Layout;exports.Link=M.Link;exports.List=D.List;exports.Loading=G.Loading;exports.Message=z.Message;exports.Nav=P.Nav;exports.Select=E.Select;exports.Table=H.Table;exports.Textarea=N.Textarea;exports.Toast=W.Toast;exports.Toggle=j.Toggle;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/index.css');const e=require("./components/_avatar/index.cjs"),n=require("./components/_card/index.cjs"),o=require("./components/_collapsible/index.cjs"),r=require("./components/_croppable/index.cjs"),t=require("./components/_dropzone/index.cjs"),i=require("./components/_editor/index.cjs"),s=require("./components/_messages/index.cjs"),c=require("./components/_portal/index.cjs"),_=require("./components/_sortable/index.cjs"),a=require("./components/_toasts/index.cjs"),d=require("./components/_widget/index.cjs"),p=require("./components/accordion/index.cjs"),u=require("./components/app-link/index.cjs"),m=require("./components/aside/index.cjs"),x=require("./components/badge/index.cjs"),l=require("./components/banner/index.cjs"),q=require("./components/branding/index.cjs"),g=require("./components/button/index.cjs"),b=require("./components/checkbox/index.cjs"),T=require("./components/controls/index.cjs"),L=require("./components/dialog/index.cjs"),C=require("./components/figure/index.cjs"),k=require("./components/file/index.cjs"),A=require("./components/footer/index.cjs"),B=require("./components/form/index.cjs"),F=require("./components/graph/index.cjs"),h=require("./components/group/index.cjs"),v=require("./components/header/index.cjs"),I=require("./components/icon/index.cjs"),S=require("./components/image/index.cjs"),f=require("./components/input/index.cjs"),y=require("./components/layout/index.cjs"),M=require("./components/link/index.cjs"),D=require("./components/list/index.cjs"),G=require("./components/loading/index.cjs"),z=require("./components/message/index.cjs"),P=require("./components/nav/index.cjs"),E=require("./components/select/index.cjs"),H=require("./components/table/index.cjs"),N=require("./components/textarea/index.cjs"),W=require("./components/toast/index.cjs"),j=require("./components/toggle/index.cjs"),w=require("./components/toolbar/index.cjs");exports.Avatar=e.Avatar;exports.Card=n.Card;exports.Collapsible=o.Collapsible;exports.Croppable=r.Croppable;exports.Dropzone=t.Dropzone;exports.Editor=i.Editor;exports.Messages=s.Messages;exports.Portal=c.Portal;exports.Sortable=_.Sortable;exports.Toasts=a.Toasts;exports.Widget=d.Widget;exports.Accordion=p.Accordion;exports.AppLink=u.AppLink;exports.Aside=m.Aside;exports.Badge=x.Badge;exports.Banner=l.Banner;exports.Branding=q.Branding;exports.Button=g.Button;exports.Checkbox=b.Checkbox;exports.Controls=T.Controls;exports.Dialog=L.Dialog;exports.Figure=C.Figure;exports.File=k.File;exports.Footer=A.Footer;exports.Form=B.Form;exports.Graph=F.Graph;exports.Group=h.Group;exports.Header=v.Header;exports.Icon=I.Icon;exports.Image=S.Image;exports.Input=f.Input;exports.Layout=y.Layout;exports.Link=M.Link;exports.List=D.List;exports.Loading=G.Loading;exports.Message=z.Message;exports.Nav=P.Nav;exports.Select=E.Select;exports.Table=H.Table;exports.Textarea=N.Textarea;exports.Toast=W.Toast;exports.Toggle=j.Toggle;exports.Toolbar=w.Toolbar;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.ts

@@ -5,6 +5,7 @@ import { ForwardRefExoticComponent } from 'react';
 import { ImgHTMLAttributes } from 'react';
 import { InputHTMLAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
+import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 
 export declare const Accordion: ({ children, icon, label, open }: AccordionProps) => JSX.Element;
@@ -113,15 +114,19 @@ export declare const Controls: ({ children, ...props }: ControlsProps) => JSX.El
 
 declare type ControlsProps = React.ComponentPropsWithoutRef<'menu'> & {};
 
-export declare const Croppable: ({ children, fill, height, onCroppableChange, onFileChange, onTransformChange, transform, }: CroppableProps) => JSX.Element;
+export declare const Croppable: ({ children, fill, height, image, label, onCroppableChange, onFileChange, onImageChange, onTransformChange, transform, standalone, }: CroppableProps) => JSX.Element;
 
 declare type CroppableProps = {
     children?: default_2.ReactNode;
     fill?: 'width' | 'height' | 'none';
     height?: number;
+    image?: string | null;
+    label?: string;
     onCroppableChange?: (rect: DOMRect) => void;
     onFileChange?: (file: File | null) => void;
+    onImageChange?: (file: File | null) => void;
     onTransformChange?: (transform: CroppableTransform) => void;
+    standalone?: boolean;
     transform?: CroppableTransform;
 };
 
@@ -454,6 +459,13 @@ declare type ToggleProps = {
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 };
 
+export declare const Toolbar: ({ children, variant }: ToolbarProps) => JSX.Element;
+
+declare type ToolbarProps = {
+    children?: ReactNode;
+    variant?: 'default' | 'editor';
+};
+
 declare const variants: {
     default: string;
     meta: string;

package/dist/index.js

@@ -2,12 +2,12 @@ import { Avatar as e } from "./components/_avatar/index.js";
 import { Card as p } from "./components/_card/index.js";
 import { Collapsible as x } from "./components/_collapsible/index.js";
 import { Croppable as a } from "./components/_croppable/index.js";
-import { Dropzone as n } from "./components/_dropzone/index.js";
+import { Dropzone as l } from "./components/_dropzone/index.js";
 import { Editor as s } from "./components/_editor/index.js";
 import { Messages as d } from "./components/_messages/index.js";
-import { Portal as c } from "./components/_portal/index.js";
-import { Sortable as C } from "./components/_sortable/index.js";
-import { Toasts as T } from "./components/_toasts/index.js";
+import { Portal as T } from "./components/_portal/index.js";
+import { Sortable as u } from "./components/_sortable/index.js";
+import { Toasts as L } from "./components/_toasts/index.js";
 import { Widget as B } from "./components/_widget/index.js";
 import { Accordion as k } from "./components/accordion/index.js";
 import { AppLink as h } from "./components/app-link/index.js";
@@ -29,17 +29,18 @@ import { Header as eo } from "./components/header/index.js";
 import { Icon as po } from "./components/icon/index.js";
 import { Image as xo } from "./components/image/index.js";
 import { Input as ao } from "./components/input/index.js";
-import { Layout as no } from "./components/layout/index.js";
+import { Layout as lo } from "./components/layout/index.js";
 import { Link as so } from "./components/link/index.js";
 import { List as bo } from "./components/list/index.js";
-import { Loading as uo } from "./components/loading/index.js";
-import { Message as Lo } from "./components/message/index.js";
+import { Loading as co } from "./components/loading/index.js";
+import { Message as Co } from "./components/message/index.js";
 import { Nav as Ao } from "./components/nav/index.js";
 import { Select as Fo } from "./components/select/index.js";
 import { Table as Io } from "./components/table/index.js";
 import { Textarea as vo } from "./components/textarea/index.js";
 import { Toast as Go } from "./components/toast/index.js";
 import { Toggle as So } from "./components/toggle/index.js";
+import { Toolbar as zo } from "./components/toolbar/index.js";
 import './assets/index.css';export {
   k as Accordion,
   h as AppLink,
@@ -55,7 +56,7 @@ import './assets/index.css';export {
   q as Controls,
   a as Croppable,
   J as Dialog,
-  n as Dropzone,
+  l as Dropzone,
   s as Editor,
   O as Figure,
   R as File,
@@ -67,21 +68,22 @@ import './assets/index.css';export {
   po as Icon,
   xo as Image,
   ao as Input,
-  no as Layout,
+  lo as Layout,
   so as Link,
   bo as List,
-  uo as Loading,
-  Lo as Message,
+  co as Loading,
+  Co as Message,
   d as Messages,
   Ao as Nav,
-  c as Portal,
+  T as Portal,
   Fo as Select,
-  C as Sortable,
+  u as Sortable,
   Io as Table,
   vo as Textarea,
   Go as Toast,
-  T as Toasts,
+  L as Toasts,
   So as Toggle,
+  zo as Toolbar,
   B as Widget
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/styles.module-BuPl_9yN.cjs

@@ -0,0 +1,2 @@
+"use strict";require('./assets/styles.css');const t="_container_11w26_1",n="_input_11w26_10",e="_label_11w26_47",i="_required_11w26_51",_={container:t,input:n,label:e,required:i};exports.inputStyles=_;
+//# sourceMappingURL=styles.module-BuPl_9yN.cjs.map

package/dist/styles.module-BuPl_9yN.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module-BuPl_9yN.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/styles.module-ZrsD4xw8.js

@@ -0,0 +1,10 @@
+import './assets/styles.css';const n = "_container_11w26_1", e = "_input_11w26_10", t = "_label_11w26_47", _ = "_required_11w26_51", i = {
+  container: n,
+  input: e,
+  label: t,
+  required: _
+};
+export {
+  i
+};
+//# sourceMappingURL=styles.module-ZrsD4xw8.js.map

package/dist/styles.module-ZrsD4xw8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module-ZrsD4xw8.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solibo/solibo-ui",
-  "version": "0.3.28",
+  "version": "0.3.30",
   "type": "module",
   "scripts": {
     "dev": "vite build --watch",

package/dist/styles.module--qoz6wR5.cjs

@@ -1,2 +0,0 @@
-"use strict";require('./assets/styles.css');const t="_container_1qx20_1",n="_input_1qx20_10",e="_label_1qx20_45",i="_required_1qx20_49",_={container:t,input:n,label:e,required:i};exports.inputStyles=_;
-//# sourceMappingURL=styles.module--qoz6wR5.cjs.map

package/dist/styles.module--qoz6wR5.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.module--qoz6wR5.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/styles.module-y5zmJBcz.js

@@ -1,10 +0,0 @@
-import './assets/styles.css';const n = "_container_1qx20_1", e = "_input_1qx20_10", t = "_label_1qx20_45", _ = "_required_1qx20_49", i = {
-  container: n,
-  input: e,
-  label: t,
-  required: _
-};
-export {
-  i
-};
-//# sourceMappingURL=styles.module-y5zmJBcz.js.map

package/dist/styles.module-y5zmJBcz.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.module-y5zmJBcz.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}