@sakura-ui/forms 0.4.2 → 0.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs.js CHANGED
@@ -1,15 +1,15 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react");var k={exports:{}},E={};var G;function ve(){if(G)return E;G=1;var r=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function d(i,o,t){var a=null;if(t!==void 0&&(a=""+t),o.key!==void 0&&(a=""+o.key),"key"in o){t={};for(var u in o)u!=="key"&&(t[u]=o[u])}else t=o;return o=t.ref,{$$typeof:r,type:i,key:a,ref:o!==void 0?o:null,props:t}}return E.Fragment=n,E.jsx=d,E.jsxs=d,E}var _={};var U;function ye(){return U||(U=1,process.env.NODE_ENV!=="production"&&(function(){function r(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===me?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case C:return"Fragment";case ie:return"Profiler";case ne:return"StrictMode";case fe:return"Suspense";case pe:return"SuspenseList";case xe:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case ae:return"Portal";case ce:return e.displayName||"Context";case de:return(e._context.displayName||"Context")+".Consumer";case ue:var l=e.render;return e=e.displayName,e||(e=l.displayName||l.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case be:return l=e.displayName||null,l!==null?l:r(e.type)||"Memo";case P:l=e._payload,e=e._init;try{return r(e(l))}catch{}}return null}function n(e){return""+e}function d(e){try{n(e);var l=!1}catch{l=!0}if(l){l=console;var p=l.error,b=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return p.call(l,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",b),n(e)}}function i(e){if(e===C)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===P)return"<...>";try{var l=r(e);return l?"<"+l+">":"<...>"}catch{return"<...>"}}function o(){var e=S.A;return e===null?null:e.getOwner()}function t(){return Error("react-stack-top-frame")}function a(e){if(Y.call(e,"key")){var l=Object.getOwnPropertyDescriptor(e,"key").get;if(l&&l.isReactWarning)return!1}return e.key!==void 0}function u(e,l){function p(){z||(z=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",l))}p.isReactWarning=!0,Object.defineProperty(e,"key",{get:p,configurable:!0})}function c(){var e=r(this.type);return L[e]||(L[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function m(e,l,p,b,I,A){var x=p.ref;return e={$$typeof:F,type:e,key:l,props:p,_owner:b},(x!==void 0?x:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:c}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:I}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:A}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function f(e,l,p,b,I,A){var x=l.children;if(x!==void 0)if(b)if(ge(x)){for(b=0;b<x.length;b++)g(x[b]);Object.freeze&&Object.freeze(x)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else g(x);if(Y.call(l,"key")){x=r(e);var j=Object.keys(l).filter(function(he){return he!=="key"});b=0<j.length?"{key: someKey, "+j.join(": ..., ")+": ...}":"{key: someKey}",B[x+b]||(j=0<j.length?"{"+j.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react");var k={exports:{}},E={};var U;function ve(){if(U)return E;U=1;var r=Symbol.for("react.transitional.element"),n=Symbol.for("react.fragment");function d(i,a,t){var o=null;if(t!==void 0&&(o=""+t),a.key!==void 0&&(o=""+a.key),"key"in a){t={};for(var u in a)u!=="key"&&(t[u]=a[u])}else t=a;return a=t.ref,{$$typeof:r,type:i,key:o,ref:a!==void 0?a:null,props:t}}return E.Fragment=n,E.jsx=d,E.jsxs=d,E}var _={};var B;function ye(){return B||(B=1,process.env.NODE_ENV!=="production"&&(function(){function r(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===me?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case C:return"Fragment";case ie:return"Profiler";case ne:return"StrictMode";case fe:return"Suspense";case pe:return"SuspenseList";case xe:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case oe:return"Portal";case ce:return e.displayName||"Context";case de:return(e._context.displayName||"Context")+".Consumer";case ue:var l=e.render;return e=e.displayName,e||(e=l.displayName||l.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case be:return l=e.displayName||null,l!==null?l:r(e.type)||"Memo";case P:l=e._payload,e=e._init;try{return r(e(l))}catch{}}return null}function n(e){return""+e}function d(e){try{n(e);var l=!1}catch{l=!0}if(l){l=console;var p=l.error,b=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return p.call(l,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",b),n(e)}}function i(e){if(e===C)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===P)return"<...>";try{var l=r(e);return l?"<"+l+">":"<...>"}catch{return"<...>"}}function a(){var e=S.A;return e===null?null:e.getOwner()}function t(){return Error("react-stack-top-frame")}function o(e){if(Y.call(e,"key")){var l=Object.getOwnPropertyDescriptor(e,"key").get;if(l&&l.isReactWarning)return!1}return e.key!==void 0}function u(e,l){function p(){z||(z=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",l))}p.isReactWarning=!0,Object.defineProperty(e,"key",{get:p,configurable:!0})}function c(){var e=r(this.type);return D[e]||(D[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function m(e,l,p,b,I,A){var x=p.ref;return e={$$typeof:F,type:e,key:l,props:p,_owner:b},(x!==void 0?x:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:c}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:I}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:A}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function f(e,l,p,b,I,A){var x=l.children;if(x!==void 0)if(b)if(ge(x)){for(b=0;b<x.length;b++)g(x[b]);Object.freeze&&Object.freeze(x)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else g(x);if(Y.call(l,"key")){x=r(e);var j=Object.keys(l).filter(function(he){return he!=="key"});b=0<j.length?"{key: someKey, "+j.join(": ..., ")+": ...}":"{key: someKey}",G[x+b]||(j=0<j.length?"{"+j.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
2
2
  let props = %s;
3
3
  <%s {...props} />
4
4
  React keys must be passed directly to JSX without using spread:
5
5
  let props = %s;
6
- <%s key={someKey} {...props} />`,b,x,j,x),B[x+b]=!0)}if(x=null,p!==void 0&&(d(p),x=""+p),a(l)&&(d(l.key),x=""+l.key),"key"in l){p={};for(var $ in l)$!=="key"&&(p[$]=l[$])}else p=l;return x&&u(p,typeof e=="function"?e.displayName||e.name||"Unknown":e),m(e,x,p,o(),I,A)}function g(e){h(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===P&&(e._payload.status==="fulfilled"?h(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function h(e){return typeof e=="object"&&e!==null&&e.$$typeof===F}var v=R,F=Symbol.for("react.transitional.element"),ae=Symbol.for("react.portal"),C=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),ie=Symbol.for("react.profiler"),de=Symbol.for("react.consumer"),ce=Symbol.for("react.context"),ue=Symbol.for("react.forward_ref"),fe=Symbol.for("react.suspense"),pe=Symbol.for("react.suspense_list"),be=Symbol.for("react.memo"),P=Symbol.for("react.lazy"),xe=Symbol.for("react.activity"),me=Symbol.for("react.client.reference"),S=v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Y=Object.prototype.hasOwnProperty,ge=Array.isArray,O=console.createTask?console.createTask:function(){return null};v={react_stack_bottom_frame:function(e){return e()}};var z,L={},D=v.react_stack_bottom_frame.bind(v,t)(),W=O(i(t)),B={};_.Fragment=C,_.jsx=function(e,l,p){var b=1e4>S.recentlyCreatedOwnerStacks++;return f(e,l,p,!1,b?Error("react-stack-top-frame"):D,b?O(i(e)):W)},_.jsxs=function(e,l,p){var b=1e4>S.recentlyCreatedOwnerStacks++;return f(e,l,p,!0,b?Error("react-stack-top-frame"):D,b?O(i(e)):W)}})()),_}var V;function Re(){return V||(V=1,process.env.NODE_ENV==="production"?k.exports=ve():k.exports=ye()),k.exports}var s=Re();const y=(...r)=>r.filter(Boolean).join(" ");var N;(r=>{r.clickable=`
6
+ <%s key={someKey} {...props} />`,b,x,j,x),G[x+b]=!0)}if(x=null,p!==void 0&&(d(p),x=""+p),o(l)&&(d(l.key),x=""+l.key),"key"in l){p={};for(var $ in l)$!=="key"&&(p[$]=l[$])}else p=l;return x&&u(p,typeof e=="function"?e.displayName||e.name||"Unknown":e),m(e,x,p,a(),I,A)}function g(e){h(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===P&&(e._payload.status==="fulfilled"?h(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function h(e){return typeof e=="object"&&e!==null&&e.$$typeof===F}var v=R,F=Symbol.for("react.transitional.element"),oe=Symbol.for("react.portal"),C=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),ie=Symbol.for("react.profiler"),de=Symbol.for("react.consumer"),ce=Symbol.for("react.context"),ue=Symbol.for("react.forward_ref"),fe=Symbol.for("react.suspense"),pe=Symbol.for("react.suspense_list"),be=Symbol.for("react.memo"),P=Symbol.for("react.lazy"),xe=Symbol.for("react.activity"),me=Symbol.for("react.client.reference"),S=v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,Y=Object.prototype.hasOwnProperty,ge=Array.isArray,O=console.createTask?console.createTask:function(){return null};v={react_stack_bottom_frame:function(e){return e()}};var z,D={},L=v.react_stack_bottom_frame.bind(v,t)(),W=O(i(t)),G={};_.Fragment=C,_.jsx=function(e,l,p){var b=1e4>S.recentlyCreatedOwnerStacks++;return f(e,l,p,!1,b?Error("react-stack-top-frame"):L,b?O(i(e)):W)},_.jsxs=function(e,l,p){var b=1e4>S.recentlyCreatedOwnerStacks++;return f(e,l,p,!0,b?Error("react-stack-top-frame"):L,b?O(i(e)):W)}})()),_}var V;function Re(){return V||(V=1,process.env.NODE_ENV==="production"?k.exports=ve():k.exports=ye()),k.exports}var s=Re();const y=(...r)=>r.filter(Boolean).join(" ");var N;(r=>{r.clickable=`
7
7
  px-2
8
8
  min-h-[calc(44/16*1rem)]
9
9
  border
10
10
  border-transparent
11
11
  rounded-lg
12
- hover:bg-solid-grey-50
12
+ hover:bg-solid-gray-50
13
13
  `,r.selected=`
14
14
  rounded-full
15
15
  bg-yellow-50
@@ -60,16 +60,8 @@ React keys must be passed directly to JSX without using spread:
60
60
  shadow-1
61
61
  rounded-lg
62
62
  border
63
- border-solid-grey-420
63
+ border-solid-gray-420
64
64
  has-[>:nth-child(7)]:rounded-r-none
65
- `,r.popoverPositionBottomRight=`
66
- absolute
67
- top-11
68
- right-0
69
- `,r.popoverPositionBottomLeft=`
70
- absolute
71
- top-11
72
- left-0
73
65
  `,(d=>{d.focus=`
74
66
  peer-focus-visible:outline-4
75
67
  peer-focus-visible:outline-black
@@ -126,7 +118,7 @@ React keys must be passed directly to JSX without using spread:
126
118
  py-2
127
119
  text-label
128
120
  leading-snug
129
- `},Q={lg:"w-[22px] h-[22px] mr-2",md:"w-[18px] h-[18px] mr-1.5",sm:"w-[18px] h-[18px] mr-1"},M=r=>{const{id:n,className:d,size:i="lg",children:o,...t}=r,a=R.useId(),u=n||a,c=R.useContext(T);c.isRequired&&(t.required=!0),c.groupName&&(t.name=c.groupName);const m={lg:22/24,md:18/24,sm:18/24},f=`
121
+ `},Q={lg:"w-[22px] h-[22px] mr-2",md:"w-[18px] h-[18px] mr-1.5",sm:"w-[18px] h-[18px] mr-1"},M=r=>{const{id:n,className:d,size:i="lg",children:a,...t}=r,o=R.useId(),u=n||o,c=R.useContext(T);c.isRequired&&(t.required=!0),c.groupName&&(t.name=c.groupName);const m={lg:22/24,md:18/24,sm:18/24},f=`
130
122
  peer
131
123
  sr-only
132
124
  `,g=`
@@ -141,7 +133,7 @@ React keys must be passed directly to JSX without using spread:
141
133
  peer-checked:border-none
142
134
  peer-disabled:border-solid-gray-500
143
135
  ${N.Peer.focusRect}
144
- `;return s.jsx("label",{htmlFor:u,className:y(X,Z[i],d),children:s.jsxs("span",{className:"flex items-center",children:[s.jsx("input",{id:u,className:f,type:"checkbox","aria-describedby":c.helperTextId,"aria-errormessage":c.errorMessageId,"aria-invalid":c.isInvalid??!1,...t}),s.jsx("span",{className:y(g,Q[i]),children:s.jsx("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":!0,width:"24",height:"24",viewBox:"0 0 24 24",children:s.jsx("g",{transform:`scale(${m[i]} ${m[i]})`,children:s.jsx("path",{d:"m9.55 17.65-5.325-5.325 1.05-1.075 4.275 4.275 9.175-9.175 1.05 1.075Z"})})})}),s.jsx("span",{className:"peer-disabled:text-solid-gray-500",children:o})]})})};M.displayName="Checkbox";const q=r=>{const{id:n,className:d,size:i="lg",children:o,...t}=r,a=R.useId(),u=n||a,c=R.useContext(T);c.isRequired&&(t.required=!0),c.groupName&&(t.name=c.groupName);const m=`
136
+ `;return s.jsx("label",{htmlFor:u,className:y(X,Z[i],d),children:s.jsxs("span",{className:"flex items-center",children:[s.jsx("input",{id:u,className:f,type:"checkbox","aria-describedby":c.helperTextId,"aria-errormessage":c.errorMessageId,"aria-invalid":c.isInvalid??!1,...t}),s.jsx("span",{className:y(g,Q[i]),children:s.jsx("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":!0,width:"24",height:"24",viewBox:"0 0 24 24",children:s.jsx("g",{transform:`scale(${m[i]} ${m[i]})`,children:s.jsx("path",{d:"m9.55 17.65-5.325-5.325 1.05-1.075 4.275 4.275 9.175-9.175 1.05 1.075Z"})})})}),s.jsx("span",{className:"peer-disabled:text-solid-gray-500",children:a})]})})};M.displayName="Checkbox";const q=r=>{const{id:n,className:d,size:i="lg",children:a,...t}=r,o=R.useId(),u=n||o,c=R.useContext(T);c.isRequired&&(t.required=!0),c.groupName&&(t.name=c.groupName);const m=`
145
137
  peer
146
138
  sr-only
147
139
  `,f=`
@@ -154,12 +146,12 @@ React keys must be passed directly to JSX without using spread:
154
146
  peer-checked:border-blue-600
155
147
  peer-disabled:border-solid-gray-500
156
148
  ${N.Peer.focusRect}
157
- `,g={lg:"p-1",md:"p-[3px]",sm:"p-[3px]"};return s.jsx("label",{htmlFor:u,className:y(X,Z[i],d),children:s.jsxs("span",{className:"flex items-center",children:[s.jsx("input",{id:u,className:m,type:"radio","aria-describedby":c.helperTextId,"aria-errormessage":c.errorMessageId,"aria-invalid":c.isInvalid??!1,...t}),s.jsx("span",{"aria-hidden":!0,className:y(f,g[i],Q[i])}),s.jsx("span",{className:"peer-disabled:text-solid-gray-500",children:o})]})})};q.displayName="Radio";const K=r=>{const{id:n,className:d,size:i="lg",children:o,...t}=r,a=R.useContext(T);return a.isRequired&&(t.required=!0),s.jsxs("div",{className:"inline-block relative",children:[s.jsx("select",{id:n||a.id,className:y(`
149
+ `,g={lg:"p-1",md:"p-[3px]",sm:"p-[3px]"};return s.jsx("label",{htmlFor:u,className:y(X,Z[i],d),children:s.jsxs("span",{className:"flex items-center",children:[s.jsx("input",{id:u,className:m,type:"radio","aria-describedby":c.helperTextId,"aria-errormessage":c.errorMessageId,"aria-invalid":c.isInvalid??!1,...t}),s.jsx("span",{"aria-hidden":!0,className:y(f,g[i],Q[i])}),s.jsx("span",{className:"peer-disabled:text-solid-gray-500",children:a})]})})};q.displayName="Radio";const K=r=>{const{id:n,className:d,size:i="lg",children:a,...t}=r,o=R.useContext(T);return o.isRequired&&(t.required=!0),s.jsxs("div",{className:"inline-block relative",children:[s.jsx("select",{id:n||o.id,className:y(`
158
150
  !pr-8
159
151
  peer
160
152
  cursor-pointer
161
153
  appearance-none
162
- `,J,H[i],d),"aria-describedby":a.helperTextId,"aria-errormessage":a.errorMessageId,"aria-invalid":a.isInvalid??!1,...t,children:o}),s.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":!0,className:`
154
+ `,J,H[i],d),"aria-describedby":o.helperTextId,"aria-errormessage":o.errorMessageId,"aria-invalid":o.isInvalid??!1,...t,children:a}),s.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":!0,className:`
163
155
  pointer-events-none
164
156
  absolute
165
157
  right-4
@@ -167,7 +159,7 @@ React keys must be passed directly to JSX without using spread:
167
159
  -translate-y-1/2
168
160
  text-solid-gray-900
169
161
  peer-disabled:text-solid-gray-500
170
- `,fill:"none",width:"16",height:"16",viewBox:"0 0 16 16",children:[s.jsx("title",{children:"arrow down"}),s.jsx("path",{d:"M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z",fill:"currentColor"})]})]})};K.displayName="Select";const ee=r=>{const{id:n,className:d,size:i="lg",...o}=r,t=R.useContext(T);t.isRequired&&(o.required=!0);const a=`
162
+ `,fill:"none",width:"16",height:"16",viewBox:"0 0 16 16",children:[s.jsx("title",{children:"arrow down"}),s.jsx("path",{d:"M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z",fill:"currentColor"})]})]})};K.displayName="Select";const ee=r=>{const{id:n,className:d,size:i="lg",...a}=r,t=R.useContext(T);t.isRequired&&(a.required=!0);const o=`
171
163
  file:mr-2
172
164
  file:inline-block
173
165
  file:text-button
@@ -217,7 +209,7 @@ React keys must be passed directly to JSX without using spread:
217
209
  file:text-button
218
210
  file:rounded-md
219
211
  file:leading-snug
220
- `};return s.jsx("input",{type:"file",id:n||t.id,className:y(a,u,m[i],c,d),"aria-describedby":t.helperTextId,"aria-errormessage":t.errorMessageId,"aria-invalid":t.isInvalid??!1,...o})};ee.displayName="FileInput";const re=r=>{const{id:n,className:d,size:i="lg",...o}=r,t=R.useContext(T);return t.isRequired&&(o.required=!0),s.jsx("input",{type:"text",id:n||t.id,className:y(J,H[i],d),"aria-describedby":t.helperTextId,"aria-errormessage":t.errorMessageId,"aria-invalid":t.isInvalid??!1,...o})};re.displayName="Input";const te=r=>{const{id:n,className:d,children:i,onChange:o,maxLength:t,...a}=r,[u,c]=R.useState(0),m=v=>{o&&o(v),c(v.target.value.length)},f=R.useContext(T);f.isRequired&&(a.required=!0);const g=u>(t||0)?"text-red-800":"text-solid-gray-700",h=`
212
+ `};return s.jsx("input",{type:"file",id:n||t.id,className:y(o,u,m[i],c,d),"aria-describedby":t.helperTextId,"aria-errormessage":t.errorMessageId,"aria-invalid":t.isInvalid??!1,...a})};ee.displayName="FileInput";const re=r=>{const{id:n,className:d,size:i="lg",...a}=r,t=R.useContext(T);return t.isRequired&&(a.required=!0),s.jsx("input",{type:"text",id:n||t.id,className:y(J,H[i],d),"aria-describedby":t.helperTextId,"aria-errormessage":t.errorMessageId,"aria-invalid":t.isInvalid??!1,...a})};re.displayName="Input";const te=r=>{const{id:n,className:d,children:i,onChange:a,maxLength:t,...o}=r,[u,c]=R.useState(0),m=v=>{a&&a(v),c(v.target.value.length)},f=R.useContext(T);f.isRequired&&(o.required=!0);const g=u>(t||0)?"text-red-800":"text-solid-gray-700",h=`
221
213
  p-4
222
214
  text-label
223
215
  rounded-lg
@@ -229,8 +221,8 @@ React keys must be passed directly to JSX without using spread:
229
221
  disabled:border-solid-gray-500
230
222
  aria-invalid:border-red-800
231
223
  ${N.focusRect}
232
- `;return s.jsxs(s.Fragment,{children:[s.jsx("textarea",{id:n||f.id,className:y(h,d),"aria-describedby":f.helperTextId,"aria-errormessage":f.errorMessageId,"aria-invalid":f.isInvalid??!1,onChange:m,...a,children:i}),t?s.jsxs("p",{className:"text-label text-solid-gray-700",children:[s.jsx("span",{className:g,children:u}),"/",s.jsx("span",{children:t})]}):""]})};te.displayName="Textarea";const se=r=>{const n=R.useId(),{labelText:d,className:i,helperText:o,errorMessage:t,isInvalid:a,isRequired:u,children:c,...m}=r,f={id:r.htmlFor??`input-${n}`,helperTextId:`helper-text-${n}`,errorMessageId:`error-message-${n}`,isInvalid:a??!1,isRequired:u??!1};return s.jsx(T.Provider,{value:f,children:s.jsxs("div",{className:y("flex flex-col items-start gap-2",i),children:[s.jsxs("label",{className:y("block text-label",a&&"text-red-800"),htmlFor:f.id,...m,children:[d,u&&s.jsx("span",{className:"text-label text-red-800",children:" *"})]}),o&&s.jsx("p",{id:f.helperTextId,className:`
224
+ `;return s.jsxs(s.Fragment,{children:[s.jsx("textarea",{id:n||f.id,className:y(h,d),"aria-describedby":f.helperTextId,"aria-errormessage":f.errorMessageId,"aria-invalid":f.isInvalid??!1,onChange:m,...o,children:i}),t?s.jsxs("p",{className:"text-label text-solid-gray-700",children:[s.jsx("span",{className:g,children:u}),"/",s.jsx("span",{children:t})]}):""]})};te.displayName="Textarea";const se=r=>{const n=R.useId(),{labelText:d,className:i,helperText:a,errorMessage:t,isInvalid:o,isRequired:u,children:c,...m}=r,f={id:r.htmlFor??`input-${n}`,helperTextId:`helper-text-${n}`,errorMessageId:`error-message-${n}`,isInvalid:o??!1,isRequired:u??!1};return s.jsx(T.Provider,{value:f,children:s.jsxs("div",{className:y("flex flex-col items-start gap-2",i),children:[s.jsxs("label",{className:y("block text-label",o&&"text-red-800"),htmlFor:f.id,...m,children:[d,u&&s.jsx("span",{className:"text-label text-red-800",children:" *"})]}),a&&s.jsx("p",{id:f.helperTextId,className:`
233
225
  text-label text-solid-gray-700
234
- `,children:o}),c,a&&s.jsx("p",{id:f.errorMessageId,className:`
226
+ `,children:a}),c,o&&s.jsx("p",{id:f.errorMessageId,className:`
235
227
  text-label text-red-800
236
- `,children:t})]})})};se.displayName="LabelControl";const w=r=>{const n=R.useId(),{labelText:d,className:i,helperText:o,errorMessage:t,isInvalid:a,isRequired:u,direction:c,children:m,...f}=r,h={groupName:f.name??`group-${n}`,helperTextId:`helper-text-${n}`,errorMessageId:`error-message-${n}`,isInvalid:a??!1,isRequired:u??!1},v=c??"flex-col";return s.jsx(T.Provider,{value:h,children:s.jsxs("fieldset",{className:y("flex flex-col items-start gap-2",i),...f,children:[s.jsx("legend",{children:s.jsxs("p",{className:y("block text-label",a&&"text-red-800"),children:[d,u&&s.jsx("span",{className:"text-red-800",children:" *"})]})}),s.jsx("div",{className:y("inline-flex",v),children:m}),o&&s.jsx("p",{id:h.helperTextId,className:"text-sup text-solid-gray-700",children:o}),a&&s.jsx("p",{id:h.errorMessageId,className:"text-label text-red-800",children:t})]})})};w.displayName="FieldsetControl";const le=r=>{const{items:n,onChange:d,className:i,labelText:o,helperText:t,errorMessage:a,isInvalid:u,isRequired:c,size:m,...f}=r;return s.jsx(w,{className:i,labelText:o,helperText:t,errorMessage:a,isInvalid:u,isRequired:c,...f,children:n.map(({label:g,value:h})=>s.jsx(M,{size:m,value:h,onChange:d,children:g},`${g}-${h}`))})};le.displayName="CheckboxGroup";const oe=r=>{const{items:n,onChange:d,className:i,labelText:o,helperText:t,errorMessage:a,isInvalid:u,isRequired:c,defaultValue:m,size:f,...g}=r;return s.jsx(w,{className:i,labelText:o,helperText:t,errorMessage:a,isInvalid:u,isRequired:c,...g,children:n.map(({label:h,value:v})=>s.jsx(q,{size:f,value:v,onChange:d,defaultChecked:m===v,children:h},`${h}-${v}`))})};oe.displayName="RadioGroup";exports.Checkbox=M;exports.CheckboxGroup=le;exports.FieldsetControl=w;exports.FileInput=ee;exports.Input=re;exports.LabelControl=se;exports.Radio=q;exports.RadioGroup=oe;exports.Select=K;exports.Textarea=te;
228
+ `,children:t})]})})};se.displayName="LabelControl";const w=r=>{const n=R.useId(),{labelText:d,className:i,helperText:a,errorMessage:t,isInvalid:o,isRequired:u,direction:c,children:m,...f}=r,h={groupName:f.name??`group-${n}`,helperTextId:`helper-text-${n}`,errorMessageId:`error-message-${n}`,isInvalid:o??!1,isRequired:u??!1},v=c??"flex-col";return s.jsx(T.Provider,{value:h,children:s.jsxs("fieldset",{className:y("flex flex-col items-start gap-2",i),...f,children:[s.jsx("legend",{children:s.jsxs("p",{className:y("block text-label",o&&"text-red-800"),children:[d,u&&s.jsx("span",{className:"text-red-800",children:" *"})]})}),s.jsx("div",{className:y("inline-flex",v),children:m}),a&&s.jsx("p",{id:h.helperTextId,className:"text-sup text-solid-gray-700",children:a}),o&&s.jsx("p",{id:h.errorMessageId,className:"text-label text-red-800",children:t})]})})};w.displayName="FieldsetControl";const le=r=>{const{items:n,onChange:d,className:i,labelText:a,helperText:t,errorMessage:o,isInvalid:u,isRequired:c,size:m,...f}=r;return s.jsx(w,{className:i,labelText:a,helperText:t,errorMessage:o,isInvalid:u,isRequired:c,...f,children:n.map(({label:g,value:h})=>s.jsx(M,{size:m,value:h,onChange:d,children:g},`${g}-${h}`))})};le.displayName="CheckboxGroup";const ae=r=>{const{items:n,onChange:d,className:i,labelText:a,helperText:t,errorMessage:o,isInvalid:u,isRequired:c,defaultValue:m,size:f,...g}=r;return s.jsx(w,{className:i,labelText:a,helperText:t,errorMessage:o,isInvalid:u,isRequired:c,...g,children:n.map(({label:h,value:v})=>s.jsx(q,{size:f,value:v,onChange:d,defaultChecked:m===v,children:h},`${h}-${v}`))})};ae.displayName="RadioGroup";exports.Checkbox=M;exports.CheckboxGroup=le;exports.FieldsetControl=w;exports.FileInput=ee;exports.Input=re;exports.LabelControl=se;exports.Radio=q;exports.RadioGroup=ae;exports.Select=K;exports.Textarea=te;
package/dist/index.es.js CHANGED
@@ -1,31 +1,31 @@
1
1
  import R from "react";
2
2
  var I = { exports: {} }, E = {};
3
- var W;
3
+ var L;
4
4
  function fe() {
5
- if (W) return E;
6
- W = 1;
5
+ if (L) return E;
6
+ L = 1;
7
7
  var r = /* @__PURE__ */ Symbol.for("react.transitional.element"), n = /* @__PURE__ */ Symbol.for("react.fragment");
8
- function d(i, a, t) {
8
+ function d(i, a, s) {
9
9
  var o = null;
10
- if (t !== void 0 && (o = "" + t), a.key !== void 0 && (o = "" + a.key), "key" in a) {
11
- t = {};
10
+ if (s !== void 0 && (o = "" + s), a.key !== void 0 && (o = "" + a.key), "key" in a) {
11
+ s = {};
12
12
  for (var u in a)
13
- u !== "key" && (t[u] = a[u]);
14
- } else t = a;
15
- return a = t.ref, {
13
+ u !== "key" && (s[u] = a[u]);
14
+ } else s = a;
15
+ return a = s.ref, {
16
16
  $$typeof: r,
17
17
  type: i,
18
18
  key: o,
19
19
  ref: a !== void 0 ? a : null,
20
- props: t
20
+ props: s
21
21
  };
22
22
  }
23
23
  return E.Fragment = n, E.jsx = d, E.jsxs = d, E;
24
24
  }
25
25
  var _ = {};
26
- var B;
26
+ var U;
27
27
  function pe() {
28
- return B || (B = 1, process.env.NODE_ENV !== "production" && (function() {
28
+ return U || (U = 1, process.env.NODE_ENV !== "production" && (function() {
29
29
  function r(e) {
30
30
  if (e == null) return null;
31
31
  if (typeof e == "function")
@@ -51,9 +51,9 @@ function pe() {
51
51
  ), e.$$typeof) {
52
52
  case K:
53
53
  return "Portal";
54
- case se:
55
- return e.displayName || "Context";
56
54
  case te:
55
+ return e.displayName || "Context";
56
+ case se:
57
57
  return (e._context.displayName || "Context") + ".Consumer";
58
58
  case le:
59
59
  var l = e.render;
@@ -104,7 +104,7 @@ function pe() {
104
104
  var e = C.A;
105
105
  return e === null ? null : e.getOwner();
106
106
  }
107
- function t() {
107
+ function s() {
108
108
  return Error("react-stack-top-frame");
109
109
  }
110
110
  function o(e) {
@@ -183,7 +183,7 @@ function pe() {
183
183
  var j = Object.keys(l).filter(function(ue) {
184
184
  return ue !== "key";
185
185
  });
186
- b = 0 < j.length ? "{key: someKey, " + j.join(": ..., ") + ": ...}" : "{key: someKey}", L[m + b] || (j = 0 < j.length ? "{" + j.join(": ..., ") + ": ...}" : "{}", console.error(
186
+ b = 0 < j.length ? "{key: someKey, " + j.join(": ..., ") + ": ...}" : "{key: someKey}", W[m + b] || (j = 0 < j.length ? "{" + j.join(": ..., ") + ": ...}" : "{}", console.error(
187
187
  `A props object containing a "key" prop is being spread into JSX:
188
188
  let props = %s;
189
189
  <%s {...props} />
@@ -194,7 +194,7 @@ React keys must be passed directly to JSX without using spread:
194
194
  m,
195
195
  j,
196
196
  m
197
- ), L[m + b] = !0);
197
+ ), W[m + b] = !0);
198
198
  }
199
199
  if (m = null, p !== void 0 && (d(p), m = "" + p), o(l) && (d(l.key), m = "" + l.key), "key" in l) {
200
200
  p = {};
@@ -219,7 +219,7 @@ React keys must be passed directly to JSX without using spread:
219
219
  function h(e) {
220
220
  return typeof e == "object" && e !== null && e.$$typeof === M;
221
221
  }
222
- var v = R, M = /* @__PURE__ */ Symbol.for("react.transitional.element"), K = /* @__PURE__ */ Symbol.for("react.portal"), k = /* @__PURE__ */ Symbol.for("react.fragment"), ee = /* @__PURE__ */ Symbol.for("react.strict_mode"), re = /* @__PURE__ */ Symbol.for("react.profiler"), te = /* @__PURE__ */ Symbol.for("react.consumer"), se = /* @__PURE__ */ Symbol.for("react.context"), le = /* @__PURE__ */ Symbol.for("react.forward_ref"), ae = /* @__PURE__ */ Symbol.for("react.suspense"), oe = /* @__PURE__ */ Symbol.for("react.suspense_list"), ne = /* @__PURE__ */ Symbol.for("react.memo"), P = /* @__PURE__ */ Symbol.for("react.lazy"), ie = /* @__PURE__ */ Symbol.for("react.activity"), de = /* @__PURE__ */ Symbol.for("react.client.reference"), C = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, q = Object.prototype.hasOwnProperty, ce = Array.isArray, S = console.createTask ? console.createTask : function() {
222
+ var v = R, M = /* @__PURE__ */ Symbol.for("react.transitional.element"), K = /* @__PURE__ */ Symbol.for("react.portal"), k = /* @__PURE__ */ Symbol.for("react.fragment"), ee = /* @__PURE__ */ Symbol.for("react.strict_mode"), re = /* @__PURE__ */ Symbol.for("react.profiler"), se = /* @__PURE__ */ Symbol.for("react.consumer"), te = /* @__PURE__ */ Symbol.for("react.context"), le = /* @__PURE__ */ Symbol.for("react.forward_ref"), ae = /* @__PURE__ */ Symbol.for("react.suspense"), oe = /* @__PURE__ */ Symbol.for("react.suspense_list"), ne = /* @__PURE__ */ Symbol.for("react.memo"), P = /* @__PURE__ */ Symbol.for("react.lazy"), ie = /* @__PURE__ */ Symbol.for("react.activity"), de = /* @__PURE__ */ Symbol.for("react.client.reference"), C = v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, q = Object.prototype.hasOwnProperty, ce = Array.isArray, S = console.createTask ? console.createTask : function() {
223
223
  return null;
224
224
  };
225
225
  v = {
@@ -229,8 +229,8 @@ React keys must be passed directly to JSX without using spread:
229
229
  };
230
230
  var F, Y = {}, z = v.react_stack_bottom_frame.bind(
231
231
  v,
232
- t
233
- )(), D = S(i(t)), L = {};
232
+ s
233
+ )(), D = S(i(s)), W = {};
234
234
  _.Fragment = k, _.jsx = function(e, l, p) {
235
235
  var b = 1e4 > C.recentlyCreatedOwnerStacks++;
236
236
  return f(
@@ -254,11 +254,11 @@ React keys must be passed directly to JSX without using spread:
254
254
  };
255
255
  })()), _;
256
256
  }
257
- var U;
257
+ var B;
258
258
  function be() {
259
- return U || (U = 1, process.env.NODE_ENV === "production" ? I.exports = fe() : I.exports = pe()), I.exports;
259
+ return B || (B = 1, process.env.NODE_ENV === "production" ? I.exports = fe() : I.exports = pe()), I.exports;
260
260
  }
261
- var s = be();
261
+ var t = be();
262
262
  const y = (...r) => r.filter(Boolean).join(" ");
263
263
  var N;
264
264
  ((r) => {
@@ -268,7 +268,7 @@ var N;
268
268
  border
269
269
  border-transparent
270
270
  rounded-lg
271
- hover:bg-solid-grey-50
271
+ hover:bg-solid-gray-50
272
272
  `, r.selected = `
273
273
  rounded-full
274
274
  bg-yellow-50
@@ -321,16 +321,8 @@ var N;
321
321
  shadow-1
322
322
  rounded-lg
323
323
  border
324
- border-solid-grey-420
324
+ border-solid-gray-420
325
325
  has-[>:nth-child(7)]:rounded-r-none
326
- `, r.popoverPositionBottomRight = `
327
- absolute
328
- top-11
329
- right-0
330
- `, r.popoverPositionBottomLeft = `
331
- absolute
332
- top-11
333
- left-0
334
326
  `, ((d) => {
335
327
  d.focus = `
336
328
  peer-focus-visible:outline-4
@@ -415,8 +407,8 @@ const T = R.createContext({
415
407
  md: "w-[18px] h-[18px] mr-1.5",
416
408
  sm: "w-[18px] h-[18px] mr-1"
417
409
  }, Z = (r) => {
418
- const { id: n, className: d, size: i = "lg", children: a, ...t } = r, o = R.useId(), u = n || o, c = R.useContext(T);
419
- c.isRequired && (t.required = !0), c.groupName && (t.name = c.groupName);
410
+ const { id: n, className: d, size: i = "lg", children: a, ...s } = r, o = R.useId(), u = n || o, c = R.useContext(T);
411
+ c.isRequired && (s.required = !0), c.groupName && (s.name = c.groupName);
420
412
  const x = {
421
413
  lg: 22 / 24,
422
414
  md: 18 / 24,
@@ -437,7 +429,7 @@ const T = R.createContext({
437
429
  peer-disabled:border-solid-gray-500
438
430
  ${N.Peer.focusRect}
439
431
  `;
440
- return /* @__PURE__ */ s.jsx(
432
+ return /* @__PURE__ */ t.jsx(
441
433
  "label",
442
434
  {
443
435
  htmlFor: u,
@@ -446,8 +438,8 @@ const T = R.createContext({
446
438
  H[i],
447
439
  d
448
440
  ),
449
- children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
450
- /* @__PURE__ */ s.jsx(
441
+ children: /* @__PURE__ */ t.jsxs("span", { className: "flex items-center", children: [
442
+ /* @__PURE__ */ t.jsx(
451
443
  "input",
452
444
  {
453
445
  id: u,
@@ -456,10 +448,10 @@ const T = R.createContext({
456
448
  "aria-describedby": c.helperTextId,
457
449
  "aria-errormessage": c.errorMessageId,
458
450
  "aria-invalid": c.isInvalid ?? !1,
459
- ...t
451
+ ...s
460
452
  }
461
453
  ),
462
- /* @__PURE__ */ s.jsx("span", { className: y(g, X[i]), children: /* @__PURE__ */ s.jsx(
454
+ /* @__PURE__ */ t.jsx("span", { className: y(g, X[i]), children: /* @__PURE__ */ t.jsx(
463
455
  "svg",
464
456
  {
465
457
  xmlns: "http://www.w3.org/2000/svg",
@@ -467,18 +459,18 @@ const T = R.createContext({
467
459
  width: "24",
468
460
  height: "24",
469
461
  viewBox: "0 0 24 24",
470
- children: /* @__PURE__ */ s.jsx("g", { transform: `scale(${x[i]} ${x[i]})`, children: /* @__PURE__ */ s.jsx("path", { d: "m9.55 17.65-5.325-5.325 1.05-1.075 4.275 4.275 9.175-9.175 1.05 1.075Z" }) })
462
+ children: /* @__PURE__ */ t.jsx("g", { transform: `scale(${x[i]} ${x[i]})`, children: /* @__PURE__ */ t.jsx("path", { d: "m9.55 17.65-5.325-5.325 1.05-1.075 4.275 4.275 9.175-9.175 1.05 1.075Z" }) })
471
463
  }
472
464
  ) }),
473
- /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-solid-gray-500", children: a })
465
+ /* @__PURE__ */ t.jsx("span", { className: "peer-disabled:text-solid-gray-500", children: a })
474
466
  ] })
475
467
  }
476
468
  );
477
469
  };
478
470
  Z.displayName = "Checkbox";
479
471
  const Q = (r) => {
480
- const { id: n, className: d, size: i = "lg", children: a, ...t } = r, o = R.useId(), u = n || o, c = R.useContext(T);
481
- c.isRequired && (t.required = !0), c.groupName && (t.name = c.groupName);
472
+ const { id: n, className: d, size: i = "lg", children: a, ...s } = r, o = R.useId(), u = n || o, c = R.useContext(T);
473
+ c.isRequired && (s.required = !0), c.groupName && (s.name = c.groupName);
482
474
  const x = `
483
475
  peer
484
476
  sr-only
@@ -497,7 +489,7 @@ const Q = (r) => {
497
489
  md: "p-[3px]",
498
490
  sm: "p-[3px]"
499
491
  };
500
- return /* @__PURE__ */ s.jsx(
492
+ return /* @__PURE__ */ t.jsx(
501
493
  "label",
502
494
  {
503
495
  htmlFor: u,
@@ -506,8 +498,8 @@ const Q = (r) => {
506
498
  H[i],
507
499
  d
508
500
  ),
509
- children: /* @__PURE__ */ s.jsxs("span", { className: "flex items-center", children: [
510
- /* @__PURE__ */ s.jsx(
501
+ children: /* @__PURE__ */ t.jsxs("span", { className: "flex items-center", children: [
502
+ /* @__PURE__ */ t.jsx(
511
503
  "input",
512
504
  {
513
505
  id: u,
@@ -516,26 +508,26 @@ const Q = (r) => {
516
508
  "aria-describedby": c.helperTextId,
517
509
  "aria-errormessage": c.errorMessageId,
518
510
  "aria-invalid": c.isInvalid ?? !1,
519
- ...t
511
+ ...s
520
512
  }
521
513
  ),
522
- /* @__PURE__ */ s.jsx(
514
+ /* @__PURE__ */ t.jsx(
523
515
  "span",
524
516
  {
525
517
  "aria-hidden": !0,
526
518
  className: y(f, g[i], X[i])
527
519
  }
528
520
  ),
529
- /* @__PURE__ */ s.jsx("span", { className: "peer-disabled:text-solid-gray-500", children: a })
521
+ /* @__PURE__ */ t.jsx("span", { className: "peer-disabled:text-solid-gray-500", children: a })
530
522
  ] })
531
523
  }
532
524
  );
533
525
  };
534
526
  Q.displayName = "Radio";
535
527
  const me = (r) => {
536
- const { id: n, className: d, size: i = "lg", children: a, ...t } = r, o = R.useContext(T);
537
- return o.isRequired && (t.required = !0), /* @__PURE__ */ s.jsxs("div", { className: "inline-block relative", children: [
538
- /* @__PURE__ */ s.jsx(
528
+ const { id: n, className: d, size: i = "lg", children: a, ...s } = r, o = R.useContext(T);
529
+ return o.isRequired && (s.required = !0), /* @__PURE__ */ t.jsxs("div", { className: "inline-block relative", children: [
530
+ /* @__PURE__ */ t.jsx(
539
531
  "select",
540
532
  {
541
533
  id: n || o.id,
@@ -553,11 +545,11 @@ const me = (r) => {
553
545
  "aria-describedby": o.helperTextId,
554
546
  "aria-errormessage": o.errorMessageId,
555
547
  "aria-invalid": o.isInvalid ?? !1,
556
- ...t,
548
+ ...s,
557
549
  children: a
558
550
  }
559
551
  ),
560
- /* @__PURE__ */ s.jsxs(
552
+ /* @__PURE__ */ t.jsxs(
561
553
  "svg",
562
554
  {
563
555
  xmlns: "http://www.w3.org/2000/svg",
@@ -576,8 +568,8 @@ const me = (r) => {
576
568
  height: "16",
577
569
  viewBox: "0 0 16 16",
578
570
  children: [
579
- /* @__PURE__ */ s.jsx("title", { children: "arrow down" }),
580
- /* @__PURE__ */ s.jsx(
571
+ /* @__PURE__ */ t.jsx("title", { children: "arrow down" }),
572
+ /* @__PURE__ */ t.jsx(
581
573
  "path",
582
574
  {
583
575
  d: "M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z",
@@ -591,8 +583,8 @@ const me = (r) => {
591
583
  };
592
584
  me.displayName = "Select";
593
585
  const xe = (r) => {
594
- const { id: n, className: d, size: i = "lg", ...a } = r, t = R.useContext(T);
595
- t.isRequired && (a.required = !0);
586
+ const { id: n, className: d, size: i = "lg", ...a } = r, s = R.useContext(T);
587
+ s.isRequired && (a.required = !0);
596
588
  const o = `
597
589
  file:mr-2
598
590
  file:inline-block
@@ -651,46 +643,46 @@ const xe = (r) => {
651
643
  file:leading-snug
652
644
  `
653
645
  };
654
- return /* @__PURE__ */ s.jsx(
646
+ return /* @__PURE__ */ t.jsx(
655
647
  "input",
656
648
  {
657
649
  type: "file",
658
- id: n || t.id,
650
+ id: n || s.id,
659
651
  className: y(o, u, x[i], c, d),
660
- "aria-describedby": t.helperTextId,
661
- "aria-errormessage": t.errorMessageId,
662
- "aria-invalid": t.isInvalid ?? !1,
652
+ "aria-describedby": s.helperTextId,
653
+ "aria-errormessage": s.errorMessageId,
654
+ "aria-invalid": s.isInvalid ?? !1,
663
655
  ...a
664
656
  }
665
657
  );
666
658
  };
667
659
  xe.displayName = "FileInput";
668
660
  const ge = (r) => {
669
- const { id: n, className: d, size: i = "lg", ...a } = r, t = R.useContext(T);
670
- return t.isRequired && (a.required = !0), /* @__PURE__ */ s.jsx(
661
+ const { id: n, className: d, size: i = "lg", ...a } = r, s = R.useContext(T);
662
+ return s.isRequired && (a.required = !0), /* @__PURE__ */ t.jsx(
671
663
  "input",
672
664
  {
673
665
  type: "text",
674
- id: n || t.id,
666
+ id: n || s.id,
675
667
  className: y(
676
668
  G,
677
669
  V[i],
678
670
  d
679
671
  ),
680
- "aria-describedby": t.helperTextId,
681
- "aria-errormessage": t.errorMessageId,
682
- "aria-invalid": t.isInvalid ?? !1,
672
+ "aria-describedby": s.helperTextId,
673
+ "aria-errormessage": s.errorMessageId,
674
+ "aria-invalid": s.isInvalid ?? !1,
683
675
  ...a
684
676
  }
685
677
  );
686
678
  };
687
679
  ge.displayName = "Input";
688
680
  const he = (r) => {
689
- const { id: n, className: d, children: i, onChange: a, maxLength: t, ...o } = r, [u, c] = R.useState(0), x = (v) => {
681
+ const { id: n, className: d, children: i, onChange: a, maxLength: s, ...o } = r, [u, c] = R.useState(0), x = (v) => {
690
682
  a && a(v), c(v.target.value.length);
691
683
  }, f = R.useContext(T);
692
684
  f.isRequired && (o.required = !0);
693
- const g = u > (t || 0) ? "text-red-800" : "text-solid-gray-700", h = `
685
+ const g = u > (s || 0) ? "text-red-800" : "text-solid-gray-700", h = `
694
686
  p-4
695
687
  text-label
696
688
  rounded-lg
@@ -703,8 +695,8 @@ const he = (r) => {
703
695
  aria-invalid:border-red-800
704
696
  ${N.focusRect}
705
697
  `;
706
- return /* @__PURE__ */ s.jsxs(s.Fragment, { children: [
707
- /* @__PURE__ */ s.jsx(
698
+ return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
699
+ /* @__PURE__ */ t.jsx(
708
700
  "textarea",
709
701
  {
710
702
  id: n || f.id,
@@ -717,10 +709,10 @@ const he = (r) => {
717
709
  children: i
718
710
  }
719
711
  ),
720
- t ? /* @__PURE__ */ s.jsxs("p", { className: "text-label text-solid-gray-700", children: [
721
- /* @__PURE__ */ s.jsx("span", { className: g, children: u }),
712
+ s ? /* @__PURE__ */ t.jsxs("p", { className: "text-label text-solid-gray-700", children: [
713
+ /* @__PURE__ */ t.jsx("span", { className: g, children: u }),
722
714
  "/",
723
- /* @__PURE__ */ s.jsx("span", { children: t })
715
+ /* @__PURE__ */ t.jsx("span", { children: s })
724
716
  ] }) : ""
725
717
  ] });
726
718
  };
@@ -730,7 +722,7 @@ const ve = (r) => {
730
722
  labelText: d,
731
723
  className: i,
732
724
  helperText: a,
733
- errorMessage: t,
725
+ errorMessage: s,
734
726
  isInvalid: o,
735
727
  isRequired: u,
736
728
  children: c,
@@ -742,8 +734,8 @@ const ve = (r) => {
742
734
  isInvalid: o ?? !1,
743
735
  isRequired: u ?? !1
744
736
  };
745
- return /* @__PURE__ */ s.jsx(T.Provider, { value: f, children: /* @__PURE__ */ s.jsxs("div", { className: y("flex flex-col items-start gap-2", i), children: [
746
- /* @__PURE__ */ s.jsxs(
737
+ return /* @__PURE__ */ t.jsx(T.Provider, { value: f, children: /* @__PURE__ */ t.jsxs("div", { className: y("flex flex-col items-start gap-2", i), children: [
738
+ /* @__PURE__ */ t.jsxs(
747
739
  "label",
748
740
  {
749
741
  className: y("block text-label", o && "text-red-800"),
@@ -751,17 +743,17 @@ const ve = (r) => {
751
743
  ...x,
752
744
  children: [
753
745
  d,
754
- u && /* @__PURE__ */ s.jsx("span", { className: "text-label text-red-800", children: " *" })
746
+ u && /* @__PURE__ */ t.jsx("span", { className: "text-label text-red-800", children: " *" })
755
747
  ]
756
748
  }
757
749
  ),
758
- a && /* @__PURE__ */ s.jsx("p", { id: f.helperTextId, className: `
750
+ a && /* @__PURE__ */ t.jsx("p", { id: f.helperTextId, className: `
759
751
  text-label text-solid-gray-700
760
752
  `, children: a }),
761
753
  c,
762
- o && /* @__PURE__ */ s.jsx("p", { id: f.errorMessageId, className: `
754
+ o && /* @__PURE__ */ t.jsx("p", { id: f.errorMessageId, className: `
763
755
  text-label text-red-800
764
- `, children: t })
756
+ `, children: s })
765
757
  ] }) });
766
758
  };
767
759
  ve.displayName = "LabelControl";
@@ -770,7 +762,7 @@ const $ = (r) => {
770
762
  labelText: d,
771
763
  className: i,
772
764
  helperText: a,
773
- errorMessage: t,
765
+ errorMessage: s,
774
766
  isInvalid: o,
775
767
  isRequired: u,
776
768
  direction: c,
@@ -783,19 +775,19 @@ const $ = (r) => {
783
775
  isInvalid: o ?? !1,
784
776
  isRequired: u ?? !1
785
777
  }, v = c ?? "flex-col";
786
- return /* @__PURE__ */ s.jsx(T.Provider, { value: h, children: /* @__PURE__ */ s.jsxs(
778
+ return /* @__PURE__ */ t.jsx(T.Provider, { value: h, children: /* @__PURE__ */ t.jsxs(
787
779
  "fieldset",
788
780
  {
789
781
  className: y("flex flex-col items-start gap-2", i),
790
782
  ...f,
791
783
  children: [
792
- /* @__PURE__ */ s.jsx("legend", { children: /* @__PURE__ */ s.jsxs("p", { className: y("block text-label", o && "text-red-800"), children: [
784
+ /* @__PURE__ */ t.jsx("legend", { children: /* @__PURE__ */ t.jsxs("p", { className: y("block text-label", o && "text-red-800"), children: [
793
785
  d,
794
- u && /* @__PURE__ */ s.jsx("span", { className: "text-red-800", children: " *" })
786
+ u && /* @__PURE__ */ t.jsx("span", { className: "text-red-800", children: " *" })
795
787
  ] }) }),
796
- /* @__PURE__ */ s.jsx("div", { className: y("inline-flex", v), children: x }),
797
- a && /* @__PURE__ */ s.jsx("p", { id: h.helperTextId, className: "text-sup text-solid-gray-700", children: a }),
798
- o && /* @__PURE__ */ s.jsx("p", { id: h.errorMessageId, className: "text-label text-red-800", children: t })
788
+ /* @__PURE__ */ t.jsx("div", { className: y("inline-flex", v), children: x }),
789
+ a && /* @__PURE__ */ t.jsx("p", { id: h.helperTextId, className: "text-sup text-solid-gray-700", children: a }),
790
+ o && /* @__PURE__ */ t.jsx("p", { id: h.errorMessageId, className: "text-label text-red-800", children: s })
799
791
  ]
800
792
  }
801
793
  ) });
@@ -807,24 +799,24 @@ const ye = (r) => {
807
799
  onChange: d,
808
800
  className: i,
809
801
  labelText: a,
810
- helperText: t,
802
+ helperText: s,
811
803
  errorMessage: o,
812
804
  isInvalid: u,
813
805
  isRequired: c,
814
806
  size: x,
815
807
  ...f
816
808
  } = r;
817
- return /* @__PURE__ */ s.jsx(
809
+ return /* @__PURE__ */ t.jsx(
818
810
  $,
819
811
  {
820
812
  className: i,
821
813
  labelText: a,
822
- helperText: t,
814
+ helperText: s,
823
815
  errorMessage: o,
824
816
  isInvalid: u,
825
817
  isRequired: c,
826
818
  ...f,
827
- children: n.map(({ label: g, value: h }) => /* @__PURE__ */ s.jsx(
819
+ children: n.map(({ label: g, value: h }) => /* @__PURE__ */ t.jsx(
828
820
  Z,
829
821
  {
830
822
  size: x,
@@ -844,7 +836,7 @@ const Re = (r) => {
844
836
  onChange: d,
845
837
  className: i,
846
838
  labelText: a,
847
- helperText: t,
839
+ helperText: s,
848
840
  errorMessage: o,
849
841
  isInvalid: u,
850
842
  isRequired: c,
@@ -852,17 +844,17 @@ const Re = (r) => {
852
844
  size: f,
853
845
  ...g
854
846
  } = r;
855
- return /* @__PURE__ */ s.jsx(
847
+ return /* @__PURE__ */ t.jsx(
856
848
  $,
857
849
  {
858
850
  className: i,
859
851
  labelText: a,
860
- helperText: t,
852
+ helperText: s,
861
853
  errorMessage: o,
862
854
  isInvalid: u,
863
855
  isRequired: c,
864
856
  ...g,
865
- children: n.map(({ label: h, value: v }) => /* @__PURE__ */ s.jsx(
857
+ children: n.map(({ label: h, value: v }) => /* @__PURE__ */ t.jsx(
866
858
  Q,
867
859
  {
868
860
  size: f,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sakura-ui/forms",
3
- "version": "0.4.2",
3
+ "version": "0.4.3",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "author": "glassonion1",
@@ -34,7 +34,7 @@
34
34
  "tailwindcss": "^4.1.17"
35
35
  },
36
36
  "dependencies": {
37
- "@sakura-ui/helper": "0.0.9"
37
+ "@sakura-ui/helper": "0.0.10"
38
38
  },
39
39
  "devDependencies": {
40
40
  "@testing-library/jest-dom": "^7.0.1",