@fabio.caffarello/react-design-system 1.0.0 → 1.2.0

package/README.md

@@ -117,6 +117,7 @@ Explore the live documentation and interactive components:
 - [x] Storybook integration
 - [x] Automated unit and story testing
 - [x] TailwindCSS theming
+- [ ] Create Publish npm package cd step
 - [ ] Improve components design
 - [ ] New components (Cards, Modals, etc.)
 - [ ] Customizable themes and dark mode

package/dist/index.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const oe=require("react");var h={exports:{}},_={};/**
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const oe=require("react");var _={exports:{}},p={};/**
  * @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 W;function se(){if(W)return _;W=1;var n=Symbol.for("react.transitional.element"),a=Symbol.for("react.fragment");function s(o,c,f){var m=null;if(f!==void 0&&(m=""+f),c.key!==void 0&&(m=""+c.key),"key"in c){f={};for(var d in c)d!=="key"&&(f[d]=c[d])}else f=c;return c=f.ref,{$$typeof:n,type:o,key:m,ref:c!==void 0?c:null,props:f}}return _.Fragment=a,_.jsx=s,_.jsxs=s,_}var E={};/**
+ */var W;function se(){if(W)return p;W=1;var t=Symbol.for("react.transitional.element"),o=Symbol.for("react.fragment");function a(n,s,i){var b=null;if(i!==void 0&&(b=""+i),s.key!==void 0&&(b=""+s.key),"key"in s){i={};for(var f in s)f!=="key"&&(i[f]=s[f])}else i=s;return s=i.ref,{$$typeof:t,type:n,key:b,ref:s!==void 0?s:null,props:i}}return p.Fragment=o,p.jsx=a,p.jsxs=a,p}var x={};/**
  * @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 D;function le(){return D||(D=1,process.env.NODE_ENV!=="production"&&(function(){function n(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===te?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case g:return"Fragment";case G:return"Profiler";case z:return"StrictMode";case Q:return"Suspense";case K:return"SuspenseList";case re: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 V:return"Portal";case H:return e.displayName||"Context";case X:return(e._context.displayName||"Context")+".Consumer";case Z:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case ee:return r=e.displayName||null,r!==null?r:n(e.type)||"Memo";case R:r=e._payload,e=e._init;try{return n(e(r))}catch{}}return null}function a(e){return""+e}function s(e){try{a(e);var r=!1}catch{r=!0}if(r){r=console;var t=r.error,l=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return t.call(r,"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===g)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===R)return"<...>";try{var r=n(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function c(){var e=T.A;return e===null?null:e.getOwner()}function f(){return Error("react-stack-top-frame")}function m(e){if(C.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function d(e,r){function t(){I||(I=!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)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}function b(){var e=n(this.type);return Y[e]||(Y[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,r,t,l,x,j){var u=t.ref;return e={$$typeof:P,type:e,key:r,props:t,_owner:l},(u!==void 0?u:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:b}):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:x}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:j}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function O(e,r,t,l,x,j){var u=r.children;if(u!==void 0)if(l)if(ne(u)){for(l=0;l<u.length;l++)N(u[l]);Object.freeze&&Object.freeze(u)}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 N(u);if(C.call(r,"key")){u=n(e);var p=Object.keys(r).filter(function(ae){return ae!=="key"});l=0<p.length?"{key: someKey, "+p.join(": ..., ")+": ...}":"{key: someKey}",L[u+l]||(p=0<p.length?"{"+p.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
+ */var B;function le(){return B||(B=1,process.env.NODE_ENV!=="production"&&(function(){function t(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===te?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case E:return"Fragment";case G:return"Profiler";case V:return"StrictMode";case Q:return"Suspense";case K:return"SuspenseList";case re: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 J:return"Portal";case H:return e.displayName||"Context";case X:return(e._context.displayName||"Context")+".Consumer";case Z:var r=e.render;return e=e.displayName,e||(e=r.displayName||r.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case ee:return r=e.displayName||null,r!==null?r:t(e.type)||"Memo";case R:r=e._payload,e=e._init;try{return t(e(r))}catch{}}return null}function o(e){return""+e}function a(e){try{o(e);var r=!1}catch{r=!0}if(r){r=console;var l=r.error,c=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return l.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",c),o(e)}}function n(e){if(e===E)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===R)return"<...>";try{var r=t(e);return r?"<"+r+">":"<...>"}catch{return"<...>"}}function s(){var e=j.A;return e===null?null:e.getOwner()}function i(){return Error("react-stack-top-frame")}function b(e){if(C.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function f(e,r){function l(){I||(I=!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)",r))}l.isReactWarning=!0,Object.defineProperty(e,"key",{get:l,configurable:!0})}function m(){var e=t(this.type);return Y[e]||(Y[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 U(e,r,l,c,h,T){var d=l.ref;return e={$$typeof:P,type:e,key:r,props:l,_owner:c},(d!==void 0?d:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:m}):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:h}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:T}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function N(e,r,l,c,h,T){var d=r.children;if(d!==void 0)if(c)if(ae(d)){for(c=0;c<d.length;c++)O(d[c]);Object.freeze&&Object.freeze(d)}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 O(d);if(C.call(r,"key")){d=t(e);var g=Object.keys(r).filter(function(ne){return ne!=="key"});c=0<g.length?"{key: someKey, "+g.join(": ..., ")+": ...}":"{key: someKey}",L[d+c]||(g=0<g.length?"{"+g.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,u,p,u),L[u+l]=!0)}if(u=null,t!==void 0&&(s(t),u=""+t),m(r)&&(s(r.key),u=""+r.key),"key"in r){t={};for(var y in r)y!=="key"&&(t[y]=r[y])}else t=r;return u&&d(t,typeof e=="function"?e.displayName||e.name||"Unknown":e),J(e,u,t,c(),x,j)}function N(e){A(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===R&&(e._payload.status==="fulfilled"?A(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function A(e){return typeof e=="object"&&e!==null&&e.$$typeof===P}var v=oe,P=Symbol.for("react.transitional.element"),V=Symbol.for("react.portal"),g=Symbol.for("react.fragment"),z=Symbol.for("react.strict_mode"),G=Symbol.for("react.profiler"),X=Symbol.for("react.consumer"),H=Symbol.for("react.context"),Z=Symbol.for("react.forward_ref"),Q=Symbol.for("react.suspense"),K=Symbol.for("react.suspense_list"),ee=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),re=Symbol.for("react.activity"),te=Symbol.for("react.client.reference"),T=v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,ne=Array.isArray,k=console.createTask?console.createTask:function(){return null};v={react_stack_bottom_frame:function(e){return e()}};var I,Y={},$=v.react_stack_bottom_frame.bind(v,f)(),F=k(o(f)),L={};E.Fragment=g,E.jsx=function(e,r,t){var l=1e4>T.recentlyCreatedOwnerStacks++;return O(e,r,t,!1,l?Error("react-stack-top-frame"):$,l?k(o(e)):F)},E.jsxs=function(e,r,t){var l=1e4>T.recentlyCreatedOwnerStacks++;return O(e,r,t,!0,l?Error("react-stack-top-frame"):$,l?k(o(e)):F)}})()),E}var M;function ue(){return M||(M=1,process.env.NODE_ENV==="production"?h.exports=se():h.exports=le()),h.exports}var i=ue();function ie({variant:n="info",className:a,...s}){const o=[a||""];switch(n){case"warning":{o.push("bg-yellow-100 text-yellow-800 border-yellow-500");break}case"error":{o.push("bg-red-100 text-red-800 border-red-500");break}default:case"info":{o.push("bg-blue-100 text-blue-800 border-blue-500");break}}return i.jsx("div",{role:"alert",className:`border px-4 py-2 rounded-lg ${o.join(" ")}`,...s})}function q({variant:n,bold:a,italic:s,className:o,as:c,color:f,...m}){const d=[o];let b;if(c)b=c;else switch(n){case"heading":b="h2";break;case"list":b="li";break;case"paragraph":default:b="p";break}return a&&d.push("font-bold"),s&&d.push("italic"),f&&d.push(`text-${f}`),i.jsx(b,{className:d.join(" "),...m})}function U({className:n,...a}){const s=[n,"px-large","border","border-1","border-grey-light","rounded","lh-form-element","h-form-element","text-base"];return i.jsx("input",{className:s.join(" "),...a})}function w({className:n,variant:a="regular",...s}){const o=[n,"rounded","h-form-element","lh-form-element","px-large","text-base"];switch(a){case"error":o.push("bg-red-light","text-red-dark","font-bold");break;case"secondary":o.push("bg-transparent","text-grey-minor","px-0");break;case"regular":default:o.push("bg-blue-light","text-blue-dark","font-bold");break}return i.jsx("button",{className:o.join(" "),...s})}function B({className:n,...a}){const s=[n,"p-large","bg-bg","rounded","shadow-card"];return i.jsx("div",{className:s.join(" "),...a})}function S({label:n,...a}){return a.id||console.error("InputWithLabel component requires an id prop"),i.jsxs("div",{className:"mb-medium grid gap-small",children:[i.jsx(q,{as:"label",htmlFor:a.id,className:"cursor-pointer",children:n}),i.jsx(U,{...a})]})}function ce({onForgotPasswordClick:n,className:a,...s}){return i.jsx(B,{className:a,children:i.jsxs("form",{...s,onSubmit:o=>{o.preventDefault(),s.onSubmit&&s.onSubmit(o)},children:[i.jsx(S,{id:"login-email",label:"Your email",placeholder:"myname@email.com"}),i.jsx(S,{id:"login-password",label:"Your password",placeholder:"••••••••",type:"password"}),i.jsxs("div",{className:"flex justify-between",children:[i.jsx(w,{variant:"secondary",type:"button",onClick:n,children:"Forgot password?"}),i.jsx(w,{variant:"regular",type:"submit",children:"Sign in"})]})]})})}exports.BoxWrapper=B;exports.Button=w;exports.Info=ie;exports.Input=U;exports.InputWithLabel=S;exports.LoginBox=ce;exports.Text=q;
+  <%s key={someKey} {...props} />`,c,d,g,d),L[d+c]=!0)}if(d=null,l!==void 0&&(a(l),d=""+l),b(r)&&(a(r.key),d=""+r.key),"key"in r){l={};for(var k in r)k!=="key"&&(l[k]=r[k])}else l=r;return d&&f(l,typeof e=="function"?e.displayName||e.name||"Unknown":e),U(e,d,l,s(),h,T)}function O(e){A(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===R&&(e._payload.status==="fulfilled"?A(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function A(e){return typeof e=="object"&&e!==null&&e.$$typeof===P}var v=oe,P=Symbol.for("react.transitional.element"),J=Symbol.for("react.portal"),E=Symbol.for("react.fragment"),V=Symbol.for("react.strict_mode"),G=Symbol.for("react.profiler"),X=Symbol.for("react.consumer"),H=Symbol.for("react.context"),Z=Symbol.for("react.forward_ref"),Q=Symbol.for("react.suspense"),K=Symbol.for("react.suspense_list"),ee=Symbol.for("react.memo"),R=Symbol.for("react.lazy"),re=Symbol.for("react.activity"),te=Symbol.for("react.client.reference"),j=v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,ae=Array.isArray,y=console.createTask?console.createTask:function(){return null};v={react_stack_bottom_frame:function(e){return e()}};var I,Y={},$=v.react_stack_bottom_frame.bind(v,i)(),F=y(n(i)),L={};x.Fragment=E,x.jsx=function(e,r,l){var c=1e4>j.recentlyCreatedOwnerStacks++;return N(e,r,l,!1,c?Error("react-stack-top-frame"):$,c?y(n(e)):F)},x.jsxs=function(e,r,l){var c=1e4>j.recentlyCreatedOwnerStacks++;return N(e,r,l,!0,c?Error("react-stack-top-frame"):$,c?y(n(e)):F)}})()),x}var D;function ie(){return D||(D=1,process.env.NODE_ENV==="production"?_.exports=se():_.exports=le()),_.exports}var u=ie();function ue({variant:t="info",className:o,...a}){const n=[o||""];switch(t){case"warning":{n.push("bg-yellow-100 text-yellow-800 border-yellow-500");break}case"error":{n.push("bg-red-100 text-red-800 border-red-500");break}default:case"info":{n.push("bg-blue-100 text-blue-800 border-blue-500");break}}return u.jsx("div",{role:"alert",className:`border px-4 py-2 rounded-lg ${n.join(" ")}`,...a})}function z({variant:t,bold:o,italic:a,className:n,as:s,color:i,...b}){const f=[n];let m;if(s)m=s;else switch(t){case"heading":m="h2";break;case"list":m="li";break;case"paragraph":default:m="p";break}return o&&f.push("font-bold"),a&&f.push("italic"),i&&f.push(`text-${i}`),u.jsx(m,{className:f.join(" "),...b})}function M({className:t,...o}){const a=[t,"px-large","border","border-1","border-grey-light","rounded","lh-form-element","h-form-element","text-base"];return u.jsx("input",{className:a.join(" "),...o})}function w({className:t,variant:o="regular",...a}){const n=[t,"rounded","h-form-element","lh-form-element","px-large","text-base"];switch(o){case"error":n.push("bg-red-light","text-red-dark","font-bold");break;case"secondary":n.push("bg-transparent","text-grey-minor","px-0");break;case"regular":default:n.push("bg-blue-light","text-blue-dark","font-bold");break}return u.jsx("button",{className:n.join(" "),...a})}function q({className:t,...o}){const a=[t,"p-large","bg-bg","rounded","shadow-card"];return u.jsx("div",{className:a.join(" "),...o})}function ce({variant:t="neutral",className:o="",children:a,...n}){const s=["inline-flex","items-center","px-2","py-1","rounded","text-xs","font-medium","border"],i={success:"bg-green-100 text-green-800 border-green-500",warning:"bg-yellow-100 text-yellow-800 border-yellow-500",error:"bg-red-100 text-red-800 border-red-500",info:"bg-blue-100 text-blue-800 border-blue-500",neutral:"bg-gray-100 text-gray-800 border-gray-500"},b=[...s,i[t],o].filter(Boolean).join(" ");return u.jsx("span",{role:"status","aria-label":typeof a=="string"?a:void 0,className:b,...n,children:a})}function de({options:t,placeholder:o,error:a=!1,className:n="",...s}){const i=["block","w-full","rounded","h-form-element","px-large","border","text-base","focus:outline-none","focus:ring-2","focus:ring-offset-2"],b=a?"border-red-500 focus:ring-red-500":"border-gray-300 focus:ring-indigo-500",f=[...i,b,n].filter(Boolean).join(" ");return u.jsxs("select",{className:f,"aria-invalid":a,"aria-describedby":a?`${s.id}-error`:void 0,...s,children:[o&&u.jsx("option",{value:"",disabled:!0,children:o}),t.map(m=>u.jsx("option",{value:m.value,disabled:m.disabled,children:m.label},m.value))]})}function fe({error:t=!1,resize:o="vertical",className:a="",...n}){const s=["block","w-full","rounded","px-large","py-medium","border","text-base","focus:outline-none","focus:ring-2","focus:ring-offset-2"],i={none:"resize-none",both:"resize",horizontal:"resize-x",vertical:"resize-y"},b=t?"border-red-500 focus:ring-red-500":"border-gray-300 focus:ring-indigo-500",f=[...s,i[o],b,a].filter(Boolean).join(" ");return u.jsx("textarea",{className:f,"aria-invalid":t,"aria-describedby":t&&n.id?`${n.id}-error`:void 0,...n})}function S({label:t,...o}){return o.id||console.error("InputWithLabel component requires an id prop"),u.jsxs("div",{className:"mb-medium grid gap-small",children:[u.jsx(z,{as:"label",htmlFor:o.id,className:"cursor-pointer",children:t}),u.jsx(M,{...o})]})}function be({variant:t="default",padding:o="medium",className:a="",children:n,...s}){const i=["bg-white","rounded-lg","border","border-gray-200","shadow-sm"],b={default:"",hover:"hover:shadow-md transition-shadow cursor-pointer",selected:"border-indigo-500 shadow-md"},f={none:"",small:"p-2",medium:"p-4",large:"p-6"},m=[...i,b[t],f[o],a].filter(Boolean).join(" ");return u.jsx("div",{className:m,...s,children:n})}function me({onForgotPasswordClick:t,className:o,...a}){return u.jsx(q,{className:o,children:u.jsxs("form",{...a,onSubmit:n=>{n.preventDefault(),a.onSubmit&&a.onSubmit(n)},children:[u.jsx(S,{id:"login-email",label:"Your email",placeholder:"myname@email.com"}),u.jsx(S,{id:"login-password",label:"Your password",placeholder:"••••••••",type:"password"}),u.jsxs("div",{className:"flex justify-between",children:[u.jsx(w,{variant:"secondary",type:"button",onClick:t,children:"Forgot password?"}),u.jsx(w,{variant:"regular",type:"submit",children:"Sign in"})]})]})})}exports.Badge=ce;exports.BoxWrapper=q;exports.Button=w;exports.Card=be;exports.Info=ue;exports.Input=M;exports.InputWithLabel=S;exports.LoginBox=me;exports.Select=de;exports.Text=z;exports.Textarea=fe;