@e1011/es-kit 1.0.180 → 1.0.184

package/dist/types/src/core/utils/appState/store/simpleComponent/SimpleComponent2.d.ts

@@ -0,0 +1,13 @@
+import { FC, PropsWithChildren } from 'react';
+import { StoreWithActions } from '../store.vanillajs';
+export type SimpleState = {
+    title: string;
+    count: number;
+    data: number[];
+};
+export type SimpleComponentType = PropsWithChildren;
+export declare const simpleStore2: StoreWithActions<SimpleState>;
+export declare const getRenderCount: () => number;
+export declare const setRenderCount: (count: number) => void;
+export declare const SimpleComponent2: FC<SimpleComponentType>;
+//# sourceMappingURL=SimpleComponent2.d.ts.map

package/dist/types/src/core/utils/appState/store/simpleComponent/SimpleComponent2.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleComponent2.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/utils/appState/store/simpleComponent/SimpleComponent2.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,iBAAiB,EAAqB,MAAM,OAAO,CAAA;AAIhE,OAAO,EAAE,gBAAgB,EAAe,MAAM,oBAAoB,CAAA;AAKlE,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,EAAE,CAAA;CACf,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAA;AAEnD,eAAO,MAAM,YAAY,EAAE,gBAAgB,CAAC,WAAW,CAsBpB,CAAA;AAInC,eAAO,MAAM,cAAc,QAAO,MAAqB,CAAA;AACvD,eAAO,MAAM,cAAc,UAAW,MAAM,SAE3C,CAAA;AAwBD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,mBAAmB,CA2BnD,CAAA"}

package/dist/types/src/core/utils/appState/store/useStore.react.d.ts

@@ -3,18 +3,15 @@ import { Store, StoreWithActions, Selector } from './store.vanillajs';
  * Represents the type for the partial store state used in the `useStore` hook.
  */
 export type useStoreType<T> = Partial<T>;
-/**
- * Custom hook to subscribe to a store and retrieve the selected state.
- * @param store - The store to subscribe to.
- * @param selector - Optional selector function to transform the store state.
- * @returns The selected state from the store.
- */
-export declare function useStore<T>(store: Store<T> | StoreWithActions<T>, selector?: Selector<T>): useStoreType<T>;
+export type useStoreWithSetterType<T> = [Partial<T>, Store<T>['setState']];
+type returnSetterTrueType = true;
+export declare function useStore<T>(store: Store<T> | StoreWithActions<T>, selector: Selector<T>): useStoreType<T>;
+export declare function useStore<T>(store: Store<T> | StoreWithActions<T>, selector: Selector<T>, returnSetter: returnSetterTrueType): useStoreWithSetterType<T>;
 /**
  * Represents the type for the API returned by the `useStoreApi` hook.
  */
 export type useStoreApiType<T> = [
-    ReturnType<typeof useStore>,
+    useStoreType<T>,
     Store<T>['getState'],
     Store<T>['setState'],
     StoreWithActions<T>['actions']
@@ -26,4 +23,5 @@ export type useStoreApiType<T> = [
  * @returns The store API including state, getters, setters, and actions (if applicable).
  */
 export declare function useStoreApi<T>(store: Store<T>, selector?: Selector<T>): useStoreApiType<T>;
+export {};
 //# sourceMappingURL=useStore.react.d.ts.map

package/dist/types/src/core/utils/appState/store/useStore.react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStore.react.d.ts","sourceRoot":"","sources":["../../../../../../../src/core/utils/appState/store/useStore.react.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAGrE;;GAEG;AACH,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,CAAA;AAExC;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EACxB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,EACrC,QAAQ,GAAE,QAAQ,CAAC,CAAC,CAAgC,GAInD,YAAY,CAAC,CAAC,CAAC,CAEjB;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,UAAU,CAAC,OAAO,QAAQ,CAAC;IAC3B,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IACpB,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IACpB,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;CAC/B,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAC3B,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EACf,QAAQ,GAAE,QAAQ,CAAC,CAAC,CAAgC,GACnD,eAAe,CAAC,CAAC,CAAC,CAOpB"}
+{"version":3,"file":"useStore.react.d.ts","sourceRoot":"","sources":["../../../../../../../src/core/utils/appState/store/useStore.react.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAGrE;;GAEG;AACH,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,CAAA;AAExC,MAAM,MAAM,sBAAsB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAA;AAE1E,KAAK,oBAAoB,GAAG,IAAI,CAAA;AAEhC,wBAAgB,QAAQ,CAAC,CAAC,EACxB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,EACrC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,CAAA;AAEzC,wBAAgB,QAAQ,CAAC,CAAC,EACxB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,EACrC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,EACrB,YAAY,EAAE,oBAAoB,GAAG,sBAAsB,CAAC,CAAC,CAAC,CAAA;AAyBhE;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,YAAY,CAAC,CAAC,CAAC;IACf,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IACpB,KAAK,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IACpB,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;CAC/B,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAC3B,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EACf,QAAQ,GAAE,QAAQ,CAAC,CAAC,CAAgC,GACnD,eAAe,CAAC,CAAC,CAAC,CAOpB"}

package/dist/ui/_virtual/_rollupPluginBabelHelpers.js

@@ -1,2 +1,2 @@
-"use strict";function e(){return e=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},e.apply(this,arguments)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.extends=e;
+"use strict";function e(e,r){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var i=t.call(e,r||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}function r(r){var t=e(r,"string");return"symbol"==typeof t?t:String(t)}function t(){return t=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e},t.apply(this,arguments)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.defineProperty=function(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e},exports.extends=t,exports.taggedTemplateLiteral=function(e,r){return r||(r=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(r)}}))},exports.toPrimitive=e,exports.toPropertyKey=r;
 //# sourceMappingURL=_rollupPluginBabelHelpers.js.map

package/dist/ui/esm/_virtual/_rollupPluginBabelHelpers.js

@@ -1,2 +1,2 @@
-function t(){return t=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var e in r)Object.prototype.hasOwnProperty.call(r,e)&&(t[e]=r[e])}return t},t.apply(this,arguments)}export{t as extends};
+function e(e,r){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var i=t.call(e,r||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}function r(r){var t=e(r,"string");return"symbol"==typeof t?t:String(t)}function t(e,t,i){return(t=r(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function i(){return i=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var i in t)Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i])}return e},i.apply(this,arguments)}function n(e,r){return r||(r=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(r)}}))}export{t as defineProperty,i as extends,n as taggedTemplateLiteral,e as toPrimitive,r as toPropertyKey};
 //# sourceMappingURL=_rollupPluginBabelHelpers.js.map

package/dist/ui/esm/src/core/ui/components/container/Flex.js

@@ -1,2 +1,2 @@
-import{memo as t}from"react";import e from"styled-components";const i={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},r=t=>t&&i[t]||t,n=t(e.div.withConfig({displayName:"Flex",componentId:"sc-19vq3db-0"})(["display:flex;position:relative;flex-direction:",";flex:",";flex-grow:",";flex-shrink:",";flex-basis:",";flex-wrap:",";gap:",";text-align:",";justify-content:",";align-items:",";align-self:",";margin:",";padding:",";width:",";height:",";max-width:",";max-height:",";min-width:",";min-height:",";border-radius:",";"],(t=>{let{direction:e}=t;return e||"row"}),(t=>{let{flex:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexGrow:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexShrink:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexBasis:e}=t;return e||"auto"}),(t=>{let{flexWrap:e}=t;return e||"nowrap"}),(t=>{let{gap:e}=t;return void 0!==e?e:"0"}),(t=>{let{alignText:e}=t;return e||"left"}),(t=>{let{justify:e}=t;return r(e)||"flex-start"}),(t=>{let{align:e}=t;return r(e)||"flex-start"}),(t=>{let{alignSelf:e}=t;return e||"auto"}),(t=>{let{margin:e}=t;return e||"0"}),(t=>{let{padding:e}=t;return e||"0"}),(t=>{let{width:e}=t;return e||"auto"}),(t=>{let{height:e}=t;return e||"auto"}),(t=>{let{maxWidth:e}=t;return e||"none"}),(t=>{let{maxHeight:e}=t;return e||"none"}),(t=>{let{minWidth:e}=t;return e||"0"===e?e:"0"}),(t=>{let{minHeight:e}=t;return e||"0"}),(t=>{let{borderRadius:e}=t;return e||"initial"}))),l=t(e(n).attrs((t=>({width:t.width||"100%",height:t.height||"100%",justify:t.justify||"center",align:t.align||"center",...t}))).withConfig({displayName:"Flex__FlexWrapper",componentId:"sc-19vq3db-1"})([""])),a=t(e(n).attrs((t=>({width:"initial",...t}))).withConfig({displayName:"Flex__FlexTight",componentId:"sc-19vq3db-2"})([""])),d=t(e(n).attrs((t=>({width:"initial",style:{text:"blue",padding:"1rem",border:"1px solid green"},...t}))).withConfig({displayName:"Flex__FlexTightStyled",componentId:"sc-19vq3db-3"})([""]));export{n as Flex,a as FlexTight,d as FlexTightStyled,l as FlexWrapper};
+import{taggedTemplateLiteral as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as e}from"react";import n from"styled-components";var r,i,l,a;const d={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},o=t=>t&&d[t]||t,u=e(n.div(r||(r=t(["\n  display: flex;\n  position: relative;\n  flex-direction: ",";\n  flex: ",";\n  flex-grow: ",";\n  flex-shrink: ",";\n  flex-basis: ",";\n  flex-wrap: ",";\n  gap: ",";\n  text-align: ",";\n  justify-content: ",";\n  align-items: ",";\n  align-self: ",";\n  margin: ",";\n  padding: ",";\n  width: ",";\n  height: ",";\n  max-width: ",";\n  max-height: ",";\n  min-width: ",";\n  min-height: ",";\n  border-radius: ",";\n"])),(t=>{let{direction:e}=t;return e||"row"}),(t=>{let{flex:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexGrow:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexShrink:e}=t;return void 0!==e?e:"0"}),(t=>{let{flexBasis:e}=t;return e||"auto"}),(t=>{let{flexWrap:e}=t;return e||"nowrap"}),(t=>{let{gap:e}=t;return void 0!==e?e:"0"}),(t=>{let{alignText:e}=t;return e||"left"}),(t=>{let{justify:e}=t;return o(e)||"flex-start"}),(t=>{let{align:e}=t;return o(e)||"flex-start"}),(t=>{let{alignSelf:e}=t;return e||"auto"}),(t=>{let{margin:e}=t;return e||"0"}),(t=>{let{padding:e}=t;return e||"0"}),(t=>{let{width:e}=t;return e||"auto"}),(t=>{let{height:e}=t;return e||"auto"}),(t=>{let{maxWidth:e}=t;return e||"none"}),(t=>{let{maxHeight:e}=t;return e||"none"}),(t=>{let{minWidth:e}=t;return e||"0"===e?e:"0"}),(t=>{let{minHeight:e}=t;return e||"0"}),(t=>{let{borderRadius:e}=t;return e||"initial"}))),s=e(n(u).attrs((t=>({width:t.width||"100%",height:t.height||"100%",justify:t.justify||"center",align:t.align||"center",...t})))(i||(i=t([""])))),f=e(n(u).attrs((t=>({width:"initial",...t})))(l||(l=t([""])))),x=e(n(u).attrs((t=>({width:"initial",style:{text:"blue",padding:"1rem",border:"1px solid green"},...t})))(a||(a=t([""]))));export{u as Flex,f as FlexTight,x as FlexTightStyled,s as FlexWrapper};
 //# sourceMappingURL=Flex.js.map

