@wrdagency/blockout 0.0.10 → 0.0.12

package/dist/{2NBKRL7C-raj2vrMY.js → 2NBKRL7C-C6mXReCE.js}

@@ -1,7 +1,7 @@
-import { u as _ } from "./VIIRIBF3-B3f0V2Nc.js";
-import { c as H, C as T, a as k, m as y, f as P, b as w, d as A, _ as D, i as N, u as F, e as R, g as j, h as C, j as d, k as B, l as K, n as V } from "./P7GR5CS5-PkUYC6hd.js";
+import { u as _ } from "./VIIRIBF3-B585VK9r.js";
+import { c as H, C as T, b as k, m as y, f as P, d as w, e as A, _ as D, i as N, u as F, g as R, h as j, j as C, k as d, l as B, n as K, o as V } from "./P7GR5CS5-DNbthaqU.js";
 import { createContext as W } from "react";
-import { u as q, a as L, b as z, h as x } from "./UQQRIHDV-xtNCxi0H.js";
+import { u as q, a as L, b as z, h as x } from "./UQQRIHDV-CFdrMoqW.js";
 var b = H(
   [k],
   [T]

package/dist/{P7GR5CS5-PkUYC6hd.js → P7GR5CS5-DNbthaqU.js}

@@ -575,7 +575,7 @@ export {
   Pt as Y,
   Qt as Z,
   st as _,
-  Ye as a,
+  We as a,
   ue as a0,
   Jt as a1,
   Ce as a2,
@@ -612,20 +612,20 @@ export {
   $e as ax,
   Fe as ay,
   Be as az,
-  Le as b,
+  Ye as b,
   w as c,
-  Ie as d,
-  Q as e,
+  Le as d,
+  Ie as e,
   De as f,
-  re as g,
-  v as h,
+  Q as g,
+  re as h,
   Xt as i,
-  c as j,
-  le as k,
-  fe as l,
+  v as j,
+  c as k,
+  le as l,
   Me as m,
-  E as n,
-  We as o,
+  fe as n,
+  E as o,
   Xe as p,
   je as q,
   ye as r,

package/dist/{T7VMP3TM-BeJUiw28.js → T7VMP3TM-B3jxXFmj.js}

@@ -1,5 +1,5 @@
-import { y as z, x as Te, D as De, z as ce, an as $n, n as G, M as Ut, r as Yt, j as _, c as Cr, P as Gt, C as Ar, o as Tr, a as Vn, b as ee, _ as se, ao as _r, i as Fe, ag as Rr, v as j, ap as Ue, Y as Xt, e as ue, a3 as Ne, u as rt, W as Jt, G as fe, h as W, s as Be, aq as Ir, f as K, d as Q, ar as Zt, as as Hn, t as Bn, K as Fr, at as vn, a4 as nt, E as Qt, I as de, Z as Lr, aj as Mr, w as Wn, au as Nr, av as kr, U as Rt, aw as Dt, A as zn, a1 as Vt, ax as $r, ay as Vr, a2 as Hr, a6 as Br, az as Ct, a5 as Wr, a7 as zr, O as jr, p as Kr, am as qr } from "./P7GR5CS5-PkUYC6hd.js";
-import { t as en, c as it, f as $e, l as Ur, i as hn, d as re, s as xt, n as ke, q as Yr, k as Gr, r as Xr, v as It, e as jn, w as Jr, x as Zr, u as he, m as Kn, o as qn, y as Qr, g as Un, z as Ft, A as yn, B as eo, C as to, F as no, D as ro, E as oo, G as io, H as ot, I as so, J as ao, K as co } from "./UQQRIHDV-xtNCxi0H.js";
+import { y as z, x as Te, D as De, z as ce, an as $n, o as G, M as Ut, r as Yt, k as _, c as Cr, P as Gt, C as Ar, a as Tr, b as Vn, d as ee, _ as se, ao as _r, i as Fe, ag as Rr, v as j, ap as Ue, Y as Xt, g as ue, a3 as Ne, u as rt, W as Jt, G as fe, j as W, s as Be, aq as Ir, f as K, e as Q, ar as Zt, as as Hn, t as Bn, K as Fr, at as vn, a4 as nt, E as Qt, I as de, Z as Lr, aj as Mr, w as Wn, au as Nr, av as kr, U as Rt, aw as Dt, A as zn, a1 as Vt, ax as $r, ay as Vr, a2 as Hr, a6 as Br, az as Ct, a5 as Wr, a7 as zr, O as jr, p as Kr, am as qr } from "./P7GR5CS5-DNbthaqU.js";
+import { t as en, c as it, f as $e, l as Ur, i as hn, d as re, s as xt, n as ke, q as Yr, k as Gr, r as Xr, v as It, e as jn, w as Jr, x as Zr, u as he, m as Kn, o as qn, y as Qr, g as Un, z as Ft, A as yn, B as eo, C as to, F as no, D as ro, E as oo, G as io, H as ot, I as so, J as ao, K as co } from "./UQQRIHDV-CFdrMoqW.js";
 import Yn, { createContext as Je, useRef as Y, useEffect as U, useState as le, useCallback as st, useMemo as Gn, useContext as tn, isValidElement as uo } from "react";
 import { jsx as H, jsxs as yt, Fragment as bt } from "react/jsx-runtime";
 function lo(e) {

package/dist/{UQQRIHDV-xtNCxi0H.js → UQQRIHDV-CFdrMoqW.js}

@@ -1,4 +1,4 @@
-import { i as Ue, Q as j, R as gt, S as Et, T as yt, D as Ae, L as ht, x as It, z as He, U as wt, V as je, v as be, h as B, j as D, e as A, F as xt, W as he, n as _t, b as ee, _ as H, X as Tt, r as qe, s as te, t as ce, f as re, d as ne, Y as oe, I as ze, Z as Ct, $ as Ge, E as De, J as Ie, a0 as $e, a1 as Q, a2 as ie, a3 as W, a4 as Ot, a5 as Pt, a6 as We, a7 as At, a8 as Dt, a9 as Fe, p as Ye, aa as Ft, ab as ve, u as ae, ac as Lt, ad as Mt, G as kt, ae as Kt, af as Rt, m as Je, B as Vt } from "./P7GR5CS5-PkUYC6hd.js";
+import { i as Ue, Q as j, R as gt, S as Et, T as yt, D as Ae, L as ht, x as It, z as He, U as wt, V as je, v as be, j as B, k as D, g as A, F as xt, W as he, o as _t, d as ee, _ as H, X as Tt, r as qe, s as te, t as ce, f as re, e as ne, Y as oe, I as ze, Z as Ct, $ as Ge, E as De, J as Ie, a0 as $e, a1 as Q, a2 as ie, a3 as W, a4 as Ot, a5 as Pt, a6 as We, a7 as At, a8 as Dt, a9 as Fe, p as Ye, aa as Ft, ab as ve, u as ae, ac as Lt, ad as Mt, G as kt, ae as Kt, af as Rt, m as Je, B as Vt } from "./P7GR5CS5-DNbthaqU.js";
 import * as $ from "react";
 import Xe, { useRef as Y, useEffect as G, createContext as Nt, useState as me, useContext as Qe, useMemo as Ze, useCallback as et } from "react";
 import { g as Bt } from "./_commonjsHelpers-C6fGbg64.js";

package/dist/{VIIRIBF3-B3f0V2Nc.js → VIIRIBF3-B585VK9r.js}

@@ -1,4 +1,4 @@
-import { c as r, P as t, o as v, C as a, a as d } from "./P7GR5CS5-PkUYC6hd.js";
+import { c as r, P as t, a as v, C as a, b as d } from "./P7GR5CS5-DNbthaqU.js";
 import { createContext as n } from "react";
 var o = r(
   [v],

package/dist/assets/form.css

@@ -0,0 +1 @@
+.component-form-title{font-size:1.75rem;font-weight:600;margin-bottom:.25rem}.component-form-description{font-size:1rem;font-weight:400;color:var(--blockout__colours__surface--600)}.component-form-step{display:grid;gap:1.5rem;padding:1.5rem 0}.component-form-row{display:grid;gap:inherit}.component-form-row--2-cols{grid-template-columns:repeat(2,1fr)}.component-form-row--3-cols{grid-template-columns:repeat(3,1fr)}.component-form-pagination{display:flex;gap:1.5rem}

package/dist/assets/index.css

@@ -1 +1 @@
-.component-progress{--component-progress__steps: 0;--component-progress__step-width: max(.75rem, 3.5%);--component-progress__bg: var(--blockout__colours__surface--200);--component-progress__fg: var(--blockout__colours__surface--950);-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;display:block;height:4px;width:100%;border-radius:0;overflow:clip}.component-progress::-webkit-progress-bar{border-radius:0;height:100%;background:var(--component-progress__bg)}.component-progress::-moz-progress-bar{border-radius:0;height:100%;background:var(--component-progress__bg)}.component-progress::-webkit-progress-value{border-radius:0;height:100%;background:var(--component-progress__fg)}.component-progress:indeterminate:before{content:"";position:absolute;top:0;left:0;background-color:var(--component-progress__fg);height:100%;width:20%;transform-origin:left;animation:component-progress__indeterminate 2s ease-in-out infinite alternate}@keyframes component-progress__indeterminate{0%{left:-50%}to{left:100%}}.component-progress--with-steps:after{content:"";position:absolute;top:-1px;bottom:-1px;left:0;right:0;height:calc(100% + 2px);width:100%;z-index:1;background-image:linear-gradient(90deg,transparent 0%,transparent calc(100% - var(--component-progress__step-width)),var(--blockout__colours__surface--0) calc(100% - var(--component-progress__step-width)),var(--blockout__colours__surface--0) 100%);background-repeat:repeat-x;background-size:calc((100% + ((var(--component-progress__steps) - 1) * (var(--component-progress__step-width) / 2))) / var(--component-progress__steps)) 100%;background-position:0% center}
+.component-breadcrumbs{text-transform:uppercase;font-size:.75rem;font-weight:600;color:var(--blockout__colours__surface--700)}.component-breadcrumbs__list{display:flex;align-items:baseline;flex-wrap:wrap}.component-breadcrumbs__item{display:flex;align-items:baseline;gap:.125rem}.component-breadcrumbs__link{display:block;padding:.25rem .5rem;text-underline-offset:0;transition:color .15s ease,text-underline-offset .15s ease}.component-breadcrumbs__item:first-child .component-breadcrumbs__link{padding-left:0}.component-breadcrumbs__item:last-child .component-breadcrumbs__link{color:var(--blockout__colours__surface--500)}.component-breadcrumbs__link:hover,.component-breadcrumbs__link:focus-visible{color:var(--blockout__colours__surface--950);text-decoration:underline;text-underline-offset:.125rem;outline:none}.component-breacrumbs__separator{color:var(--blockout__colours__surface--300)}.component-breadcrumbs__item:last-child .component-breacrumbs__separator{display:none}

package/dist/assets/index10.css

@@ -1 +1 @@
-.component-select-control__input{cursor:pointer;display:flex;width:100%}.component-select-control__input:focus{outline:none}.component-select-control__value{flex-grow:1;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;text-align:left;background-color:transparent;transition:background-color .25s ease}.component-select-control__value:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret{width:2rem;display:flex;justify-content:center;align-items:center;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:background-color .25s ease}.component-select-control__caret:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret>svg{width:.75rem;height:.75rem;fill:currentColor}.component-select-control__popover__wrapper{z-index:9999!important}.component-select-control__popover{background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);box-shadow:0 .175rem .375rem #0000001a;width:calc(var(--popover-anchor-width) + 2px);max-height:var(--popover-available-height);overflow-y:auto}.component-select-control__popover:focus{outline:none}.component-select-control__list{display:flex;flex-direction:column;gap:.325rem;padding:.325rem}.component-select-control__list:focus{outline:none}.component-select-control__popover__search-wrapper{display:flex;align-items:center;gap:0;padding-left:1rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-select-control__popover__search-icon{width:1rem;height:1rem;fill:var(--blockout__colours__surface--600)}.component-select-control__popover__search{width:100%;padding:.375rem .675rem;min-height:40px}.component-select-control__popover__search:focus{outline:none}.component-select-control__option{display:flex;justify-content:start;align-items:start;flex-direction:column;gap:.25rem;padding:.375rem .675rem;min-height:40px;cursor:pointer;transition:background-color .25s ease}.component-select-control__option:focus{outline:none}.component-select-control__option:first-child{border-top:none}.component-select-control__option__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-select-control__option__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-select-control__option[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-select-control__option[data-active-item=true] .component-select-control__option__label{color:var(--blockout__colours__primary--950)}.component-select-control__option[data-active-item=true] .component-select-control__option__description{color:var(--blockout__colours__primary--900);opacity:.7}
+.component-menu__button{outline:0px solid transparent;outline-offset:0px;cursor:pointer;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease}.component-menu__button:hover{background-color:var(--blockout__colours__surface--50)}.component-menu__button:focus-visible{background-color:transparent;outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-menu__menu-wrapper{z-index:9999!important}.component-menu{display:flex;flex-direction:column;background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);min-width:8rem;gap:.325rem;padding:.325rem;box-shadow:0 .175rem .375rem #0000001a}.component-menu__arrow>svg{fill:var(--blockout__colours__surface--0)!important;stroke:var(--blockout__colours__surface--300)!important}.component-menu__item{display:flex;align-items:baseline;gap:.875rem;padding:.375rem .675rem;width:100%;cursor:pointer;transition:background-color .25s ease}.component-menu__item[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-menu__item:focus-visible{outline:none}.component-menu__item[data-active-item=true] .component-menu__item__label{color:var(--blockout__colours__primary--950)}.component-menu__item[data-active-item=true] .component-menu__item__description{color:var(--blockout__colours__primary--900);opacity:.7}.component-menu__item__icon{width:1.25rem;height:1.25rem;fill:var(--blockout__colours__surface--400)}.component-menu__item__icon--pictoral{transform:translateY(.25rem)}.component-menu__item__text{flex-grow:1}.component-menu__item__text__header{display:flex;align-items:center;gap:2rem;justify-content:space-between;width:100%}.component-menu__item__text__header+.component-menu__item__description{margin-top:.25rem}.component-menu__item__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-menu__item__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;padding-right:.375rem;transition:color .25s ease,opacity .25s ease}.component-menu__item--toggle--checked .component-menu__item__icon--checkbox{fill:var(--blockout__colours__surface--950)}.component-menu__separator{margin:0 -.325rem;border-top:1px solid var(--blockout__colours__surface--300);border-bottom:none}

package/dist/assets/index11.css

@@ -0,0 +1 @@
+.component-select-control__input{cursor:pointer;display:flex;width:100%}.component-select-control__input:focus{outline:none}.component-select-control__value{flex-grow:1;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;text-align:left;background-color:transparent;transition:background-color .25s ease}.component-select-control__input:disabled .component-select-control__value{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}.component-select-control__value:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret{width:2rem;display:flex;justify-content:center;align-items:center;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:background-color .25s ease}.component-select-control__caret:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret>svg{width:.75rem;height:.75rem;fill:currentColor}.component-select-control__popover__wrapper{z-index:9999!important}.component-select-control__popover{background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);box-shadow:0 .175rem .375rem #0000001a;width:calc(var(--popover-anchor-width) + 2px);max-height:var(--popover-available-height);overflow-y:auto}.component-select-control__popover:focus{outline:none}.component-select-control__list{display:flex;flex-direction:column;gap:.325rem;padding:.325rem}.component-select-control__list:focus{outline:none}.component-select-control__popover__search-wrapper{display:flex;align-items:center;gap:0;padding-left:1rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-select-control__popover__search-icon{width:1rem;height:1rem;fill:var(--blockout__colours__surface--600)}.component-select-control__popover__search{width:100%;padding:.375rem .675rem;min-height:40px}.component-select-control__popover__search:focus{outline:none}.component-select-control__option{display:flex;justify-content:start;align-items:start;flex-direction:column;gap:.25rem;padding:.375rem .675rem;min-height:40px;cursor:pointer;transition:background-color .25s ease}.component-select-control__option:focus{outline:none}.component-select-control__option:first-child{border-top:none}.component-select-control__option[aria-disabled=true] .component-select-control__option__label{color:var(--blockout__colours__surface--400)}.component-select-control__option[aria-disabled=true] .component-select-control__option__description{color:var(--blockout__colours__surface--300)}.component-select-control__option__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-select-control__option__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-select-control__option[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-select-control__option[data-active-item=true] .component-select-control__option__label{color:var(--blockout__colours__primary--950)}.component-select-control__option[data-active-item=true] .component-select-control__option__description{color:var(--blockout__colours__primary--900);opacity:.7}

package/dist/assets/index2.css

@@ -1 +1 @@
-.component-toggle-control__buttons{display:flex;overflow:hidden}.component-toggle-control__on,.component-toggle-control__off{padding:.75rem;min-height:40px;width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;font-weight:500;flex-basis:50%;cursor:pointer;position:relative;transition:color .25s ease,background-color .25s ease}.component-toggle-control__off{border-right:1px solid var(--blockout__colours__surface--300)}.component-toggle-control__on,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--600);box-shadow:none;z-index:1}.component-toggle-control__off,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--0);color:var(--blockout__colours__surface--950);box-shadow:0 0 .75rem .125rem #0003;z-index:2}
+.component-button{--button__bg: var(--blockout__colours__primary--500);--button__bg--hover: var(--blockout__colours__primary--600);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50);display:flex;align-items:center;justify-content:center;gap:1rem;padding:.75rem 1.25rem;min-height:40px;font-size:1rem;width:fit-content;background-color:var(--button__bg);color:var(--button__text);cursor:pointer;outline:0px solid transparent;outline-offset:0px;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-button>svg{width:1.25rem;height:1.25rem;color:currentColor}.component-button:hover{background-color:var(--button__bg--hover);color:var(--button__text--hover)}.component-button:focus{background-color:var(--button__bg--hover);color:var(--button__text--hover);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-button:active{outline-offset:3px}.component-button--wide{width:100%}.component-button--outline{border:2px solid var(--button__bg);color:var(--button__bg);background-color:transparent}.component-button--outline:hover{border:2px solid var(--button__bg--hover);color:var(--button__bg--hover);background-color:transparent}.component-button--outline:focus{border:2px solid var(--button__bg--hover);color:var(--button__bg--hover);background-color:transparent}.component-button--primary{--button__bg: var(--blockout__colours__primary--500);--button__bg--hover: var(--blockout__colours__primary--600);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50)}.component-button--dark{--button__bg: var(--blockout__colours__surface--950);--button__bg--hover: var(--blockout__colours__surface--900);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50)}.component-button--light{--button__bg: var(--blockout__colours__surface--100);--button__bg--hover: var(--blockout__colours__surface--200);--button__text: var(--blockout__colours__surface--950);--button__text--hover: var(--blockout__colours__surface--950)}.component-button:disabled{opacity:.66;pointer-events:none}

package/dist/assets/index3.css

@@ -1 +1 @@
-.component-textarea-control__input{min-height:5rem!important;max-height:85vh!important;resize:vertical}
+.component-base-control{display:flex;flex-direction:column}.component-base-control__label{display:block;font-weight:600;color:var(--blockout__colours__surface--950);font-size:.875rem;text-transform:uppercase;padding-bottom:.375rem}.component-base-control__label__required{color:#df1414;padding-left:.25rem}.component-base-control__box{display:flex;flex-direction:row;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);transition:outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-base-control__box:focus-within{background-color:var(--blockout__colours__surface--0);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-base-control__control{flex-grow:1}.component-base-control__control>input,.component-base-control__control>select,.component-base-control__control>textarea{display:block;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;background-color:transparent;transition:background-color .25s ease}.component-base-control__control>input:hover,.component-base-control__control>select:hover,.component-base-control__control>textarea:hover{background-color:var(--blockout__colours__surface--50)}.component-base-control__control>input:focus,.component-base-control__control>select:focus,.component-base-control__control>textarea:focus{background-color:transparent;outline:none}.component-base-control__control>input:disabled,.component-base-control__control>select:disabled,.component-base-control__control>textarea:disabled{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}.component-base-control__help{margin-top:.25rem;max-width:65ch;font-size:.75rem;font-weight:400;color:var(--blockout__colours__surface--600)}fieldset.component-base-control .component-base-control__box{border:none}fieldset.component-base-control .component-base-control__box:focus-within{outline:none}fieldset.component-base-control .component-base-control__help{order:-1;margin-top:0;margin-bottom:.75rem}

package/dist/assets/index4.css

@@ -1 +1 @@
-.component-button{--button__bg: var(--blockout__colours__primary--500);--button__bg--hover: var(--blockout__colours__primary--600);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50);display:flex;align-items:center;justify-content:center;gap:1rem;padding:.75rem 1.25rem;min-height:40px;font-size:1rem;width:fit-content;background-color:var(--button__bg);color:var(--button__text);cursor:pointer;outline:0px solid transparent;outline-offset:0px;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-button>svg{width:1.25rem;height:1.25rem;color:currentColor}.component-button:hover{background-color:var(--button__bg--hover);color:var(--button__text--hover)}.component-button:focus{background-color:var(--button__bg--hover);color:var(--button__text--hover);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-button:active{outline-offset:3px}.component-button--wide{width:100%}.component-button--outline{border:2px solid var(--button__bg);color:var(--button__bg);background-color:transparent}.component-button--outline:hover{border:2px solid var(--button__bg--hover);color:var(--button__bg--hover);background-color:transparent}.component-button--outline:focus{border:2px solid var(--button__bg--hover);color:var(--button__bg--hover);background-color:transparent}.component-button--primary{--button__bg: var(--blockout__colours__primary--500);--button__bg--hover: var(--blockout__colours__primary--600);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50)}.component-button--dark{--button__bg: var(--blockout__colours__surface--950);--button__bg--hover: var(--blockout__colours__surface--900);--button__text: var(--blockout__colours__surface--50);--button__text--hover: var(--blockout__colours__surface--50)}.component-button--light{--button__bg: var(--blockout__colours__surface--100);--button__bg--hover: var(--blockout__colours__surface--200);--button__text: var(--blockout__colours__surface--950);--button__text--hover: var(--blockout__colours__surface--950)}.component-button:disabled{opacity:.66;pointer-events:none}
+.component-choice-control__choices{display:grid;gap:1.5rem}@media (min-width: 768px){.component-choice-control__choices{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1024px){.component-choice-control__choices{grid-template-columns:repeat(3,minmax(0,1fr))}}.component-choice-control__choice{padding:.325rem;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:outline .25s ease,outline-offset .25s ease}.component-choice-control__choice__body{display:flex;flex-direction:row;align-items:baseline;gap:.75rem;padding:.675rem}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__body{background-color:var(--blockout__colours__primary--50)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__primary--950)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__description{color:var(--blockout__colours__primary--900);opacity:.7}.component-choice-control__choice:focus-within{outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-choice-control__choice:has(input:disabled){background-color:var(--blockout__colours__surface--200)}.component-choice-control__choice:has(input:disabled) .component-choice-control__choice__label,.component-choice-control__choice:has(input:disabled) .component-choice-control__choice__description{color:var(--blockout__colours__surface--400)}.component-choice-control__choice__icon{position:relative;border:2px solid var(--blockout__colours__surface--300);width:1rem;height:1rem;transition:border-color .25s ease;border-radius:2px;transform:translateY(.125rem)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon{border-color:var(--blockout__colours__primary--950)}.component-choice-control__choice__icon:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:scale(0);display:block;background-color:var(--blockout__colours__primary--700);transition:transform .15s ease;border-radius:1px}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon:after{transform:scale(.75)}.component-choice-control__choice--single .component-choice-control__choice__icon{border-radius:1rem}.component-choice-control__choice--single .component-choice-control__choice__icon:after{border-radius:1rem}.component-choice-control__choice__label{font-weight:500;color:var(--blockout__colours__surface--600);transition:color .25s ease}.component-choice-control__choice__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__surface--950)}

package/dist/assets/index5.css

@@ -1 +1 @@
-.component-base-control{display:flex;flex-direction:column}.component-base-control__label{display:block;font-weight:500;color:var(--blockout__colours__surface--950);font-size:.75rem;text-transform:uppercase;padding-bottom:.375rem}.component-base-control__label__required{color:#df1414;padding-left:.25rem}.component-base-control__box{display:flex;flex-direction:row;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);transition:outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-base-control__box:focus-within{background-color:var(--blockout__colours__surface--0);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-base-control__control{flex-grow:1}.component-base-control__control>input,.component-base-control__control>select,.component-base-control__control>textarea{display:block;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;background-color:transparent;transition:background-color .25s ease}.component-base-control__control>input:hover,.component-base-control__control>select:hover,.component-base-control__control>textarea:hover{background-color:var(--blockout__colours__surface--50)}.component-base-control__control>input:focus,.component-base-control__control>select:focus,.component-base-control__control>textarea:focus{background-color:transparent;outline:none}.component-base-control__help{margin-top:.25rem;max-width:65ch;font-size:.75rem;font-weight:400;color:var(--blockout__colours__surface--600)}fieldset.component-base-control .component-base-control__box{border:none}fieldset.component-base-control .component-base-control__box:focus-within{outline:none}fieldset.component-base-control .component-base-control__help{order:-1;margin-top:0;margin-bottom:.75rem}
+.component-number-control__input::-webkit-outer-spin-button,.component-number-control__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.component-number-control__input{-moz-appearance:textfield}.component-number-control__spinbox{width:2rem;display:flex;flex-direction:column;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0)}.component-number-control__spinbox__button{display:flex;align-items:center;justify-content:center;flex-basis:50%;cursor:pointer;transition:background-color .25s ease}.component-number-control__spinbox__button:hover{background-color:var(--blockout__colours__surface--50)}.component-number-control__spinbox__button:first-child{border-bottom:1px solid var(--blockout__colours__surface--300)}.component-number-control__spinbox__button>svg{width:.75rem;height:.75rem;fill:currentColor}

package/dist/assets/index6.css

@@ -1 +1 @@
-.component-choice-control__choices{display:grid;gap:1.5rem}@media (min-width: 768px){.component-choice-control__choices{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1024px){.component-choice-control__choices{grid-template-columns:repeat(3,minmax(0,1fr))}}.component-choice-control__choice{display:flex;flex-direction:row;align-items:baseline;gap:.75rem;padding:1rem;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--200);cursor:pointer;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease}.component-choice-control__choice:focus-within{outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-choice-control__choice:has(input:checked){background-color:var(--blockout__colours__surface--0)}.component-choice-control__choice__icon{position:relative;border:2px solid var(--blockout__colours__surface--300);width:1rem;height:1rem;transition:border-color .25s ease;border-radius:2px;transform:translateY(.125rem)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon{border-color:var(--blockout__colours__surface--950)}.component-choice-control__choice__icon:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:scale(0);display:block;background-color:var(--blockout__colours__primary--950);transition:transform .15s ease;border-radius:1px}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon:after{transform:scale(.75)}.component-choice-control__choice--single .component-choice-control__choice__icon{border-radius:1rem}.component-choice-control__choice--single .component-choice-control__choice__icon:after{border-radius:1rem}.component-choice-control__choice__label{font-weight:500;color:var(--blockout__colours__surface--600);transition:color .25s ease}.component-choice-control__choice__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__surface--950)}
+.component-textarea-control__input{min-height:5rem!important;max-height:85vh!important;resize:vertical}

package/dist/assets/index7.css

@@ -1 +1 @@
-.component-number-control__input::-webkit-outer-spin-button,.component-number-control__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.component-number-control__input{-moz-appearance:textfield}.component-number-control__spinbox{width:2rem;display:flex;flex-direction:column;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0)}.component-number-control__spinbox__button{display:flex;align-items:center;justify-content:center;flex-basis:50%;cursor:pointer;transition:background-color .25s ease}.component-number-control__spinbox__button:hover{background-color:var(--blockout__colours__surface--50)}.component-number-control__spinbox__button:first-child{border-bottom:1px solid var(--blockout__colours__surface--300)}.component-number-control__spinbox__button>svg{width:.75rem;height:.75rem;fill:currentColor}
+.component-toggle-control__buttons{display:flex;overflow:hidden}.component-toggle-control__on,.component-toggle-control__off{padding:.75rem;min-height:40px;width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;font-weight:500;flex-basis:50%;cursor:pointer;position:relative;transition:color .25s ease,background-color .25s ease}.component-toggle-control__off{border-right:1px solid var(--blockout__colours__surface--300)}.component-toggle-control__on,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--600);box-shadow:none;z-index:1}.component-toggle-control__off,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--0);color:var(--blockout__colours__surface--950);box-shadow:0 0 .75rem .125rem #0003;z-index:2}.component-toggle-control__buttons:has(input:disabled) .component-toggle-control__on,.component-toggle-control__buttons:has(input:disabled:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--300);color:var(--blockout__colours__surface--400)}.component-toggle-control__buttons:has(input:disabled) .component-toggle-control__off,.component-toggle-control__buttons:has(input:disabled:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}

