rharuow-ds 1.0.2 → 1.0.4

package/README.md

@@ -4,18 +4,42 @@ Design System em React com integração a React Hook Form, Tailwind CSS e shadcn
 
 ## Instalação
 
+Adicione o pacote ao seu projeto:
+
 ```bash
 npm install rharuow-ds
 ```
 
-## Uso básico
+> **Atenção:**  
+> Não é necessário instalar ou configurar Tailwind CSS no seu projeto consumidor para usar os estilos do rharuow-ds. O CSS já vem pronto no pacote!
 
-```tsx
-import { Button, Input } from "rharuow-ds";
+---
 
-<Button variant="default">Clique aqui</Button>
-<Input label="E-mail" name="email" />
-```
+## Como usar
+
+1. **Importe o CSS do design system**  
+   No seu arquivo de entrada (ex: `src/main.tsx`, `src/index.tsx` ou `_app.tsx` no Next.js):
+
+   ```js
+   import "rharuow-ds/dist/styles.css";
+   ```
+
+2. **Use os componentes normalmente**
+
+   ```tsx
+   import { Button, Input } from "rharuow-ds";
+
+   function App() {
+     return (
+       <div>
+         <Input label="E-mail" name="email" />
+         <Button variant="default">Enviar</Button>
+       </div>
+     );
+   }
+   ```
+
+---
 
 ## Documentação
 