package/dist/ui/esm/src/core/ui/components/container/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../../../../../../src/core/ui/components/container/Flex.ts"],"sourcesContent":["import { memo } from 'react'\nimport styled from 'styled-components'\n\nexport type FlexProps = {\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\nexport const Flex = memo(styled.div<FlexProps>`\n  display: flex;\n  position: relative;\n  flex-direction: ${({ direction }: Partial<FlexProps>) => direction || 'row'};\n  flex: ${({ flex }: Partial<FlexProps>) => (flex !== undefined ? flex : '0')};\n  flex-grow: ${({ flexGrow }: Partial<FlexProps>) => (flexGrow !== undefined ? flexGrow : '0')};\n  flex-shrink: ${({ flexShrink }: Partial<FlexProps>) => (flexShrink !== undefined ? flexShrink : '0')};\n  flex-basis: ${({ flexBasis }: Partial<FlexProps>) => flexBasis || 'auto'};\n  flex-wrap: ${({ flexWrap }: Partial<FlexProps>) => flexWrap || 'nowrap'};\n  gap: ${({ gap }: Partial<FlexProps>) => (gap !== undefined ? gap : '0')};\n  text-align: ${({ alignText }: Partial<FlexProps>) => alignText || 'left'};\n  justify-content: ${({ justify }: Partial<FlexProps>) => resolveFlexProps(justify) || 'flex-start'};\n  align-items: ${({ align }: Partial<FlexProps>) => resolveFlexProps(align) || 'flex-start'};\n  align-self: ${({ alignSelf }: Partial<FlexProps>) => alignSelf || 'auto'};\n  margin: ${({ margin }: Partial<FlexProps>) => margin || '0'};\n  padding: ${({ padding }: Partial<FlexProps>) => padding || '0'};\n  width: ${({ width }: Partial<FlexProps>) => width || 'auto'};\n  height: ${({ height }: Partial<FlexProps>) => height || 'auto'};\n  max-width: ${({ maxWidth }: Partial<FlexProps>) => maxWidth || 'none'};\n  max-height: ${({ maxHeight }: Partial<FlexProps>) => maxHeight || 'none'};\n  min-width: ${({ minWidth }: Partial<FlexProps>) => ((minWidth || minWidth === '0') ? minWidth : '0')};\n  min-height: ${({ minHeight }: Partial<FlexProps>) => minHeight || '0'};\n  border-radius: ${({ borderRadius }: Partial<FlexProps>) => borderRadius || 'initial'};\n`)\n\n// default flex centralized, 100% width and height\nexport const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n  {\n    width: props.width || '100%',\n    height: props.height || '100%',\n    justify: props.justify || 'center',\n    align: props.align || 'center',\n    ...props,\n  }\n))``)\n\nexport const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  ...props,\n}))``)\n\nexport const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  style: {\n    text: 'blue',\n    padding: '1rem',\n    border: '1px solid green',\n  },\n  ...props,\n}))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","Flex","memo","styled","div","withConfig","displayName","componentId","_ref","direction","_ref2","flex","undefined","_ref3","flexGrow","_ref4","flexShrink","_ref5","flexBasis","_ref6","flexWrap","_ref7","gap","_ref8","alignText","_ref9","justify","_ref10","align","_ref11","alignSelf","_ref12","margin","_ref13","padding","_ref14","width","_ref15","height","_ref16","maxWidth","_ref17","maxHeight","_ref18","minWidth","_ref19","minHeight","_ref20","borderRadius","FlexWrapper","attrs","props","FlexTight","FlexTightStyled","style","text","border"],"mappings":"8DA2BA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAE9FC,EAAOC,EAAKC,EAAOC,IAAGC,WAAA,CAAAC,YAAA,OAAAC,YAAA,gBAAVJ,CAAU,CAAA,iDAAA,SAAA,cAAA,gBAAA,eAAA,cAAA,QAAA,eAAA,oBAAA,gBAAA,eAAA,WAAA,YAAA,UAAA,WAAA,cAAA,eAAA,cAAA,eAAA,kBAAA,MAGfK,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,KAAK,IACnEC,IAAA,IAACC,KAAEA,GAA0BD,EAAA,YAAeE,IAATD,EAAqBA,EAAO,GAAG,IAC7DE,IAAA,IAACC,SAAEA,GAA8BD,EAAA,YAAmBD,IAAbE,EAAyBA,EAAW,GAAG,IAC5EC,IAAA,IAACC,WAAEA,GAAgCD,EAAA,YAAqBH,IAAfI,EAA2BA,EAAa,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,QAAQ,IAChEC,IAAA,IAACC,IAAEA,GAAyBD,EAAA,YAAcT,IAARU,EAAoBA,EAAM,GAAG,IACxDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IACrDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAK1B,EAAiB2B,IAAY,YAAY,IAClFC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAK5B,EAAiB6B,IAAU,YAAY,IAC3EC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC9DC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,GAAG,IAChDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAKC,GAAW,GAAG,IACrDC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAKC,GAAS,MAAM,IACjDC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,MAAM,IACjDC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,MAAM,IACvDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAOC,GAAyB,MAAbA,EAAoBA,EAAW,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,GAAG,IACpDC,IAAA,IAACC,aAAEA,GAAkCD,EAAA,OAAKC,GAAgB,SAAS,KAIzEC,EAAc/C,EAAKC,EAAOF,GAAMiD,OAAOC,IAClD,CACEf,MAAOe,EAAMf,OAAS,OACtBE,OAAQa,EAAMb,QAAU,OACxBZ,QAASyB,EAAMzB,SAAW,SAC1BE,MAAOuB,EAAMvB,OAAS,YACnBuB,MAEL9C,WAAA,CAAAC,YAAA,oBAAAC,YAAA,gBAR8BJ,CAQ9B,CAAA,MAEWiD,EAAYlD,EAAKC,EAAOF,GAAMiD,OAAOC,IAA+B,CAC/Ef,MAAO,aACJe,MACF9C,WAAA,CAAAC,YAAA,kBAAAC,YAAA,gBAH2BJ,CAG3B,CAAA,MAEUkD,EAAkBnD,EAAKC,EAAOF,GAAMiD,OAAOC,IAA+B,CACrFf,MAAO,UACPkB,MAAO,CACLC,KAAM,OACNrB,QAAS,OACTsB,OAAQ,sBAEPL,MACF9C,WAAA,CAAAC,YAAA,wBAAAC,YAAA,gBARiCJ,CAQjC,CAAA"}
+{"version":3,"file":"Flex.js","sources":["../../../../../../../../src/core/ui/components/container/Flex.ts"],"sourcesContent":["import { memo } from 'react'\nimport styled from 'styled-components'\n\nexport type FlexProps = {\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\nexport const Flex = memo(styled.div<FlexProps>`\n  display: flex;\n  position: relative;\n  flex-direction: ${({ direction }: Partial<FlexProps>) => direction || 'row'};\n  flex: ${({ flex }: Partial<FlexProps>) => (flex !== undefined ? flex : '0')};\n  flex-grow: ${({ flexGrow }: Partial<FlexProps>) => (flexGrow !== undefined ? flexGrow : '0')};\n  flex-shrink: ${({ flexShrink }: Partial<FlexProps>) => (flexShrink !== undefined ? flexShrink : '0')};\n  flex-basis: ${({ flexBasis }: Partial<FlexProps>) => flexBasis || 'auto'};\n  flex-wrap: ${({ flexWrap }: Partial<FlexProps>) => flexWrap || 'nowrap'};\n  gap: ${({ gap }: Partial<FlexProps>) => (gap !== undefined ? gap : '0')};\n  text-align: ${({ alignText }: Partial<FlexProps>) => alignText || 'left'};\n  justify-content: ${({ justify }: Partial<FlexProps>) => resolveFlexProps(justify) || 'flex-start'};\n  align-items: ${({ align }: Partial<FlexProps>) => resolveFlexProps(align) || 'flex-start'};\n  align-self: ${({ alignSelf }: Partial<FlexProps>) => alignSelf || 'auto'};\n  margin: ${({ margin }: Partial<FlexProps>) => margin || '0'};\n  padding: ${({ padding }: Partial<FlexProps>) => padding || '0'};\n  width: ${({ width }: Partial<FlexProps>) => width || 'auto'};\n  height: ${({ height }: Partial<FlexProps>) => height || 'auto'};\n  max-width: ${({ maxWidth }: Partial<FlexProps>) => maxWidth || 'none'};\n  max-height: ${({ maxHeight }: Partial<FlexProps>) => maxHeight || 'none'};\n  min-width: ${({ minWidth }: Partial<FlexProps>) => ((minWidth || minWidth === '0') ? minWidth : '0')};\n  min-height: ${({ minHeight }: Partial<FlexProps>) => minHeight || '0'};\n  border-radius: ${({ borderRadius }: Partial<FlexProps>) => borderRadius || 'initial'};\n`)\n\n// default flex centralized, 100% width and height\nexport const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n  {\n    width: props.width || '100%',\n    height: props.height || '100%',\n    justify: props.justify || 'center',\n    align: props.align || 'center',\n    ...props,\n  }\n))``)\n\nexport const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  ...props,\n}))``)\n\nexport const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  style: {\n    text: 'blue',\n    padding: '1rem',\n    border: '1px solid green',\n  },\n  ...props,\n}))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","Flex","memo","styled","div","_templateObject","_taggedTemplateLiteral","_ref","direction","_ref2","flex","undefined","_ref3","flexGrow","_ref4","flexShrink","_ref5","flexBasis","_ref6","flexWrap","_ref7","gap","_ref8","alignText","_ref9","justify","_ref10","align","_ref11","alignSelf","_ref12","margin","_ref13","padding","_ref14","width","_ref15","height","_ref16","maxWidth","_ref17","maxHeight","_ref18","minWidth","_ref19","minHeight","_ref20","borderRadius","FlexWrapper","attrs","props","_templateObject2","FlexTight","_templateObject3","FlexTightStyled","style","text","border","_templateObject4"],"mappings":"uKA2BA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAE9FC,EAAOC,EAAKC,EAAOC,IAAGC,IAAAA,EAAAC,kbAGfC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,KAAK,IACnEC,IAAA,IAACC,KAAEA,GAA0BD,EAAA,YAAeE,IAATD,EAAqBA,EAAO,GAAG,IAC7DE,IAAA,IAACC,SAAEA,GAA8BD,EAAA,YAAmBD,IAAbE,EAAyBA,EAAW,GAAG,IAC5EC,IAAA,IAACC,WAAEA,GAAgCD,EAAA,YAAqBH,IAAfI,EAA2BA,EAAa,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,QAAQ,IAChEC,IAAA,IAACC,IAAEA,GAAyBD,EAAA,YAAcT,IAARU,EAAoBA,EAAM,GAAG,IACxDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IACrDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAKzB,EAAiB0B,IAAY,YAAY,IAClFC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAK3B,EAAiB4B,IAAU,YAAY,IAC3EC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC9DC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,GAAG,IAChDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAKC,GAAW,GAAG,IACrDC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAKC,GAAS,MAAM,IACjDC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,MAAM,IACjDC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,MAAM,IACvDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAOC,GAAyB,MAAbA,EAAoBA,EAAW,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,GAAG,IACpDC,IAAA,IAACC,aAAEA,GAAkCD,EAAA,OAAKC,GAAgB,SAAS,KAIzEC,EAAc9C,EAAKC,EAAOF,GAAMgD,OAAOC,IAClD,CACEf,MAAOe,EAAMf,OAAS,OACtBE,OAAQa,EAAMb,QAAU,OACxBZ,QAASyB,EAAMzB,SAAW,SAC1BE,MAAOuB,EAAMvB,OAAS,YACnBuB,KANyB/C,CAQ9BgD,IAAAA,EAAA7C,EAAA,CAAA,QAEW8C,EAAYlD,EAAKC,EAAOF,GAAMgD,OAAOC,IAA+B,CAC/Ef,MAAO,aACJe,KAFyB/C,CAG3BkD,IAAAA,EAAA/C,EAAA,CAAA,QAEUgD,EAAkBpD,EAAKC,EAAOF,GAAMgD,OAAOC,IAA+B,CACrFf,MAAO,UACPoB,MAAO,CACLC,KAAM,OACNvB,QAAS,OACTwB,OAAQ,sBAEPP,KAP+B/C,CAQjCuD,IAAAA,EAAApD,EAAA,CAAA"}

package/dist/ui/esm/src/core/ui/components/container/Placeholder.js

@@ -1,2 +1,2 @@
-import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import r from"styled-components";import{memo as o}from"react";import{FlexWrapper as l}from"./Flex.js";const s=o((r=>{let{title:o,border:l,background:s,onClick:t,cssProp:a,children:n,...i}=r;return React.createElement(c,e({onClick:t},i,{$_css:l||"border: 1px solid #999999;",$_css2:s||"background-color: rgba(0, 120, 255, 0.2);",$_css3:a}),o&&React.createElement("h2",null,o),n&&n)}));s.displayName="Placeholder";var c=r(l).withConfig({displayName:"Placeholder___StyledFlexWrapper",componentId:"sc-ozx0bx-0"})([""," "," ",""],(e=>e.$_css),(e=>e.$_css2),(e=>e.$_css3));export{s as Placeholder};
+import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as r}from"react";import{FlexWrapper as o}from"./Flex.js";const c=r((r=>{let{title:c,border:l,background:t,onClick:n,cssProp:a,children:s,...i}=r;return React.createElement(o,e({css:"\n      ".concat(l||"border: 1px solid #999999;","\n      ").concat(t||"background-color: rgba(0, 120, 255, 0.2);","\n      ").concat(a,"\n    "),onClick:n},i),c&&React.createElement("h2",null,c),s&&s)}));c.displayName="Placeholder";export{c as Placeholder};
 //# sourceMappingURL=Placeholder.js.map