package/dist/assets/index8.css

@@ -1 +1 @@
-.component-data-table__table{border-collapse:separate;border-spacing:0}.component-data-table__th__target,.component-data-table__td{padding:1.25rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-data-table__th:first-child .component-data-table__th__target,.component-data-table__td:first-child{padding-left:.25rem}.component-data-table__th:last-child .component-data-table__th__target,.component-data-table__td:last-child{padding-right:.25rem}.component-data-table__th{text-align:left;font-weight:500}.component-data-table__th__target{display:flex;align-items:center;gap:.75rem;width:100%;height:100%;font-weight:500}.component-data-table__th__sort-indicator{width:1rem;height:1rem;fill:var(--blockout__colours__surface--400)}.component-data-table__td{white-space:nowrap}.component-data-table__td--sticky,.component-data-table__th--sticky{position:sticky;left:0;background-color:var(--blockout__colours__surface--0)}.component-data-table__td--sticky:after,.component-data-table__th--sticky:after{content:"";position:absolute;top:-1px;left:100%;bottom:0;width:1rem;pointer-events:none;background:linear-gradient(90deg,#00000016,#0000)}.component-data-table__tfoot .component-data-table__td{padding-top:.75rem;padding-bottom:.75rem;font-size:.875rem;color:var(--blockout__colours__surface--600)}
+.component-progress{--component-progress__steps: 0;--component-progress__step-width: max(.75rem, 3.5%);--component-progress__bg: var(--blockout__colours__surface--200);--component-progress__fg: var(--blockout__colours__surface--950);-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;display:block;height:4px;width:100%;border-radius:0;overflow:clip}.component-progress::-webkit-progress-bar{border-radius:0;height:100%;background:var(--component-progress__bg)}.component-progress::-moz-progress-bar{border-radius:0;height:100%;background:var(--component-progress__bg)}.component-progress::-webkit-progress-value{border-radius:0;height:100%;background:var(--component-progress__fg)}.component-progress:indeterminate:before{content:"";position:absolute;top:0;left:0;background-color:var(--component-progress__fg);height:100%;width:20%;transform-origin:left;animation:component-progress__indeterminate 2s ease-in-out infinite alternate}@keyframes component-progress__indeterminate{0%{left:-50%}to{left:100%}}.component-progress--with-steps:after{content:"";position:absolute;top:-1px;bottom:-1px;left:0;right:0;height:calc(100% + 2px);width:100%;z-index:1;background-image:linear-gradient(90deg,transparent 0%,transparent calc(100% - var(--component-progress__step-width)),var(--blockout__colours__surface--0) calc(100% - var(--component-progress__step-width)),var(--blockout__colours__surface--0) 100%);background-repeat:repeat-x;background-size:calc((100% + ((var(--component-progress__steps) - 1) * (var(--component-progress__step-width) / 2))) / var(--component-progress__steps)) 100%;background-position:0% center}

package/dist/assets/index9.css

@@ -1 +1 @@
-.component-menu__button{outline:0px solid transparent;outline-offset:0px;cursor:pointer;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease}.component-menu__button:hover{background-color:var(--blockout__colours__surface--50)}.component-menu__button:focus-visible{background-color:transparent;outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-menu__menu-wrapper{z-index:9999!important}.component-menu{display:flex;flex-direction:column;background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);min-width:8rem;gap:.325rem;padding:.325rem;box-shadow:0 .175rem .375rem #0000001a}.component-menu__arrow>svg{fill:var(--blockout__colours__surface--0)!important;stroke:var(--blockout__colours__surface--300)!important}.component-menu__item{display:flex;align-items:baseline;gap:.875rem;padding:.375rem .675rem;width:100%;cursor:pointer;transition:background-color .25s ease}.component-menu__item[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-menu__item:focus-visible{outline:none}.component-menu__item[data-active-item=true] .component-menu__item__label{color:var(--blockout__colours__primary--950)}.component-menu__item[data-active-item=true] .component-menu__item__description{color:var(--blockout__colours__primary--900);opacity:.7}.component-menu__item__icon{width:1.25rem;height:1.25rem;fill:var(--blockout__colours__surface--400)}.component-menu__item__icon--pictoral{transform:translateY(.25rem)}.component-menu__item__text{flex-grow:1}.component-menu__item__text__header{display:flex;align-items:center;gap:2rem;justify-content:space-between;width:100%}.component-menu__item__text__header+.component-menu__item__description{margin-top:.25rem}.component-menu__item__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-menu__item__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;padding-right:.375rem;transition:color .25s ease,opacity .25s ease}.component-menu__item--toggle--checked .component-menu__item__icon--checkbox{fill:var(--blockout__colours__surface--950)}.component-menu__separator{margin:0 -.325rem;border-top:1px solid var(--blockout__colours__surface--300);border-bottom:none}
+.component-data-table__table{border-collapse:separate;border-spacing:0}.component-data-table__th__target,.component-data-table__td{padding:1.25rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-data-table__th:first-child .component-data-table__th__target,.component-data-table__td:first-child{padding-left:.25rem}.component-data-table__th:last-child .component-data-table__th__target,.component-data-table__td:last-child{padding-right:.25rem}.component-data-table__th{text-align:left;font-weight:500}.component-data-table__th__target{display:flex;align-items:center;gap:.75rem;width:100%;height:100%;font-weight:500}.component-data-table__th__sort-indicator{width:1rem;height:1rem;fill:var(--blockout__colours__surface--400)}.component-data-table__td{white-space:nowrap}.component-data-table__td--sticky,.component-data-table__th--sticky{position:sticky;left:0;background-color:var(--blockout__colours__surface--0)}.component-data-table__td--sticky:after,.component-data-table__th--sticky:after{content:"";position:absolute;top:-1px;left:100%;bottom:0;width:1rem;pointer-events:none;background:linear-gradient(90deg,#00000016,#0000)}.component-data-table__tfoot .component-data-table__td{padding-top:.75rem;padding-bottom:.75rem;font-size:.875rem;color:var(--blockout__colours__surface--600)}

package/dist/components/breadcrumbs/index.d.ts

@@ -0,0 +1,7 @@
+import { FC, HTMLAttributes } from 'react';
+import { Crumb } from './types';
+interface BreadcrumbsProps extends HTMLAttributes<HTMLElement> {
+    crumbs: Crumb[];
+}
+export declare const Breadcrumbs: FC<BreadcrumbsProps>;
+export {};

package/dist/components/breadcrumbs/index.js

@@ -0,0 +1,29 @@
+import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { cn as c } from "../../utils/css.js";
+import '../../assets/index.css';const t = ({
+  crumbs: e,
+  className: n,
+  ...o
+}) => /* @__PURE__ */ r(
+  "nav",
+  {
+    className: c("component-breadcrumbs", n),
+    "aria-label": "breadcrumb",
+    ...o,
+    children: /* @__PURE__ */ r("ol", { className: "component-breadcrumbs__list", children: e.map((a) => /* @__PURE__ */ s("li", { className: "component-breadcrumbs__item", children: [
+      /* @__PURE__ */ r("a", { className: "component-breadcrumbs__link", href: a.href, children: a.label }),
+      /* @__PURE__ */ r(
+        "span",
+        {
+          className: "component-breacrumbs__separator",
+          role: "separator",
+          "aria-orientation": "horizontal",
+          children: "/"
+        }
+      )
+    ] })) })
+  }
+);
+export {
+  t as Breadcrumbs
+};

package/dist/components/breadcrumbs/types.d.ts

@@ -0,0 +1,4 @@
+export type Crumb = {
+    href: string;
+    label: string;
+};

package/dist/components/button/index.js

@@ -1,6 +1,6 @@
 import { jsx as p } from "react/jsx-runtime";
 import { cn as c } from "../../utils/css.js";
-import '../../assets/index4.css';const a = ({
+import '../../assets/index2.css';const a = ({
   children: t,
   className: o,
   variant: n = "primary",

package/dist/components/controls/base-control/index.js

@@ -1,6 +1,6 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { cn as b } from "../../../utils/css.js";
-import '../../../assets/index5.css';const N = ({
+import '../../../assets/index3.css';const N = ({
   as: n = "div",
   label: c,
   className: s,

package/dist/components/controls/choice-control/choice.js

@@ -1,19 +1,19 @@
-import { jsxs as n, jsx as c } from "react/jsx-runtime";
+import { jsx as c, jsxs as n } from "react/jsx-runtime";
 import { cn as m } from "../../../utils/css.js";
 import { useId as s } from "react";
 import '../../../assets/style.css';/* empty css                      */
 import { VisuallyHidden as a } from "../../../primitives/visually-hidden/index.js";
 const x = ({
   value: t,
-  label: r,
+  label: l,
   description: o,
-  disabled: l,
+  disabled: r,
   multiple: e = !1,
   className: _,
   ...h
 }) => {
   const i = s();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ c(
     "label",
     {
       className: m(
@@ -22,7 +22,7 @@ const x = ({
         _
       ),
       htmlFor: i,
-      children: [
+      children: /* @__PURE__ */ n("div", { className: "component-choice-control__choice__body", children: [
         /* @__PURE__ */ c(a, { children: /* @__PURE__ */ c(
           "input",
           {
@@ -31,7 +31,7 @@ const x = ({
             id: i,
             type: e ? "checkbox" : "radio",
             value: t,
-            disabled: l
+            disabled: r
           }
         ) }),
         /* @__PURE__ */ c(
@@ -42,10 +42,10 @@ const x = ({
           }
         ),
         /* @__PURE__ */ n("div", { className: "component-choice-control__choice__text", children: [
-          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: r }),
+          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: l }),
           o && /* @__PURE__ */ c("p", { className: "component-choice-control__choice__description", children: o })
         ] })
-      ]
+      ] })
     }
   );
 };

package/dist/components/controls/choice-control/index.d.ts

@@ -1,9 +1,18 @@
 import { Optionable } from '../../../types/options';
 import { InputHTMLAttributes } from 'react';
 import { ControlFC } from '../base-control/props';
-interface ChoiceControlProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+interface ChoiceControlProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "checked"> {
     options?: Optionable[];
-    multiple?: boolean;
 }
-export declare const ChoiceControl: ControlFC<ChoiceControlProps>;
+interface MultipleChoiceControlProps extends ChoiceControlProps {
+    multiple: true;
+    value?: string[];
+    onChangeValue?: (value: string[]) => void;
+}
+interface SingleChoiceControlProps extends ChoiceControlProps {
+    multiple?: false;
+    value?: string;
+    onChangeValue?: (value: string) => void;
+}
+export declare const ChoiceControl: ControlFC<MultipleChoiceControlProps | SingleChoiceControlProps>;
 export {};

package/dist/components/controls/choice-control/index.js

@@ -1,31 +1,41 @@
-import { jsx as o } from "react/jsx-runtime";
-import { normalizeOption as p } from "../../../types/options.js";
+import { jsx as t } from "react/jsx-runtime";
+import { normalizeOption as C } from "../../../types/options.js";
+import { noop as c } from "../../../utils/noop.js";
 import "react";
-import { BaseControl as a } from "../base-control/index.js";
-import { useBaseControlProps as f } from "../base-control/props.js";
-import { Choice as h } from "./choice.js";
-import '../../../assets/index6.css';const B = (t) => {
-  const { baseProps: r, controlProps: n } = f(t, {
+import { BaseControl as g } from "../base-control/index.js";
+import { useBaseControlProps as v } from "../base-control/props.js";
+import { Choice as P } from "./choice.js";
+import '../../../assets/index4.css';const _ = (l) => {
+  const { baseProps: a, controlProps: s } = v(l, {
     className: "component-choice-control"
   }), {
-    options: s,
-    multiple: i = !1,
-    name: c = r.id,
-    value: d,
-    // Remove value from restControlProps
-    ...m
-  } = n, l = (s || []).map(p);
-  return /* @__PURE__ */ o(a, { as: "fieldset", ...r, children: /* @__PURE__ */ o("div", { className: "component-choice-control__choices", children: l.map((e) => /* @__PURE__ */ o(
-    h,
+    options: i,
+    multiple: r = !1,
+    name: m = a.id,
+    value: e,
+    onChange: p = c,
+    onChangeValue: n = c,
+    ...u
+  } = s, h = (i || []).map(C), f = (o) => {
+    r ? o.currentTarget.checked ? n([...e, o.currentTarget.value]) : n(
+      e.filter(
+        (d) => d !== o.currentTarget.value
+      )
+    ) : n(o.currentTarget.value), p(o);
+  };
+  return /* @__PURE__ */ t(g, { as: "fieldset", ...a, children: /* @__PURE__ */ t("div", { className: "component-choice-control__choices", children: h.map((o) => /* @__PURE__ */ t(
+    P,
     {
-      name: c,
-      multiple: i,
-      ...e,
-      ...m
+      name: m,
+      multiple: r,
+      onChange: f,
+      checked: r ? (e || []).includes(o.value) : e === o.value,
+      ...o,
+      ...u
     },
-    e.value
+    o.value
   )) }) });
 };
 export {
-  B as ChoiceControl
+  _ as ChoiceControl
 };

package/dist/components/controls/number-control/index.d.ts

@@ -1,6 +1,7 @@
 import { InputHTMLAttributes } from 'react';
 import { ControlFC } from '../base-control/props';
 interface NumberControlProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    onChangeValue?: (value: number) => void;
 }
 export declare const NumberControl: ControlFC<NumberControlProps>;
 export {};

package/dist/components/controls/number-control/index.js

@@ -1,54 +1,62 @@
-import { jsx as n, jsxs as i } from "react/jsx-runtime";
-import { e as l } from "../../../CaretDown.es-eySGHzTJ.js";
-import { r as u } from "../../../CaretUp.es-Cy8czlHG.js";
-import { useRef as p } from "react";
-import { BaseControl as a } from "../base-control/index.js";
-import { useBaseControlProps as b } from "../base-control/props.js";
-import '../../../assets/index7.css';const h = (t) => {
-  const o = p(null), c = () => /* @__PURE__ */ i("div", { className: "component-number-control__spinbox", children: [
-    /* @__PURE__ */ n(
+import { jsx as o, jsxs as p } from "react/jsx-runtime";
+import { noop as s } from "../../../utils/noop.js";
+import { e as b } from "../../../CaretDown.es-eySGHzTJ.js";
+import { r as f } from "../../../CaretUp.es-Cy8czlHG.js";
+import { useRef as d } from "react";
+import { BaseControl as h } from "../base-control/index.js";
+import { useBaseControlProps as C } from "../base-control/props.js";
+import '../../../assets/index5.css';const k = (e) => {
+  const r = d(null), l = () => /* @__PURE__ */ p("div", { className: "component-number-control__spinbox", children: [
+    /* @__PURE__ */ o(
       "button",
       {
         type: "button",
         className: "component-number-control__spinbox__button",
         "aria-label": "Increment",
         role: "spinbutton",
-        "aria-controls": t.id,
-        onClick: () => e(1),
+        "aria-controls": e.id,
+        onClick: () => t(1),
         tabIndex: -1,
-        children: /* @__PURE__ */ n(u, {})
+        children: /* @__PURE__ */ o(f, {})
       }
     ),
-    /* @__PURE__ */ n(
+    /* @__PURE__ */ o(
       "button",
       {
         type: "button",
         className: "component-number-control__spinbox__button",
         "aria-label": "Decrement",
         role: "spinbutton",
-        "aria-controls": t.id,
-        onClick: () => e(-1),
+        "aria-controls": e.id,
+        onClick: () => t(-1),
         tabIndex: -1,
-        children: /* @__PURE__ */ n(l, {})
+        children: /* @__PURE__ */ o(b, {})
       }
     )
-  ] }), e = (r) => {
-    o.current && (r > 0 ? o.current.stepUp(r) : o.current.stepDown(r * -1), o.current.focus());
-  }, { baseProps: s, controlProps: m } = b(t, {
+  ] }), t = (n) => {
+    r.current && (n > 0 ? r.current.stepUp(n) : r.current.stepDown(n * -1), c(Number(r.current.value)), r.current.focus());
+  }, { baseProps: m, controlProps: u } = C(e, {
     className: "component-number-control",
-    suffix: /* @__PURE__ */ n(c, {})
-  });
-  return /* @__PURE__ */ n(a, { ...s, children: /* @__PURE__ */ n(
+    suffix: /* @__PURE__ */ o(l, {})
+  }), {
+    onChangeValue: c = s,
+    onChange: a = s,
+    ...i
+  } = u;
+  return /* @__PURE__ */ o(h, { ...m, children: /* @__PURE__ */ o(
     "input",
     {
       className: "component-number-control__input",
       type: "number",
       inputMode: "numeric",
-      ref: o,
-      ...m
+      ref: r,
+      onChange: (n) => {
+        console.log(n), c(Number(n.currentTarget.value)), a(n);
+      },
+      ...i
     }
   ) });
 };
 export {
-  h as NumberControl
+  k as NumberControl
 };

package/dist/components/controls/select-control/index.d.ts

@@ -2,6 +2,8 @@ import { Optionable } from '../../../types/options';
 import { ControlFC } from '../base-control/props';
 import * as Ariakit from "@ariakit/react";
 interface SelectControlProps extends Ariakit.SelectOptions {
+    value?: string;
+    onChangeValue?: (value: string) => void;
     options?: Optionable[];
     searchable?: boolean;
     placeholder?: string;