@arkyn/components 1.2.2 → 1.2.4
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/bundle.js +479 -458
- package/dist/bundle.umd.cjs +10 -10
- package/dist/components/Form/FormError/index.d.ts.map +1 -1
- package/dist/components/Form/FormError/index.js +4 -2
- package/dist/components/Skeleton/index.d.ts +5 -0
- package/dist/components/Skeleton/index.d.ts.map +1 -0
- package/dist/components/Skeleton/index.js +7 -0
- package/dist/hooks/useScopedParams.d.ts +7 -0
- package/dist/hooks/useScopedParams.d.ts.map +1 -0
- package/dist/hooks/useScopedParams.js +27 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -0
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/Form/FormError/index.tsx +2 -1
- package/src/components/Skeleton/index.tsx +9 -0
- package/src/components/Skeleton/styles.css +18 -0
- package/src/hooks/useScopedParams.ts +31 -0
- package/src/index.ts +4 -0
package/dist/bundle.umd.cjs
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
(function(
|
1
|
+
(function(S,N){typeof exports=="object"&&typeof module<"u"?N(exports,require("react"),require("lucide-react"),require("@remix-run/react"),require("@react-input/mask"),require("framer-motion")):typeof define=="function"&&define.amd?define(["exports","react","lucide-react","@remix-run/react","@react-input/mask","framer-motion"],N):(S=typeof globalThis<"u"?globalThis:S||self,N(S["@arkyn/components"]={},S.require$$0,S.lucideReact,S.react,S.mask,S.framerMotion))})(this,function(S,N,Q,me,er,be){"use strict";var xe={exports:{}},ce={};/**
|
2
2
|
* @license React
|
3
3
|
* react-jsx-runtime.production.min.js
|
4
4
|
*
|
@@ -6,7 +6,7 @@
|
|
6
6
|
*
|
7
7
|
* This source code is licensed under the MIT license found in the
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
9
|
-
*/var Ie;function rr(){if(Ie)return ce;Ie=1;var n=N,
|
9
|
+
*/var Ie;function rr(){if(Ie)return ce;Ie=1;var n=N,s=Symbol.for("react.element"),t=Symbol.for("react.fragment"),o=Object.prototype.hasOwnProperty,c=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,u={key:!0,ref:!0,__self:!0,__source:!0};function d(l,m,h){var p,x={},E=null,P=null;h!==void 0&&(E=""+h),m.key!==void 0&&(E=""+m.key),m.ref!==void 0&&(P=m.ref);for(p in m)o.call(m,p)&&!u.hasOwnProperty(p)&&(x[p]=m[p]);if(l&&l.defaultProps)for(p in m=l.defaultProps,m)x[p]===void 0&&(x[p]=m[p]);return{$$typeof:s,type:l,key:E,ref:P,props:x,_owner:c.current}}return ce.Fragment=t,ce.jsx=d,ce.jsxs=d,ce}var ue={};/**
|
10
10
|
* @license React
|
11
11
|
* react-jsx-runtime.development.js
|
12
12
|
*
|
@@ -14,19 +14,19 @@
|
|
14
14
|
*
|
15
15
|
* This source code is licensed under the MIT license found in the
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
17
|
-
*/var Te;function nr(){return Te||(Te=1,process.env.NODE_ENV!=="production"&&function(){var n=N,
|
18
|
-
`+
|
19
|
-
`),F=
|
17
|
+
*/var Te;function nr(){return Te||(Te=1,process.env.NODE_ENV!=="production"&&function(){var n=N,s=Symbol.for("react.element"),t=Symbol.for("react.portal"),o=Symbol.for("react.fragment"),c=Symbol.for("react.strict_mode"),u=Symbol.for("react.profiler"),d=Symbol.for("react.provider"),l=Symbol.for("react.context"),m=Symbol.for("react.forward_ref"),h=Symbol.for("react.suspense"),p=Symbol.for("react.suspense_list"),x=Symbol.for("react.memo"),E=Symbol.for("react.lazy"),P=Symbol.for("react.offscreen"),T=Symbol.iterator,$="@@iterator";function L(e){if(e===null||typeof e!="object")return null;var r=T&&e[T]||e[$];return typeof r=="function"?r:null}var R=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function y(e){{for(var r=arguments.length,a=new Array(r>1?r-1:0),f=1;f<r;f++)a[f-1]=arguments[f];j("error",e,a)}}function j(e,r,a){{var f=R.ReactDebugCurrentFrame,b=f.getStackAddendum();b!==""&&(r+="%s",a=a.concat([b]));var _=a.map(function(g){return String(g)});_.unshift("Warning: "+r),Function.prototype.apply.call(console[e],console,_)}}var z=!1,V=!1,A=!1,W=!1,Y=!1,O;O=Symbol.for("react.module.reference");function K(e){return!!(typeof e=="string"||typeof e=="function"||e===o||e===u||Y||e===c||e===h||e===p||W||e===P||z||V||A||typeof e=="object"&&e!==null&&(e.$$typeof===E||e.$$typeof===x||e.$$typeof===d||e.$$typeof===l||e.$$typeof===m||e.$$typeof===O||e.getModuleId!==void 0))}function I(e,r,a){var f=e.displayName;if(f)return f;var b=r.displayName||r.name||"";return b!==""?a+"("+b+")":a}function Z(e){return e.displayName||"Context"}function C(e){if(e==null)return null;if(typeof e.tag=="number"&&y("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case o:return"Fragment";case t:return"Portal";case u:return"Profiler";case c:return"StrictMode";case h:return"Suspense";case p:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case l:var r=e;return Z(r)+".Consumer";case d:var a=e;return Z(a._context)+".Provider";case m:return I(e,e.render,"ForwardRef");case x:var f=e.displayName||null;return f!==null?f:C(e.type)||"Memo";case E:{var b=e,_=b._payload,g=b._init;try{return C(g(_))}catch{return null}}}return null}var B=Object.assign,J=0,X,re,ne,te,se,ae,M;function G(){}G.__reactDisabledLog=!0;function H(){{if(J===0){X=console.log,re=console.info,ne=console.warn,te=console.error,se=console.group,ae=console.groupCollapsed,M=console.groupEnd;var e={configurable:!0,enumerable:!0,value:G,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}J++}}function Ae(){{if(J--,J===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:B({},e,{value:X}),info:B({},e,{value:re}),warn:B({},e,{value:ne}),error:B({},e,{value:te}),group:B({},e,{value:se}),groupCollapsed:B({},e,{value:ae}),groupEnd:B({},e,{value:M})})}J<0&&y("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var Se=R.ReactCurrentDispatcher,Re;function ve(e,r,a){{if(Re===void 0)try{throw Error()}catch(b){var f=b.stack.trim().match(/\n( *(at )?)/);Re=f&&f[1]||""}return`
|
18
|
+
`+Re+e}}var Ee=!1,ge;{var Dr=typeof WeakMap=="function"?WeakMap:Map;ge=new Dr}function We(e,r){if(!e||Ee)return"";{var a=ge.get(e);if(a!==void 0)return a}var f;Ee=!0;var b=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var _;_=Se.current,Se.current=null,H();try{if(r){var g=function(){throw Error()};if(Object.defineProperty(g.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(g,[])}catch(D){f=D}Reflect.construct(e,[],g)}else{try{g.call()}catch(D){f=D}e.call(g.prototype)}}else{try{throw Error()}catch(D){f=D}e()}}catch(D){if(D&&f&&typeof D.stack=="string"){for(var v=D.stack.split(`
|
19
|
+
`),F=f.stack.split(`
|
20
20
|
`),k=v.length-1,w=F.length-1;k>=1&&w>=0&&v[k]!==F[w];)w--;for(;k>=1&&w>=0;k--,w--)if(v[k]!==F[w]){if(k!==1||w!==1)do if(k--,w--,w<0||v[k]!==F[w]){var U=`
|
21
|
-
`+v[k].replace(" at new "," at ");return e.displayName&&U.includes("<anonymous>")&&(U=U.replace("<anonymous>",e.displayName)),typeof e=="function"&&
|
21
|
+
`+v[k].replace(" at new "," at ");return e.displayName&&U.includes("<anonymous>")&&(U=U.replace("<anonymous>",e.displayName)),typeof e=="function"&&ge.set(e,U),U}while(k>=1&&w>=0);break}}}finally{Ee=!1,Se.current=_,Ae(),Error.prepareStackTrace=b}var oe=e?e.displayName||e.name:"",q=oe?ve(oe):"";return typeof e=="function"&&ge.set(e,q),q}function Ar(e,r,a){return We(e,!1)}function Wr(e){var r=e.prototype;return!!(r&&r.isReactComponent)}function pe(e,r,a){if(e==null)return"";if(typeof e=="function")return We(e,Wr(e));if(typeof e=="string")return ve(e);switch(e){case h:return ve("Suspense");case p:return ve("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case m:return Ar(e.render);case x:return pe(e.type,r,a);case E:{var f=e,b=f._payload,_=f._init;try{return pe(_(b),r,a)}catch{}}}return""}var fe=Object.prototype.hasOwnProperty,Be={},Ve=R.ReactDebugCurrentFrame;function ye(e){if(e){var r=e._owner,a=pe(e.type,e._source,r?r.type:null);Ve.setExtraStackFrame(a)}else Ve.setExtraStackFrame(null)}function Br(e,r,a,f,b){{var _=Function.call.bind(fe);for(var g in e)if(_(e,g)){var v=void 0;try{if(typeof e[g]!="function"){var F=Error((f||"React class")+": "+a+" type `"+g+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[g]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw F.name="Invariant Violation",F}v=e[g](r,g,f,a,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(k){v=k}v&&!(v instanceof Error)&&(ye(b),y("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",f||"React class",a,g,typeof v),ye(null)),v instanceof Error&&!(v.message in Be)&&(Be[v.message]=!0,ye(b),y("Failed %s type: %s",a,v.message),ye(null))}}}var Vr=Array.isArray;function Ce(e){return Vr(e)}function Yr(e){{var r=typeof Symbol=="function"&&Symbol.toStringTag,a=r&&e[Symbol.toStringTag]||e.constructor.name||"Object";return a}}function Mr(e){try{return Ye(e),!1}catch{return!0}}function Ye(e){return""+e}function Me(e){if(Mr(e))return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",Yr(e)),Ye(e)}var de=R.ReactCurrentOwner,Ur={key:!0,ref:!0,__self:!0,__source:!0},Ue,Ke,je;je={};function Kr(e){if(fe.call(e,"ref")){var r=Object.getOwnPropertyDescriptor(e,"ref").get;if(r&&r.isReactWarning)return!1}return e.ref!==void 0}function Jr(e){if(fe.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return e.key!==void 0}function Gr(e,r){if(typeof e.ref=="string"&&de.current&&r&&de.current.stateNode!==r){var a=C(de.current.type);je[a]||(y('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',C(de.current.type),e.ref),je[a]=!0)}}function Xr(e,r){{var a=function(){Ue||(Ue=!0,y("%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://reactjs.org/link/special-props)",r))};a.isReactWarning=!0,Object.defineProperty(e,"key",{get:a,configurable:!0})}}function Hr(e,r){{var a=function(){Ke||(Ke=!0,y("%s: `ref` 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://reactjs.org/link/special-props)",r))};a.isReactWarning=!0,Object.defineProperty(e,"ref",{get:a,configurable:!0})}}var Zr=function(e,r,a,f,b,_,g){var v={$$typeof:s,type:e,key:r,ref:a,props:g,_owner:_};return v._store={},Object.defineProperty(v._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(v,"_self",{configurable:!1,enumerable:!1,writable:!1,value:f}),Object.defineProperty(v,"_source",{configurable:!1,enumerable:!1,writable:!1,value:b}),Object.freeze&&(Object.freeze(v.props),Object.freeze(v)),v};function Qr(e,r,a,f,b){{var _,g={},v=null,F=null;a!==void 0&&(Me(a),v=""+a),Jr(r)&&(Me(r.key),v=""+r.key),Kr(r)&&(F=r.ref,Gr(r,b));for(_ in r)fe.call(r,_)&&!Ur.hasOwnProperty(_)&&(g[_]=r[_]);if(e&&e.defaultProps){var k=e.defaultProps;for(_ in k)g[_]===void 0&&(g[_]=k[_])}if(v||F){var w=typeof e=="function"?e.displayName||e.name||"Unknown":e;v&&Xr(g,w),F&&Hr(g,w)}return Zr(e,v,F,b,f,de.current,g)}}var ke=R.ReactCurrentOwner,Je=R.ReactDebugCurrentFrame;function ie(e){if(e){var r=e._owner,a=pe(e.type,e._source,r?r.type:null);Je.setExtraStackFrame(a)}else Je.setExtraStackFrame(null)}var Ne;Ne=!1;function Pe(e){return typeof e=="object"&&e!==null&&e.$$typeof===s}function Ge(){{if(ke.current){var e=C(ke.current.type);if(e)return`
|
22
22
|
|
23
|
-
Check the render method of \``+e+"`."}return""}}function
|
23
|
+
Check the render method of \``+e+"`."}return""}}function qr(e){{if(e!==void 0){var r=e.fileName.replace(/^.*[\\\/]/,""),a=e.lineNumber;return`
|
24
24
|
|
25
|
-
Check your code at `+r+":"+
|
25
|
+
Check your code at `+r+":"+a+"."}return""}}var Xe={};function en(e){{var r=Ge();if(!r){var a=typeof e=="string"?e:e.displayName||e.name;a&&(r=`
|
26
26
|
|
27
|
-
Check the top-level render call using <`+
|
27
|
+
Check the top-level render call using <`+a+">.")}return r}}function He(e,r){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var a=en(r);if(Xe[a])return;Xe[a]=!0;var f="";e&&e._owner&&e._owner!==ke.current&&(f=" It was passed a child from "+C(e._owner.type)+"."),ie(e),y('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',a,f),ie(null)}}function Ze(e,r){{if(typeof e!="object")return;if(Ce(e))for(var a=0;a<e.length;a++){var f=e[a];Pe(f)&&He(f,r)}else if(Pe(e))e._store&&(e._store.validated=!0);else if(e){var b=L(e);if(typeof b=="function"&&b!==e.entries)for(var _=b.call(e),g;!(g=_.next()).done;)Pe(g.value)&&He(g.value,r)}}}function rn(e){{var r=e.type;if(r==null||typeof r=="string")return;var a;if(typeof r=="function")a=r.propTypes;else if(typeof r=="object"&&(r.$$typeof===m||r.$$typeof===x))a=r.propTypes;else return;if(a){var f=C(r);Br(a,e.props,"prop",f,e)}else if(r.PropTypes!==void 0&&!Ne){Ne=!0;var b=C(r);y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",b||"Unknown")}typeof r.getDefaultProps=="function"&&!r.getDefaultProps.isReactClassApproved&&y("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function nn(e){{for(var r=Object.keys(e.props),a=0;a<r.length;a++){var f=r[a];if(f!=="children"&&f!=="key"){ie(e),y("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",f),ie(null);break}}e.ref!==null&&(ie(e),y("Invalid attribute `ref` supplied to `React.Fragment`."),ie(null))}}var Qe={};function qe(e,r,a,f,b,_){{var g=K(e);if(!g){var v="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(v+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var F=qr(b);F?v+=F:v+=Ge();var k;e===null?k="null":Ce(e)?k="array":e!==void 0&&e.$$typeof===s?(k="<"+(C(e.type)||"Unknown")+" />",v=" Did you accidentally export a JSX literal instead of a component?"):k=typeof e,y("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",k,v)}var w=Qr(e,r,a,b,_);if(w==null)return w;if(g){var U=r.children;if(U!==void 0)if(f)if(Ce(U)){for(var oe=0;oe<U.length;oe++)Ze(U[oe],e);Object.freeze&&Object.freeze(U)}else y("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 Ze(U,e)}if(fe.call(r,"key")){var q=C(e),D=Object.keys(r).filter(function(un){return un!=="key"}),we=D.length>0?"{key: someKey, "+D.join(": ..., ")+": ...}":"{key: someKey}";if(!Qe[q+we]){var cn=D.length>0?"{"+D.join(": ..., ")+": ...}":"{}";y(`A props object containing a "key" prop is being spread into JSX:
|
28
28
|
let props = %s;
|
29
29
|
<%s {...props} />
|
30
30
|
React keys must be passed directly to JSX without using spread:
|
31
31
|
let props = %s;
|
32
|
-
<%s key={someKey} {...props} />`,we,q,an,q),Qe[q+we]=!0}}return e===o?en(w):qr(w),w}}function rn(e,r,s){return qe(e,r,s,!0)}function nn(e,r,s){return qe(e,r,s,!1)}var tn=nn,sn=rn;ue.Fragment=o,ue.jsx=tn,ue.jsxs=sn}()),ue}process.env.NODE_ENV==="production"?xe.exports=rr():xe.exports=nr();var i=xe.exports;function he(n,t){return t?i.jsx(t,{size:n,strokeWidth:2.5}):i.jsx(i.Fragment,{})}function tr(n){const{variant:t="ghost",scheme:a="primary",size:o="md",leftIcon:c,rightIcon:l,className:h="",children:f,...d}=n,g={md:12,lg:14}[o];return{className:`arkyn_badge ${t} ${a} ${o} ${h}`.trim(),children:f,leftIcon:he(g,c),rightIcon:he(g,l),...d}}function sr(n){const{leftIcon:t,children:a,rightIcon:o,...c}=tr(n);return i.jsxs("div",{...c,children:[t,a,o]})}function ar(n){const{className:t,orientation:a="horizontal",...o}=n,c=`arkyn_divider ${a} ${t}`;return i.jsx("div",{className:c,...o})}function ir(n){const{isLoading:t=!1,scheme:a="primary",variant:o="solid",loadingText:c,size:l="md",leftIcon:h,rightIcon:f,disabled:d,className:m="",children:g,...x}=n,P={xs:12,sm:16,md:20,lg:24}[l];return{className:`arkyn_button loading_text_${!!c} ${o} ${a} ${l} loading_${t} ${m}`.trim(),loadingText:c,children:g,iconSize:P,disabled:d||t,leftIcon:he(P,h),rightIcon:he(P,f),...x}}function or(n){const{leftIcon:t,rightIcon:a,iconSize:o,children:c,loadingText:l,...h}=ir(n);return i.jsxs("button",{...h,children:[i.jsxs("div",{className:"spinner",children:[i.jsx(Q.Loader2,{size:o,strokeWidth:2.5}),l&&l]}),i.jsxs("div",{className:"content",children:[t,c,a]})]})}const Oe=N.createContext({});function cr({children:n,...t}){var f,d;const a=ye.useActionData(),o=N.useRef(null),c=((f=o.current)==null?void 0:f.name)||"",l=((d=a==null?void 0:a.fieldErrors)==null?void 0:d[c])||null,h=N.useId();return i.jsx(Oe.Provider,{value:{error:l,id:h,inputRef:o},children:i.jsx("section",{className:"arkyn_form_controller",...t,children:n})})}function le(){return N.useContext(Oe)}function ur({children:n}){const{error:t}=le();return t?i.jsx("strong",{className:"arkyn_form_error",children:n||t}):i.jsx(i.Fragment,{})}function lr(n){const{showAsterisk:t=!1,className:a="",...o}=n;return{className:`arkyn_form_label ${t?"show-asterisk":""} ${a}`.trim(),...o}}function fr(n){const{id:t}=le();return i.jsx("label",{...lr(n),htmlFor:t})}const Fe={xs:12,sm:16,md:20,lg:24};function dr(n){const{isLoading:t=!1,scheme:a="primary",variant:o="solid",size:c="md",icon:l,disabled:h,className:f="",...d}=n,m=`arkyn_icon_button ${o} ${a} ${c} loading_${t} ${f}`;return i.jsxs("button",{disabled:h||t,className:m.trim(),...d,children:[i.jsx("div",{className:"spinner",children:i.jsx(Q.Loader2,{size:Fe[c],strokeWidth:2.5})}),i.jsx("div",{className:"content "+c,children:i.jsx(l,{size:Fe[c],strokeWidth:2.5})})]})}function ee(n,t,a){if(!n)return i.jsx(i.Fragment,{});if(typeof n=="string")return i.jsx("p",{className:a,children:n});const o=n;return i.jsx("p",{className:a,children:i.jsx(o,{color:"var(--secondary-600)",size:t,strokeWidth:2.5})})}function hr(n,t){const{isLoading:a,isError:o,size:c="md",className:l="",variant:h="solid",prefix:f,sufix:d,leftIcon:m,rightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,onChange:R,...y}=n,j=g?"right":"left",O=`arkyn_input ${f?"hasPrefix":""} ${d?"hasSufix":""} ${h} ${c} ${x||C||a?"opacity":""} ${o?"errored":""} ${t?"focused":""} ${l}`,I={md:20,lg:20}[c];return{isLoading:a,className:O,prefix:ee(f,I,"prefix"),sufix:ee(d,I,"sufix"),LeftIcon:m,RightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,onChange:R,loadingPosition:j,iconSize:I,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:I,strokeWidth:2.5}),...y}}function _e(n){return n&&n.replace(/[^0-9]/g,"")}function mr(n,t){let a="",o=0;return Array.from(n).forEach((c,l)=>{t[l+o].match(/[0-9]/)||(a+=t[l+o],o++),a+=c}),a}function vr(n){return n.length>11?"CNPJ":"CPF"}const Le={CPF:"999.999.999-999",CNPJ:"99.999.999/9999-99"},pr=_e(Le.CNPJ).length;function gr(n){const[t,a]=N.useState(!1),[o,c]=N.useState(_e((n==null?void 0:n.defaultValue)||"")),l=N.useRef(null),{inputRef:h,id:f,error:d}=le(),m=h||l,g=n.isError||!!d,{disabled:x,title:C,style:P,className:T,prefix:L,sufix:$,iconSize:R,loadingPosition:y,isLoading:j,LeftIcon:z,readOnly:V,onFocus:A,onBlur:W,RightIcon:Y,Spinner:O,onChange:K,value:I,defaultValue:Z="",...S}=hr({...n,id:f,isError:g},t),B=z&&!j,J=Y&&!j,X=y==="left"&&j,re=y==="right"&&j;function ne(){x||!(m!=null&&m.current)||(a(!0),m.current.focus())}function te(M){let G=_e(M.target.value);const H=vr(G);G.length>pr||(G=mr(G,Le[H]),M.target.value=G,c(G),K&&K(M))}function se(M){a(!0),A&&A(M)}function ae(M){a(!1),W&&W(M)}return i.jsxs("section",{title:C,style:P,onClick:ne,className:T,children:[L,X&&O,B&&i.jsx(z,{size:R,strokeWidth:2.5}),i.jsx("input",{disabled:x||j,readOnly:V,ref:m,value:I||o,onFocus:se,onChange:te,onBlur:ae,...S}),J&&i.jsx(Y,{size:R,strokeWidth:2.5}),re&&O,$]})}function yr(n,t){const{isLoading:a,isError:o,size:c="md",className:l="",variant:h="solid",prefix:f,sufix:d,leftIcon:m,rightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,showCents:R=!1,max:y=1e9,onChange:j,...z}=n,V=g?"right":"left",I=`arkyn_input ${f?"hasPrefix":""} ${d?"hasSufix":""} ${h} ${c} ${x||C||a?"opacity":""} ${o?"errored":""} ${t?"focused":""} ${l}`,S={md:20,lg:20}[c];return{isLoading:a,className:I,prefix:ee(f,S,"prefix"),sufix:ee(d,S,"sufix"),LeftIcon:m,RightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,max:y,onChange:j,showCents:R,loadingPosition:V,iconSize:S,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:S,strokeWidth:2.5}),...z}}const br=/^[1-9]{1}$/,xr=/^[0-9]{1}$/,$e=8;function _r(n,t){if(n===0)return"";const a=(n/100).toLocaleString("pt-BR",{style:"currency",currency:"BRL"});return t?a:a.replace("R$","").trim()}function Rr(n){const{currencyValue:t,event:a,max:o,setCurrencyValue:c}=n,{key:l,keyCode:h}=a;if(t===0&&!br.test(l)||t!==0&&!xr.test(l)&&h!==$e)return;const f=t.toString();let d;if(h!==$e){const m=t===0?l:`${f}${l}`;d=Number.parseInt(m,10)}else{const m=f.slice(0,-1);d=m===""?0:Number.parseInt(m,10)}d>Number(o)||c(d)}function Cr(n){const[t,a]=N.useState(!1),[o,c]=N.useState(n.defaultValue||0),l=N.useRef(null),{inputRef:h,id:f,error:d}=le(),m=h||l,g=n.isError||!!d,{disabled:x,title:C,style:P,className:T,prefix:L,sufix:$,iconSize:R,loadingPosition:y,isLoading:j,LeftIcon:z,readOnly:V,onFocus:A,onBlur:W,RightIcon:Y,Spinner:O,value:K,max:I,onKeyDown:Z,onChange:S,showCents:B,...J}=yr({...n,id:f,isError:g},t),X=z&&!j,re=Y&&!j,ne=y==="left"&&j,te=y==="right"&&j;function se(){x||!(m!=null&&m.current)||(a(!0),m.current.focus())}function ae(H){Rr({currencyValue:o,event:H,max:I,setCurrencyValue:c}),S&&S(o),Z&&Z(H)}function M(H){a(!0),A&&A(H)}function G(H){a(!1),W&&W(H)}return i.jsxs("section",{title:C,style:P,onClick:se,className:T,children:[L,ne&&O,X&&i.jsx(z,{size:R,strokeWidth:2.5}),i.jsx("input",{value:_r(K||o,B),onKeyDown:ae,disabled:x||j,readOnly:V,ref:m,onFocus:M,onChange:()=>{},onBlur:G,...J}),te&&O,re&&i.jsx(Y,{size:R,strokeWidth:2.5}),$]})}function Er(n,t){const{isLoading:a,isError:o,size:c="md",className:l="",variant:h="solid",prefix:f,sufix:d,leftIcon:m,rightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,onChange:R,...y}=n,j=g?"right":"left",O=`arkyn_input ${f?"hasPrefix":""} ${d?"hasSufix":""} ${h} ${c} ${x||C||a?"opacity":""} ${o?"errored":""} ${t?"focused":""} ${l}`,I={md:20,lg:20}[c];return{isLoading:a,className:O,prefix:ee(f,I,"prefix"),sufix:ee(d,I,"sufix"),LeftIcon:m,RightIcon:g,disabled:x,readOnly:C,onFocus:P,onBlur:T,title:L,style:$,onChange:R,loadingPosition:j,iconSize:I,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:I,strokeWidth:2.5}),...y}}function ze(n){const[t,a]=N.useState(!1),o=N.useRef(null),{inputRef:c,id:l,error:h}=le(),f=c||o,d=n.isError||!!h,{disabled:m,title:g,style:x,className:C,prefix:P,sufix:T,iconSize:L,loadingPosition:$,isLoading:R,LeftIcon:y,readOnly:j,onFocus:z,onBlur:V,RightIcon:A,Spinner:W,...Y}=Er({...n,id:l,isError:d},t),O=y&&!R,K=A&&!R,I=$==="left"&&R,Z=$==="right"&&R;function S(){m||!(f!=null&&f.current)||(a(!0),f.current.focus())}function B(X){a(!0),z&&z(X)}function J(X){a(!1),V&&V(X)}return i.jsxs("section",{title:g,style:x,onClick:S,className:C,children:[P,I&&W,O&&i.jsx(y,{size:L,strokeWidth:2.5}),i.jsx("input",{disabled:m||R,readOnly:j,ref:f,onFocus:B,onBlur:J,...Y}),K&&i.jsx(A,{size:L,strokeWidth:2.5}),Z&&W,T]})}function Sr(n){return i.jsx(er.InputMask,{component:ze,...n,type:"text"})}function jr(n){return n.type==="currency"?i.jsx(Cr,{...n}):n.type==="masked"?i.jsx(Sr,{...n}):n.type==="cpf-cpnj"?i.jsx(gr,{...n}):i.jsx(ze,{...n})}function kr(n){const{className:t="",...a}=n;return{className:`arkyn_breadcrumb ${t}`.trim(),...a}}function Nr(n){const{pathname:t}=ye.useLocation(),{className:a="",disabled:o=!1,to:c,...l}=n,h=t===c?"active":"inactive",f=`arkyn_breadcrumb_link ${h} ${a}`;return{to:c,className:f.trim(),disabled:o||h==="active",...l}}function Pr(n){const{className:t,...a}=kr(n);return i.jsx("nav",{className:t,...a})}function wr(n){const{children:t,className:a,disabled:o,...c}=Nr(n);return o?i.jsxs("p",{className:a,children:[i.jsx(Q.ChevronRight,{size:14,strokeWidth:2.5}),t]}):i.jsxs(ye.Link,{className:a,...c,children:[i.jsx(Q.ChevronRight,{size:14,strokeWidth:2.5}),t]})}const De=N.createContext({});function Ir(n){const{isVisibled:t,makeInvisible:a,children:o,className:c="",...l}=n,f=`arkyn_modal_container ${t?"visible":""} ${c}`;return i.jsx(De.Provider,{value:{makeInvisible:a},children:i.jsx(be.AnimatePresence,{children:t&&i.jsxs("aside",{className:f.trim(),...l,children:[i.jsx(be.motion.div,{className:"overlay",transition:{duration:.15,ease:"easeOut"},initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},onClick:a}),i.jsx(be.motion.div,{className:"content",transition:{duration:.15,ease:"easeOut"},initial:{opacity:0,scale:.75},animate:{opacity:1,scale:1},exit:{opacity:0,scale:0},children:o})]})})})}function Tr(n){const{alignment:t="right",className:a,...o}=n,c=`arkyn_modal_footer ${t} ${a}`;return i.jsx("footer",{className:c.trim(),...o})}function Or(n){const{showCloseButton:t,className:a,children:o,...c}=n,{makeInvisible:l}=N.useContext(De),f=`arkyn_modal_header ${t?"show-close":""} ${a}`;return i.jsxs("header",{className:f.trim(),...c,children:[o,i.jsx("button",{type:"button",onClick:l,children:i.jsx(Q.X,{size:24})})]})}const Fr={Container:Ir,Header:Or,Footer:Tr};function Lr(n){const{text:t,size:a="lg",children:o,orientation:c="top",className:l,...h}=n;return i.jsxs("div",{className:`arkyn_tooltip ${a} ${c} ${l}`,...h,children:[o,i.jsx("div",{className:"arkyn_tooltip_text",children:t})]})}E.Badge=sr,E.Breadcrumb=Pr,E.BreadcrumbLink=wr,E.Button=or,E.Divider=ar,E.FormController=cr,E.FormError=ur,E.FormLabel=fr,E.IconButton=dr,E.Input=jr,E.Modal=Fr,E.Tooltip=Lr,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
|
32
|
+
<%s key={someKey} {...props} />`,we,q,cn,q),Qe[q+we]=!0}}return e===o?nn(w):rn(w),w}}function tn(e,r,a){return qe(e,r,a,!0)}function sn(e,r,a){return qe(e,r,a,!1)}var an=sn,on=tn;ue.Fragment=o,ue.jsx=an,ue.jsxs=on}()),ue}process.env.NODE_ENV==="production"?xe.exports=rr():xe.exports=nr();var i=xe.exports;function he(n,s){return s?i.jsx(s,{size:n,strokeWidth:2.5}):i.jsx(i.Fragment,{})}function tr(n){const{variant:s="ghost",scheme:t="primary",size:o="md",leftIcon:c,rightIcon:u,className:d="",children:l,...m}=n,p={md:12,lg:14}[o];return{className:`arkyn_badge ${s} ${t} ${o} ${d}`.trim(),children:l,leftIcon:he(p,c),rightIcon:he(p,u),...m}}function sr(n){const{leftIcon:s,children:t,rightIcon:o,...c}=tr(n);return i.jsxs("div",{...c,children:[s,t,o]})}function ar(n){const{className:s,orientation:t="horizontal",...o}=n,c=`arkyn_divider ${t} ${s}`;return i.jsx("div",{className:c,...o})}function ir({className:n,...s}){const t="arkyn_skeleton "+n;return i.jsx("div",{className:t.trim(),...s})}function or(n){const{isLoading:s=!1,scheme:t="primary",variant:o="solid",loadingText:c,size:u="md",leftIcon:d,rightIcon:l,disabled:m,className:h="",children:p,...x}=n,P={xs:12,sm:16,md:20,lg:24}[u];return{className:`arkyn_button loading_text_${!!c} ${o} ${t} ${u} loading_${s} ${h}`.trim(),loadingText:c,children:p,iconSize:P,disabled:m||s,leftIcon:he(P,d),rightIcon:he(P,l),...x}}function cr(n){const{leftIcon:s,rightIcon:t,iconSize:o,children:c,loadingText:u,...d}=or(n);return i.jsxs("button",{...d,children:[i.jsxs("div",{className:"spinner",children:[i.jsx(Q.Loader2,{size:o,strokeWidth:2.5}),u&&u]}),i.jsxs("div",{className:"content",children:[s,c,t]})]})}const Oe=N.createContext({});function ur({children:n,...s}){var l,m;const t=me.useActionData(),o=N.useRef(null),c=((l=o.current)==null?void 0:l.name)||"",u=((m=t==null?void 0:t.fieldErrors)==null?void 0:m[c])||null,d=N.useId();return i.jsx(Oe.Provider,{value:{error:u,id:d,inputRef:o},children:i.jsx("section",{className:"arkyn_form_controller",...s,children:n})})}function le(){return N.useContext(Oe)}function lr({children:n}){const{error:s}=le();return n?i.jsx("strong",{className:"arkyn_form_error",children:n}):s?i.jsx("strong",{className:"arkyn_form_error",children:s}):i.jsx(i.Fragment,{})}function fr(n){const{showAsterisk:s=!1,className:t="",...o}=n;return{className:`arkyn_form_label ${s?"show-asterisk":""} ${t}`.trim(),...o}}function dr(n){const{id:s}=le();return i.jsx("label",{...fr(n),htmlFor:s})}const Fe={xs:12,sm:16,md:20,lg:24};function mr(n){const{isLoading:s=!1,scheme:t="primary",variant:o="solid",size:c="md",icon:u,disabled:d,className:l="",...m}=n,h=`arkyn_icon_button ${o} ${t} ${c} loading_${s} ${l}`;return i.jsxs("button",{disabled:d||s,className:h.trim(),...m,children:[i.jsx("div",{className:"spinner",children:i.jsx(Q.Loader2,{size:Fe[c],strokeWidth:2.5})}),i.jsx("div",{className:"content "+c,children:i.jsx(u,{size:Fe[c],strokeWidth:2.5})})]})}function ee(n,s,t){if(!n)return i.jsx(i.Fragment,{});if(typeof n=="string")return i.jsx("p",{className:t,children:n});const o=n;return i.jsx("p",{className:t,children:i.jsx(o,{color:"var(--secondary-600)",size:s,strokeWidth:2.5})})}function hr(n,s){const{isLoading:t,isError:o,size:c="md",className:u="",variant:d="solid",prefix:l,sufix:m,leftIcon:h,rightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,onChange:R,...y}=n,j=p?"right":"left",O=`arkyn_input ${l?"hasPrefix":""} ${m?"hasSufix":""} ${d} ${c} ${x||E||t?"opacity":""} ${o?"errored":""} ${s?"focused":""} ${u}`,I={md:20,lg:20}[c];return{isLoading:t,className:O,prefix:ee(l,I,"prefix"),sufix:ee(m,I,"sufix"),LeftIcon:h,RightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,onChange:R,loadingPosition:j,iconSize:I,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:I,strokeWidth:2.5}),...y}}function _e(n){return n&&n.replace(/[^0-9]/g,"")}function vr(n,s){let t="",o=0;return Array.from(n).forEach((c,u)=>{s[u+o].match(/[0-9]/)||(t+=s[u+o],o++),t+=c}),t}function gr(n){return n.length>11?"CNPJ":"CPF"}const $e={CPF:"999.999.999-999",CNPJ:"99.999.999/9999-99"},pr=_e($e.CNPJ).length;function yr(n){const[s,t]=N.useState(!1),[o,c]=N.useState(_e((n==null?void 0:n.defaultValue)||"")),u=N.useRef(null),{inputRef:d,id:l,error:m}=le(),h=d||u,p=n.isError||!!m,{disabled:x,title:E,style:P,className:T,prefix:$,sufix:L,iconSize:R,loadingPosition:y,isLoading:j,LeftIcon:z,readOnly:V,onFocus:A,onBlur:W,RightIcon:Y,Spinner:O,onChange:K,value:I,defaultValue:Z="",...C}=hr({...n,id:l,isError:p},s),B=z&&!j,J=Y&&!j,X=y==="left"&&j,re=y==="right"&&j;function ne(){x||!(h!=null&&h.current)||(t(!0),h.current.focus())}function te(M){let G=_e(M.target.value);const H=gr(G);G.length>pr||(G=vr(G,$e[H]),M.target.value=G,c(G),K&&K(M))}function se(M){t(!0),A&&A(M)}function ae(M){t(!1),W&&W(M)}return i.jsxs("section",{title:E,style:P,onClick:ne,className:T,children:[$,X&&O,B&&i.jsx(z,{size:R,strokeWidth:2.5}),i.jsx("input",{disabled:x||j,readOnly:V,ref:h,value:I||o,onFocus:se,onChange:te,onBlur:ae,...C}),J&&i.jsx(Y,{size:R,strokeWidth:2.5}),re&&O,L]})}function br(n,s){const{isLoading:t,isError:o,size:c="md",className:u="",variant:d="solid",prefix:l,sufix:m,leftIcon:h,rightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,showCents:R=!1,max:y=1e9,onChange:j,...z}=n,V=p?"right":"left",I=`arkyn_input ${l?"hasPrefix":""} ${m?"hasSufix":""} ${d} ${c} ${x||E||t?"opacity":""} ${o?"errored":""} ${s?"focused":""} ${u}`,C={md:20,lg:20}[c];return{isLoading:t,className:I,prefix:ee(l,C,"prefix"),sufix:ee(m,C,"sufix"),LeftIcon:h,RightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,max:y,onChange:j,showCents:R,loadingPosition:V,iconSize:C,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:C,strokeWidth:2.5}),...z}}const xr=/^[1-9]{1}$/,_r=/^[0-9]{1}$/,Le=8;function Sr(n,s){if(n===0)return"";const t=(n/100).toLocaleString("pt-BR",{style:"currency",currency:"BRL"});return s?t:t.replace("R$","").trim()}function Rr(n){const{currencyValue:s,event:t,max:o,setCurrencyValue:c}=n,{key:u,keyCode:d}=t;if(s===0&&!xr.test(u)||s!==0&&!_r.test(u)&&d!==Le)return;const l=s.toString();let m;if(d!==Le){const h=s===0?u:`${l}${u}`;m=Number.parseInt(h,10)}else{const h=l.slice(0,-1);m=h===""?0:Number.parseInt(h,10)}m>Number(o)||c(m)}function Er(n){const[s,t]=N.useState(!1),[o,c]=N.useState(n.defaultValue||0),u=N.useRef(null),{inputRef:d,id:l,error:m}=le(),h=d||u,p=n.isError||!!m,{disabled:x,title:E,style:P,className:T,prefix:$,sufix:L,iconSize:R,loadingPosition:y,isLoading:j,LeftIcon:z,readOnly:V,onFocus:A,onBlur:W,RightIcon:Y,Spinner:O,value:K,max:I,onKeyDown:Z,onChange:C,showCents:B,...J}=br({...n,id:l,isError:p},s),X=z&&!j,re=Y&&!j,ne=y==="left"&&j,te=y==="right"&&j;function se(){x||!(h!=null&&h.current)||(t(!0),h.current.focus())}function ae(H){Rr({currencyValue:o,event:H,max:I,setCurrencyValue:c}),C&&C(o),Z&&Z(H)}function M(H){t(!0),A&&A(H)}function G(H){t(!1),W&&W(H)}return i.jsxs("section",{title:E,style:P,onClick:se,className:T,children:[$,ne&&O,X&&i.jsx(z,{size:R,strokeWidth:2.5}),i.jsx("input",{value:Sr(K||o,B),onKeyDown:ae,disabled:x||j,readOnly:V,ref:h,onFocus:M,onChange:()=>{},onBlur:G,...J}),te&&O,re&&i.jsx(Y,{size:R,strokeWidth:2.5}),L]})}function Cr(n,s){const{isLoading:t,isError:o,size:c="md",className:u="",variant:d="solid",prefix:l,sufix:m,leftIcon:h,rightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,onChange:R,...y}=n,j=p?"right":"left",O=`arkyn_input ${l?"hasPrefix":""} ${m?"hasSufix":""} ${d} ${c} ${x||E||t?"opacity":""} ${o?"errored":""} ${s?"focused":""} ${u}`,I={md:20,lg:20}[c];return{isLoading:t,className:O,prefix:ee(l,I,"prefix"),sufix:ee(m,I,"sufix"),LeftIcon:h,RightIcon:p,disabled:x,readOnly:E,onFocus:P,onBlur:T,title:$,style:L,onChange:R,loadingPosition:j,iconSize:I,Spinner:i.jsx(Q.Loader2,{className:"spinner",size:I,strokeWidth:2.5}),...y}}function ze(n){const[s,t]=N.useState(!1),o=N.useRef(null),{inputRef:c,id:u,error:d}=le(),l=c||o,m=n.isError||!!d,{disabled:h,title:p,style:x,className:E,prefix:P,sufix:T,iconSize:$,loadingPosition:L,isLoading:R,LeftIcon:y,readOnly:j,onFocus:z,onBlur:V,RightIcon:A,Spinner:W,...Y}=Cr({...n,id:u,isError:m},s),O=y&&!R,K=A&&!R,I=L==="left"&&R,Z=L==="right"&&R;function C(){h||!(l!=null&&l.current)||(t(!0),l.current.focus())}function B(X){t(!0),z&&z(X)}function J(X){t(!1),V&&V(X)}return i.jsxs("section",{title:p,style:x,onClick:C,className:E,children:[P,I&&W,O&&i.jsx(y,{size:$,strokeWidth:2.5}),i.jsx("input",{disabled:h||R,readOnly:j,ref:l,onFocus:B,onBlur:J,...Y}),K&&i.jsx(A,{size:$,strokeWidth:2.5}),Z&&W,T]})}function jr(n){return i.jsx(er.InputMask,{component:ze,...n,type:"text"})}function kr(n){return n.type==="currency"?i.jsx(Er,{...n}):n.type==="masked"?i.jsx(jr,{...n}):n.type==="cpf-cpnj"?i.jsx(yr,{...n}):i.jsx(ze,{...n})}function Nr(n){const{className:s="",...t}=n;return{className:`arkyn_breadcrumb ${s}`.trim(),...t}}function Pr(n){const{pathname:s}=me.useLocation(),{className:t="",disabled:o=!1,to:c,...u}=n,d=s===c?"active":"inactive",l=`arkyn_breadcrumb_link ${d} ${t}`;return{to:c,className:l.trim(),disabled:o||d==="active",...u}}function wr(n){const{className:s,...t}=Nr(n);return i.jsx("nav",{className:s,...t})}function Ir(n){const{children:s,className:t,disabled:o,...c}=Pr(n);return o?i.jsxs("p",{className:t,children:[i.jsx(Q.ChevronRight,{size:14,strokeWidth:2.5}),s]}):i.jsxs(me.Link,{className:t,...c,children:[i.jsx(Q.ChevronRight,{size:14,strokeWidth:2.5}),s]})}const De=N.createContext({});function Tr(n){const{isVisibled:s,makeInvisible:t,children:o,className:c="",...u}=n,l=`arkyn_modal_container ${s?"visible":""} ${c}`;return i.jsx(De.Provider,{value:{makeInvisible:t},children:i.jsx(be.AnimatePresence,{children:s&&i.jsxs("aside",{className:l.trim(),...u,children:[i.jsx(be.motion.div,{className:"overlay",transition:{duration:.15,ease:"easeOut"},initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},onClick:t}),i.jsx(be.motion.div,{className:"content",transition:{duration:.15,ease:"easeOut"},initial:{opacity:0,scale:.75},animate:{opacity:1,scale:1},exit:{opacity:0,scale:0},children:o})]})})})}function Or(n){const{alignment:s="right",className:t,...o}=n,c=`arkyn_modal_footer ${s} ${t}`;return i.jsx("footer",{className:c.trim(),...o})}function Fr(n){const{showCloseButton:s,className:t,children:o,...c}=n,{makeInvisible:u}=N.useContext(De),l=`arkyn_modal_header ${s?"show-close":""} ${t}`;return i.jsxs("header",{className:l.trim(),...c,children:[o,i.jsx("button",{type:"button",onClick:u,children:i.jsx(Q.X,{size:24})})]})}const $r={Container:Tr,Header:Fr,Footer:Or};function Lr(n){const{text:s,size:t="lg",children:o,orientation:c="top",className:u,...d}=n;return i.jsxs("div",{className:`arkyn_tooltip ${t} ${c} ${u}`,...d,children:[o,i.jsx("div",{className:"arkyn_tooltip_text",children:s})]})}function zr(n=""){const s=me.useLocation(),t=new URLSearchParams(s.search),o=n?`${n}:`:"",c=u=>{Object.entries(u).forEach(([d,l])=>{l===void 0?t.delete(`${o}${d}`):t.set(`${o}${d}`,String(l))})};return{getParam:u=>t.get(`${o}${u}`),getScopedSearch:u=>{c(u);let d=t.toString();return d&&(d="?"+d),d}}}S.Badge=sr,S.Breadcrumb=wr,S.BreadcrumbLink=Ir,S.Button=cr,S.Divider=ar,S.FormController=ur,S.FormError=lr,S.FormLabel=dr,S.IconButton=mr,S.Input=kr,S.Modal=$r,S.Skeleton=ir,S.Tooltip=Lr,S.useScopedParams=zr,Object.defineProperty(S,Symbol.toStringTag,{value:"Module"})});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/FormError/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,cAAc,CAAC;AAEtB,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,iBAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,cAAc,
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/FormError/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlC,OAAO,cAAc,CAAC;AAEtB,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,iBAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,cAAc,2CAK9C;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
@@ -1,10 +1,12 @@
|
|
1
|
-
import {
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
2
2
|
import { useFormController } from "../FormController";
|
3
3
|
import "./styles.css";
|
4
4
|
function FormError({ children }) {
|
5
5
|
const { error } = useFormController();
|
6
|
+
if (children)
|
7
|
+
return _jsx("strong", { className: "arkyn_form_error", children: children });
|
6
8
|
if (!error)
|
7
9
|
return _jsx(_Fragment, {});
|
8
|
-
return _jsx("strong", { className: "arkyn_form_error", children:
|
10
|
+
return _jsx("strong", { className: "arkyn_form_error", children: error });
|
9
11
|
}
|
10
12
|
export { FormError };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,cAAc,CAAC;AAEtB,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,2CAGrE;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import "./styles.css";
|
3
|
+
function Skeleton({ className: baseClassName, ...rest }) {
|
4
|
+
const className = "arkyn_skeleton " + baseClassName;
|
5
|
+
return _jsx("div", { className: className.trim(), ...rest });
|
6
|
+
}
|
7
|
+
export { Skeleton };
|
@@ -0,0 +1,7 @@
|
|
1
|
+
type ParamsType = Record<string, string | number | boolean | undefined>;
|
2
|
+
declare function useScopedParams(scope?: string): {
|
3
|
+
getParam: (key: string) => string;
|
4
|
+
getScopedSearch: (params: ParamsType) => string;
|
5
|
+
};
|
6
|
+
export { useScopedParams };
|
7
|
+
//# sourceMappingURL=useScopedParams.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useScopedParams.d.ts","sourceRoot":"","sources":["../../src/hooks/useScopedParams.ts"],"names":[],"mappings":"AAEA,KAAK,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC;AAExE,iBAAS,eAAe,CAAC,KAAK,GAAE,MAAW;oBAgBvB,MAAM;8BACI,UAAU;EAOvC;AAED,OAAO,EAAE,eAAe,EAAE,CAAC"}
|
@@ -0,0 +1,27 @@
|
|
1
|
+
import { useLocation } from "@remix-run/react";
|
2
|
+
function useScopedParams(scope = "") {
|
3
|
+
const location = useLocation();
|
4
|
+
const searchParams = new URLSearchParams(location.search);
|
5
|
+
const prefix = scope ? `${scope}:` : "";
|
6
|
+
const updateSearchParams = (params) => {
|
7
|
+
Object.entries(params).forEach(([key, value]) => {
|
8
|
+
if (value === undefined) {
|
9
|
+
searchParams.delete(`${prefix}${key}`);
|
10
|
+
}
|
11
|
+
else {
|
12
|
+
searchParams.set(`${prefix}${key}`, String(value));
|
13
|
+
}
|
14
|
+
});
|
15
|
+
};
|
16
|
+
return {
|
17
|
+
getParam: (key) => searchParams.get(`${prefix}${key}`),
|
18
|
+
getScopedSearch: (params) => {
|
19
|
+
updateSearchParams(params);
|
20
|
+
let search = searchParams.toString();
|
21
|
+
if (search)
|
22
|
+
search = "?" + search;
|
23
|
+
return search;
|
24
|
+
},
|
25
|
+
};
|
26
|
+
}
|
27
|
+
export { useScopedParams };
|
package/dist/index.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
1
|
export { Badge } from "./components/Badge";
|
2
2
|
export { Divider } from "./components/Divider";
|
3
|
+
export { Skeleton } from "./components/Skeleton";
|
3
4
|
export { Button } from "./components/Button";
|
4
5
|
export { FormController, FormError, FormLabel } from "./components/Form";
|
5
6
|
export { IconButton } from "./components/IconButton";
|
@@ -7,4 +8,5 @@ export { Input } from "./components/Input";
|
|
7
8
|
export { Breadcrumb, BreadcrumbLink } from "./components/Breadcrumb";
|
8
9
|
export { Modal } from "./components/Modal";
|
9
10
|
export { Tooltip } from "./components/Tooltip";
|
11
|
+
export { useScopedParams } from "./hooks/useScopedParams";
|
10
12
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAG3C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAGrE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC"}
|
package/dist/index.js
CHANGED
@@ -1,6 +1,7 @@
|
|
1
1
|
// Data Display
|
2
2
|
export { Badge } from "./components/Badge";
|
3
3
|
export { Divider } from "./components/Divider";
|
4
|
+
export { Skeleton } from "./components/Skeleton";
|
4
5
|
// Form
|
5
6
|
export { Button } from "./components/Button";
|
6
7
|
export { FormController, FormError, FormLabel } from "./components/Form";
|
@@ -11,3 +12,5 @@ export { Breadcrumb, BreadcrumbLink } from "./components/Breadcrumb";
|
|
11
12
|
// Overlay
|
12
13
|
export { Modal } from "./components/Modal";
|
13
14
|
export { Tooltip } from "./components/Tooltip";
|
15
|
+
// Hooks
|
16
|
+
export { useScopedParams } from "./hooks/useScopedParams";
|
package/dist/style.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.arkyn_badge{display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent}.arkyn_badge.solid{color:#fff}.arkyn_badge.solid.primary{background-color:var(--primary-500)}.arkyn_badge.solid.secondary{background-color:var(--secondary-500)}.arkyn_badge.solid.danger{background-color:var(--danger-600)}.arkyn_badge.solid.success{background-color:var(--success-500)}.arkyn_badge.solid.warning{background-color:var(--warning-600)}.arkyn_badge.solid.info{background-color:var(--info-500)}.arkyn_badge.outline.primary{color:var(--primary-500);border-color:var(--primary-500)}.arkyn_badge.outline.secondary{color:var(--secondary-500);border-color:var(--secondary-500)}.arkyn_badge.outline.danger{color:var(--danger-600);border-color:var(--danger-600)}.arkyn_badge.outline.success{color:var(--success-500);border-color:var(--success-500)}.arkyn_badge.outline.warning{color:var(--warning-600);border-color:var(--warning-600)}.arkyn_badge.outline.info{color:var(--info-600);border-color:var(--info-600)}.arkyn_badge.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_badge.ghost.secondary{color:var(--secondary-500);background-color:var(--secondary-100)}.arkyn_badge.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_badge.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_badge.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_badge.ghost.info{color:var(--info-600);background-color:var(--info-100)}.arkyn_badge.lg{font-weight:400;font-size:12px;line-height:12px;border-radius:4px;padding:0 16px;height:24px}.arkyn_badge.md{font-weight:400;font-size:10px;line-height:10px;border-radius:4px;padding:0 12px;height:20px}.arkyn_divider{display:block;flex:1;background-color:var(--secondary-300)}.arkyn_divider.horizontal{width:100%;min-height:1px;max-height:1px}.arkyn_divider.vertical{height:100%;min-width:1px;max-width:1px}.arkyn_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_button:hover{cursor:pointer}.arkyn_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_button .content{display:flex;align-items:center;justify-content:center;white-space:nowrap}.arkyn_button.solid{color:#fff}.arkyn_button.solid:disabled{opacity:.4}.arkyn_button.solid.primary{background-color:var(--primary-500)}.arkyn_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_button.solid.danger{background-color:var(--danger-600)}.arkyn_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_button.solid.success{background-color:var(--success-500)}.arkyn_button.solid.success:hover{background-color:var(--success-400)}.arkyn_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_button.solid.warning{background-color:var(--warning-600)}.arkyn_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_button.outline{border-color:var(--secondary-300)}.arkyn_button.outline:hover{border-color:var(--secondary-200)}.arkyn_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_button.outline.primary{color:var(--primary-500)}.arkyn_button.outline.primary:hover{color:var(--primary-400)}.arkyn_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_button.outline.danger{color:var(--danger-600)}.arkyn_button.outline.danger:hover{color:var(--danger-500)}.arkyn_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_button.outline.success{color:var(--success-500)}.arkyn_button.outline.success:hover{color:var(--success-400)}.arkyn_button.outline.success:disabled{color:var(--success-400)}.arkyn_button.outline.warning{color:var(--warning-600)}.arkyn_button.outline.warning:hover{color:var(--warning-500)}.arkyn_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_button.ghost:disabled{opacity:.4}.arkyn_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.invisible:disabled{opacity:.4}.arkyn_button.invisible.primary{color:var(--primary-500)}.arkyn_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_button.invisible.danger{color:var(--danger-600)}.arkyn_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_button.invisible.success{color:var(--success-500)}.arkyn_button.invisible.success:hover{color:var(--success-400)}.arkyn_button.invisible.success:disabled{color:var(--success-400)}.arkyn_button.invisible.warning{color:var(--warning-600)}.arkyn_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_button.lg{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;padding:0 20px;height:44px}.arkyn_button.lg .content,.arkyn_button.lg .spinner{gap:16px}.arkyn_button.md{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;gap:16px;padding:0 16px;height:40px}.arkyn_button.md .content,.arkyn_button.md .spinner{gap:14px}.arkyn_button.sm{font-weight:600;font-size:12px;line-height:12px;border-radius:6px;padding:0 16px;height:32px}.arkyn_button.sm .content,.arkyn_button.sm .spinner{gap:12px}.arkyn_button.xs{font-weight:600;font-size:10px;line-height:10px;border-radius:4px;padding:0 16px;height:24px}.arkyn_button.xs .content,.arkyn_button.xs .spinner{gap:8px}.arkyn_button .spinner{display:flex;align-items:center;justify-content:center;white-space:nowrap;opacity:0}.arkyn_button .spinner>svg{animation:spin 2s linear infinite}.arkyn_button.loading_text_false .spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.arkyn_button.loading_text_true .spinner{max-height:0px}.arkyn_button.loading_true .content{opacity:0;max-height:0px}.arkyn_button.loading_true .spinner{opacity:1;max-height:unset}.arkyn_form_controller{display:flex;flex-direction:column;gap:6px}.arkyn_form_error{font-size:12px;line-height:12px;font-weight:600;color:var(--danger-600)}.arkyn_form_label{color:var(--secondary-700);font-size:14px;font-weight:600;line-height:19.07px}.arkyn_form_label.show-asterisk:before{content:"* ";font-size:12px;font-weight:600;line-height:16.34px;text-align:left;color:var(--danger-600)}.arkyn_icon_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_icon_button:hover{cursor:pointer}.arkyn_icon_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_icon_button .content{display:flex;align-items:center;justify-content:center}.arkyn_icon_button.solid{color:#fff}.arkyn_icon_button.solid:disabled{opacity:.4}.arkyn_icon_button.solid.primary{background-color:var(--primary-500)}.arkyn_icon_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_icon_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_icon_button.solid.danger{background-color:var(--danger-600)}.arkyn_icon_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_icon_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_icon_button.solid.success{background-color:var(--success-500)}.arkyn_icon_button.solid.success:hover{background-color:var(--success-400)}.arkyn_icon_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_icon_button.solid.warning{background-color:var(--warning-600)}.arkyn_icon_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_icon_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_icon_button.outline{border-color:var(--secondary-300)}.arkyn_icon_button.outline:hover{border-color:var(--secondary-200)}.arkyn_icon_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_icon_button.outline.primary{color:var(--primary-500)}.arkyn_icon_button.outline.primary:hover{color:var(--primary-400)}.arkyn_icon_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.outline.danger{color:var(--danger-600)}.arkyn_icon_button.outline.danger:hover{color:var(--danger-500)}.arkyn_icon_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.outline.success{color:var(--success-500)}.arkyn_icon_button.outline.success:hover{color:var(--success-400)}.arkyn_icon_button.outline.success:disabled{color:var(--success-400)}.arkyn_icon_button.outline.warning{color:var(--warning-600)}.arkyn_icon_button.outline.warning:hover{color:var(--warning-500)}.arkyn_icon_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.ghost:disabled{opacity:.4}.arkyn_icon_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_icon_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_icon_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_icon_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_icon_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.invisible:disabled{opacity:.4}.arkyn_icon_button.invisible.primary{color:var(--primary-500)}.arkyn_icon_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_icon_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.invisible.danger{color:var(--danger-600)}.arkyn_icon_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_icon_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.invisible.success{color:var(--success-500)}.arkyn_icon_button.invisible.success:hover{color:var(--success-400)}.arkyn_icon_button.invisible.success:disabled{color:var(--success-400)}.arkyn_icon_button.invisible.warning{color:var(--warning-600)}.arkyn_icon_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_icon_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.lg{border-radius:6px;height:44px;width:44px}.arkyn_icon_button.md{border-radius:6px;height:40px;width:40px}.arkyn_icon_button.sm{border-radius:6px;height:32px;width:32px}.arkyn_icon_button.xs{border-radius:4px;height:24px;width:24px}.arkyn_icon_button .spinner{display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}.arkyn_icon_button .spinner svg{animation:spin 2s linear infinite}.arkyn_icon_button.loading_true .content{opacity:0}.arkyn_icon_button.loading_true .spinner{opacity:1}.arkyn_input{flex:1;position:relative;display:flex;align-items:center;padding:0 16px;gap:8px;border-radius:6px;border:1px solid transparent;outline:1px solid transparent}.arkyn_input:hover{cursor:text}.arkyn_input input{border:none;outline:none;background:transparent;width:100%}.arkyn_input input{color:var(--secondary-900)}.arkyn_input .prefix,.arkyn_input .sufix{color:var(--secondary-600);background:var(--secondary-200);font-weight:400;display:flex;align-items:center;justify-content:center;position:absolute}.arkyn_input .prefix{left:0;top:0;bottom:0;border-radius:5px 0 0 5px;border-right:1px solid var(--secondary-300)}.arkyn_input .sufix{right:0;top:0;bottom:0;border-radius:0 5px 5px 0;border-left:1px solid var(--secondary-300)}.arkyn_input input::placeholder{color:var(--secondary-400)}.arkyn_input svg{color:var(--secondary-400)}.arkyn_input.errored svg{color:var(--danger-600)}.arkyn_input:not(.opacity).focused svg{color:var(--primary-500)}.arkyn_input.opacity{opacity:.5}.arkyn_input.solid{border-color:var(--secondary-300);background-color:var(--secondary-50)}.arkyn_input.solid.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).solid.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.outline{border-color:var(--secondary-300)}.arkyn_input.outline.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).outline.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.underline{border-radius:0;border-top:none;border-left:none;border-right:none;outline:none;border-color:var(--secondary-300)}.arkyn_input.underline .sufix,.arkyn_input.underline .prefix{display:none}.arkyn_input.underline:before{content:" ";position:absolute;height:1px;left:0;right:0;bottom:-2px;background:transparent}.arkyn_input.underline.errored{border-color:var(--danger-600)}.arkyn_input.underline.errored:before{background:var(--danger-600)}.arkyn_input:not(.opacity).underline.focused{border-color:var(--primary-500)}.arkyn_input:not(.opacity).underline.focused:before{background:var(--primary-500)}.arkyn_input.md input{min-height:40px;max-height:40px;font-size:14px;line-height:14px;font-weight:400}.arkyn_input.md input::placeholder{font-weight:400;font-size:14px;line-height:14px}.arkyn_input.md.hasPrefix{padding-left:60px}.arkyn_input.md.hasSufix{padding-right:60px}.arkyn_input.md .prefix,.arkyn_input.md .sufix{height:40px;width:44px;font-size:14px}.arkyn_input.lg input{min-height:44px;max-height:44px;line-height:16px;font-size:16px;font-weight:400}.arkyn_input.lg input::placeholder{font-weight:400;font-size:16px;line-height:16px}.arkyn_input.lg .prefix,.arkyn_input.lg .sufix{height:44px;width:48px;font-size:16px}.arkyn_input.lg.hasPrefix{padding-left:64px}.arkyn_input.lg.hasSufix{padding-right:64px}.arkyn_input .spinner{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.arkyn_breadcrumb{display:flex;align-items:center;justify-content:start;flex-wrap:wrap;gap:4px}.arkyn_breadcrumb_link{-webkit-user-select:none;user-select:none;text-decoration:none;font-size:14px;color:var(--secondary-500)}.arkyn_breadcrumb_link.active{color:var(--secondary-900)}.arkyn_breadcrumb_link.inactive:hover{cursor:pointer;color:var(--secondary-900)}.arkyn_breadcrumb_link:first-child>svg{display:none}.arkyn_breadcrumb_link:not(:first-child){display:flex;align-items:center;gap:4px}.arkyn_breadcrumb_link:not(:first-child)>svg{display:unset;color:var(--secondary-400)}.arkyn_modal_container{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:start;justify-content:center;padding:10vh 0;padding-bottom:2rem;overflow:auto}.arkyn_modal_container>.overlay{position:fixed;z-index:9997;top:0;left:0;right:0;bottom:0;background:#00000080}.arkyn_modal_container>.overlay:hover{cursor:pointer}.arkyn_modal_container>.content{z-index:9999;border-radius:6px;background:var(--secondary-50)}.arkyn_modal_footer{display:flex;align-items:center;gap:16px;padding:16px;border-top:1px solid var(--secondary-200)}.arkyn_modal_footer.left{justify-content:flex-start}.arkyn_modal_footer.right{justify-content:flex-end}.arkyn_modal_footer.center{justify-content:center}.arkyn_modal_footer.between{justify-content:space-between}.arkyn_modal_footer.around{justify-content:space-around}.arkyn_modal_header{display:flex;align-items:center;justify-content:space-between;height:56px;padding:16px;font-size:16px;font-weight:600;line-height:20px;color:var(--secondary-900);border-bottom:1px solid var(--secondary-200)}.arkyn_modal_header>button{display:flex;align-items:center;justify-content:center;padding:2px;border-radius:4px;border:none;background:none;color:var(--secondary-400);transition:all .15s ease-out}.arkyn_modal_header>button:hover{cursor:pointer;background-color:var(--secondary-100)}.arkyn_tooltip{position:relative;display:block}.arkyn_tooltip .arkyn_tooltip_text{visibility:hidden;opacity:0;position:absolute;transform:translate(-50%,-50%);white-space:nowrap;transition:.15s all ease-out;border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:400;color:var(--secondary-100);background-color:var(--secondary-900);z-index:9999}.arkyn_tooltip.lg .arkyn_tooltip_text{font-size:14px;line-height:14px;padding:8px 12px}.arkyn_tooltip.md .arkyn_tooltip_text{font-size:12px;line-height:12px;padding:8px 12px}.arkyn_tooltip:hover .arkyn_tooltip_text{opacity:1;visibility:visible}.arkyn_tooltip.top .arkyn_tooltip_text{bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.top .arkyn_tooltip_text:before{content:"";top:100%;border-style:solid;border-color:var(--secondary-900) transparent;border-width:6px 6px 0 6px;bottom:20px;position:absolute;left:50%;transform:translate(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text{top:50%;right:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text:before{content:"";top:50%;border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 0 6px 6px;left:100%;position:absolute;transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 6px 6px 0;top:50%;left:0;transform:translate(-100%,-50%);position:absolute}.arkyn_tooltip.bottom .arkyn_tooltip_text{top:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.bottom .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:var(--secondary-900) transparent;border-width:0 6px 6px 6px;top:0;left:50%;transform:translate(-50%,-100%);position:absolute}
|
1
|
+
.arkyn_badge{display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent}.arkyn_badge.solid{color:#fff}.arkyn_badge.solid.primary{background-color:var(--primary-500)}.arkyn_badge.solid.secondary{background-color:var(--secondary-500)}.arkyn_badge.solid.danger{background-color:var(--danger-600)}.arkyn_badge.solid.success{background-color:var(--success-500)}.arkyn_badge.solid.warning{background-color:var(--warning-600)}.arkyn_badge.solid.info{background-color:var(--info-500)}.arkyn_badge.outline.primary{color:var(--primary-500);border-color:var(--primary-500)}.arkyn_badge.outline.secondary{color:var(--secondary-500);border-color:var(--secondary-500)}.arkyn_badge.outline.danger{color:var(--danger-600);border-color:var(--danger-600)}.arkyn_badge.outline.success{color:var(--success-500);border-color:var(--success-500)}.arkyn_badge.outline.warning{color:var(--warning-600);border-color:var(--warning-600)}.arkyn_badge.outline.info{color:var(--info-600);border-color:var(--info-600)}.arkyn_badge.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_badge.ghost.secondary{color:var(--secondary-500);background-color:var(--secondary-100)}.arkyn_badge.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_badge.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_badge.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_badge.ghost.info{color:var(--info-600);background-color:var(--info-100)}.arkyn_badge.lg{font-weight:400;font-size:12px;line-height:12px;border-radius:4px;padding:0 16px;height:24px}.arkyn_badge.md{font-weight:400;font-size:10px;line-height:10px;border-radius:4px;padding:0 12px;height:20px}.arkyn_divider{display:block;flex:1;background-color:var(--secondary-300)}.arkyn_divider.horizontal{width:100%;min-height:1px;max-height:1px}.arkyn_divider.vertical{height:100%;min-width:1px;max-width:1px}.arkyn_skeleton{width:100%;height:100%;border-radius:6px;background:linear-gradient(to right,#f0f0f0 4%,#e0e0e0 25%,#f0f0f0 36%);background-size:40rem 100%;animation:shimmer 1.5s infinite linear}@keyframes shimmer{0%{background-position:-40rem 0}to{background-position:40rem 0}}.arkyn_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_button:hover{cursor:pointer}.arkyn_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_button .content{display:flex;align-items:center;justify-content:center;white-space:nowrap}.arkyn_button.solid{color:#fff}.arkyn_button.solid:disabled{opacity:.4}.arkyn_button.solid.primary{background-color:var(--primary-500)}.arkyn_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_button.solid.danger{background-color:var(--danger-600)}.arkyn_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_button.solid.success{background-color:var(--success-500)}.arkyn_button.solid.success:hover{background-color:var(--success-400)}.arkyn_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_button.solid.warning{background-color:var(--warning-600)}.arkyn_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_button.outline{border-color:var(--secondary-300)}.arkyn_button.outline:hover{border-color:var(--secondary-200)}.arkyn_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_button.outline.primary{color:var(--primary-500)}.arkyn_button.outline.primary:hover{color:var(--primary-400)}.arkyn_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_button.outline.danger{color:var(--danger-600)}.arkyn_button.outline.danger:hover{color:var(--danger-500)}.arkyn_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_button.outline.success{color:var(--success-500)}.arkyn_button.outline.success:hover{color:var(--success-400)}.arkyn_button.outline.success:disabled{color:var(--success-400)}.arkyn_button.outline.warning{color:var(--warning-600)}.arkyn_button.outline.warning:hover{color:var(--warning-500)}.arkyn_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_button.ghost:disabled{opacity:.4}.arkyn_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.invisible:disabled{opacity:.4}.arkyn_button.invisible.primary{color:var(--primary-500)}.arkyn_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_button.invisible.danger{color:var(--danger-600)}.arkyn_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_button.invisible.success{color:var(--success-500)}.arkyn_button.invisible.success:hover{color:var(--success-400)}.arkyn_button.invisible.success:disabled{color:var(--success-400)}.arkyn_button.invisible.warning{color:var(--warning-600)}.arkyn_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_button.lg{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;padding:0 20px;height:44px}.arkyn_button.lg .content,.arkyn_button.lg .spinner{gap:16px}.arkyn_button.md{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;gap:16px;padding:0 16px;height:40px}.arkyn_button.md .content,.arkyn_button.md .spinner{gap:14px}.arkyn_button.sm{font-weight:600;font-size:12px;line-height:12px;border-radius:6px;padding:0 16px;height:32px}.arkyn_button.sm .content,.arkyn_button.sm .spinner{gap:12px}.arkyn_button.xs{font-weight:600;font-size:10px;line-height:10px;border-radius:4px;padding:0 16px;height:24px}.arkyn_button.xs .content,.arkyn_button.xs .spinner{gap:8px}.arkyn_button .spinner{display:flex;align-items:center;justify-content:center;white-space:nowrap;opacity:0}.arkyn_button .spinner>svg{animation:spin 2s linear infinite}.arkyn_button.loading_text_false .spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.arkyn_button.loading_text_true .spinner{max-height:0px}.arkyn_button.loading_true .content{opacity:0;max-height:0px}.arkyn_button.loading_true .spinner{opacity:1;max-height:unset}.arkyn_form_controller{display:flex;flex-direction:column;gap:6px}.arkyn_form_error{font-size:12px;line-height:12px;font-weight:600;color:var(--danger-600)}.arkyn_form_label{color:var(--secondary-700);font-size:14px;font-weight:600;line-height:19.07px}.arkyn_form_label.show-asterisk:before{content:"* ";font-size:12px;font-weight:600;line-height:16.34px;text-align:left;color:var(--danger-600)}.arkyn_icon_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_icon_button:hover{cursor:pointer}.arkyn_icon_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_icon_button .content{display:flex;align-items:center;justify-content:center}.arkyn_icon_button.solid{color:#fff}.arkyn_icon_button.solid:disabled{opacity:.4}.arkyn_icon_button.solid.primary{background-color:var(--primary-500)}.arkyn_icon_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_icon_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_icon_button.solid.danger{background-color:var(--danger-600)}.arkyn_icon_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_icon_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_icon_button.solid.success{background-color:var(--success-500)}.arkyn_icon_button.solid.success:hover{background-color:var(--success-400)}.arkyn_icon_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_icon_button.solid.warning{background-color:var(--warning-600)}.arkyn_icon_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_icon_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_icon_button.outline{border-color:var(--secondary-300)}.arkyn_icon_button.outline:hover{border-color:var(--secondary-200)}.arkyn_icon_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_icon_button.outline.primary{color:var(--primary-500)}.arkyn_icon_button.outline.primary:hover{color:var(--primary-400)}.arkyn_icon_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.outline.danger{color:var(--danger-600)}.arkyn_icon_button.outline.danger:hover{color:var(--danger-500)}.arkyn_icon_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.outline.success{color:var(--success-500)}.arkyn_icon_button.outline.success:hover{color:var(--success-400)}.arkyn_icon_button.outline.success:disabled{color:var(--success-400)}.arkyn_icon_button.outline.warning{color:var(--warning-600)}.arkyn_icon_button.outline.warning:hover{color:var(--warning-500)}.arkyn_icon_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.ghost:disabled{opacity:.4}.arkyn_icon_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_icon_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_icon_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_icon_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_icon_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.invisible:disabled{opacity:.4}.arkyn_icon_button.invisible.primary{color:var(--primary-500)}.arkyn_icon_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_icon_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.invisible.danger{color:var(--danger-600)}.arkyn_icon_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_icon_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.invisible.success{color:var(--success-500)}.arkyn_icon_button.invisible.success:hover{color:var(--success-400)}.arkyn_icon_button.invisible.success:disabled{color:var(--success-400)}.arkyn_icon_button.invisible.warning{color:var(--warning-600)}.arkyn_icon_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_icon_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.lg{border-radius:6px;height:44px;width:44px}.arkyn_icon_button.md{border-radius:6px;height:40px;width:40px}.arkyn_icon_button.sm{border-radius:6px;height:32px;width:32px}.arkyn_icon_button.xs{border-radius:4px;height:24px;width:24px}.arkyn_icon_button .spinner{display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}.arkyn_icon_button .spinner svg{animation:spin 2s linear infinite}.arkyn_icon_button.loading_true .content{opacity:0}.arkyn_icon_button.loading_true .spinner{opacity:1}.arkyn_input{flex:1;position:relative;display:flex;align-items:center;padding:0 16px;gap:8px;border-radius:6px;border:1px solid transparent;outline:1px solid transparent}.arkyn_input:hover{cursor:text}.arkyn_input input{border:none;outline:none;background:transparent;width:100%}.arkyn_input input{color:var(--secondary-900)}.arkyn_input .prefix,.arkyn_input .sufix{color:var(--secondary-600);background:var(--secondary-200);font-weight:400;display:flex;align-items:center;justify-content:center;position:absolute}.arkyn_input .prefix{left:0;top:0;bottom:0;border-radius:5px 0 0 5px;border-right:1px solid var(--secondary-300)}.arkyn_input .sufix{right:0;top:0;bottom:0;border-radius:0 5px 5px 0;border-left:1px solid var(--secondary-300)}.arkyn_input input::placeholder{color:var(--secondary-400)}.arkyn_input svg{color:var(--secondary-400)}.arkyn_input.errored svg{color:var(--danger-600)}.arkyn_input:not(.opacity).focused svg{color:var(--primary-500)}.arkyn_input.opacity{opacity:.5}.arkyn_input.solid{border-color:var(--secondary-300);background-color:var(--secondary-50)}.arkyn_input.solid.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).solid.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.outline{border-color:var(--secondary-300)}.arkyn_input.outline.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).outline.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.underline{border-radius:0;border-top:none;border-left:none;border-right:none;outline:none;border-color:var(--secondary-300)}.arkyn_input.underline .sufix,.arkyn_input.underline .prefix{display:none}.arkyn_input.underline:before{content:" ";position:absolute;height:1px;left:0;right:0;bottom:-2px;background:transparent}.arkyn_input.underline.errored{border-color:var(--danger-600)}.arkyn_input.underline.errored:before{background:var(--danger-600)}.arkyn_input:not(.opacity).underline.focused{border-color:var(--primary-500)}.arkyn_input:not(.opacity).underline.focused:before{background:var(--primary-500)}.arkyn_input.md input{min-height:40px;max-height:40px;font-size:14px;line-height:14px;font-weight:400}.arkyn_input.md input::placeholder{font-weight:400;font-size:14px;line-height:14px}.arkyn_input.md.hasPrefix{padding-left:60px}.arkyn_input.md.hasSufix{padding-right:60px}.arkyn_input.md .prefix,.arkyn_input.md .sufix{height:40px;width:44px;font-size:14px}.arkyn_input.lg input{min-height:44px;max-height:44px;line-height:16px;font-size:16px;font-weight:400}.arkyn_input.lg input::placeholder{font-weight:400;font-size:16px;line-height:16px}.arkyn_input.lg .prefix,.arkyn_input.lg .sufix{height:44px;width:48px;font-size:16px}.arkyn_input.lg.hasPrefix{padding-left:64px}.arkyn_input.lg.hasSufix{padding-right:64px}.arkyn_input .spinner{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.arkyn_breadcrumb{display:flex;align-items:center;justify-content:start;flex-wrap:wrap;gap:4px}.arkyn_breadcrumb_link{-webkit-user-select:none;user-select:none;text-decoration:none;font-size:14px;color:var(--secondary-500)}.arkyn_breadcrumb_link.active{color:var(--secondary-900)}.arkyn_breadcrumb_link.inactive:hover{cursor:pointer;color:var(--secondary-900)}.arkyn_breadcrumb_link:first-child>svg{display:none}.arkyn_breadcrumb_link:not(:first-child){display:flex;align-items:center;gap:4px}.arkyn_breadcrumb_link:not(:first-child)>svg{display:unset;color:var(--secondary-400)}.arkyn_modal_container{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:start;justify-content:center;padding:10vh 0;padding-bottom:2rem;overflow:auto}.arkyn_modal_container>.overlay{position:fixed;z-index:9997;top:0;left:0;right:0;bottom:0;background:#00000080}.arkyn_modal_container>.overlay:hover{cursor:pointer}.arkyn_modal_container>.content{z-index:9999;border-radius:6px;background:var(--secondary-50)}.arkyn_modal_footer{display:flex;align-items:center;gap:16px;padding:16px;border-top:1px solid var(--secondary-200)}.arkyn_modal_footer.left{justify-content:flex-start}.arkyn_modal_footer.right{justify-content:flex-end}.arkyn_modal_footer.center{justify-content:center}.arkyn_modal_footer.between{justify-content:space-between}.arkyn_modal_footer.around{justify-content:space-around}.arkyn_modal_header{display:flex;align-items:center;justify-content:space-between;height:56px;padding:16px;font-size:16px;font-weight:600;line-height:20px;color:var(--secondary-900);border-bottom:1px solid var(--secondary-200)}.arkyn_modal_header>button{display:flex;align-items:center;justify-content:center;padding:2px;border-radius:4px;border:none;background:none;color:var(--secondary-400);transition:all .15s ease-out}.arkyn_modal_header>button:hover{cursor:pointer;background-color:var(--secondary-100)}.arkyn_tooltip{position:relative;display:block}.arkyn_tooltip .arkyn_tooltip_text{visibility:hidden;opacity:0;position:absolute;transform:translate(-50%,-50%);white-space:nowrap;transition:.15s all ease-out;border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:400;color:var(--secondary-100);background-color:var(--secondary-900);z-index:9999}.arkyn_tooltip.lg .arkyn_tooltip_text{font-size:14px;line-height:14px;padding:8px 12px}.arkyn_tooltip.md .arkyn_tooltip_text{font-size:12px;line-height:12px;padding:8px 12px}.arkyn_tooltip:hover .arkyn_tooltip_text{opacity:1;visibility:visible}.arkyn_tooltip.top .arkyn_tooltip_text{bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.top .arkyn_tooltip_text:before{content:"";top:100%;border-style:solid;border-color:var(--secondary-900) transparent;border-width:6px 6px 0 6px;bottom:20px;position:absolute;left:50%;transform:translate(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text{top:50%;right:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text:before{content:"";top:50%;border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 0 6px 6px;left:100%;position:absolute;transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 6px 6px 0;top:50%;left:0;transform:translate(-100%,-50%);position:absolute}.arkyn_tooltip.bottom .arkyn_tooltip_text{top:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.bottom .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:var(--secondary-900) transparent;border-width:0 6px 6px 6px;top:0;left:50%;transform:translate(-50%,-100%);position:absolute}
|
package/package.json
CHANGED
@@ -9,8 +9,9 @@ type FormErrorProps = {
|
|
9
9
|
|
10
10
|
function FormError({ children }: FormErrorProps) {
|
11
11
|
const { error } = useFormController();
|
12
|
+
if (children) return <strong className="arkyn_form_error">{children}</strong>;
|
12
13
|
if (!error) return <></>;
|
13
|
-
return <strong className="arkyn_form_error">{
|
14
|
+
return <strong className="arkyn_form_error">{error}</strong>;
|
14
15
|
}
|
15
16
|
|
16
17
|
export { FormError };
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { SkeletonProps } from "@arkyn/types";
|
2
|
+
import "./styles.css";
|
3
|
+
|
4
|
+
function Skeleton({ className: baseClassName, ...rest }: SkeletonProps) {
|
5
|
+
const className = "arkyn_skeleton " + baseClassName;
|
6
|
+
return <div className={className.trim()} {...rest} />;
|
7
|
+
}
|
8
|
+
|
9
|
+
export { Skeleton };
|
@@ -0,0 +1,18 @@
|
|
1
|
+
.arkyn_skeleton {
|
2
|
+
width: 100%;
|
3
|
+
height: 100%;
|
4
|
+
border-radius: 6px;
|
5
|
+
|
6
|
+
background: linear-gradient(to right, #f0f0f0 4%, #e0e0e0 25%, #f0f0f0 36%);
|
7
|
+
background-size: 40rem 100%;
|
8
|
+
animation: shimmer 1.5s infinite linear;
|
9
|
+
}
|
10
|
+
|
11
|
+
@keyframes shimmer {
|
12
|
+
0% {
|
13
|
+
background-position: -40rem 0;
|
14
|
+
}
|
15
|
+
100% {
|
16
|
+
background-position: 40rem 0;
|
17
|
+
}
|
18
|
+
}
|
@@ -0,0 +1,31 @@
|
|
1
|
+
import { useLocation } from "@remix-run/react";
|
2
|
+
|
3
|
+
type ParamsType = Record<string, string | number | boolean | undefined>;
|
4
|
+
|
5
|
+
function useScopedParams(scope: string = "") {
|
6
|
+
const location = useLocation();
|
7
|
+
const searchParams = new URLSearchParams(location.search);
|
8
|
+
const prefix = scope ? `${scope}:` : "";
|
9
|
+
|
10
|
+
const updateSearchParams = (params: ParamsType) => {
|
11
|
+
Object.entries(params).forEach(([key, value]) => {
|
12
|
+
if (value === undefined) {
|
13
|
+
searchParams.delete(`${prefix}${key}`);
|
14
|
+
} else {
|
15
|
+
searchParams.set(`${prefix}${key}`, String(value));
|
16
|
+
}
|
17
|
+
});
|
18
|
+
};
|
19
|
+
|
20
|
+
return {
|
21
|
+
getParam: (key: string) => searchParams.get(`${prefix}${key}`),
|
22
|
+
getScopedSearch: (params: ParamsType) => {
|
23
|
+
updateSearchParams(params);
|
24
|
+
let search = searchParams.toString();
|
25
|
+
if (search) search = "?" + search;
|
26
|
+
return search;
|
27
|
+
},
|
28
|
+
};
|
29
|
+
}
|
30
|
+
|
31
|
+
export { useScopedParams };
|
package/src/index.ts
CHANGED
@@ -1,6 +1,7 @@
|
|
1
1
|
// Data Display
|
2
2
|
export { Badge } from "./components/Badge";
|
3
3
|
export { Divider } from "./components/Divider";
|
4
|
+
export { Skeleton } from "./components/Skeleton";
|
4
5
|
|
5
6
|
// Form
|
6
7
|
export { Button } from "./components/Button";
|
@@ -14,3 +15,6 @@ export { Breadcrumb, BreadcrumbLink } from "./components/Breadcrumb";
|
|
14
15
|
// Overlay
|
15
16
|
export { Modal } from "./components/Modal";
|
16
17
|
export { Tooltip } from "./components/Tooltip";
|
18
|
+
|
19
|
+
// Hooks
|
20
|
+
export { useScopedParams } from "./hooks/useScopedParams";
|