package/dist/ui/esm/src/core/ui/components/container/Placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.js","sources":["../../../../../../../../src/core/ui/components/container/Placeholder.tsx"],"sourcesContent":["import { FC, memo, PropsWithChildren } from 'react'\n\nimport { FlexWrapper, FlexProps } from './Flex'\n\nexport type PlaceholderProps = FlexProps & PropsWithChildren<unknown> & {\n  title?: string\n  cssProp?: string\n  background?: string\n  border?: string\n  onClick?: () => void\n}\n\nexport const Placeholder: FC<PlaceholderProps>\n= memo<PlaceholderProps>(({ title, border, background, onClick, cssProp, children, ...props }: PlaceholderProps) => (\n  <FlexWrapper\n    css={`\n      ${border || 'border: 1px solid #999999;'}\n      ${background || 'background-color: rgba(0, 120, 255, 0.2);'}\n      ${cssProp}\n    `}\n    onClick={onClick}\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    {...props}\n  >\n    {title && (<h2>{title}</h2>)}\n    {children && children}\n  </FlexWrapper>\n))\n\nPlaceholder.displayName = 'Placeholder'\n"],"names":["Placeholder","memo","_ref","title","border","background","onClick","cssProp","children","props","React","createElement","_StyledFlexWrapper","_extends","$_css","$_css2","$_css3","displayName","_styled","FlexWrapper","withConfig","componentId","p"],"mappings":"qLAYaA,MAAAA,EACXC,GAAuBC,IAAA,IAACC,MAAEA,EAAKC,OAAEA,EAAMC,WAAEA,EAAUC,QAAEA,EAAOC,QAAEA,EAAOC,SAAEA,KAAaC,GAAyBP,EAAA,OAC7GQ,MAAAC,cAAAC,EAAAC,EAAA,CAMEP,QAASA,GAELG,EAAK,CAAAK,MANLV,GAAU,6BAA4BW,OACtCV,GAAc,4CAA2CW,OACzDT,IAMHJ,GAAUO,MAAAC,cAAA,KAAA,KAAKR,GACfK,GAAYA,EACD,IAGhBR,EAAYiB,YAAc,cAAa,IAAAL,EAAAM,EAAAC,GAAAC,WAAA,CAAAH,YAAA,kCAAAI,YAAA,eAAAH,CAAA,CAAA,GAAA,IAAA,IAAA,KAAAI,GAAAA,EAAAR,QAAAQ,GAAAA,EAAAP,SAAAO,GAAAA,EAAAN"}
+{"version":3,"file":"Placeholder.js","sources":["../../../../../../../../src/core/ui/components/container/Placeholder.tsx"],"sourcesContent":["import { FC, memo, PropsWithChildren } from 'react'\n\nimport { FlexWrapper, FlexProps } from './Flex'\n\nexport type PlaceholderProps = FlexProps & PropsWithChildren<unknown> & {\n  title?: string\n  cssProp?: string\n  background?: string\n  border?: string\n  onClick?: () => void\n}\n\nexport const Placeholder: FC<PlaceholderProps>\n= memo<PlaceholderProps>(({ title, border, background, onClick, cssProp, children, ...props }: PlaceholderProps) => (\n  <FlexWrapper\n    css={`\n      ${border || 'border: 1px solid #999999;'}\n      ${background || 'background-color: rgba(0, 120, 255, 0.2);'}\n      ${cssProp}\n    `}\n    onClick={onClick}\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    {...props}\n  >\n    {title && (<h2>{title}</h2>)}\n    {children && children}\n  </FlexWrapper>\n))\n\nPlaceholder.displayName = 'Placeholder'\n"],"names":["Placeholder","memo","_ref","title","border","background","onClick","cssProp","children","props","React","createElement","FlexWrapper","_extends","css","concat","displayName"],"mappings":"oJAYaA,MAAAA,EACXC,GAAuBC,IAAA,IAACC,MAAEA,EAAKC,OAAEA,EAAMC,WAAEA,EAAUC,QAAEA,EAAOC,QAAEA,EAAOC,SAAEA,KAAaC,GAAyBP,EAAA,OAC7GQ,MAAAC,cAACC,EAAWC,EAAA,CACVC,eAAGC,OACCX,GAAU,6BAA4BW,YAAAA,OACtCV,GAAc,4CAA2C,YAAAU,OACzDR,EACF,UACFD,QAASA,GAELG,GAEHN,GAAUO,MAAAC,cAAKR,KAAAA,KAAAA,GACfK,GAAYA,EACD,IAGhBR,EAAYgB,YAAc"}

package/dist/ui/esm/src/core/ui/components/field/Field.js

@@ -1,2 +1,2 @@
-import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import t from"styled-components";import{memo as a,useCallback as n,useMemo as o}from"react";let l=()=>"#000000";const i=e=>{l=e};let c=a((function(){return React.createElement("span",null)}));const r=e=>{c=e},s=t.div.withConfig({displayName:"Field__FieldWrapper",componentId:"sc-i8c0jy-0"})(["opacity:",";pointer-events:",";flex:1 1 auto;width:100%;@media (min-width:400px){flex:1;}.label{font-size:0.8rem !important;font-weight:normal;}.help{text-align:left;}.mainControl{flex:1;border-radius:6px;box-shadow:0 0 6px 1px rgba(0,0,0,0.06);will-change:box-shadow;transition:box-shadow 250ms ease-in-out;&:hover{box-shadow:0 0 8px 2px rgba(0,0,0,0.1);}}button{box-shadow:0 0 8px 2px rgba(0,0,0,0.1);}.select{width:100%;flex:1;&::after{border-color:#000000 !important;}}.icon{&.is-action{cursor:pointer;pointer-events:initial !important;}}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}input[type=number]{-moz-appearance:textfield;}.input[type=date]::-webkit-calendar-picker-indicator{opacity:0;-webkit-appearance:none;position:absolute;left:0;top:0;width:40px;height:100%;margin:0;padding:0;cursor:pointer;}textarea{resize:none;}"],(e=>{let{disabled:t,userDisabled:a}=e;return t||a?.5:1}),(e=>{let{disabled:t,userDisabled:a}=e;return t||a?"none":"auto"}));var p=t(s).withConfig({displayName:"Field___StyledFieldWrapper",componentId:"sc-i8c0jy-1"})(["",""],(e=>e.$_css));const d=a((function(t){let{options:a,value:n,inputRef:o,...l}=t;return React.createElement("div",{className:"select"},React.createElement("select",e({},l,{ref:o,defaultValue:n}),null==a?void 0:a.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),m=t.input.withConfig({displayName:"Field__InputComponent",componentId:"sc-i8c0jy-2"})([""]),u=t.textarea.withConfig({displayName:"Field__TextAreaComponent",componentId:"sc-i8c0jy-3"})([""]),f=t.label.withConfig({displayName:"Field__StyledFieldLabel",componentId:"sc-i8c0jy-4"})(["text-align:left;"]),h=a((t=>{let{label:a,name:i,type:r="text",value:s,defaultValue:h,placeholder:b,inputRef:g,error:x,disabled:y,userDisabled:v,withoutComponent:w,helpTextInfo:N,helpText:R,children:C,iconLeft:E,iconRight:_,addon:F,className:k,onChange:I,onChangeInner:j,onBlur:D,onFocus:B,rightIconClick:z,leftIconClick:L,options:S,css:T,...V}=t,K=m;C||"textarea"!==r||(K=u);const W=n((e=>{var t;v?null==e||null===(t=e.preventDefault)||void 0===t||t.call(e):B&&B(e)}),[v,B]),$=n((e=>{v||(j&&null!=e&&e.target?(e.target.value=j(e.target.value),I&&I(e)):I&&I(e))}),[j,I,v]),A=o((()=>void 0===s?{defaultValue:h}:{value:s}),[s,h]);return React.createElement(p,{className:"field ".concat(k),error:x,disabled:y,userDisabled:v,$_css:T},React.createElement(f,{htmlFor:i,className:"label"},a),React.createElement("div",{className:"field ".concat(F?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(E&&!w?"has-icons-left":""," ").concat(_?"has-icons-right":"")},!w&&(C||"select"!==r&&!S?!C&&React.createElement(K,e({name:i,id:i,ref:g,className:"input ".concat(x?"is-danger":""),type:r,placeholder:b},A,{onChange:$,onBlur:D,onFocus:W,onKeyDown:W,autoComplete:"off",disabled:y},V)):React.createElement(d,e({name:i,id:i,inputRef:g,className:"input ".concat(x?"is-danger":""),type:"select",placeholder:b,value:s,options:S,onChange:I,onBlur:D,onFocus:W,onKeyDown:W,autoComplete:"off",disabled:y},V))),E&&!w&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(L?"is-action":""),onClick:L},React.createElement(c,{iconName:E,color:l})),_&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(z?"is-action":""),onClick:z},React.createElement(c,{iconName:_,color:l})),C&&C),F&&F),N&&React.createElement("p",{className:"help"},N),R&&React.createElement("p",{className:"help ".concat(x?"is-danger":"")},R))}));h.displayName="Field";export{h as Field,s as FieldWrapper,d as Select,i as setIconColor,r as setIconComponent};
+import{taggedTemplateLiteral as e,extends as n}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,useCallback as a,useMemo as l}from"react";import o from"styled-components";var i,c,r,s;let p=()=>"#000000";const d=e=>{p=e};let u=t((function(){return React.createElement("span",null)}));const m=e=>{u=e},f=o.div(i||(i=e(["\n  opacity: ",";\n  pointer-events: ",";\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n"])),(e=>{let{disabled:n,userDisabled:t}=e;return n||t?.5:1}),(e=>{let{disabled:n,userDisabled:t}=e;return n||t?"none":"auto"})),b=t((function(e){let{options:t,value:a,inputRef:l,...o}=e;return React.createElement("div",{className:"select"},React.createElement("select",n({},o,{ref:l,defaultValue:a}),null==t?void 0:t.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),h=o.input(c||(c=e([""]))),g=o.textarea(r||(r=e([""]))),x=o.label(s||(s=e(["\n  text-align: left;\n"]))),v=t((e=>{let{label:t,name:o,type:i="text",value:c,defaultValue:r,placeholder:s,inputRef:d,error:m,disabled:v,userDisabled:R,withoutComponent:w,helpTextInfo:E,helpText:N,children:y,iconLeft:C,iconRight:k,addon:D,className:F,onChange:B,onChangeInner:I,onBlur:j,onFocus:z,rightIconClick:L,leftIconClick:T,options:V,css:K,...O}=e,S=h;y||"textarea"!==i||(S=g);const _=a((e=>{var n;R?null==e||null===(n=e.preventDefault)||void 0===n||n.call(e):z&&z(e)}),[R,z]),H=a((e=>{R||(I&&null!=e&&e.target?(e.target.value=I(e.target.value),B&&B(e)):B&&B(e))}),[I,B,R]),J=l((()=>void 0===c?{defaultValue:r}:{value:c}),[c,r]);return React.createElement(f,{className:"field ".concat(F),error:m,disabled:v,userDisabled:R,css:K},React.createElement(x,{htmlFor:o,className:"label"},t),React.createElement("div",{className:"field ".concat(D?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(C&&!w?"has-icons-left":""," ").concat(k?"has-icons-right":"")},!w&&(y||"select"!==i&&!V?!y&&React.createElement(S,n({name:o,id:o,ref:d,className:"input ".concat(m?"is-danger":""),type:i,placeholder:s},J,{onChange:H,onBlur:j,onFocus:_,onKeyDown:_,autoComplete:"off",disabled:v},O)):React.createElement(b,n({name:o,id:o,inputRef:d,className:"input ".concat(m?"is-danger":""),type:"select",placeholder:s,value:c,options:V,onChange:B,onBlur:j,onFocus:_,onKeyDown:_,autoComplete:"off",disabled:v},O))),C&&!w&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(T?"is-action":""),onClick:T},React.createElement(u,{iconName:C,color:p})),k&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(L?"is-action":""),onClick:L},React.createElement(u,{iconName:k,color:p})),y&&y),D&&D),E&&React.createElement("p",{className:"help"},E),N&&React.createElement("p",{className:"help ".concat(m?"is-danger":"")},N))}));v.displayName="Field";export{v as Field,f as FieldWrapper,b as Select,d as setIconColor,m as setIconComponent};
 //# sourceMappingURL=Field.js.map

package/dist/ui/esm/src/core/ui/components/field/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sources":["../../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren } from 'react'\nimport styled from 'styled-components'\n\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\nexport const FieldWrapper: FC<FileWrapperProps> = styled.div<FileWrapperProps>`\n  opacity: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 0.5 : 1)};\n  pointer-events: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 'none' : 'auto')};\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n`\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  css?: string\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\n\nconst InputComponent = styled.input``\nconst TextAreaComponent = styled.textarea``\nconst StyledFieldLabel = styled.label`\n  text-align: left;\n`\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  css,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <FieldWrapper\n      className={`field ${className}`}\n      error={error}\n      disabled={disabled}\n      userDisabled={userDisabled}\n      css={css}\n    >\n      <StyledFieldLabel htmlFor={name} className='label'>{label}</StyledFieldLabel>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </FieldWrapper>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","FieldWrapper","styled","div","withConfig","displayName","componentId","_ref","disabled","userDisabled","_ref2","_StyledFieldWrapper","p","$_css","Select","_ref3","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","InputComponent","input","TextAreaComponent","textarea","StyledFieldLabel","Field","_ref4","name","type","placeholder","error","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","css","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","htmlFor","id","onKeyDown","autoComplete","onClick","iconName"],"mappings":"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"}
+{"version":3,"file":"Field.js","sources":["../../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren } from 'react'\nimport styled from 'styled-components'\n\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\nexport const FieldWrapper: FC<FileWrapperProps> = styled.div<FileWrapperProps>`\n  opacity: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 0.5 : 1)};\n  pointer-events: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 'none' : 'auto')};\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n`\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  css?: string\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\n\nconst InputComponent = styled.input``\nconst TextAreaComponent = styled.textarea``\nconst StyledFieldLabel = styled.label`\n  text-align: left;\n`\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  css,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <FieldWrapper\n      className={`field ${className}`}\n      error={error}\n      disabled={disabled}\n      userDisabled={userDisabled}\n      css={css}\n    >\n      <StyledFieldLabel htmlFor={name} className='label'>{label}</StyledFieldLabel>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </FieldWrapper>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","FieldWrapper","styled","div","_templateObject","_taggedTemplateLiteral","_ref","disabled","userDisabled","_ref2","Select","_ref3","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","InputComponent","input","_templateObject2","TextAreaComponent","textarea","_templateObject3","StyledFieldLabel","_templateObject4","Field","_ref4","name","type","placeholder","error","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","css","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","displayName"],"mappings":"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"}

package/dist/ui/esm/src/core/ui/components/icon/IconWC.js