@@ -23,4 +47,17 @@ Acesse a documentação interativa dos componentes em [GitHub Pages](#) _(link s
 
 ---
 
+## Desenvolvimento
+
+Para contribuir ou rodar localmente:
+
+```bash
+git clone https://github.com/seu-usuario/rharuow-ds.git
+cd rharuow-ds
+npm install
+npm run storybook
+```
+
+---
+
 Desenvolvido por Harysson.

package/dist/rharuow-ds.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react");function fe(r){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const a=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(o,t,a.get?a:{enumerable:!0,get:()=>r[t]})}}return o.default=r,Object.freeze(o)}const Y=fe(R);var F={exports:{}},k={};/**
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react");function fe(r){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(a,t,o.get?o:{enumerable:!0,get:()=>r[t]})}}return a.default=r,Object.freeze(a)}const W=fe(R);var D={exports:{}},A={};/**
  * @license React
  * react-jsx-runtime.production.js
  *
@@ -6,7 +6,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var H;function de(){if(H)return k;H=1;var r=Symbol.for("react.transitional.element"),o=Symbol.for("react.fragment");function t(a,s,c){var d=null;if(c!==void 0&&(d=""+c),s.key!==void 0&&(d=""+s.key),"key"in s){c={};for(var m in s)m!=="key"&&(c[m]=s[m])}else c=s;return s=c.ref,{$$typeof:r,type:a,key:d,ref:s!==void 0?s:null,props:c}}return k.Fragment=o,k.jsx=t,k.jsxs=t,k}var h={};/**
+ */var K;function de(){if(K)return A;K=1;var r=Symbol.for("react.transitional.element"),a=Symbol.for("react.fragment");function t(o,s,u){var d=null;if(u!==void 0&&(d=""+u),s.key!==void 0&&(d=""+s.key),"key"in s){u={};for(var m in s)m!=="key"&&(u[m]=s[m])}else u=s;return s=u.ref,{$$typeof:r,type:o,key:d,ref:s!==void 0?s:null,props:u}}return A.Fragment=a,A.jsx=t,A.jsxs=t,A}var S={};/**
  * @license React
  * react-jsx-runtime.development.js
  *
@@ -14,9 +14,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var Z;function me(){return Z||(Z=1,process.env.NODE_ENV!=="production"&&function(){function r(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===ce?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case y:return"Fragment";case w:return"Profiler";case I:return"StrictMode";case C:return"Suspense";case O:return"SuspenseList";case ue: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 A:return"Portal";case P:return(e.displayName||"Context")+".Provider";case D:return(e._context.displayName||"Context")+".Consumer";case N:var n=e.render;return e=e.displayName,e||(e=n.displayName||n.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case se:return n=e.displayName||null,n!==null?n:r(e.type)||"Memo";case z:n=e._payload,e=e._init;try{return r(e(n))}catch{}}return null}function o(e){return""+e}function t(e){try{o(e);var n=!1}catch{n=!0}if(n){n=console;var u=n.error,l=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return u.call(n,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",l),o(e)}}function a(e){if(e===y)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===z)return"<...>";try{var n=r(e);return n?"<"+n+">":"<...>"}catch{return"<...>"}}function s(){var e=W.A;return e===null?null:e.getOwner()}function c(){return Error("react-stack-top-frame")}function d(e){if(q.call(e,"key")){var n=Object.getOwnPropertyDescriptor(e,"key").get;if(n&&n.isReactWarning)return!1}return e.key!==void 0}function m(e,n){function u(){J||(J=!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)",n))}u.isReactWarning=!0,Object.defineProperty(e,"key",{get:u,configurable:!0})}function T(){var e=r(this.type);return V[e]||(V[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 f(e,n,u,l,E,b,L,M){return u=b.ref,e={$$typeof:v,type:e,key:n,props:b,_owner:E},(u!==void 0?u:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:T}):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:L}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:M}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function x(e,n,u,l,E,b,L,M){var i=n.children;if(i!==void 0)if(l)if(le(i)){for(l=0;l<i.length;l++)j(i[l]);Object.freeze&&Object.freeze(i)}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 j(i);if(q.call(n,"key")){i=r(e);var g=Object.keys(n).filter(function(ie){return ie!=="key"});l=0<g.length?"{key: someKey, "+g.join(": ..., ")+": ...}":"{key: someKey}",X[i+l]||(g=0<g.length?"{"+g.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+ */var ee;function be(){return ee||(ee=1,process.env.NODE_ENV!=="production"&&function(){function r(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===_?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case h:return"Fragment";case P:return"Profiler";case $:return"StrictMode";case C:return"Suspense";case F:return"SuspenseList";case I: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 f:return"Portal";case N:return(e.displayName||"Context")+".Provider";case L:return(e._context.displayName||"Context")+".Consumer";case M:var n=e.render;return e=e.displayName,e||(e=n.displayName||n.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case Y:return n=e.displayName||null,n!==null?n:r(e.type)||"Memo";case b:n=e._payload,e=e._init;try{return r(e(n))}catch{}}return null}function a(e){return""+e}function t(e){try{a(e);var n=!1}catch{n=!0}if(n){n=console;var c=n.error,l=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return c.call(n,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",l),a(e)}}function o(e){if(e===h)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===b)return"<...>";try{var n=r(e);return n?"<"+n+">":"<...>"}catch{return"<...>"}}function s(){var e=U.A;return e===null?null:e.getOwner()}function u(){return Error("react-stack-top-frame")}function d(e){if(G.call(e,"key")){var n=Object.getOwnPropertyDescriptor(e,"key").get;if(n&&n.isReactWarning)return!1}return e.key!==void 0}function m(e,n){function c(){B||(B=!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)",n))}c.isReactWarning=!0,Object.defineProperty(e,"key",{get:c,configurable:!0})}function k(){var e=r(this.type);return X[e]||(X[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 j(e,n,c,l,y,v,q,J){return c=v.ref,e={$$typeof:T,type:e,key:n,props:v,_owner:y},(c!==void 0?c:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:k}):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:q}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:J}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function p(e,n,c,l,y,v,q,J){var i=n.children;if(i!==void 0)if(l)if(le(i)){for(l=0;l<i.length;l++)E(i[l]);Object.freeze&&Object.freeze(i)}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 E(i);if(G.call(n,"key")){i=r(e);var O=Object.keys(n).filter(function(ie){return ie!=="key"});l=0<O.length?"{key: someKey, "+O.join(": ..., ")+": ...}":"{key: someKey}",Q[i+l]||(O=0<O.length?"{"+O.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,l,i,g,i),X[i+l]=!0)}if(i=null,u!==void 0&&(t(u),i=""+u),d(n)&&(t(n.key),i=""+n.key),"key"in n){u={};for(var U in n)U!=="key"&&(u[U]=n[U])}else u=n;return i&&m(u,typeof e=="function"?e.displayName||e.name||"Unknown":e),f(e,i,b,E,s(),u,L,M)}function j(e){typeof e=="object"&&e!==null&&e.$$typeof===v&&e._store&&(e._store.validated=1)}var _=R,v=Symbol.for("react.transitional.element"),A=Symbol.for("react.portal"),y=Symbol.for("react.fragment"),I=Symbol.for("react.strict_mode"),w=Symbol.for("react.profiler"),D=Symbol.for("react.consumer"),P=Symbol.for("react.context"),N=Symbol.for("react.forward_ref"),C=Symbol.for("react.suspense"),O=Symbol.for("react.suspense_list"),se=Symbol.for("react.memo"),z=Symbol.for("react.lazy"),ue=Symbol.for("react.activity"),ce=Symbol.for("react.client.reference"),W=_.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,q=Object.prototype.hasOwnProperty,le=Array.isArray,$=console.createTask?console.createTask:function(){return null};_={"react-stack-bottom-frame":function(e){return e()}};var J,V={},G=_["react-stack-bottom-frame"].bind(_,c)(),B=$(a(c)),X={};h.Fragment=y,h.jsx=function(e,n,u,l,E){var b=1e4>W.recentlyCreatedOwnerStacks++;return x(e,n,u,!1,l,E,b?Error("react-stack-top-frame"):G,b?$(a(e)):B)},h.jsxs=function(e,n,u,l,E){var b=1e4>W.recentlyCreatedOwnerStacks++;return x(e,n,u,!0,l,E,b?Error("react-stack-top-frame"):G,b?$(a(e)):B)}}()),h}var Q;function be(){return Q||(Q=1,process.env.NODE_ENV==="production"?F.exports=de():F.exports=me()),F.exports}var p=be();function re(r){var o,t,a="";if(typeof r=="string"||typeof r=="number")a+=r;else if(typeof r=="object")if(Array.isArray(r)){var s=r.length;for(o=0;o<s;o++)r[o]&&(t=re(r[o]))&&(a&&(a+=" "),a+=t)}else for(t in r)r[t]&&(a&&(a+=" "),a+=t);return a}function ve(){for(var r,o,t=0,a="",s=arguments.length;t<s;t++)(r=arguments[t])&&(o=re(r))&&(a&&(a+=" "),a+=o);return a}function S(...r){return ve(...r)}const Ee=({children:r,variant:o="default",className:t="",...a})=>{const s="px-4 py-2 rounded font-medium transition",c={default:"bg-blue-600 text-white hover:bg-blue-700",outline:"border border-blue-600 text-blue-600 bg-white hover:bg-blue-50"};return p.jsx("button",{className:S(s,c[o],t),...a,children:r})};var _e=r=>r instanceof Date,te=r=>r==null;const pe=r=>typeof r=="object";var Re=r=>!te(r)&&!Array.isArray(r)&&pe(r)&&!_e(r),xe=r=>/^\w*$/.test(r),K=r=>r===void 0,ge=r=>Array.isArray(r)?r.filter(Boolean):[],Te=r=>ge(r.replace(/["|']|\]/g,"").split(/\.|\[/)),ee=(r,o,t)=>{if(!o||!Re(r))return t;const a=(xe(o)?[o]:Te(o)).reduce((s,c)=>te(s)?s:s[c],r);return K(a)||a===r?K(r[o])?t:r[o]:a};const ne=R.createContext(null);ne.displayName="HookFormContext";const ae=()=>R.useContext(ne),ye=typeof window<"u"?Y.useLayoutEffect:Y.useEffect;var Oe=r=>typeof r=="string",ke=(r,o,t,a,s)=>Oe(r)?ee(t,r,s):Array.isArray(r)?r.map(c=>ee(t,c)):t;function he(r){const o=ae(),{control:t=o.control,name:a,defaultValue:s,disabled:c,exact:d}=r||{},m=R.useRef(s),[T,f]=R.useState(t._getWatch(a,m.current));return ye(()=>t._subscribe({name:a,formState:{values:!0},exact:d,callback:x=>!c&&f(ke(a,t._names,x.values||t._formValues,!1,m.current))}),[a,t,c,d]),R.useEffect(()=>t._removeUnmounted()),T}const oe=Y.forwardRef(({className:r,type:o="text",label:t,onFocus:a,onBlur:s,Icon:c,iconClassName:d,iconAction:m,containerClassName:T,...f},x)=>{var P,N,C;const[j,_]=Y.useState(!1),v=ae(),A=v==null?void 0:v.control,y=A&&f.name?he({control:A,name:String(f.name)}):void 0,I=f.value??y??"",w=(C=(N=(P=v==null?void 0:v.formState)==null?void 0:P.errors)==null?void 0:N[f.name])==null?void 0:C.message,D=j||!!I;return p.jsxs("div",{className:S("relative",T),children:[p.jsx("input",{id:f.id||f.name,type:o,className:S("peer flex h-12 w-full border border-input rounded-md bg-transparent px-3 pt-6 pb-2 text-sm text-white placeholder-transparent transition focus:outline-none focus:border-blue-500 disabled:cursor-not-allowed disabled:opacity-50",r),onFocus:O=>{_(!0),a&&a(O)},onBlur:O=>{_(!1),s&&s(O)},ref:x,...f}),t&&p.jsx("label",{htmlFor:f.id||f.name,className:S("absolute left-3 top-3 z-10 origin-[0] cursor-text select-none text-sm text-gray-400 transition-all duration-200",D?"scale-90 -translate-y-3 text-xs text-blue-400":"scale-100 translate-y-0"),children:t}),c&&p.jsx("div",{className:S("absolute top-1/2 right-3 -translate-y-1/2 text-white",d),onClick:m,children:p.jsx(c,{})}),w&&p.jsx("span",{className:"text-red-500 text-xs mt-1 block",children:w})]})});oe.displayName="Input";exports.Button=Ee;exports.Input=oe;
+  <%s key={someKey} {...props} />`,l,i,O,i),Q[i+l]=!0)}if(i=null,c!==void 0&&(t(c),i=""+c),d(n)&&(t(n.key),i=""+n.key),"key"in n){c={};for(var V in n)V!=="key"&&(c[V]=n[V])}else c=n;return i&&m(c,typeof e=="function"?e.displayName||e.name||"Unknown":e),j(e,i,v,y,s(),c,q,J)}function E(e){typeof e=="object"&&e!==null&&e.$$typeof===T&&e._store&&(e._store.validated=1)}var x=R,T=Symbol.for("react.transitional.element"),f=Symbol.for("react.portal"),h=Symbol.for("react.fragment"),$=Symbol.for("react.strict_mode"),P=Symbol.for("react.profiler"),L=Symbol.for("react.consumer"),N=Symbol.for("react.context"),M=Symbol.for("react.forward_ref"),C=Symbol.for("react.suspense"),F=Symbol.for("react.suspense_list"),Y=Symbol.for("react.memo"),b=Symbol.for("react.lazy"),I=Symbol.for("react.activity"),_=Symbol.for("react.client.reference"),U=x.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,G=Object.prototype.hasOwnProperty,le=Array.isArray,z=console.createTask?console.createTask:function(){return null};x={"react-stack-bottom-frame":function(e){return e()}};var B,X={},H=x["react-stack-bottom-frame"].bind(x,u)(),Z=z(o(u)),Q={};S.Fragment=h,S.jsx=function(e,n,c,l,y){var v=1e4>U.recentlyCreatedOwnerStacks++;return p(e,n,c,!1,l,y,v?Error("react-stack-top-frame"):H,v?z(o(e)):Z)},S.jsxs=function(e,n,c,l,y){var v=1e4>U.recentlyCreatedOwnerStacks++;return p(e,n,c,!0,l,y,v?Error("react-stack-top-frame"):H,v?z(o(e)):Z)}}()),S}var re;function me(){return re||(re=1,process.env.NODE_ENV==="production"?D.exports=de():D.exports=be()),D.exports}var g=me();function oe(r){var a,t,o="";if(typeof r=="string"||typeof r=="number")o+=r;else if(typeof r=="object")if(Array.isArray(r)){var s=r.length;for(a=0;a<s;a++)r[a]&&(t=oe(r[a]))&&(o&&(o+=" "),o+=t)}else for(t in r)r[t]&&(o&&(o+=" "),o+=t);return o}function ve(){for(var r,a,t=0,o="",s=arguments.length;t<s;t++)(r=arguments[t])&&(a=oe(r))&&(o&&(o+=" "),o+=a);return o}function w(...r){return ve(...r)}const pe=({children:r,variant:a="default",className:t="",...o})=>{const s="px-4 py-2 rounded font-medium transition",u={default:"bg-[var(--primary,#2563eb)] text-[var(--primary-text,#fff)] hover:bg-[var(--primary-hover,#1d4ed8)]",outline:"border border-[var(--primary,#2563eb)] text-[var(--primary,#2563eb)] bg-white hover:bg-[var(--primary-hover,#e0e7ff)]",secondary:"bg-[var(--secondary,#fbbf24)] text-[var(--secondary-text,#222)] hover:bg-[var(--secondary-hover,#f59e42)]"};return g.jsx("button",{className:w(s,u[a],t),...o,children:r})};var Ee=r=>r instanceof Date,ae=r=>r==null;const _e=r=>typeof r=="object";var ye=r=>!ae(r)&&!Array.isArray(r)&&_e(r)&&!Ee(r),ge=r=>/^\w*$/.test(r),te=r=>r===void 0,Re=r=>Array.isArray(r)?r.filter(Boolean):[],xe=r=>Re(r.replace(/["|']|\]/g,"").split(/\.|\[/)),ne=(r,a,t)=>{if(!a||!ye(r))return t;const o=(ge(a)?[a]:xe(a)).reduce((s,u)=>ae(s)?s:s[u],r);return te(o)||o===r?te(r[a])?t:r[a]:o};const se=R.createContext(null);se.displayName="HookFormContext";const ue=()=>R.useContext(se),Te=typeof window<"u"?W.useLayoutEffect:W.useEffect;var he=r=>typeof r=="string",Oe=(r,a,t,o,s)=>he(r)?ne(t,r,s):Array.isArray(r)?r.map(u=>ne(t,u)):t;function ke(r){const a=ue(),{control:t=a.control,name:o,defaultValue:s,disabled:u,exact:d}=r||{},m=R.useRef(s),[k,j]=R.useState(t._getWatch(o,m.current));return Te(()=>t._subscribe({name:o,formState:{values:!0},exact:d,callback:p=>!u&&j(Oe(o,t._names,p.values||t._formValues,!1,m.current))}),[o,t,u,d]),R.useEffect(()=>t._removeUnmounted()),k}const ce=W.forwardRef(({name:r,className:a,type:t="text",label:o,onFocus:s,onBlur:u,Icon:d,iconClassName:m,iconAction:k,containerClassName:j,...p},E)=>{var C,F,Y;const[x,T]=W.useState(!1),f=ue(),h=f==null?void 0:f.control,$=f==null?void 0:f.register,P=h&&r?ke({control:h,name:r}):void 0,L=p.value??P??"";console.log("form = ",f),console.log("valueWatch = ",P),console.log("name = ",r);const N=(Y=(F=(C=f==null?void 0:f.formState)==null?void 0:C.errors)==null?void 0:F[r])==null?void 0:Y.message,M=x||!!L;return g.jsxs("div",{className:w("relative",j),children:[g.jsx("input",{id:p.id||r,type:t,className:w("peer flex h-12 w-full border border-[var(--primary,#2563eb)] rounded-md bg-[var(--input-bg,#fff)] text-[var(--input-text,#222)] px-3 pt-6 pb-2 text-sm placeholder-transparent transition focus:outline-none focus:border-[var(--primary,#2563eb)] disabled:cursor-not-allowed disabled:opacity-50",a),onFocus:b=>{T(!0),s&&s(b)},...f&&r?(()=>{const b=$(r),I=b.onBlur;return{...b,ref:_=>{typeof E=="function"?E(_):E&&(E.current=_),b.ref&&b.ref(_)},onBlur:_=>{T(!1),u&&u(_),I&&I(_)}}})():{ref:E,onBlur:b=>{T(!1),u&&u(b)}},...p}),o&&g.jsx("label",{htmlFor:p.id||r,className:w("absolute left-3 z-10 origin-[0] cursor-text select-none text-sm text-gray-400 transition-all duration-200",M?"top-0 scale-90 -translate-y-1 text-xs text-blue-400 p-1 rounded-full bg-white":"top-3 scale-100 translate-y-0.5"),children:o}),d&&g.jsx("div",{className:w("absolute top-1/2 right-3 -translate-y-1/2 text-white",m),onClick:k,children:g.jsx(d,{})}),N&&g.jsx("span",{className:"text-red-500 text-xs mt-1 block",children:N})]})});ce.displayName="Input";exports.Button=pe;exports.Input=ce;

package/dist/rharuow-ds.es.js

@@ -1,6 +1,6 @@
-import * as Y from "react";
-import T from "react";
-var F = { exports: {} }, h = {};
+import * as D from "react";
+import k from "react";
+var W = { exports: {} }, w = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -10,29 +10,29 @@ var F = { exports: {} }, h = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var H;
+var K;
 function ie() {
-  if (H) return h;
-  H = 1;
+  if (K) return w;
+  K = 1;
   var r = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
-  function n(a, o, l) {
+  function o(n, a, u) {
     var d = null;
-    if (l !== void 0 && (d = "" + l), o.key !== void 0 && (d = "" + o.key), "key" in o) {
-      l = {};
-      for (var m in o)
-        m !== "key" && (l[m] = o[m]);
-    } else l = o;
-    return o = l.ref, {
+    if (u !== void 0 && (d = "" + u), a.key !== void 0 && (d = "" + a.key), "key" in a) {
+      u = {};
+      for (var b in a)
+        b !== "key" && (u[b] = a[b]);
+    } else u = a;
+    return a = u.ref, {
       $$typeof: r,
-      type: a,
+      type: n,
       key: d,
-      ref: o !== void 0 ? o : null,
-      props: l
+      ref: a !== void 0 ? a : null,
+      props: u
     };
   }
-  return h.Fragment = s, h.jsx = n, h.jsxs = n, h;
+  return w.Fragment = s, w.jsx = o, w.jsxs = o, w;
 }
-var A = {};
+var S = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -42,44 +42,44 @@ var A = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Z;
+var ee;
 function fe() {
-  return Z || (Z = 1, process.env.NODE_ENV !== "production" && function() {
+  return ee || (ee = 1, process.env.NODE_ENV !== "production" && function() {
     function r(e) {
       if (e == null) return null;
       if (typeof e == "function")
-        return e.$$typeof === ue ? null : e.displayName || e.name || null;
+        return e.$$typeof === _ ? null : e.displayName || e.name || null;
       if (typeof e == "string") return e;
       switch (e) {
-        case y:
+        case T:
           return "Fragment";
-        case j:
+        case P:
           return "Profiler";
-        case I:
+        case $:
           return "StrictMode";
         case C:
           return "Suspense";
-        case k:
+        case F:
           return "SuspenseList";
-        case se:
+        case I:
           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 S:
+          case f:
             return "Portal";
-          case P:
+          case N:
             return (e.displayName || "Context") + ".Provider";
-          case D:
+          case L:
             return (e._context.displayName || "Context") + ".Consumer";
-          case N:
+          case U:
             var t = e.render;
             return e = e.displayName, e || (e = t.displayName || t.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case oe:
+          case Y:
             return t = e.displayName || null, t !== null ? t : r(e.type) || "Memo";
-          case z:
+          case m:
             t = e._payload, e = e._init;
             try {
               return r(e(t));
@@ -91,7 +91,7 @@ function fe() {
     function s(e) {
       return "" + e;
     }
-    function n(e) {
+    function o(e) {
       try {
         s(e);
         var t = !1;
@@ -100,17 +100,17 @@ function fe() {
       }
       if (t) {
         t = console;
-        var u = t.error, c = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return u.call(
+        var c = t.error, l = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return c.call(
           t,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          c
+          l
         ), s(e);
       }
     }
-    function a(e) {
-      if (e === y) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === z)
+    function n(e) {
+      if (e === T) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === m)
         return "<...>";
       try {
         var t = r(e);
@@ -119,48 +119,48 @@ function fe() {
         return "<...>";
       }
     }
-    function o() {
-      var e = W.A;
+    function a() {
+      var e = M.A;
       return e === null ? null : e.getOwner();
     }
-    function l() {
+    function u() {
       return Error("react-stack-top-frame");
     }
     function d(e) {
-      if (J.call(e, "key")) {
+      if (G.call(e, "key")) {
         var t = Object.getOwnPropertyDescriptor(e, "key").get;
         if (t && t.isReactWarning) return !1;
       }
       return e.key !== void 0;
     }
-    function m(e, t) {
-      function u() {
-        V || (V = !0, console.error(
+    function b(e, t) {
+      function c() {
+        B || (B = !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)",
           t
         ));
       }
-      u.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: u,
+      c.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: c,
         configurable: !0
       });
     }
-    function g() {
+    function A() {
       var e = r(this.type);
-      return q[e] || (q[e] = !0, console.error(
+      return X[e] || (X[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 f(e, t, u, c, E, b, L, U) {
-      return u = b.ref, e = {
-        $$typeof: v,
+    function O(e, t, c, l, x, v, J, V) {
+      return c = v.ref, e = {
+        $$typeof: g,
         type: e,
         key: t,
-        props: b,
-        _owner: E
-      }, (u !== void 0 ? u : null) !== null ? Object.defineProperty(e, "ref", {
+        props: v,
+        _owner: x
+      }, (c !== void 0 ? c : null) !== null ? Object.defineProperty(e, "ref", {
         enumerable: !1,
-        get: g
+        get: A
       }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -175,225 +175,242 @@ function fe() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: L
+        value: J
       }), Object.defineProperty(e, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: U
+        value: V
       }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
     }
-    function x(e, t, u, c, E, b, L, U) {
+    function p(e, t, c, l, x, v, J, V) {
       var i = t.children;
       if (i !== void 0)
-        if (c)
-          if (le(i)) {
-            for (c = 0; c < i.length; c++)
-              w(i[c]);
+        if (l)
+          if (ce(i)) {
+            for (l = 0; l < i.length; l++)
+              E(i[l]);
             Object.freeze && Object.freeze(i);
           } 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 w(i);
-      if (J.call(t, "key")) {
+        else E(i);
+      if (G.call(t, "key")) {
         i = r(e);
-        var p = Object.keys(t).filter(function(ce) {
-          return ce !== "key";
+        var h = Object.keys(t).filter(function(le) {
+          return le !== "key";
         });
-        c = 0 < p.length ? "{key: someKey, " + p.join(": ..., ") + ": ...}" : "{key: someKey}", B[i + c] || (p = 0 < p.length ? "{" + p.join(": ..., ") + ": ...}" : "{}", console.error(
+        l = 0 < h.length ? "{key: someKey, " + h.join(": ..., ") + ": ...}" : "{key: someKey}", Q[i + l] || (h = 0 < h.length ? "{" + h.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          c,
+          l,
           i,
-          p,
+          h,
           i
-        ), B[i + c] = !0);
+        ), Q[i + l] = !0);
       }
-      if (i = null, u !== void 0 && (n(u), i = "" + u), d(t) && (n(t.key), i = "" + t.key), "key" in t) {
-        u = {};
-        for (var M in t)
-          M !== "key" && (u[M] = t[M]);
-      } else u = t;
-      return i && m(
-        u,
+      if (i = null, c !== void 0 && (o(c), i = "" + c), d(t) && (o(t.key), i = "" + t.key), "key" in t) {
+        c = {};
+        for (var q in t)
+          q !== "key" && (c[q] = t[q]);
+      } else c = t;
+      return i && b(
+        c,
         typeof e == "function" ? e.displayName || e.name || "Unknown" : e
-      ), f(
+      ), O(
         e,
         i,
-        b,
-        E,
-        o(),
-        u,
-        L,
-        U
+        v,
+        x,
+        a(),
+        c,
+        J,
+        V
       );
     }
-    function w(e) {
-      typeof e == "object" && e !== null && e.$$typeof === v && e._store && (e._store.validated = 1);
+    function E(e) {
+      typeof e == "object" && e !== null && e.$$typeof === g && e._store && (e._store.validated = 1);
     }
-    var _ = T, v = Symbol.for("react.transitional.element"), S = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), I = Symbol.for("react.strict_mode"), j = Symbol.for("react.profiler"), D = Symbol.for("react.consumer"), P = Symbol.for("react.context"), N = Symbol.for("react.forward_ref"), C = Symbol.for("react.suspense"), k = Symbol.for("react.suspense_list"), oe = Symbol.for("react.memo"), z = Symbol.for("react.lazy"), se = Symbol.for("react.activity"), ue = Symbol.for("react.client.reference"), W = _.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, J = Object.prototype.hasOwnProperty, le = Array.isArray, $ = console.createTask ? console.createTask : function() {
+    var y = k, g = Symbol.for("react.transitional.element"), f = Symbol.for("react.portal"), T = Symbol.for("react.fragment"), $ = Symbol.for("react.strict_mode"), P = Symbol.for("react.profiler"), L = Symbol.for("react.consumer"), N = Symbol.for("react.context"), U = Symbol.for("react.forward_ref"), C = Symbol.for("react.suspense"), F = Symbol.for("react.suspense_list"), Y = Symbol.for("react.memo"), m = Symbol.for("react.lazy"), I = Symbol.for("react.activity"), _ = Symbol.for("react.client.reference"), M = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, G = Object.prototype.hasOwnProperty, ce = Array.isArray, z = console.createTask ? console.createTask : function() {
       return null;
     };
-    _ = {
+    y = {
       "react-stack-bottom-frame": function(e) {
         return e();
       }
     };
-    var V, q = {}, G = _["react-stack-bottom-frame"].bind(
-      _,
-      l
-    )(), X = $(a(l)), B = {};
-    A.Fragment = y, A.jsx = function(e, t, u, c, E) {
-      var b = 1e4 > W.recentlyCreatedOwnerStacks++;
-      return x(
+    var B, X = {}, H = y["react-stack-bottom-frame"].bind(
+      y,
+      u
+    )(), Z = z(n(u)), Q = {};
+    S.Fragment = T, S.jsx = function(e, t, c, l, x) {
+      var v = 1e4 > M.recentlyCreatedOwnerStacks++;
+      return p(
         e,
         t,
-        u,
-        !1,
         c,
-        E,
-        b ? Error("react-stack-top-frame") : G,
-        b ? $(a(e)) : X
+        !1,
+        l,
+        x,
+        v ? Error("react-stack-top-frame") : H,
+        v ? z(n(e)) : Z
       );
-    }, A.jsxs = function(e, t, u, c, E) {
-      var b = 1e4 > W.recentlyCreatedOwnerStacks++;
-      return x(
+    }, S.jsxs = function(e, t, c, l, x) {
+      var v = 1e4 > M.recentlyCreatedOwnerStacks++;
+      return p(
         e,
         t,
-        u,
-        !0,
         c,
-        E,
-        b ? Error("react-stack-top-frame") : G,
-        b ? $(a(e)) : X
+        !0,
+        l,
+        x,
+        v ? Error("react-stack-top-frame") : H,
+        v ? z(n(e)) : Z
       );
     };
-  }()), A;
+  }()), S;
 }
-var Q;
+var re;
 function de() {
-  return Q || (Q = 1, process.env.NODE_ENV === "production" ? F.exports = ie() : F.exports = fe()), F.exports;
+  return re || (re = 1, process.env.NODE_ENV === "production" ? W.exports = ie() : W.exports = fe()), W.exports;
 }
 var R = de();
-function re(r) {
-  var s, n, a = "";
-  if (typeof r == "string" || typeof r == "number") a += r;
+function oe(r) {
+  var s, o, n = "";
+  if (typeof r == "string" || typeof r == "number") n += r;
   else if (typeof r == "object") if (Array.isArray(r)) {
-    var o = r.length;
-    for (s = 0; s < o; s++) r[s] && (n = re(r[s])) && (a && (a += " "), a += n);
-  } else for (n in r) r[n] && (a && (a += " "), a += n);
-  return a;
+    var a = r.length;
+    for (s = 0; s < a; s++) r[s] && (o = oe(r[s])) && (n && (n += " "), n += o);
+  } else for (o in r) r[o] && (n && (n += " "), n += o);
+  return n;
 }
 function me() {
-  for (var r, s, n = 0, a = "", o = arguments.length; n < o; n++) (r = arguments[n]) && (s = re(r)) && (a && (a += " "), a += s);
-  return a;
+  for (var r, s, o = 0, n = "", a = arguments.length; o < a; o++) (r = arguments[o]) && (s = oe(r)) && (n && (n += " "), n += s);
+  return n;
 }
-function O(...r) {
+function j(...r) {
   return me(...r);
 }
 const Ae = ({
   children: r,
   variant: s = "default",
-  className: n = "",
-  ...a
+  className: o = "",
+  ...n
 }) => {
-  const o = "px-4 py-2 rounded font-medium transition", l = {
-    default: "bg-blue-600 text-white hover:bg-blue-700",
-    outline: "border border-blue-600 text-blue-600 bg-white hover:bg-blue-50"
+  const a = "px-4 py-2 rounded font-medium transition", u = {
+    default: "bg-[var(--primary,#2563eb)] text-[var(--primary-text,#fff)] hover:bg-[var(--primary-hover,#1d4ed8)]",
+    outline: "border border-[var(--primary,#2563eb)] text-[var(--primary,#2563eb)] bg-white hover:bg-[var(--primary-hover,#e0e7ff)]",
+    secondary: "bg-[var(--secondary,#fbbf24)] text-[var(--secondary-text,#222)] hover:bg-[var(--secondary-hover,#f59e42)]"
   };
-  return /* @__PURE__ */ R.jsx("button", { className: O(o, l[s], n), ...a, children: r });
+  return /* @__PURE__ */ R.jsx("button", { className: j(a, u[s], o), ...n, children: r });
 };
-var be = (r) => r instanceof Date, te = (r) => r == null;
+var be = (r) => r instanceof Date, ae = (r) => r == null;
 const ve = (r) => typeof r == "object";
-var Ee = (r) => !te(r) && !Array.isArray(r) && ve(r) && !be(r), _e = (r) => /^\w*$/.test(r), K = (r) => r === void 0, Re = (r) => Array.isArray(r) ? r.filter(Boolean) : [], xe = (r) => Re(r.replace(/["|']|\]/g, "").split(/\.|\[/)), ee = (r, s, n) => {
-  if (!s || !Ee(r))
-    return n;
-  const a = (_e(s) ? [s] : xe(s)).reduce((o, l) => te(o) ? o : o[l], r);
-  return K(a) || a === r ? K(r[s]) ? n : r[s] : a;
+var pe = (r) => !ae(r) && !Array.isArray(r) && ve(r) && !be(r), Ee = (r) => /^\w*$/.test(r), te = (r) => r === void 0, _e = (r) => Array.isArray(r) ? r.filter(Boolean) : [], xe = (r) => _e(r.replace(/["|']|\]/g, "").split(/\.|\[/)), ne = (r, s, o) => {
+  if (!s || !pe(r))
+    return o;
+  const n = (Ee(s) ? [s] : xe(s)).reduce((a, u) => ae(a) ? a : a[u], r);
+  return te(n) || n === r ? te(r[s]) ? o : r[s] : n;
 };
-const ne = T.createContext(null);
-ne.displayName = "HookFormContext";
-const ae = () => T.useContext(ne), pe = typeof window < "u" ? Y.useLayoutEffect : Y.useEffect;
-var Te = (r) => typeof r == "string", ge = (r, s, n, a, o) => Te(r) ? ee(n, r, o) : Array.isArray(r) ? r.map((l) => ee(n, l)) : n;
-function ye(r) {
-  const s = ae(), { control: n = s.control, name: a, defaultValue: o, disabled: l, exact: d } = r || {}, m = T.useRef(o), [g, f] = T.useState(n._getWatch(a, m.current));
-  return pe(() => n._subscribe({
-    name: a,
+const se = k.createContext(null);
+se.displayName = "HookFormContext";
+const ue = () => k.useContext(se), Re = typeof window < "u" ? D.useLayoutEffect : D.useEffect;
+var ye = (r) => typeof r == "string", ge = (r, s, o, n, a) => ye(r) ? ne(o, r, a) : Array.isArray(r) ? r.map((u) => ne(o, u)) : o;
+function Te(r) {
+  const s = ue(), { control: o = s.control, name: n, defaultValue: a, disabled: u, exact: d } = r || {}, b = k.useRef(a), [A, O] = k.useState(o._getWatch(n, b.current));
+  return Re(() => o._subscribe({
+    name: n,
     formState: {
       values: !0
     },
     exact: d,
-    callback: (x) => !l && f(ge(a, n._names, x.values || n._formValues, !1, m.current))
-  }), [a, n, l, d]), T.useEffect(() => n._removeUnmounted()), g;
+    callback: (p) => !u && O(ge(n, o._names, p.values || o._formValues, !1, b.current))
+  }), [n, o, u, d]), k.useEffect(() => o._removeUnmounted()), A;
 }
-const ke = Y.forwardRef(
+const he = D.forwardRef(
   ({
-    className: r,
-    type: s = "text",
+    name: r,
+    className: s,
+    type: o = "text",
     label: n,
     onFocus: a,
-    onBlur: o,
-    Icon: l,
-    iconClassName: d,
-    iconAction: m,
-    containerClassName: g,
-    ...f
-  }, x) => {
-    var P, N, C;
-    const [w, _] = Y.useState(!1), v = ae(), S = v == null ? void 0 : v.control, y = S && f.name ? ye({ control: S, name: String(f.name) }) : void 0, I = f.value ?? y ?? "", j = (C = (N = (P = v == null ? void 0 : v.formState) == null ? void 0 : P.errors) == null ? void 0 : N[f.name]) == null ? void 0 : C.message, D = w || !!I;
-    return /* @__PURE__ */ R.jsxs("div", { className: O("relative", g), children: [
+    onBlur: u,
+    Icon: d,
+    iconClassName: b,
+    iconAction: A,
+    containerClassName: O,
+    ...p
+  }, E) => {
+    var C, F, Y;
+    const [y, g] = D.useState(!1), f = ue(), T = f == null ? void 0 : f.control, $ = f == null ? void 0 : f.register, P = T && r ? Te({ control: T, name: r }) : void 0, L = p.value ?? P ?? "";
+    console.log("form = ", f), console.log("valueWatch = ", P), console.log("name = ", r);
+    const N = (Y = (F = (C = f == null ? void 0 : f.formState) == null ? void 0 : C.errors) == null ? void 0 : F[r]) == null ? void 0 : Y.message, U = y || !!L;
+    return /* @__PURE__ */ R.jsxs("div", { className: j("relative", O), children: [
       /* @__PURE__ */ R.jsx(
         "input",
         {
-          id: f.id || f.name,
-          type: s,
-          className: O(
-            "peer flex h-12 w-full border border-input rounded-md bg-transparent px-3 pt-6 pb-2 text-sm text-white placeholder-transparent transition focus:outline-none focus:border-blue-500 disabled:cursor-not-allowed disabled:opacity-50",
-            r
+          id: p.id || r,
+          type: o,
+          className: j(
+            "peer flex h-12 w-full border border-[var(--primary,#2563eb)] rounded-md bg-[var(--input-bg,#fff)] text-[var(--input-text,#222)] px-3 pt-6 pb-2 text-sm placeholder-transparent transition focus:outline-none focus:border-[var(--primary,#2563eb)] disabled:cursor-not-allowed disabled:opacity-50",
+            s
           ),
-          onFocus: (k) => {
-            _(!0), a && a(k);
+          onFocus: (m) => {
+            g(!0), a && a(m);
           },
-          onBlur: (k) => {
-            _(!1), o && o(k);
+          ...f && r ? (() => {
+            const m = $(r), I = m.onBlur;
+            return {
+              ...m,
+              ref: (_) => {
+                typeof E == "function" ? E(_) : E && (E.current = _), m.ref && m.ref(_);
+              },
+              onBlur: (_) => {
+                g(!1), u && u(_), I && I(_);
+              }
+            };
+          })() : {
+            ref: E,
+            onBlur: (m) => {
+              g(!1), u && u(m);
+            }
           },
-          ref: x,
-          ...f
+          ...p
         }
       ),
       n && /* @__PURE__ */ R.jsx(
         "label",
         {
-          htmlFor: f.id || f.name,
-          className: O(
-            "absolute left-3 top-3 z-10 origin-[0] cursor-text select-none text-sm text-gray-400 transition-all duration-200",
-            D ? "scale-90 -translate-y-3 text-xs text-blue-400" : "scale-100 translate-y-0"
+          htmlFor: p.id || r,
+          className: j(
+            "absolute left-3 z-10 origin-[0] cursor-text select-none text-sm text-gray-400 transition-all duration-200",
+            U ? "top-0 scale-90 -translate-y-1 text-xs text-blue-400 p-1 rounded-full bg-white" : "top-3 scale-100 translate-y-0.5"
           ),
           children: n
         }
       ),
-      l && /* @__PURE__ */ R.jsx(
+      d && /* @__PURE__ */ R.jsx(
         "div",
         {
-          className: O(
+          className: j(
             "absolute top-1/2 right-3 -translate-y-1/2 text-white",
-            d
+            b
           ),
-          onClick: m,
-          children: /* @__PURE__ */ R.jsx(l, {})
+          onClick: A,
+          children: /* @__PURE__ */ R.jsx(d, {})
         }
       ),
-      j && /* @__PURE__ */ R.jsx("span", { className: "text-red-500 text-xs mt-1 block", children: j })
+      N && /* @__PURE__ */ R.jsx("span", { className: "text-red-500 text-xs mt-1 block", children: N })
     ] });
   }
 );
-ke.displayName = "Input";
+he.displayName = "Input";
 export {
   Ae as Button,
-  ke as Input
+  he as Input
 };

package/dist/styles.css

@@ -0,0 +1 @@
+*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.absolute{position:absolute}.relative{position:relative}.left-3{left:.75rem}.right-3{right:.75rem}.top-0{top:0}.top-1\/2{top:50%}.top-3{top:.75rem}.z-10{z-index:10}.mt-1{margin-top:.25rem}.block{display:block}.flex{display:flex}.h-12{height:3rem}.w-full{width:100%}.origin-\[0\]{transform-origin:0}.-translate-y-1{--tw-translate-y:-0.25rem}.-translate-y-1,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%}.translate-y-0\.5{--tw-translate-y:0.125rem}.scale-100,.translate-y-0\.5{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-90{--tw-scale-x:.9;--tw-scale-y:.9;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-text{cursor:text}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-\[var\(--primary\2c \#2563eb\)\]{border-color:var(--primary,#2563eb)}.bg-\[var\(--input-bg\2c \#fff\)\]{background-color:var(--input-bg,#fff)}.bg-\[var\(--primary\2c \#2563eb\)\]{background-color:var(--primary,#2563eb)}.bg-\[var\(--secondary\2c \#fbbf24\)\]{background-color:var(--secondary,#fbbf24)}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.p-1{padding:.25rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-top:.5rem}.pb-2,.py-2{padding-bottom:.5rem}.pt-6{padding-top:1.5rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-medium{font-weight:500}.text-\[var\(--input-text\2c \#222\)\]{color:var(--input-text,#222)}.text-\[var\(--primary\2c \#2563eb\)\]{color:var(--primary,#2563eb)}.text-\[var\(--primary-text\2c \#fff\)\]{color:var(--primary-text,#fff)}.text-\[var\(--secondary-text\2c \#222\)\]{color:var(--secondary-text,#222)}.text-blue-400{--tw-text-opacity:1;color:rgb(96 165 250/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-red-500{--tw-text-opacity:1;color:rgb(239 68 68/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.placeholder-transparent::-moz-placeholder{color:transparent}.placeholder-transparent::placeholder{color:transparent}.outline{outline-style:solid}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.hover\:bg-\[var\(--primary-hover\2c \#1d4ed8\)\]:hover{background-color:var(--primary-hover,#1d4ed8)}.hover\:bg-\[var\(--primary-hover\2c \#e0e7ff\)\]:hover{background-color:var(--primary-hover,#e0e7ff)}.hover\:bg-\[var\(--secondary-hover\2c \#f59e42\)\]:hover{background-color:var(--secondary-hover,#f59e42)}.focus\:border-\[var\(--primary\2c \#2563eb\)\]:focus{border-color:var(--primary,#2563eb)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}

package/dist/types/src/components/Button.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "default" | "outline";
+    variant?: "default" | "outline" | "secondary";
 }
 export declare const Button: React.FC<ButtonProps>;
 export {};

package/dist/types/src/components/Input.d.ts

@@ -2,6 +2,7 @@ import * as React from "react";
 export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
 }
 export interface CustomProps {
+    name: string;
     label?: string;
     Icon?: React.ElementType;
     iconClassName?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rharuow-ds",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "main": "dist/rharuow-ds.cjs.js",
   "module": "dist/rharuow-ds.es.js",
   "types": "dist/types/src/components/index.d.ts",
@@ -9,11 +9,13 @@
       "import": "./dist/rharuow-ds.es.js",
       "require": "./dist/rharuow-ds.cjs.js",
       "types": "./dist/types/src/components/index.d.ts"
-    }
+    },
+    "./dist/styles.css": "./dist/styles.css"
   },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "vite build && tsc --emitDeclarationOnly --declaration --declarationDir dist/types",
+    "build:css": "npx tailwindcss -i ./src/styles/ds.css -o ./dist/styles.css --minify",
+    "build": "vite build && tsc --emitDeclarationOnly --declaration --declarationDir dist/types && npm run build:css",
     "storybook": "storybook dev -p 6006",
     "deploy-storybook": "npx gh-pages -d storybook-static",
     "build-storybook": "storybook build"
@@ -36,9 +38,7 @@
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "^4.6.0",
-    "autoprefixer": "^10.4.21",
     "gh-pages": "^6.3.0",
-    "postcss": "^8.5.6",
     "storybook": "^9.0.14",
     "tailwindcss": "^3.4.3",
     "typescript": "^5.8.3"