UNPKG

@nuitral/react-ui-suite

Version:
12 lines (11 loc) 11 kB
import e,{useMemo as r,useState as t,useRef as n,useEffect as a}from"react";var o,i={exports:{}},s={};var l,c,u={}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */function d(){return l||(l=1,"production"!==process.env.NODE_ENV&&function(){function r(e){if(null==e)return null;if("function"==typeof e)return e.$$typeof===$?null:e.displayName||e.name||null;if("string"==typeof e)return e;switch(e){case m:return"Fragment";case y:return"Profiler";case b:return"StrictMode";case j:return"Suspense";case k:return"SuspenseList";case N:return"Activity"}if("object"==typeof e)switch("number"==typeof e.tag&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case p:return"Portal";case g:return(e.displayName||"Context")+".Provider";case h:return(e._context.displayName||"Context")+".Consumer";case v:var t=e.render;return(e=e.displayName)||(e=""!==(e=t.displayName||t.name||"")?"ForwardRef("+e+")":"ForwardRef"),e;case x:return null!==(t=e.displayName||null)?t:r(e.type)||"Memo";case S:t=e._payload,e=e._init;try{return r(e(t))}catch(e){}}return null}function t(e){return""+e}function n(e){try{t(e);var r=!1}catch(e){r=!0}if(r){var n=(r=console).error,a="function"==typeof Symbol&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return n.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",a),t(e)}}function a(e){if(e===m)return"<>";if("object"==typeof e&&null!==e&&e.$$typeof===S)return"<...>";try{var t=r(e);return t?"<"+t+">":"<...>"}catch(e){return"<...>"}}function o(){return Error("react-stack-top-frame")}function i(){var e=r(this.type);return P[e]||(P[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.")),void 0!==(e=this.props.ref)?e:null}function s(e,t,a,o,s,u,d,p){var m,b=t.children;if(void 0!==b)if(o)if(w(b)){for(o=0;o<b.length;o++)l(b[o]);Object.freeze&&Object.freeze(b)}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 l(b);if(_.call(t,"key")){b=r(e);var y=Object.keys(t).filter((function(e){return"key"!==e}));o=0<y.length?"{key: someKey, "+y.join(": ..., ")+": ...}":"{key: someKey}",R[b+o]||(y=0<y.length?"{"+y.join(": ..., ")+": ...}":"{}",console.error('A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',o,b,y,b),R[b+o]=!0)}if(b=null,void 0!==a&&(n(a),b=""+a),function(e){if(_.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return void 0!==e.key}(t)&&(n(t.key),b=""+t.key),"key"in t)for(var h in a={},t)"key"!==h&&(a[h]=t[h]);else a=t;return b&&function(e,r){function t(){c||(c=!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})}(a,"function"==typeof e?e.displayName||e.name||"Unknown":e),function(e,r,t,n,a,o,s,l){return t=o.ref,e={$$typeof:f,type:e,key:r,props:o,_owner:a},null!==(void 0!==t?t:null)?Object.defineProperty(e,"ref",{enumerable:!1,get:i}):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:s}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:l}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}(e,b,u,0,null===(m=O.A)?null:m.getOwner(),a,d,p)}function l(e){"object"==typeof e&&null!==e&&e.$$typeof===f&&e._store&&(e._store.validated=1)}var c,d=e,f=Symbol.for("react.transitional.element"),p=Symbol.for("react.portal"),m=Symbol.for("react.fragment"),b=Symbol.for("react.strict_mode"),y=Symbol.for("react.profiler"),h=Symbol.for("react.consumer"),g=Symbol.for("react.context"),v=Symbol.for("react.forward_ref"),j=Symbol.for("react.suspense"),k=Symbol.for("react.suspense_list"),x=Symbol.for("react.memo"),S=Symbol.for("react.lazy"),N=Symbol.for("react.activity"),$=Symbol.for("react.client.reference"),O=d.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,_=Object.prototype.hasOwnProperty,w=Array.isArray,E=console.createTask?console.createTask:function(){return null},P={},T=(d={"react-stack-bottom-frame":function(e){return e()}})["react-stack-bottom-frame"].bind(d,o)(),A=E(a(o)),R={};u.Fragment=m,u.jsx=function(e,r,t,n,o){var i=1e4>O.recentlyCreatedOwnerStacks++;return s(e,r,t,!1,0,o,i?Error("react-stack-top-frame"):T,i?E(a(e)):A)},u.jsxs=function(e,r,t,n,o){var i=1e4>O.recentlyCreatedOwnerStacks++;return s(e,r,t,!0,0,o,i?Error("react-stack-top-frame"):T,i?E(a(e)):A)}}()),u}var f=(c||(c=1,"production"===process.env.NODE_ENV?i.exports=function(){if(o)return s;o=1;var e=Symbol.for("react.transitional.element"),r=Symbol.for("react.fragment");function t(r,t,n){var a=null;if(void 0!==n&&(a=""+n),void 0!==t.key&&(a=""+t.key),"key"in t)for(var o in n={},t)"key"!==o&&(n[o]=t[o]);else n=t;return t=n.ref,{$$typeof:e,type:r,key:a,ref:void 0!==t?t:null,props:n}}return s.Fragment=r,s.jsx=t,s.jsxs=t,s}():i.exports=d()),i.exports);const p=(e,t=[])=>r((()=>{const r={};for(const n in e)if(!t.includes(n)){const t=e[n];r[n]="boolean"==typeof t?t.toString():t}return r}),[e,t]),m=()=>{const e=r((()=>["primary","secondary","accent","error","success","warning","info","neutral","background","surface"]),[]),t=r((()=>["100","200","300","400","500","600","700","800","900"]),[]),n=[];e.forEach((e=>{n.push(`${e}`),t.forEach((r=>{n.push(`${e}-${r}`)})),n.push(`border-${e}`),t.forEach((r=>{n.push(`border-${e}-${r}`)}))}));return{isValidAttribute:e=>n.includes(e)}},b=({title:e,description:t,...n})=>{const a=p(n),{isValidAttribute:o}=m(),i=r((()=>{const e={};for(const r in a)o(r)&&(e[r]=a[r]);return Object.keys(e).map((e=>`nuitral-box-background-${e}`))}),[a]);return f.jsxs("div",{className:`nuitral-box ${i}`,children:[f.jsx("div",{className:"nuitral-box-title",children:e}),f.jsx("div",{children:t})]})},y=({icon:e=""})=>{const t=r((()=>`nuitral-icon-${e}`),[e]);return f.jsx("div",{className:`nuitral-icon ${t}`})},h=({classes:e="",type:t="button",disabled:n=!1,icon:a,iconPosition:o="left",children:i,leftSide:s,rightSide:l,...c})=>{const u=p(c),{isValidAttribute:d}=m(),b=r((()=>{const e={};for(const r in u)d(r)&&(e[r]=u[r]);return Object.keys(e).map((e=>`nuitral-button-background-${e}`))}),[u]);return f.jsxs("button",{className:`nuitral-button ${e} ${b} ${n?"disabled":""}`,type:t,disabled:n,...u,children:[s&&f.jsx("div",{className:"left-side",children:s}),a&&"left"===o&&f.jsx(y,{icon:a}),i,a&&"right"===o&&f.jsx(y,{icon:a}),l&&f.jsx("div",{className:"right-side",children:l})]})},g=({classes:e="",children:t,header:n,footer:a,hasShadow:o=!1,...i})=>{const s=p(i),{isValidAttribute:l}=m(),c=r((()=>{const e={};for(const r in s)l(r)&&!r.startsWith("border-")&&(e[r]=s[r]);return Object.keys(e).length?Object.keys(e).map((e=>`nuitral-card-background-${e}`)):"nuitral-card-background-background"}),[s]),u=r((()=>{const e={};for(const r in s)l(r)&&r.startsWith("border-")&&(e[r]=s[r]);return Object.keys(e).length?Object.keys(e).map((e=>`nuitral-card-${e}`)):"nuitral-card-border-primary"}),[s]);return f.jsxs(f.Fragment,{children:[f.jsx("div",{children:c}),f.jsxs("div",{...s,className:`nuitral-card ${e} ${c} ${o?"nuitral-card-shadow":u}`,children:[n&&f.jsx("div",{className:"nuitral-card-header",children:n}),t,a&&f.jsx("div",{className:"nuitral-card-footer",children:a})]})]})},v=({type:e="text",placeholder:r="",icon:t,iconPosition:n="left",disabled:a=!1,classes:o="",value:i,onChange:s})=>f.jsxs("div",{className:`nuitral-input nuitral-input-text-color ${o} ${a?"disabled":""}`,children:[t&&"left"===n&&f.jsx(y,{icon:t}),f.jsx("input",{type:e,disabled:a,placeholder:r,value:i,onChange:r=>{const t="number"===e?Number(r.target.value):r.target.value;s(t)}}),t&&"right"===n&&f.jsx(y,{icon:t})]}),j=()=>f.jsx(f.Fragment,{}),k=({items:n=[],children:a=[],classes:o="",selected:i=0,onSelection:s,...l})=>{const[c,u]=t(i),d=p(l),{isValidAttribute:b}=m(),h=r((()=>{const e={};for(const r in d)b(r)&&(e[r]=d[r]);return Object.keys(e).map((e=>`nuitral-tab-${e}`)).join(" ")}),[d]),g=e=>{u(e.index),(e=>{s&&s(e)})(e)},v=r((()=>{const r={label:"",children:null,component:null,icon:null,iconPosition:"left",classes:"",disabled:!1,leftSide:null,rightSide:null};return n.length>0?n.map((e=>({...r,...e}))):e.Children.map(a,(t=>e.isValidElement(t)?{...r,...t.props}:null))?.filter((e=>null!==e))||[]}),[n,a]);return f.jsxs(f.Fragment,{children:[f.jsx("div",{className:`nuitral-tabs ${h} ${o}`,children:v.map(((e,r)=>f.jsxs("div",{className:`nuitral-tab ${r===c?"nuitral-tab-active":""} ${e.disabled?"disabled":""}`,onClick:()=>!e.disabled&&g({item:e,index:r}),children:[e.leftSide&&f.jsx("div",{className:"left-side",children:e.leftSide}),e.icon&&"left"===e.iconPosition&&f.jsx(y,{icon:e.icon}),e.label,e.icon&&"right"===e.iconPosition&&f.jsx(y,{icon:e.icon}),e.rightSide&&f.jsx("div",{className:"right-side",children:e.rightSide})]},r)))}),f.jsx("div",{className:`nuitral-tab-content ${v[c].classes}`,children:v[c]?.component?e.createElement(v[c].component):v[c]?.children?f.jsx("div",{children:v[c].children}):null})]})},x=({theme:e="nuitral",darkMode:r=!1,lightModeName:o="nuitral-light-mode",darkModeName:i="nuitral-dark-mode",rootId:s="nuitral-app",saveSettings:l=!1})=>{const c=(e,r)=>{l&&localStorage.setItem("nuitral",JSON.stringify({darkMode:e,theme:r}))},{theme:u,darkMode:d}=(()=>{if(!l)return{theme:e,darkMode:r};const t=localStorage.getItem("nuitral");return t?JSON.parse(t):{theme:e,darkMode:r}})(),[f,p]=t(d),[m,b]=t(u),y=n(null),h=()=>{if(y.current){const e=f?i:o;y.current.setAttribute("nuitral-theme",m),y.current.classList.add(e),y.current.classList.remove(f?o:i)}};return a((()=>{y.current=document.getElementById(s),h()}),[s]),a((()=>{h()}),[f,m]),{manageDarkMode:()=>{p((e=>{const r=!e;return c(r,m),r}))},isDarkMode:f,manageTheme:e=>{b(e),c(f,e)},themeName:m}};export{b as NuitralBox,h as NuitralButton,g as NuitralCard,y as NuitralIcon,v as NuitralInput,j as NuitralTab,k as NuitralTabs,p as useAttrs,m as useColorsAttributesValidator,x as useNuitralTheming}; //# sourceMappingURL=react-ui-suite.esm.js.map