@@ -1,2 +1,2 @@
-import"../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import{ced as t,resolveAttributes as i}from"../../../utils/webComponents/webComponent.utils.js";import e from"./icon.module.scss.js";var s;const n=document.createElement("template");n.innerHTML='<span class="icon-base"></span>';let o=t("icon-base")(s=class t extends HTMLElement{constructor(){super(...arguments),this.content=void 0,this.mainElement=void 0,this.iconUrl=void 0,this.minWidth=void 0,this.minHeight=void 0,this.width=void 0,this.height=void 0,this.size=void 0,this.fontSize=void 0,this.color=void 0,this.render=()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(e["icon-base-parent"]),this.mainElement.classList.add(e["icon-base"]);const t={"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem",...this.fontSize?{"font-size":this.fontSize||"unset"}:{},...this.iconUrl?{"--icon-url":"url(".concat(this.iconUrl,")")}:{},...this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color}};this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(t).map((t=>{let[i,e]=t;return"".concat(i,": ").concat(e,";")})).join(" "))}}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=n.innerHTML,i(this,t.observedAttributes),this.render()}attributeChangedCallback(t,i,e){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof e&&(this.classList.remove(e),this.classList.add(e)),this.color||(this.color="currentColor"),this[t]=e||"",this.render()}})||s;const h={ESIconBase:o};export{o as ESIcon,h as ESIconBase};
+import{defineProperty as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import{ced as i,resolveAttributes as e}from"../../../utils/webComponents/webComponent.utils.js";import s from"./icon.module.scss.js";var n;const o=document.createElement("template");o.innerHTML='<span class="icon-base"></span>';let r=i("icon-base")(n=class i extends HTMLElement{constructor(){super(...arguments),t(this,"render",(()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(s["icon-base-parent"]),this.mainElement.classList.add(s["icon-base"]);const t={"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem",...this.fontSize?{"font-size":this.fontSize||"unset"}:{},...this.iconUrl?{"--icon-url":"url(".concat(this.iconUrl,")")}:{},...this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color}};this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(t).map((t=>{let[i,e]=t;return"".concat(i,": ").concat(e,";")})).join(" "))}))}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=o.innerHTML,e(this,i.observedAttributes),this.render()}attributeChangedCallback(t,i,e){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof e&&(this.classList.remove(e),this.classList.add(e)),this.color||(this.color="currentColor"),this[t]=e||"",this.render()}})||n;const c={ESIconBase:r};export{r as ESIcon,c as ESIconBase};
 //# sourceMappingURL=IconWC.js.map

package/dist/ui/esm/src/core/ui/components/icon/IconWC.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconWC.js","sources":["../../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n  iconUrl?: string\n  minWidth?: string\n  minHeight?: string\n  width?: string\n  height?: string\n  size?: string\n  fontSize?: string\n  color?: string\n  className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n  content: string | null\n\n  mainElement: HTMLElement\n\n  iconUrl?: string | null\n\n  minWidth?: string | null\n\n  minHeight?: string | null\n\n  width?: string | null\n\n  height?: string | null\n\n  size?: string | null\n\n  fontSize?: string | null\n\n  color?: string | null\n\n  static get observedAttributes() {\n    return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n  }\n\n  connectedCallback() {\n    if (this.content || this.innerHTML) {\n      this.content = this.content || this.innerHTML || this.getAttribute('content')\n    }\n\n    this.innerHTML = template.innerHTML\n\n    resolveAttributes(this, ESIcon.observedAttributes)\n\n    this.render()\n  }\n\n  attributeChangedCallback(attrName: string, oldVal: string | number | null, newVal: string | number | null) {\n    if (attrName === 'className' || attrName === 'classname' || attrName === 'class') {\n      if (typeof newVal === 'string') {\n        this.classList.remove(newVal as string)\n        this.classList.add(newVal as string)\n      }\n    }\n    if (!this.color) {\n      this.color = 'currentColor'\n    }\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this[attrName] = (newVal as string) || ''\n    this.render()\n  }\n\n  render = () => {\n    this.mainElement = this.mainElement || this.querySelector('.icon-base') as HTMLElement\n    if (!this.mainElement) {\n      return\n    }\n    this.classList.add(classes['icon-base-parent'])\n    this.mainElement.classList.add(classes['icon-base'])\n\n    const styles = {\n      '--min-width': this.minWidth || this.size || this.width || 'auto',\n      '--min-height': this.minHeight || this.size || this.height || 'auto',\n      '--width': this.size || this.width || '1rem',\n      '--height': this.size || this.height || '1rem',\n      ...(this.fontSize ? { 'font-size': this.fontSize || 'unset' } : {}),\n      ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n      ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n    }\n\n    this.mainElement.innerHTML = this.iconUrl ? '' : (this.content || '')\n\n    this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      'icon-base': any\n    }\n  }\n}\n\nexport const ESIconBase = {\n  ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","this","content","mainElement","iconUrl","minWidth","minHeight","width","height","size","fontSize","color","render","querySelector","classList","add","classes","styles","concat","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"+NAKA,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,KACtCC,aAAO,EAAAD,KAEPE,iBAAW,EAAAF,KAEXG,aAAO,EAAAH,KAEPI,cAAQ,EAAAJ,KAERK,eAAS,EAAAL,KAETM,WAAK,EAAAN,KAELO,YAAM,EAAAP,KAENQ,UAAI,EAAAR,KAEJS,cAAQ,EAAAT,KAERU,WAAK,EAAAV,KAkCLW,OAAS,KAEP,GADAX,KAAKE,YAAcF,KAAKE,aAAeF,KAAKY,cAAc,eACrDZ,KAAKE,YACR,OAEFF,KAAKa,UAAUC,IAAIC,EAAQ,qBAC3Bf,KAAKE,YAAYW,UAAUC,IAAIC,EAAQ,cAEvC,MAAMC,EAAS,CACb,cAAehB,KAAKI,UAAYJ,KAAKQ,MAAQR,KAAKM,OAAS,OAC3D,eAAgBN,KAAKK,WAAaL,KAAKQ,MAAQR,KAAKO,QAAU,OAC9D,UAAWP,KAAKQ,MAAQR,KAAKM,OAAS,OACtC,WAAYN,KAAKQ,MAAQR,KAAKO,QAAU,UACpCP,KAAKS,SAAW,CAAE,YAAaT,KAAKS,UAAY,SAAY,MAC5DT,KAAKG,QAAU,CAAE,aAAYc,OAAAA,OAASjB,KAAKG,QAAO,MAAQ,MAC1DH,KAAKG,QAAU,CAAE,eAAgBH,KAAKU,OAAU,CAAE,uBAAwBV,KAAKU,QAGrFV,KAAKE,YAAYX,UAAYS,KAAKG,QAAU,GAAMH,KAAKC,SAAW,GAElED,KAAKE,YAAYgB,aAAa,QAASC,OAAOC,QAAQJ,GAAQK,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,MAAA,GAAAL,OAAQM,EAAGN,MAAAA,OAAKO,EAAK,IAAA,IAAKC,KAAK,KAAK,CACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,IACM3B,KAAKC,SAAWD,KAAKT,aACvBS,KAAKC,QAAUD,KAAKC,SAAWD,KAAKT,WAAaS,KAAK4B,aAAa,YAGrE5B,KAAKT,UAAYH,EAASG,UAE1BsC,EAAkB7B,KAAMR,EAAOkC,oBAE/B1B,KAAKW,QACP,CAEAmB,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,IACTjC,KAAKa,UAAUqB,OAAOD,GACtBjC,KAAKa,UAAUC,IAAImB,IAGlBjC,KAAKU,QACRV,KAAKU,MAAQ,gBAIfV,KAAK+B,GAAaE,GAAqB,GACvCjC,KAAKW,QACP,KAwBDhB,EAWM,MAAMwC,EAAa,CACxBA,WAAY3C"}
+{"version":3,"file":"IconWC.js","sources":["../../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n  iconUrl?: string\n  minWidth?: string\n  minHeight?: string\n  width?: string\n  height?: string\n  size?: string\n  fontSize?: string\n  color?: string\n  className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n  content: string | null\n\n  mainElement: HTMLElement\n\n  iconUrl?: string | null\n\n  minWidth?: string | null\n\n  minHeight?: string | null\n\n  width?: string | null\n\n  height?: string | null\n\n  size?: string | null\n\n  fontSize?: string | null\n\n  color?: string | null\n\n  static get observedAttributes() {\n    return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n  }\n\n  connectedCallback() {\n    if (this.content || this.innerHTML) {\n      this.content = this.content || this.innerHTML || this.getAttribute('content')\n    }\n\n    this.innerHTML = template.innerHTML\n\n    resolveAttributes(this, ESIcon.observedAttributes)\n\n    this.render()\n  }\n\n  attributeChangedCallback(attrName: string, oldVal: string | number | null, newVal: string | number | null) {\n    if (attrName === 'className' || attrName === 'classname' || attrName === 'class') {\n      if (typeof newVal === 'string') {\n        this.classList.remove(newVal as string)\n        this.classList.add(newVal as string)\n      }\n    }\n    if (!this.color) {\n      this.color = 'currentColor'\n    }\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this[attrName] = (newVal as string) || ''\n    this.render()\n  }\n\n  render = () => {\n    this.mainElement = this.mainElement || this.querySelector('.icon-base') as HTMLElement\n    if (!this.mainElement) {\n      return\n    }\n    this.classList.add(classes['icon-base-parent'])\n    this.mainElement.classList.add(classes['icon-base'])\n\n    const styles = {\n      '--min-width': this.minWidth || this.size || this.width || 'auto',\n      '--min-height': this.minHeight || this.size || this.height || 'auto',\n      '--width': this.size || this.width || '1rem',\n      '--height': this.size || this.height || '1rem',\n      ...(this.fontSize ? { 'font-size': this.fontSize || 'unset' } : {}),\n      ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n      ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n    }\n\n    this.mainElement.innerHTML = this.iconUrl ? '' : (this.content || '')\n\n    this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      'icon-base': any\n    }\n  }\n}\n\nexport const ESIconBase = {\n  ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","_defineProperty","this","mainElement","querySelector","classList","add","classes","styles","minWidth","size","width","minHeight","height","fontSize","iconUrl","concat","color","content","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","render","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"qTAKA,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,iBAqD7B,KAEP,GADAC,KAAKC,YAAcD,KAAKC,aAAeD,KAAKE,cAAc,eACrDF,KAAKC,YACR,OAEFD,KAAKG,UAAUC,IAAIC,EAAQ,qBAC3BL,KAAKC,YAAYE,UAAUC,IAAIC,EAAQ,cAEvC,MAAMC,EAAS,CACb,cAAeN,KAAKO,UAAYP,KAAKQ,MAAQR,KAAKS,OAAS,OAC3D,eAAgBT,KAAKU,WAAaV,KAAKQ,MAAQR,KAAKW,QAAU,OAC9D,UAAWX,KAAKQ,MAAQR,KAAKS,OAAS,OACtC,WAAYT,KAAKQ,MAAQR,KAAKW,QAAU,UACpCX,KAAKY,SAAW,CAAE,YAAaZ,KAAKY,UAAY,SAAY,MAC5DZ,KAAKa,QAAU,CAAE,aAAYC,OAAAA,OAASd,KAAKa,QAAO,MAAQ,MAC1Db,KAAKa,QAAU,CAAE,eAAgBb,KAAKe,OAAU,CAAE,uBAAwBf,KAAKe,QAGrFf,KAAKC,YAAYX,UAAYU,KAAKa,QAAU,GAAMb,KAAKgB,SAAW,GAElEhB,KAAKC,YAAYgB,aAAa,QAASC,OAAOC,QAAQb,GAAQc,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,MAAA,GAAAP,OAAQQ,EAAGR,MAAAA,OAAKS,EAAK,IAAA,IAAKC,KAAK,KAAK,GACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,IACM1B,KAAKgB,SAAWhB,KAAKV,aACvBU,KAAKgB,QAAUhB,KAAKgB,SAAWhB,KAAKV,WAAaU,KAAK2B,aAAa,YAGrE3B,KAAKV,UAAYH,EAASG,UAE1BsC,EAAkB5B,KAAMT,EAAOkC,oBAE/BzB,KAAK6B,QACP,CAEAC,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,IACTjC,KAAKG,UAAU+B,OAAOD,GACtBjC,KAAKG,UAAUC,IAAI6B,IAGlBjC,KAAKe,QACRf,KAAKe,MAAQ,gBAIff,KAAK+B,GAAaE,GAAqB,GACvCjC,KAAK6B,QACP,KAwBDnC,EAWM,MAAMyC,EAAa,CACxBA,WAAY5C"}

package/dist/ui/src/core/ui/components/container/Flex.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=t(require("styled-components"));const i={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},l=e=>e&&i[e]||e,n=e.memo(r.default.div.withConfig({displayName:"Flex",componentId:"sc-19vq3db-0"})(["display:flex;position:relative;flex-direction:",";flex:",";flex-grow:",";flex-shrink:",";flex-basis:",";flex-wrap:",";gap:",";text-align:",";justify-content:",";align-items:",";align-self:",";margin:",";padding:",";width:",";height:",";max-width:",";max-height:",";min-width:",";min-height:",";border-radius:",";"],(e=>{let{direction:t}=e;return t||"row"}),(e=>{let{flex:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexGrow:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexShrink:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexBasis:t}=e;return t||"auto"}),(e=>{let{flexWrap:t}=e;return t||"nowrap"}),(e=>{let{gap:t}=e;return void 0!==t?t:"0"}),(e=>{let{alignText:t}=e;return t||"left"}),(e=>{let{justify:t}=e;return l(t)||"flex-start"}),(e=>{let{align:t}=e;return l(t)||"flex-start"}),(e=>{let{alignSelf:t}=e;return t||"auto"}),(e=>{let{margin:t}=e;return t||"0"}),(e=>{let{padding:t}=e;return t||"0"}),(e=>{let{width:t}=e;return t||"auto"}),(e=>{let{height:t}=e;return t||"auto"}),(e=>{let{maxWidth:t}=e;return t||"none"}),(e=>{let{maxHeight:t}=e;return t||"none"}),(e=>{let{minWidth:t}=e;return t||"0"===t?t:"0"}),(e=>{let{minHeight:t}=e;return t||"0"}),(e=>{let{borderRadius:t}=e;return t||"initial"}))),a=e.memo(r.default(n).attrs((e=>({width:e.width||"100%",height:e.height||"100%",justify:e.justify||"center",align:e.align||"center",...e}))).withConfig({displayName:"Flex__FlexWrapper",componentId:"sc-19vq3db-1"})([""])),d=e.memo(r.default(n).attrs((e=>({width:"initial",...e}))).withConfig({displayName:"Flex__FlexTight",componentId:"sc-19vq3db-2"})([""])),o=e.memo(r.default(n).attrs((e=>({width:"initial",style:{text:"blue",padding:"1rem",border:"1px solid green"},...e}))).withConfig({displayName:"Flex__FlexTightStyled",componentId:"sc-19vq3db-3"})([""]));exports.Flex=n,exports.FlexTight=d,exports.FlexTightStyled=o,exports.FlexWrapper=a;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n,l,i,a,d=r(require("styled-components"));const u={start:"flex-start","flex-start":"flex-start",end:"flex-end","flex-end":"flex-end"},o=e=>e&&u[e]||e,s=t.memo(d.default.div(n||(n=e.taggedTemplateLiteral(["\n  display: flex;\n  position: relative;\n  flex-direction: ",";\n  flex: ",";\n  flex-grow: ",";\n  flex-shrink: ",";\n  flex-basis: ",";\n  flex-wrap: ",";\n  gap: ",";\n  text-align: ",";\n  justify-content: ",";\n  align-items: ",";\n  align-self: ",";\n  margin: ",";\n  padding: ",";\n  width: ",";\n  height: ",";\n  max-width: ",";\n  max-height: ",";\n  min-width: ",";\n  min-height: ",";\n  border-radius: ",";\n"])),(e=>{let{direction:t}=e;return t||"row"}),(e=>{let{flex:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexGrow:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexShrink:t}=e;return void 0!==t?t:"0"}),(e=>{let{flexBasis:t}=e;return t||"auto"}),(e=>{let{flexWrap:t}=e;return t||"nowrap"}),(e=>{let{gap:t}=e;return void 0!==t?t:"0"}),(e=>{let{alignText:t}=e;return t||"left"}),(e=>{let{justify:t}=e;return o(t)||"flex-start"}),(e=>{let{align:t}=e;return o(t)||"flex-start"}),(e=>{let{alignSelf:t}=e;return t||"auto"}),(e=>{let{margin:t}=e;return t||"0"}),(e=>{let{padding:t}=e;return t||"0"}),(e=>{let{width:t}=e;return t||"auto"}),(e=>{let{height:t}=e;return t||"auto"}),(e=>{let{maxWidth:t}=e;return t||"none"}),(e=>{let{maxHeight:t}=e;return t||"none"}),(e=>{let{minWidth:t}=e;return t||"0"===t?t:"0"}),(e=>{let{minHeight:t}=e;return t||"0"}),(e=>{let{borderRadius:t}=e;return t||"initial"}))),x=t.memo(d.default(s).attrs((e=>({width:e.width||"100%",height:e.height||"100%",justify:e.justify||"center",align:e.align||"center",...e})))(l||(l=e.taggedTemplateLiteral([""])))),f=t.memo(d.default(s).attrs((e=>({width:"initial",...e})))(i||(i=e.taggedTemplateLiteral([""])))),g=t.memo(d.default(s).attrs((e=>({width:"initial",style:{text:"blue",padding:"1rem",border:"1px solid green"},...e})))(a||(a=e.taggedTemplateLiteral([""]))));exports.Flex=s,exports.FlexTight=f,exports.FlexTightStyled=g,exports.FlexWrapper=x;
 //# sourceMappingURL=Flex.js.map

package/dist/ui/src/core/ui/components/container/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../../../../../src/core/ui/components/container/Flex.ts"],"sourcesContent":["import { memo } from 'react'\nimport styled from 'styled-components'\n\nexport type FlexProps = {\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\nexport const Flex = memo(styled.div<FlexProps>`\n  display: flex;\n  position: relative;\n  flex-direction: ${({ direction }: Partial<FlexProps>) => direction || 'row'};\n  flex: ${({ flex }: Partial<FlexProps>) => (flex !== undefined ? flex : '0')};\n  flex-grow: ${({ flexGrow }: Partial<FlexProps>) => (flexGrow !== undefined ? flexGrow : '0')};\n  flex-shrink: ${({ flexShrink }: Partial<FlexProps>) => (flexShrink !== undefined ? flexShrink : '0')};\n  flex-basis: ${({ flexBasis }: Partial<FlexProps>) => flexBasis || 'auto'};\n  flex-wrap: ${({ flexWrap }: Partial<FlexProps>) => flexWrap || 'nowrap'};\n  gap: ${({ gap }: Partial<FlexProps>) => (gap !== undefined ? gap : '0')};\n  text-align: ${({ alignText }: Partial<FlexProps>) => alignText || 'left'};\n  justify-content: ${({ justify }: Partial<FlexProps>) => resolveFlexProps(justify) || 'flex-start'};\n  align-items: ${({ align }: Partial<FlexProps>) => resolveFlexProps(align) || 'flex-start'};\n  align-self: ${({ alignSelf }: Partial<FlexProps>) => alignSelf || 'auto'};\n  margin: ${({ margin }: Partial<FlexProps>) => margin || '0'};\n  padding: ${({ padding }: Partial<FlexProps>) => padding || '0'};\n  width: ${({ width }: Partial<FlexProps>) => width || 'auto'};\n  height: ${({ height }: Partial<FlexProps>) => height || 'auto'};\n  max-width: ${({ maxWidth }: Partial<FlexProps>) => maxWidth || 'none'};\n  max-height: ${({ maxHeight }: Partial<FlexProps>) => maxHeight || 'none'};\n  min-width: ${({ minWidth }: Partial<FlexProps>) => ((minWidth || minWidth === '0') ? minWidth : '0')};\n  min-height: ${({ minHeight }: Partial<FlexProps>) => minHeight || '0'};\n  border-radius: ${({ borderRadius }: Partial<FlexProps>) => borderRadius || 'initial'};\n`)\n\n// default flex centralized, 100% width and height\nexport const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n  {\n    width: props.width || '100%',\n    height: props.height || '100%',\n    justify: props.justify || 'center',\n    align: props.align || 'center',\n    ...props,\n  }\n))``)\n\nexport const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  ...props,\n}))``)\n\nexport const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  style: {\n    text: 'blue',\n    padding: '1rem',\n    border: '1px solid green',\n  },\n  ...props,\n}))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","Flex","memo","styled","div","withConfig","displayName","componentId","_ref","direction","_ref2","flex","undefined","_ref3","flexGrow","_ref4","flexShrink","_ref5","flexBasis","_ref6","flexWrap","_ref7","gap","_ref8","alignText","_ref9","justify","_ref10","align","_ref11","alignSelf","_ref12","margin","_ref13","padding","_ref14","width","_ref15","height","_ref16","maxWidth","_ref17","maxHeight","_ref18","minWidth","_ref19","minHeight","_ref20","borderRadius","FlexWrapper","attrs","props","FlexTight","FlexTightStyled","style","text","border"],"mappings":"yMA2BA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAE9FC,EAAOC,EAAIA,KAACC,UAAOC,IAAGC,WAAA,CAAAC,YAAA,OAAAC,YAAA,gBAAVJ,CAAU,CAAA,iDAAA,SAAA,cAAA,gBAAA,eAAA,cAAA,QAAA,eAAA,oBAAA,gBAAA,eAAA,WAAA,YAAA,UAAA,WAAA,cAAA,eAAA,cAAA,eAAA,kBAAA,MAGfK,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,KAAK,IACnEC,IAAA,IAACC,KAAEA,GAA0BD,EAAA,YAAeE,IAATD,EAAqBA,EAAO,GAAG,IAC7DE,IAAA,IAACC,SAAEA,GAA8BD,EAAA,YAAmBD,IAAbE,EAAyBA,EAAW,GAAG,IAC5EC,IAAA,IAACC,WAAEA,GAAgCD,EAAA,YAAqBH,IAAfI,EAA2BA,EAAa,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,QAAQ,IAChEC,IAAA,IAACC,IAAEA,GAAyBD,EAAA,YAAcT,IAARU,EAAoBA,EAAM,GAAG,IACxDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IACrDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAK1B,EAAiB2B,IAAY,YAAY,IAClFC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAK5B,EAAiB6B,IAAU,YAAY,IAC3EC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC9DC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,GAAG,IAChDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAKC,GAAW,GAAG,IACrDC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAKC,GAAS,MAAM,IACjDC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,MAAM,IACjDC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,MAAM,IACvDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAOC,GAAyB,MAAbA,EAAoBA,EAAW,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,GAAG,IACpDC,IAAA,IAACC,aAAEA,GAAkCD,EAAA,OAAKC,GAAgB,SAAS,KAIzEC,EAAc/C,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAClD,CACEf,MAAOe,EAAMf,OAAS,OACtBE,OAAQa,EAAMb,QAAU,OACxBZ,QAASyB,EAAMzB,SAAW,SAC1BE,MAAOuB,EAAMvB,OAAS,YACnBuB,MAEL9C,WAAA,CAAAC,YAAA,oBAAAC,YAAA,gBAR8BJ,CAQ9B,CAAA,MAEWiD,EAAYlD,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAA+B,CAC/Ef,MAAO,aACJe,MACF9C,WAAA,CAAAC,YAAA,kBAAAC,YAAA,gBAH2BJ,CAG3B,CAAA,MAEUkD,EAAkBnD,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAA+B,CACrFf,MAAO,UACPkB,MAAO,CACLC,KAAM,OACNrB,QAAS,OACTsB,OAAQ,sBAEPL,MACF9C,WAAA,CAAAC,YAAA,wBAAAC,YAAA,gBARiCJ,CAQjC,CAAA"}
+{"version":3,"file":"Flex.js","sources":["../../../../../../../src/core/ui/components/container/Flex.ts"],"sourcesContent":["import { memo } from 'react'\nimport styled from 'styled-components'\n\nexport type FlexProps = {\n  flex?: string\n  flexGrow?: string | number\n  alignText?: 'center' | 'right' | 'left'\n  direction?: string\n  flexShrink?: string | number\n  flexBasis?: string\n  flexWrap?: string\n  justify?: string\n  align?: string\n  alignSelf?: string\n  margin?: string\n  padding?: string\n  width?: string\n  height?: string\n  maxWidth?: string\n  maxHeight?: string\n  minWidth?: string\n  minHeight?: string\n  gap?: string\n  css?: string\n  borderRadius?: string\n}\n\nconst flexValueMap: Record<string, string> = {\n  start: 'flex-start',\n  'flex-start': 'flex-start',\n  end: 'flex-end',\n  'flex-end': 'flex-end',\n}\n\nconst resolveFlexProps = (value?: string): string | undefined => (value ? (flexValueMap[value] || value) : value)\n\nexport const Flex = memo(styled.div<FlexProps>`\n  display: flex;\n  position: relative;\n  flex-direction: ${({ direction }: Partial<FlexProps>) => direction || 'row'};\n  flex: ${({ flex }: Partial<FlexProps>) => (flex !== undefined ? flex : '0')};\n  flex-grow: ${({ flexGrow }: Partial<FlexProps>) => (flexGrow !== undefined ? flexGrow : '0')};\n  flex-shrink: ${({ flexShrink }: Partial<FlexProps>) => (flexShrink !== undefined ? flexShrink : '0')};\n  flex-basis: ${({ flexBasis }: Partial<FlexProps>) => flexBasis || 'auto'};\n  flex-wrap: ${({ flexWrap }: Partial<FlexProps>) => flexWrap || 'nowrap'};\n  gap: ${({ gap }: Partial<FlexProps>) => (gap !== undefined ? gap : '0')};\n  text-align: ${({ alignText }: Partial<FlexProps>) => alignText || 'left'};\n  justify-content: ${({ justify }: Partial<FlexProps>) => resolveFlexProps(justify) || 'flex-start'};\n  align-items: ${({ align }: Partial<FlexProps>) => resolveFlexProps(align) || 'flex-start'};\n  align-self: ${({ alignSelf }: Partial<FlexProps>) => alignSelf || 'auto'};\n  margin: ${({ margin }: Partial<FlexProps>) => margin || '0'};\n  padding: ${({ padding }: Partial<FlexProps>) => padding || '0'};\n  width: ${({ width }: Partial<FlexProps>) => width || 'auto'};\n  height: ${({ height }: Partial<FlexProps>) => height || 'auto'};\n  max-width: ${({ maxWidth }: Partial<FlexProps>) => maxWidth || 'none'};\n  max-height: ${({ maxHeight }: Partial<FlexProps>) => maxHeight || 'none'};\n  min-width: ${({ minWidth }: Partial<FlexProps>) => ((minWidth || minWidth === '0') ? minWidth : '0')};\n  min-height: ${({ minHeight }: Partial<FlexProps>) => minHeight || '0'};\n  border-radius: ${({ borderRadius }: Partial<FlexProps>) => borderRadius || 'initial'};\n`)\n\n// default flex centralized, 100% width and height\nexport const FlexWrapper = memo(styled(Flex).attrs((props: Partial<FlexProps>) => (\n  {\n    width: props.width || '100%',\n    height: props.height || '100%',\n    justify: props.justify || 'center',\n    align: props.align || 'center',\n    ...props,\n  }\n))``)\n\nexport const FlexTight = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  ...props,\n}))``)\n\nexport const FlexTightStyled = memo(styled(Flex).attrs((props: Partial<FlexProps>) => ({\n  width: 'initial',\n  style: {\n    text: 'blue',\n    padding: '1rem',\n    border: '1px solid green',\n  },\n  ...props,\n}))``)\n"],"names":["flexValueMap","start","end","resolveFlexProps","value","Flex","memo","styled","div","_templateObject","_taggedTemplateLiteral","taggedTemplateLiteral","_ref","direction","_ref2","flex","undefined","_ref3","flexGrow","_ref4","flexShrink","_ref5","flexBasis","_ref6","flexWrap","_ref7","gap","_ref8","alignText","_ref9","justify","_ref10","align","_ref11","alignSelf","_ref12","margin","_ref13","padding","_ref14","width","_ref15","height","_ref16","maxWidth","_ref17","maxHeight","_ref18","minWidth","_ref19","minHeight","_ref20","borderRadius","FlexWrapper","attrs","props","_templateObject2","FlexTight","_templateObject3","FlexTightStyled","style","text","border","_templateObject4"],"mappings":"mRA2BA,MAAMA,EAAuC,CAC3CC,MAAO,aACP,aAAc,aACdC,IAAK,WACL,WAAY,YAGRC,EAAoBC,GAAwCA,GAASJ,EAAaI,IAAmBA,EAE9FC,EAAOC,EAAIA,KAACC,EAAM,QAACC,IAAGC,IAAAA,EAAAC,EAAAC,scAGfC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,KAAK,IACnEC,IAAA,IAACC,KAAEA,GAA0BD,EAAA,YAAeE,IAATD,EAAqBA,EAAO,GAAG,IAC7DE,IAAA,IAACC,SAAEA,GAA8BD,EAAA,YAAmBD,IAAbE,EAAyBA,EAAW,GAAG,IAC5EC,IAAA,IAACC,WAAEA,GAAgCD,EAAA,YAAqBH,IAAfI,EAA2BA,EAAa,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,QAAQ,IAChEC,IAAA,IAACC,IAAEA,GAAyBD,EAAA,YAAcT,IAARU,EAAoBA,EAAM,GAAG,IACxDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IACrDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAK1B,EAAiB2B,IAAY,YAAY,IAClFC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAK5B,EAAiB6B,IAAU,YAAY,IAC3EC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC9DC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,GAAG,IAChDC,IAAA,IAACC,QAAEA,GAA6BD,EAAA,OAAKC,GAAW,GAAG,IACrDC,IAAA,IAACC,MAAEA,GAA2BD,EAAA,OAAKC,GAAS,MAAM,IACjDC,IAAA,IAACC,OAAEA,GAA4BD,EAAA,OAAKC,GAAU,MAAM,IACjDC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAKC,GAAY,MAAM,IACvDC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,MAAM,IAC3DC,IAAA,IAACC,SAAEA,GAA8BD,EAAA,OAAOC,GAAyB,MAAbA,EAAoBA,EAAW,GAAG,IACrFC,IAAA,IAACC,UAAEA,GAA+BD,EAAA,OAAKC,GAAa,GAAG,IACpDC,IAAA,IAACC,aAAEA,GAAkCD,EAAA,OAAKC,GAAgB,SAAS,KAIzEC,EAAc/C,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAClD,CACEf,MAAOe,EAAMf,OAAS,OACtBE,OAAQa,EAAMb,QAAU,OACxBZ,QAASyB,EAAMzB,SAAW,SAC1BE,MAAOuB,EAAMvB,OAAS,YACnBuB,KANyBhD,CAQ9BiD,IAAAA,EAAA9C,EAAAC,sBAAA,CAAA,QAEW8C,EAAYnD,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAA+B,CAC/Ef,MAAO,aACJe,KAFyBhD,CAG3BmD,IAAAA,EAAAhD,EAAAC,sBAAA,CAAA,QAEUgD,EAAkBrD,EAAIA,KAACC,EAAM,QAACF,GAAMiD,OAAOC,IAA+B,CACrFf,MAAO,UACPoB,MAAO,CACLC,KAAM,OACNvB,QAAS,OACTwB,OAAQ,sBAEPP,KAP+BhD,CAQjCwD,IAAAA,EAAArD,EAAAC,sBAAA,CAAA"}

package/dist/ui/src/core/ui/components/container/Placeholder.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),r=require("styled-components"),l=require("react"),t=require("./Flex.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=s(r);const o=l.memo((r=>{let{title:l,border:t,background:s,onClick:c,cssProp:o,children:n,...d}=r;return React.createElement(a,e.extends({onClick:c},d,{$_css:t||"border: 1px solid #999999;",$_css2:s||"background-color: rgba(0, 120, 255, 0.2);",$_css3:o}),l&&React.createElement("h2",null,l),n&&n)}));o.displayName="Placeholder";var a=c.default(t.FlexWrapper).withConfig({displayName:"Placeholder___StyledFlexWrapper",componentId:"sc-ozx0bx-0"})([""," "," ",""],(e=>e.$_css),(e=>e.$_css2),(e=>e.$_css3));exports.Placeholder=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),l=require("./Flex.js");const c=r.memo((r=>{let{title:c,border:t,background:o,onClick:a,cssProp:n,children:s,...i}=r;return React.createElement(l.FlexWrapper,e.extends({css:"\n      ".concat(t||"border: 1px solid #999999;","\n      ").concat(o||"background-color: rgba(0, 120, 255, 0.2);","\n      ").concat(n,"\n    "),onClick:a},i),c&&React.createElement("h2",null,c),s&&s)}));c.displayName="Placeholder",exports.Placeholder=c;
 //# sourceMappingURL=Placeholder.js.map

package/dist/ui/src/core/ui/components/container/Placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"Placeholder.js","sources":["../../../../../../../src/core/ui/components/container/Placeholder.tsx"],"sourcesContent":["import { FC, memo, PropsWithChildren } from 'react'\n\nimport { FlexWrapper, FlexProps } from './Flex'\n\nexport type PlaceholderProps = FlexProps & PropsWithChildren<unknown> & {\n  title?: string\n  cssProp?: string\n  background?: string\n  border?: string\n  onClick?: () => void\n}\n\nexport const Placeholder: FC<PlaceholderProps>\n= memo<PlaceholderProps>(({ title, border, background, onClick, cssProp, children, ...props }: PlaceholderProps) => (\n  <FlexWrapper\n    css={`\n      ${border || 'border: 1px solid #999999;'}\n      ${background || 'background-color: rgba(0, 120, 255, 0.2);'}\n      ${cssProp}\n    `}\n    onClick={onClick}\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    {...props}\n  >\n    {title && (<h2>{title}</h2>)}\n    {children && children}\n  </FlexWrapper>\n))\n\nPlaceholder.displayName = 'Placeholder'\n"],"names":["Placeholder","memo","_ref","title","border","background","onClick","cssProp","children","props","React","createElement","_StyledFlexWrapper","_extends","$_css","$_css2","$_css3","displayName","_styled","FlexWrapper","withConfig","componentId","p"],"mappings":"sSAYaA,MAAAA,EACXC,EAAIA,MAAmBC,IAAA,IAACC,MAAEA,EAAKC,OAAEA,EAAMC,WAAEA,EAAUC,QAAEA,EAAOC,QAAEA,EAAOC,SAAEA,KAAaC,GAAyBP,EAAA,OAC7GQ,MAAAC,cAAAC,EAAAC,UAAA,CAMEP,QAASA,GAELG,EAAK,CAAAK,MANLV,GAAU,6BAA4BW,OACtCV,GAAc,4CAA2CW,OACzDT,IAMHJ,GAAUO,MAAAC,cAAA,KAAA,KAAKR,GACfK,GAAYA,EACD,IAGhBR,EAAYiB,YAAc,cAAa,IAAAL,EAAAM,EAAA,QAAAC,eAAAC,WAAA,CAAAH,YAAA,kCAAAI,YAAA,eAAAH,CAAA,CAAA,GAAA,IAAA,IAAA,KAAAI,GAAAA,EAAAR,QAAAQ,GAAAA,EAAAP,SAAAO,GAAAA,EAAAN"}
+{"version":3,"file":"Placeholder.js","sources":["../../../../../../../src/core/ui/components/container/Placeholder.tsx"],"sourcesContent":["import { FC, memo, PropsWithChildren } from 'react'\n\nimport { FlexWrapper, FlexProps } from './Flex'\n\nexport type PlaceholderProps = FlexProps & PropsWithChildren<unknown> & {\n  title?: string\n  cssProp?: string\n  background?: string\n  border?: string\n  onClick?: () => void\n}\n\nexport const Placeholder: FC<PlaceholderProps>\n= memo<PlaceholderProps>(({ title, border, background, onClick, cssProp, children, ...props }: PlaceholderProps) => (\n  <FlexWrapper\n    css={`\n      ${border || 'border: 1px solid #999999;'}\n      ${background || 'background-color: rgba(0, 120, 255, 0.2);'}\n      ${cssProp}\n    `}\n    onClick={onClick}\n    // eslint-disable-next-line react/jsx-props-no-spreading\n    {...props}\n  >\n    {title && (<h2>{title}</h2>)}\n    {children && children}\n  </FlexWrapper>\n))\n\nPlaceholder.displayName = 'Placeholder'\n"],"names":["Placeholder","memo","_ref","title","border","background","onClick","cssProp","children","props","React","createElement","FlexWrapper","_extends","css","concat","displayName"],"mappings":"oLAYaA,MAAAA,EACXC,EAAIA,MAAmBC,IAAA,IAACC,MAAEA,EAAKC,OAAEA,EAAMC,WAAEA,EAAUC,QAAEA,EAAOC,QAAEA,EAAOC,SAAEA,KAAaC,GAAyBP,EAAA,OAC7GQ,MAAAC,cAACC,EAAWA,YAAAC,UAAA,CACVC,eAAGC,OACCX,GAAU,6BAA4BW,YAAAA,OACtCV,GAAc,4CAA2C,YAAAU,OACzDR,EACF,UACFD,QAASA,GAELG,GAEHN,GAAUO,MAAAC,cAAKR,KAAAA,KAAAA,GACfK,GAAYA,EACD,IAGhBR,EAAYgB,YAAc"}

package/dist/ui/src/core/ui/components/field/Field.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("styled-components"),a=require("react");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(t);let o=()=>"#000000";let i=a.memo((function(){return React.createElement("span",null)}));const c=l.default.div.withConfig({displayName:"Field__FieldWrapper",componentId:"sc-i8c0jy-0"})(["opacity:",";pointer-events:",";flex:1 1 auto;width:100%;@media (min-width:400px){flex:1;}.label{font-size:0.8rem !important;font-weight:normal;}.help{text-align:left;}.mainControl{flex:1;border-radius:6px;box-shadow:0 0 6px 1px rgba(0,0,0,0.06);will-change:box-shadow;transition:box-shadow 250ms ease-in-out;&:hover{box-shadow:0 0 8px 2px rgba(0,0,0,0.1);}}button{box-shadow:0 0 8px 2px rgba(0,0,0,0.1);}.select{width:100%;flex:1;&::after{border-color:#000000 !important;}}.icon{&.is-action{cursor:pointer;pointer-events:initial !important;}}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}input[type=number]{-moz-appearance:textfield;}.input[type=date]::-webkit-calendar-picker-indicator{opacity:0;-webkit-appearance:none;position:absolute;left:0;top:0;width:40px;height:100%;margin:0;padding:0;cursor:pointer;}textarea{resize:none;}"],(e=>{let{disabled:t,userDisabled:a}=e;return t||a?.5:1}),(e=>{let{disabled:t,userDisabled:a}=e;return t||a?"none":"auto"}));var r=l.default(c).withConfig({displayName:"Field___StyledFieldWrapper",componentId:"sc-i8c0jy-1"})(["",""],(e=>e.$_css));const s=a.memo((function(t){let{options:a,value:n,inputRef:l,...o}=t;return React.createElement("div",{className:"select"},React.createElement("select",e.extends({},o,{ref:l,defaultValue:n}),null==a?void 0:a.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),p=l.default.input.withConfig({displayName:"Field__InputComponent",componentId:"sc-i8c0jy-2"})([""]),d=l.default.textarea.withConfig({displayName:"Field__TextAreaComponent",componentId:"sc-i8c0jy-3"})([""]),u=l.default.label.withConfig({displayName:"Field__StyledFieldLabel",componentId:"sc-i8c0jy-4"})(["text-align:left;"]),m=a.memo((t=>{let{label:n,name:l,type:c="text",value:m,defaultValue:f,placeholder:b,inputRef:h,error:x,disabled:g,userDisabled:y,withoutComponent:v,helpTextInfo:w,helpText:C,children:N,iconLeft:R,iconRight:_,addon:E,className:F,onChange:k,onChangeInner:I,onBlur:j,onFocus:D,rightIconClick:B,leftIconClick:S,options:q,css:z,...L}=t,T=p;N||"textarea"!==c||(T=d);const V=a.useCallback((e=>{var t;y?null==e||null===(t=e.preventDefault)||void 0===t||t.call(e):D&&D(e)}),[y,D]),W=a.useCallback((e=>{y||(I&&null!=e&&e.target?(e.target.value=I(e.target.value),k&&k(e)):k&&k(e))}),[I,k,y]),K=a.useMemo((()=>void 0===m?{defaultValue:f}:{value:m}),[m,f]);return React.createElement(r,{className:"field ".concat(F),error:x,disabled:g,userDisabled:y,$_css:z},React.createElement(u,{htmlFor:l,className:"label"},n),React.createElement("div",{className:"field ".concat(E?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(R&&!v?"has-icons-left":""," ").concat(_?"has-icons-right":"")},!v&&(N||"select"!==c&&!q?!N&&React.createElement(T,e.extends({name:l,id:l,ref:h,className:"input ".concat(x?"is-danger":""),type:c,placeholder:b},K,{onChange:W,onBlur:j,onFocus:V,onKeyDown:V,autoComplete:"off",disabled:g},L)):React.createElement(s,e.extends({name:l,id:l,inputRef:h,className:"input ".concat(x?"is-danger":""),type:"select",placeholder:b,value:m,options:q,onChange:k,onBlur:j,onFocus:V,onKeyDown:V,autoComplete:"off",disabled:g},L))),R&&!v&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(S?"is-action":""),onClick:S},React.createElement(i,{iconName:R,color:o})),_&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(B?"is-action":""),onClick:B},React.createElement(i,{iconName:_,color:o})),N&&N),E&&E),w&&React.createElement("p",{className:"help"},w),C&&React.createElement("p",{className:"help ".concat(x?"is-danger":"")},C))}));m.displayName="Field",exports.Field=m,exports.FieldWrapper=c,exports.Select=s,exports.setIconColor=e=>{o=e},exports.setIconComponent=e=>{i=e};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),n=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a,l,o,i,r=t(require("styled-components"));let c=()=>"#000000";let s=n.memo((function(){return React.createElement("span",null)}));const p=r.default.div(a||(a=e.taggedTemplateLiteral(["\n  opacity: ",";\n  pointer-events: ",";\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n"])),(e=>{let{disabled:n,userDisabled:t}=e;return n||t?.5:1}),(e=>{let{disabled:n,userDisabled:t}=e;return n||t?"none":"auto"})),u=n.memo((function(n){let{options:t,value:a,inputRef:l,...o}=n;return React.createElement("div",{className:"select"},React.createElement("select",e.extends({},o,{ref:l,defaultValue:a}),null==t?void 0:t.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),d=r.default.input(l||(l=e.taggedTemplateLiteral([""]))),m=r.default.textarea(o||(o=e.taggedTemplateLiteral([""]))),f=r.default.label(i||(i=e.taggedTemplateLiteral(["\n  text-align: left;\n"]))),b=n.memo((t=>{let{label:a,name:l,type:o="text",value:i,defaultValue:r,placeholder:b,inputRef:h,error:g,disabled:x,userDisabled:v,withoutComponent:R,helpTextInfo:w,helpText:C,children:y,iconLeft:E,iconRight:N,addon:k,className:F,onChange:D,onChangeInner:I,onBlur:L,onFocus:T,rightIconClick:j,leftIconClick:B,options:_,css:q,...z}=t,O=d;y||"textarea"!==o||(O=m);const S=n.useCallback((e=>{var n;v?null==e||null===(n=e.preventDefault)||void 0===n||n.call(e):T&&T(e)}),[v,T]),V=n.useCallback((e=>{v||(I&&null!=e&&e.target?(e.target.value=I(e.target.value),D&&D(e)):D&&D(e))}),[I,D,v]),K=n.useMemo((()=>void 0===i?{defaultValue:r}:{value:i}),[i,r]);return React.createElement(p,{className:"field ".concat(F),error:g,disabled:x,userDisabled:v,css:q},React.createElement(f,{htmlFor:l,className:"label"},a),React.createElement("div",{className:"field ".concat(k?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(E&&!R?"has-icons-left":""," ").concat(N?"has-icons-right":"")},!R&&(y||"select"!==o&&!_?!y&&React.createElement(O,e.extends({name:l,id:l,ref:h,className:"input ".concat(g?"is-danger":""),type:o,placeholder:b},K,{onChange:V,onBlur:L,onFocus:S,onKeyDown:S,autoComplete:"off",disabled:x},z)):React.createElement(u,e.extends({name:l,id:l,inputRef:h,className:"input ".concat(g?"is-danger":""),type:"select",placeholder:b,value:i,options:_,onChange:D,onBlur:L,onFocus:S,onKeyDown:S,autoComplete:"off",disabled:x},z))),E&&!R&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(B?"is-action":""),onClick:B},React.createElement(s,{iconName:E,color:c})),N&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(j?"is-action":""),onClick:j},React.createElement(s,{iconName:N,color:c})),y&&y),k&&k),w&&React.createElement("p",{className:"help"},w),C&&React.createElement("p",{className:"help ".concat(g?"is-danger":"")},C))}));b.displayName="Field",exports.Field=b,exports.FieldWrapper=p,exports.Select=u,exports.setIconColor=e=>{c=e},exports.setIconComponent=e=>{s=e};
 //# sourceMappingURL=Field.js.map

package/dist/ui/src/core/ui/components/field/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sources":["../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren } from 'react'\nimport styled from 'styled-components'\n\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\nexport const FieldWrapper: FC<FileWrapperProps> = styled.div<FileWrapperProps>`\n  opacity: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 0.5 : 1)};\n  pointer-events: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 'none' : 'auto')};\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n`\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  css?: string\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\n\nconst InputComponent = styled.input``\nconst TextAreaComponent = styled.textarea``\nconst StyledFieldLabel = styled.label`\n  text-align: left;\n`\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  css,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <FieldWrapper\n      className={`field ${className}`}\n      error={error}\n      disabled={disabled}\n      userDisabled={userDisabled}\n      css={css}\n    >\n      <StyledFieldLabel htmlFor={name} className='label'>{label}</StyledFieldLabel>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </FieldWrapper>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","IconComponent","memo","React","createElement","setIconComponent","FieldWrapper","styled","div","withConfig","displayName","componentId","_ref","disabled","userDisabled","_ref2","_StyledFieldWrapper","p","$_css","Select","_ref3","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","InputComponent","input","TextAreaComponent","textarea","StyledFieldLabel","Field","_ref4","name","type","placeholder","error","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","css","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","color","component"],"mappings":"+QAQA,IAAIA,EAAqCA,IAAM,UAM/C,IAAIC,EAAmCC,EAAAA,MAAK,WAA2B,OAAOC,MAAAC,cAAA,OAAA,KAAS,IAE1EC,MAYAC,EAAqCC,EAAAA,QAAOC,IAAGC,WAAA,CAAAC,YAAA,sBAAAC,YAAA,eAAVJ,CAAU,CAAA,WAAA,mBAAA,61BAC/CK,IAAA,IAACC,SAAEA,EAAQC,aAAEA,GAAcF,EAAA,OAAMC,GAAYC,EAAe,GAAM,CAAC,IAC5DC,IAAA,IAACF,SAAEA,EAAQC,aAAEA,GAAcC,EAAA,OAAMF,GAAYC,EAAe,OAAS,MAAM,IAuE9F,IAAAE,EAAAT,EAAA,QAAAD,GAAAG,WAAA,CAAAC,YAAA,6BAAAC,YAAA,eAAAJ,CAAA,CAAA,GAAA,KAAAU,GAAAA,EAAAC,QA8CM,MAAMC,EACXjB,EAAIA,MACJ,SAAekB,GAAsD,IAArDC,QAAEA,EAAOC,MAAEA,EAAKC,SAAEA,KAAaC,GAAoBJ,EACjE,OACEjB,MAAAC,cAAA,MAAA,CAAKqB,UAAU,UACbtB,MAAAC,cAAAsB,SAAAA,EAAAA,WAAYF,EAAK,CAAEG,IAAKJ,EAAUK,aAAcN,IAC7CD,aAAO,EAAPA,EAASQ,KAAKC,GACb3B,MAAAC,cAAA,SAAA,CACE2B,IAAG,GAAAC,OAAKC,KAAKC,UAAUJ,IACvBR,MAAyB,iBAAXQ,EAAuBA,aAAM,EAANA,EAAsBR,MAAQQ,GAEhD,iBAAXA,EAAuBA,aAAAA,EAAAA,EAAsBK,MAAQL,MAMzE,IAGIM,EAAiB7B,EAAAA,QAAO8B,MAAK5B,WAAA,CAAAC,YAAA,wBAAAC,YAAA,eAAZJ,CAAc,CAAA,KAC/B+B,EAAoB/B,EAAAA,QAAOgC,SAAQ9B,WAAA,CAAAC,YAAA,2BAAAC,YAAA,eAAfJ,CAAiB,CAAA,KACrCiC,EAAmBjC,EAAAA,QAAO4B,MAAK1B,WAAA,CAAAC,YAAA,0BAAAC,YAAA,eAAZJ,CAExB,CAAA,qBAEYkC,EAAwBvC,EAAIA,MAAawC,IA4BpC,IA5BqCP,MACrDA,EAAKQ,KACLA,EAAIC,KACJA,EAAO,OAAMtB,MACbA,EAAKM,aACLA,EAAYiB,YACZA,EAAWtB,SACXA,EAAQuB,MACRA,EAAKjC,SACLA,EAAQC,aACRA,EAAYiC,iBACZA,EAAgBC,aAChBA,EAAYC,SACZA,EAAQC,SACRA,EAAQC,SACRA,EAAQC,UACRA,EAASC,MACTA,EAAK5B,UACLA,EAAS6B,SACTA,EAAQC,cACRA,EAAaC,OACbA,EAAMC,QACNA,EAAOC,eACPA,EAAcC,cACdA,EAAatC,QACbA,EAAOuC,IACPA,KACGpC,GACQkB,EACPmB,EAAqBzB,EAEpBc,GAAqB,aAATN,IACfiB,EAAYvB,GAEd,MAAMwB,EAAcC,EAAWA,aAAEC,IACb,IAAAC,EAAdnD,EACFkD,SAAqBC,QAAhBA,EAALD,EAAOE,0BAAcD,GAArBA,EAAAE,KAAAH,GAEAP,GAAWA,EAAQO,EACrB,GACC,CAAClD,EAAc2C,IAEZW,EAAeL,EAAWA,aAAEC,IAC5BlD,IAGAyC,SAAiBS,GAAAA,EAAOK,QAE1BL,EAAMK,OAAO/C,MAAQiC,EAAeS,EAAMK,OAAO/C,OACjDgC,GAAYA,EAASU,IAErBV,GAAYA,EAASU,GACvB,GACC,CAACT,EAAeD,EAAUxC,IAEvBwD,EAAaC,EAAAA,SAAQ,SACXC,IAAVlD,EACK,CAAEM,gBAEJ,CAAEN,UACR,CAACA,EAAOM,IAEX,OACEzB,MAAAC,cAAAY,EAAA,CACES,UAASO,SAAAA,OAAWP,GACpBqB,MAAOA,EACPjC,SAAUA,EACVC,aAAcA,EAAaI,MACtB0C,GAELzD,MAAAC,cAACoC,EAAgB,CAACiC,QAAS9B,EAAMlB,UAAU,SAASU,GACpDhC,MAAAC,cAAA,MAAA,CAAKqB,mBAASO,OAAWqB,EAAQ,aAAe,KAC9ClD,MAAAC,cAAA,MAAA,CACEqB,iCAASO,OAAyBmB,IAAaJ,EAC3C,iBAAmB,QAAEf,OAAIoB,EAAY,kBAAoB,MAE3DL,IAAuBG,GAAsB,WAATN,IAAqBvB,GAsBtD6B,GACD/C,MAAAC,cAACyD,EAASnC,UAAA,CACRiB,KAAMA,EACN+B,GAAI/B,EACJhB,IAAKJ,EACLE,UAAS,SAAAO,OAAWc,EAAQ,YAAc,IAC1CF,KAAMA,EACNC,YAAaA,GACTyB,EAAU,CACdhB,SAAUc,EACVZ,OAAQA,EACRC,QAASK,EACTa,UAAWb,EACXc,aAAa,MACb/D,SAAUA,GACNW,IAnCNrB,MAAAC,cAACe,EAAMO,EAAAA,QAAA,CACLiB,KAAMA,EACN+B,GAAI/B,EACJpB,SAAUA,EACVE,UAAS,SAAAO,OAAWc,EAAQ,YAAc,IAC1CF,KAAK,SACLC,YAAaA,EACbvB,MAAOA,EACPD,QAASA,EAETiC,SAAUA,EACVE,OAAQA,EACRC,QAASK,EACTa,UAAWb,EACXc,aAAa,MACb/D,SAAUA,GACNW,KAuBT2B,IAAaJ,GACZ5C,MAAAC,cAAA,OAAA,CACEqB,UAAS,kCAAAO,OAAoC2B,EAAgB,YAAc,IAC3EkB,QAASlB,GAETxD,MAAAC,cAACH,EAAa,CACZ6E,SAAU3B,EACV4B,MAAO/E,KAIZoD,GACCjD,MAAAC,cAAA,OAAA,CACEqB,UAAS,oCAAAO,OAAsC0B,EAAiB,YAAc,IAC9EmB,QAASnB,GAETvD,MAAAC,cAACH,EAAa,CACZ6E,SAAU1B,EACV2B,MAAO/E,KAIZkD,GAAYA,GAEdG,GAASA,GAEXL,GAAgB7C,MAAAC,cAAA,IAAA,CAAGqB,UAAU,QAAQuB,GACrCC,GAAY9C,MAAAC,cAAA,IAAA,CAAGqB,kBAASO,OAAUc,EAAQ,YAAc,KAAOG,GACnD,IAInBR,EAAM/B,YAAc,qFAxTSqE,IAC3B/E,EAAY+E,CAAK,2BAKcC,IAC/B/E,EAAgB+E,CAAS"}
+{"version":3,"file":"Field.js","sources":["../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren } from 'react'\nimport styled from 'styled-components'\n\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\nexport const FieldWrapper: FC<FileWrapperProps> = styled.div<FileWrapperProps>`\n  opacity: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 0.5 : 1)};\n  pointer-events: ${({ disabled, userDisabled }) => (disabled || userDisabled ? 'none' : 'auto')};\n  flex: 1 1 auto;\n  width: 100%;\n  @media (min-width: 400px) {\n    flex: 1;\n  }\n  .label {\n    font-size: 0.8rem !important;\n    font-weight: normal;\n  }\n\n  .help {\n    text-align: left;\n  }\n\n  .mainControl {\n    flex: 1;\n    border-radius: 6px;\n    box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.06);\n    will-change: box-shadow;\n    transition: box-shadow 250ms ease-in-out;\n    &:hover {\n      box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n    }\n  }\n  button {\n    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);\n  }\n  .select {\n    width: 100%;\n    flex: 1;\n    &::after {\n      border-color: #000000 !important;\n    }\n  }\n\n  .icon {\n    &.is-action {\n      cursor: pointer;\n      pointer-events: initial !important;\n    }\n  }\n\n  /* Chrome, Safari, Edge, Opera */\n  input::-webkit-outer-spin-button,\n  input::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n\n  /* Firefox */\n  input[type=number] {\n    -moz-appearance: textfield;\n  }\n\n  .input[type=date]::-webkit-calendar-picker-indicator {\n    opacity:0;\n    -webkit-appearance: none;\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 40px;\n    height: 100%;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n  }\n\n  textarea {\n    resize: none;\n  }\n`\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  css?: string\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\n\nconst InputComponent = styled.input``\nconst TextAreaComponent = styled.textarea``\nconst StyledFieldLabel = styled.label`\n  text-align: left;\n`\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  css,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <FieldWrapper\n      className={`field ${className}`}\n      error={error}\n      disabled={disabled}\n      userDisabled={userDisabled}\n      css={css}\n    >\n      <StyledFieldLabel htmlFor={name} className='label'>{label}</StyledFieldLabel>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </FieldWrapper>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","IconComponent","memo","React","createElement","setIconComponent","FieldWrapper","styled","div","_templateObject","_taggedTemplateLiteral","_ref","disabled","userDisabled","_ref2","Select","_ref3","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","InputComponent","input","_templateObject2","TextAreaComponent","textarea","_templateObject3","StyledFieldLabel","_templateObject4","Field","_ref4","name","type","placeholder","error","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","css","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","color","displayName","component"],"mappings":"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"}

package/dist/ui/src/core/ui/components/icon/IconWC.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var t,i=require("../../../utils/webComponents/webComponent.utils.js"),e=require("./icon.module.scss.js");const s=document.createElement("template");s.innerHTML='<span class="icon-base"></span>';let n=i.ced("icon-base")(t=class t extends HTMLElement{constructor(){super(...arguments),this.content=void 0,this.mainElement=void 0,this.iconUrl=void 0,this.minWidth=void 0,this.minHeight=void 0,this.width=void 0,this.height=void 0,this.size=void 0,this.fontSize=void 0,this.color=void 0,this.render=()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(e.default["icon-base-parent"]),this.mainElement.classList.add(e.default["icon-base"]);const t={"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem",...this.fontSize?{"font-size":this.fontSize||"unset"}:{},...this.iconUrl?{"--icon-url":"url(".concat(this.iconUrl,")")}:{},...this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color}};this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(t).map((t=>{let[i,e]=t;return"".concat(i,": ").concat(e,";")})).join(" "))}}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=s.innerHTML,i.resolveAttributes(this,t.observedAttributes),this.render()}attributeChangedCallback(t,i,e){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof e&&(this.classList.remove(e),this.classList.add(e)),this.color||(this.color="currentColor"),this[t]=e||"",this.render()}})||t;const o={ESIconBase:n};exports.ESIcon=n,exports.ESIconBase=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var e,i=require("../../../utils/webComponents/webComponent.utils.js"),s=require("./icon.module.scss.js");const n=document.createElement("template");n.innerHTML='<span class="icon-base"></span>';let o=i.ced("icon-base")(e=class e extends HTMLElement{constructor(){super(...arguments),t.defineProperty(this,"render",(()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(s.default["icon-base-parent"]),this.mainElement.classList.add(s.default["icon-base"]);const t={"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem",...this.fontSize?{"font-size":this.fontSize||"unset"}:{},...this.iconUrl?{"--icon-url":"url(".concat(this.iconUrl,")")}:{},...this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color}};this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(t).map((t=>{let[e,i]=t;return"".concat(e,": ").concat(i,";")})).join(" "))}))}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=n.innerHTML,i.resolveAttributes(this,e.observedAttributes),this.render()}attributeChangedCallback(t,e,i){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof i&&(this.classList.remove(i),this.classList.add(i)),this.color||(this.color="currentColor"),this[t]=i||"",this.render()}})||e;const r={ESIconBase:o};exports.ESIcon=o,exports.ESIconBase=r;
 //# sourceMappingURL=IconWC.js.map

package/dist/ui/src/core/ui/components/icon/IconWC.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconWC.js","sources":["../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n  iconUrl?: string\n  minWidth?: string\n  minHeight?: string\n  width?: string\n  height?: string\n  size?: string\n  fontSize?: string\n  color?: string\n  className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n  content: string | null\n\n  mainElement: HTMLElement\n\n  iconUrl?: string | null\n\n  minWidth?: string | null\n\n  minHeight?: string | null\n\n  width?: string | null\n\n  height?: string | null\n\n  size?: string | null\n\n  fontSize?: string | null\n\n  color?: string | null\n\n  static get observedAttributes() {\n    return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n  }\n\n  connectedCallback() {\n    if (this.content || this.innerHTML) {\n      this.content = this.content || this.innerHTML || this.getAttribute('content')\n    }\n\n    this.innerHTML = template.innerHTML\n\n    resolveAttributes(this, ESIcon.observedAttributes)\n\n    this.render()\n  }\n\n  attributeChangedCallback(attrName: string, oldVal: string | number | null, newVal: string | number | null) {\n    if (attrName === 'className' || attrName === 'classname' || attrName === 'class') {\n      if (typeof newVal === 'string') {\n        this.classList.remove(newVal as string)\n        this.classList.add(newVal as string)\n      }\n    }\n    if (!this.color) {\n      this.color = 'currentColor'\n    }\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this[attrName] = (newVal as string) || ''\n    this.render()\n  }\n\n  render = () => {\n    this.mainElement = this.mainElement || this.querySelector('.icon-base') as HTMLElement\n    if (!this.mainElement) {\n      return\n    }\n    this.classList.add(classes['icon-base-parent'])\n    this.mainElement.classList.add(classes['icon-base'])\n\n    const styles = {\n      '--min-width': this.minWidth || this.size || this.width || 'auto',\n      '--min-height': this.minHeight || this.size || this.height || 'auto',\n      '--width': this.size || this.width || '1rem',\n      '--height': this.size || this.height || '1rem',\n      ...(this.fontSize ? { 'font-size': this.fontSize || 'unset' } : {}),\n      ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n      ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n    }\n\n    this.mainElement.innerHTML = this.iconUrl ? '' : (this.content || '')\n\n    this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      'icon-base': any\n    }\n  }\n}\n\nexport const ESIconBase = {\n  ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","this","content","mainElement","iconUrl","minWidth","minHeight","width","height","size","fontSize","color","render","querySelector","classList","add","classes","styles","concat","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"oQAKA,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAAA,IAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,KACtCC,aAAO,EAAAD,KAEPE,iBAAW,EAAAF,KAEXG,aAAO,EAAAH,KAEPI,cAAQ,EAAAJ,KAERK,eAAS,EAAAL,KAETM,WAAK,EAAAN,KAELO,YAAM,EAAAP,KAENQ,UAAI,EAAAR,KAEJS,cAAQ,EAAAT,KAERU,WAAK,EAAAV,KAkCLW,OAAS,KAEP,GADAX,KAAKE,YAAcF,KAAKE,aAAeF,KAAKY,cAAc,eACrDZ,KAAKE,YACR,OAEFF,KAAKa,UAAUC,IAAIC,EAAAA,QAAQ,qBAC3Bf,KAAKE,YAAYW,UAAUC,IAAIC,EAAO,QAAC,cAEvC,MAAMC,EAAS,CACb,cAAehB,KAAKI,UAAYJ,KAAKQ,MAAQR,KAAKM,OAAS,OAC3D,eAAgBN,KAAKK,WAAaL,KAAKQ,MAAQR,KAAKO,QAAU,OAC9D,UAAWP,KAAKQ,MAAQR,KAAKM,OAAS,OACtC,WAAYN,KAAKQ,MAAQR,KAAKO,QAAU,UACpCP,KAAKS,SAAW,CAAE,YAAaT,KAAKS,UAAY,SAAY,MAC5DT,KAAKG,QAAU,CAAE,aAAYc,OAAAA,OAASjB,KAAKG,QAAO,MAAQ,MAC1DH,KAAKG,QAAU,CAAE,eAAgBH,KAAKU,OAAU,CAAE,uBAAwBV,KAAKU,QAGrFV,KAAKE,YAAYX,UAAYS,KAAKG,QAAU,GAAMH,KAAKC,SAAW,GAElED,KAAKE,YAAYgB,aAAa,QAASC,OAAOC,QAAQJ,GAAQK,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,MAAA,GAAAL,OAAQM,EAAGN,MAAAA,OAAKO,EAAK,IAAA,IAAKC,KAAK,KAAK,CACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,IACM3B,KAAKC,SAAWD,KAAKT,aACvBS,KAAKC,QAAUD,KAAKC,SAAWD,KAAKT,WAAaS,KAAK4B,aAAa,YAGrE5B,KAAKT,UAAYH,EAASG,UAE1BsC,EAAAA,kBAAkB7B,KAAMR,EAAOkC,oBAE/B1B,KAAKW,QACP,CAEAmB,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,IACTjC,KAAKa,UAAUqB,OAAOD,GACtBjC,KAAKa,UAAUC,IAAImB,IAGlBjC,KAAKU,QACRV,KAAKU,MAAQ,gBAIfV,KAAK+B,GAAaE,GAAqB,GACvCjC,KAAKW,QACP,KAwBDhB,EAWM,MAAMwC,EAAa,CACxBA,WAAY3C"}
+{"version":3,"file":"IconWC.js","sources":["../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n  iconUrl?: string\n  minWidth?: string\n  minHeight?: string\n  width?: string\n  height?: string\n  size?: string\n  fontSize?: string\n  color?: string\n  className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n  content: string | null\n\n  mainElement: HTMLElement\n\n  iconUrl?: string | null\n\n  minWidth?: string | null\n\n  minHeight?: string | null\n\n  width?: string | null\n\n  height?: string | null\n\n  size?: string | null\n\n  fontSize?: string | null\n\n  color?: string | null\n\n  static get observedAttributes() {\n    return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n  }\n\n  connectedCallback() {\n    if (this.content || this.innerHTML) {\n      this.content = this.content || this.innerHTML || this.getAttribute('content')\n    }\n\n    this.innerHTML = template.innerHTML\n\n    resolveAttributes(this, ESIcon.observedAttributes)\n\n    this.render()\n  }\n\n  attributeChangedCallback(attrName: string, oldVal: string | number | null, newVal: string | number | null) {\n    if (attrName === 'className' || attrName === 'classname' || attrName === 'class') {\n      if (typeof newVal === 'string') {\n        this.classList.remove(newVal as string)\n        this.classList.add(newVal as string)\n      }\n    }\n    if (!this.color) {\n      this.color = 'currentColor'\n    }\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    this[attrName] = (newVal as string) || ''\n    this.render()\n  }\n\n  render = () => {\n    this.mainElement = this.mainElement || this.querySelector('.icon-base') as HTMLElement\n    if (!this.mainElement) {\n      return\n    }\n    this.classList.add(classes['icon-base-parent'])\n    this.mainElement.classList.add(classes['icon-base'])\n\n    const styles = {\n      '--min-width': this.minWidth || this.size || this.width || 'auto',\n      '--min-height': this.minHeight || this.size || this.height || 'auto',\n      '--width': this.size || this.width || '1rem',\n      '--height': this.size || this.height || '1rem',\n      ...(this.fontSize ? { 'font-size': this.fontSize || 'unset' } : {}),\n      ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n      ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n    }\n\n    this.mainElement.innerHTML = this.iconUrl ? '' : (this.content || '')\n\n    this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n  }\n}\n\ndeclare global {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface IntrinsicElements {\n      'icon-base': any\n    }\n  }\n}\n\nexport const ESIconBase = {\n  ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","_defineProperty","this","mainElement","querySelector","classList","add","classes","styles","minWidth","size","width","minHeight","height","fontSize","iconUrl","concat","color","content","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","render","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"0UAKA,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAAA,IAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,gCAqD7B,KAEP,GADAC,KAAKC,YAAcD,KAAKC,aAAeD,KAAKE,cAAc,eACrDF,KAAKC,YACR,OAEFD,KAAKG,UAAUC,IAAIC,EAAAA,QAAQ,qBAC3BL,KAAKC,YAAYE,UAAUC,IAAIC,EAAO,QAAC,cAEvC,MAAMC,EAAS,CACb,cAAeN,KAAKO,UAAYP,KAAKQ,MAAQR,KAAKS,OAAS,OAC3D,eAAgBT,KAAKU,WAAaV,KAAKQ,MAAQR,KAAKW,QAAU,OAC9D,UAAWX,KAAKQ,MAAQR,KAAKS,OAAS,OACtC,WAAYT,KAAKQ,MAAQR,KAAKW,QAAU,UACpCX,KAAKY,SAAW,CAAE,YAAaZ,KAAKY,UAAY,SAAY,MAC5DZ,KAAKa,QAAU,CAAE,aAAYC,OAAAA,OAASd,KAAKa,QAAO,MAAQ,MAC1Db,KAAKa,QAAU,CAAE,eAAgBb,KAAKe,OAAU,CAAE,uBAAwBf,KAAKe,QAGrFf,KAAKC,YAAYX,UAAYU,KAAKa,QAAU,GAAMb,KAAKgB,SAAW,GAElEhB,KAAKC,YAAYgB,aAAa,QAASC,OAAOC,QAAQb,GAAQc,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,MAAA,GAAAP,OAAQQ,EAAGR,MAAAA,OAAKS,EAAK,IAAA,IAAKC,KAAK,KAAK,GACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,IACM1B,KAAKgB,SAAWhB,KAAKV,aACvBU,KAAKgB,QAAUhB,KAAKgB,SAAWhB,KAAKV,WAAaU,KAAK2B,aAAa,YAGrE3B,KAAKV,UAAYH,EAASG,UAE1BsC,EAAAA,kBAAkB5B,KAAMT,EAAOkC,oBAE/BzB,KAAK6B,QACP,CAEAC,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,IACTjC,KAAKG,UAAU+B,OAAOD,GACtBjC,KAAKG,UAAUC,IAAI6B,IAGlBjC,KAAKe,QACRf,KAAKe,MAAQ,gBAIff,KAAK+B,GAAaE,GAAqB,GACvCjC,KAAK6B,QACP,KAwBDnC,EAWM,MAAMyC,EAAa,CACxBA,WAAY5C"}