@e1011/es-kit 1.1.58 → 1.1.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks/esm/index.css +252 -236
- package/dist/hooks/esm/src/core/hooks/index.js +1 -1
- package/dist/hooks/esm/src/core/hooks/useToggle2.js +2 -0
- package/dist/hooks/esm/src/core/hooks/useToggle2.js.map +1 -0
- package/dist/hooks/index.css +252 -236
- package/dist/hooks/src/core/hooks/index.js +1 -1
- package/dist/hooks/src/core/hooks/useToggle2.js +2 -0
- package/dist/hooks/src/core/hooks/useToggle2.js.map +1 -0
- package/dist/lib/cjs/index.css +16 -0
- package/dist/lib/cjs/src/core/hooks/useToggle2.js +2 -0
- package/dist/lib/cjs/src/core/hooks/useToggle2.js.map +1 -0
- package/dist/lib/cjs/src/core/ui/components/atoms/button/Button.js +1 -1
- package/dist/lib/cjs/src/core/ui/components/atoms/button/Button.js.map +1 -1
- package/dist/lib/cjs/src/core/ui/components/atoms/button/button.module.scss.js +1 -1
- package/dist/lib/cjs/src/core/ui/components/field/Field.js +1 -1
- package/dist/lib/cjs/src/core/ui/components/field/Field.js.map +1 -1
- package/dist/lib/cjs/src/index.js +1 -1
- package/dist/lib/esm/index.css +16 -0
- package/dist/lib/esm/src/core/hooks/useToggle2.js +2 -0
- package/dist/lib/esm/src/core/hooks/useToggle2.js.map +1 -0
- package/dist/lib/esm/src/core/ui/components/atoms/button/Button.js +1 -1
- package/dist/lib/esm/src/core/ui/components/atoms/button/Button.js.map +1 -1
- package/dist/lib/esm/src/core/ui/components/atoms/button/button.module.scss.js +1 -1
- package/dist/lib/esm/src/core/ui/components/field/Field.js +1 -1
- package/dist/lib/esm/src/core/ui/components/field/Field.js.map +1 -1
- package/dist/lib/esm/src/index.js +1 -1
- package/dist/lib/tsconfig.tsbuildinfo +1 -1
- package/dist/types/src/core/hooks/index.d.ts +1 -0
- package/dist/types/src/core/hooks/index.d.ts.map +1 -1
- package/dist/types/src/core/hooks/useToggle2.d.ts +22 -0
- package/dist/types/src/core/hooks/useToggle2.d.ts.map +1 -0
- package/dist/types/src/core/ui/components/atoms/button/Button.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/atoms/button/button.stories.d.ts.map +1 -1
- package/dist/types/src/core/ui/components/atoms/text/Typography.stories.d.ts.map +1 -1
- package/dist/ui/esm/index.css +16 -0
- package/dist/ui/esm/src/core/ui/components/atoms/button/Button.js +1 -1
- package/dist/ui/esm/src/core/ui/components/atoms/button/Button.js.map +1 -1
- package/dist/ui/esm/src/core/ui/components/atoms/button/button.module.scss.js +1 -1
- package/dist/ui/esm/src/core/ui/components/field/Field.js +1 -1
- package/dist/ui/esm/src/core/ui/components/field/Field.js.map +1 -1
- package/dist/ui/index.css +16 -0
- package/dist/ui/src/core/ui/components/atoms/button/Button.js +1 -1
- package/dist/ui/src/core/ui/components/atoms/button/Button.js.map +1 -1
- package/dist/ui/src/core/ui/components/atoms/button/button.module.scss.js +1 -1
- package/dist/ui/src/core/ui/components/field/Field.js +1 -1
- package/dist/ui/src/core/ui/components/field/Field.js.map +1 -1
- package/dist/utils/esm/index.css +252 -236
- package/dist/utils/index.css +252 -236
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,sBAAsB,CAAA;AACpC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,aAAa,CAAA;AAC3B,cAAc,cAAc,CAAA;AAC5B,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,sBAAsB,CAAA;AACpC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Type definition for the return value of the `useToggle` hook.
|
|
3
|
+
* @typedef {Array} useToggleReturnType
|
|
4
|
+
* @property {boolean} 0 - The current toggled state.
|
|
5
|
+
* @property {(value?: any | boolean) => void} 1 - Function to toggle the state.
|
|
6
|
+
* @property {(value?: any | boolean) => void} 2 - Function to forcefully set the state to true.
|
|
7
|
+
* @property {(value?: any | boolean) => void} 3 - Function to forcefully set the state to false.
|
|
8
|
+
*/
|
|
9
|
+
export type useToggleReturnType2 = [
|
|
10
|
+
boolean,
|
|
11
|
+
(value?: any | boolean) => void,
|
|
12
|
+
(value?: any | boolean) => void,
|
|
13
|
+
(value?: any | boolean) => void
|
|
14
|
+
];
|
|
15
|
+
/**
|
|
16
|
+
* Custom hook to manage a boolean state with toggle functionality.
|
|
17
|
+
* @param {boolean} defaultValue - The initial value of the toggled state.
|
|
18
|
+
* @returns {useToggleReturnType2} An array containing the current state, a toggle function,
|
|
19
|
+
* and functions to set the state to true or false.
|
|
20
|
+
*/
|
|
21
|
+
export declare const useToggle2: (defaultValue: boolean) => useToggleReturnType2;
|
|
22
|
+
//# sourceMappingURL=useToggle2.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useToggle2.d.ts","sourceRoot":"","sources":["../../../../../src/core/hooks/useToggle2.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC,OAAO;IACP,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,OAAO,KAAK,IAAI;IAC/B,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,OAAO,KAAK,IAAI;IAC/B,CAAC,KAAK,CAAC,EAAE,GAAG,GAAG,OAAO,KAAK,IAAI;CAChC,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU,iBAAkB,OAAO,KAAG,oBA8BlD,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+D,EAAE,EAAkB,MAAM,OAAO,CAAA;AAOvG,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+D,EAAE,EAAkB,MAAM,OAAO,CAAA;AAOvG,OAAO,KAAK,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAIlE,eAAO,MAAM,IAAI;;;;;CAKhB,CAAA;AAeD;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,MAAM,wOAchB,WAAW,6CAyDZ,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,OAAO,MAAM,CAAA;AAgBtC,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAqBzC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/button/button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAQzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;wBAM5C,IAAI;AAHT,wBAGS;
|
|
1
|
+
{"version":3,"file":"button.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/button/button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAQzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;wBAM5C,IAAI;AAHT,wBAGS;AAsDT,eAAO,MAAM,UAAU,kGAA0B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Typography.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/text/Typography.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"Typography.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/atoms/text/Typography.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;wBAqCpD,IAAI;AAnBT,wBAmBS;AAET,eAAO,MAAM,UAAU,EAAE,KAuDxB,CAAA"}
|
package/dist/ui/esm/index.css
CHANGED
|
@@ -392,6 +392,19 @@
|
|
|
392
392
|
.button-module_button__NDMQS.button-module_warning__MdmiZ.button-module_transparent__zbeBu {
|
|
393
393
|
border: 1px solid #FFCC3D !important;
|
|
394
394
|
}
|
|
395
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu {
|
|
396
|
+
border: none !important;
|
|
397
|
+
background-color: transparent !important;
|
|
398
|
+
background: transparent !important;
|
|
399
|
+
}
|
|
400
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu:hover {
|
|
401
|
+
border: none !important;
|
|
402
|
+
background-color: transparent !important;
|
|
403
|
+
background: transparent !important;
|
|
404
|
+
}
|
|
405
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu:hover * {
|
|
406
|
+
text-decoration: underline !important;
|
|
407
|
+
}
|
|
395
408
|
.button-module_button__NDMQS.button-module_transparent__zbeBu {
|
|
396
409
|
border: none !important;
|
|
397
410
|
background-color: transparent !important;
|
|
@@ -432,6 +445,9 @@
|
|
|
432
445
|
.button-module_button__NDMQS:hover.button-module_animated__gLwPl {
|
|
433
446
|
transform: scale(1.2);
|
|
434
447
|
}
|
|
448
|
+
.button-module_button__NDMQS:hover.button-module_transparent__zbeBu {
|
|
449
|
+
background-color: rgba(197, 197, 197, 0.1254901961) !important;
|
|
450
|
+
}
|
|
435
451
|
.button-module_button__NDMQS.button-module_disabled__hEydO {
|
|
436
452
|
user-select: none;
|
|
437
453
|
pointer-events: none;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as e,useCallback as n,createElement as a}from"react";import
|
|
1
|
+
import{extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as e,useCallback as n,createElement as a}from"react";import o from"./button.module.scss.js";import{Link as r}from"../text/Link.js";import{classNames as i,noop as s}from"../../../../utils/helpers/ui.js";import{composeId as l}from"../../../../utils/helpers/text.js";import{IconBase as c}from"../../icon/IconBase.js";const d={ENTER:{key:"Enter",keyCode:13}},m=e((t=>{let{variant:e,href:n,target:o,children:i,...l}=t;return"link"===e?a(r,{width:"100%",href:n,target:o,...l,onClick:s},i):a("span",{},i)}));m.displayName="InnerElement";const p=e((e=>{let{label:a,children:r,variant:s,tiny:c,truncate:p,fluid:h,preventDefualt:u,stopPropagation:f,onClick:g,type:E="button",transparent:y,hasShadow:v,hasIcon:b,disabled:I,animated:k=!1,className:j="",id:C,href:N,target:P,...R}=e;const w=`${a||r?.toString()}`,x=n((t=>{u&&t.preventDefault(),f&&(t.stopPropagation(),t.nativeEvent.stopImmediatePropagation()),g?.(t)}),[g,u,f]),B=n((t=>{t.key===d.ENTER.key&&(u&&t.preventDefault(),f&&(t.stopPropagation(),t.nativeEvent.stopImmediatePropagation()),g?.(t))}),[g,u,f]);return React.createElement("button",t({type:E,tabIndex:-1,onClick:x,onKeyDown:B,className:i(o.button,c&&o.tiny,s&&o[s],p&&o.truncate,h&&o.fluid,k&&o.animated,y&&o.transparent,v&&o.hasShadow,b&&o.hasIcon,I&&o.disabled,j),id:`${C||w&&l(w)}`,"data-testid":`${R.dataTestId||R["data-testid"]||C||w&&l(w)}`},R),React.createElement(m,{variant:s,href:N,target:P},a&&a,r||r))}));p.displayName="Button";const h=["iconUrl","minWidth","minHeight","width","height","size","fontSize","color"],u=e((e=>{const n={},a={};return Object.entries(e).forEach((t=>{let[e,o]=t;h.includes(e)?a[e]=o:n[e]=o})),a.children=e.children,React.createElement(p,t({},n,{hasIcon:!0}),e.iconContent&&e.iconContent,!e.iconContent&&React.createElement(c,a))}));u.displayName="IconButton";export{p as Button,u as IconButton,d as keys};
|
|
2
2
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"sourcesContent":["import { memo, useCallback, MouseEvent, KeyboardEvent, createElement, FC, HTMLAttributes } from 'react'\n\nimport { classNames, composeId, noop } from '../../../../utils'\nimport { Alerts } from '../../../../constants'\nimport {
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"sourcesContent":["import { memo, useCallback, MouseEvent, KeyboardEvent, createElement, FC, HTMLAttributes } from 'react'\n\nimport { classNames, composeId, noop } from '../../../../utils'\nimport { Alerts } from '../../../../constants'\nimport { Link } from '../text'\nimport { IconBase, IconBaseProps } from '../../icon'\n\nimport type { ButtonProps, IconButtonProps } from './button.types'\nimport classes from './button.module.scss'\n\n\nexport const keys = {\n ENTER: {\n key: 'Enter',\n keyCode: 13,\n },\n}\n\ntype InnerElementsProps = Partial<ButtonProps> & Partial<HTMLAttributes<HTMLAnchorElement>>\n\nconst InnerElement: FC<InnerElementsProps> = memo(({\n variant, href, target, children, ...props\n}: Omit<InnerElementsProps, 'onClick'>) => {\n if (variant === 'link') {\n return createElement(Link, { width: '100%', href, target, ...props, onClick: noop }, children)\n }\n return createElement('span', {}, children)\n})\n\nInnerElement.displayName = 'InnerElement'\n\n/**\n * Button component for displaying buttons with optional features.\n * @component\n *\n * Generated component from Template\n * @param {object} props - The component props.\n * @param {string} props.label - The value to be displayed in the button.\n * @param {ReactNode} [props.children] - Additional content to be displayed inside the button.\n * @param {string} [props.variant] - The variant of the button (e.g., 'primary', 'secondary').\n * @param {boolean} [props.tiny] - Whether the button should be tiny.\n * @param {boolean} [props.truncate] - Whether the content inside the button should be truncated.\n * @param {boolean} [props.fluid] - Whether the button should have a fluid width.\n * @param {boolean} [props.animated=true] - Whether the button should have animation (default is true).\n * @param {string} [props.className] - Additional classes to be applied to the button.\n * @param {...object} props.props - Additional props to be spread to the underlying div element.\n *\n * @returns {JSX.Element} The rendered Button component.\n */\nexport const Button = memo(({\n label, children,\n variant, tiny, truncate, fluid,\n preventDefualt, stopPropagation,\n onClick,\n type = 'button',\n transparent,\n hasShadow,\n hasIcon,\n disabled,\n animated = false, className = '', id,\n href,\n target,\n ...props\n}: ButtonProps) => {\n const textFromChildren: string | undefined = `${label || children?.toString()}`\n\n const clickHandler = useCallback((event: MouseEvent) => {\n if (preventDefualt) {\n event.preventDefault()\n }\n if (stopPropagation) {\n event.stopPropagation()\n event.nativeEvent.stopImmediatePropagation()\n }\n onClick?.(event)\n }, [onClick, preventDefualt, stopPropagation])\n\n const keyDownHandler = useCallback((event: KeyboardEvent) => {\n if (event.key === keys.ENTER.key) {\n if (preventDefualt) {\n event.preventDefault()\n }\n if (stopPropagation) {\n event.stopPropagation()\n event.nativeEvent.stopImmediatePropagation()\n }\n onClick?.(event)\n }\n }, [onClick, preventDefualt, stopPropagation])\n\n return (\n <button\n // eslint-disable-next-line react/button-has-type\n type={type}\n tabIndex={-1}\n onClick={clickHandler}\n onKeyDown={keyDownHandler}\n className={classNames(\n classes.button,\n tiny && classes.tiny,\n variant && classes[variant as Alerts],\n truncate && classes.truncate,\n fluid && classes.fluid,\n animated && classes.animated,\n transparent && classes.transparent,\n hasShadow && classes.hasShadow,\n hasIcon && classes.hasIcon,\n disabled && classes.disabled,\n className,\n )}\n id={`${id || (textFromChildren && composeId(textFromChildren))}`}\n data-testid={`${(props as Record<string, string>).dataTestId || (props as Record<string, string>)['data-testid'] || id || (textFromChildren && composeId(textFromChildren))}`}\n {...props}\n >\n <InnerElement variant={variant} href={href} target={target}>\n {label && label}\n {children || children}\n </InnerElement>\n </button>\n )\n})\n\nexport type ButtonType = typeof Button\n\n// Set display name for the component.\nButton.displayName = 'Button'\n\nconst iconBaseProps = [\n 'iconUrl',\n 'minWidth',\n 'minHeight',\n 'width',\n 'height',\n 'size',\n 'fontSize',\n 'color',\n]\n\nexport const IconButton: FC<IconButtonProps> = memo<IconButtonProps>((props: IconButtonProps) => {\n const buttonProps: Record<string, unknown> = {}\n const iconProps: Record<string, unknown> = {}\n\n Object.entries(props).forEach(([name, value]: [string, unknown]) => {\n if (iconBaseProps.includes(name)) {\n // eslint-disable-next-line no-param-reassign\n iconProps[name] = value\n } else {\n buttonProps[name] = value\n }\n })\n\n iconProps.children = props.children\n\n return (\n <Button {...(buttonProps as ButtonProps)} hasIcon>\n {props.iconContent && props.iconContent}\n {!props.iconContent && (<IconBase {...(iconProps as IconBaseProps)} />)}\n </Button>\n )\n})\n\nIconButton.displayName = 'IconButton'\n"],"names":["keys","ENTER","key","keyCode","InnerElement","memo","_ref","variant","href","target","children","props","createElement","Link","width","onClick","noop","displayName","Button","_ref2","label","tiny","truncate","fluid","preventDefualt","stopPropagation","type","transparent","hasShadow","hasIcon","disabled","animated","className","id","textFromChildren","toString","clickHandler","useCallback","event","preventDefault","nativeEvent","stopImmediatePropagation","keyDownHandler","React","_extends","tabIndex","onKeyDown","classNames","classes","button","composeId","dataTestId","iconBaseProps","IconButton","buttonProps","iconProps","Object","entries","forEach","_ref3","name","value","includes","iconContent","IconBase"],"mappings":"wZAWO,MAAMA,EAAO,CAClBC,MAAO,CACLC,IAAK,QACLC,QAAS,KAMPC,EAAuCC,GAAKC,IAEP,IAFQC,QACjDA,EAAOC,KAAEA,EAAIC,OAAEA,EAAMC,SAAEA,KAAaC,GACAL,EACpC,MAAgB,SAAZC,EACKK,EAAcC,EAAM,CAAEC,MAAO,OAAQN,OAAMC,YAAWE,EAAOI,QAASC,GAAQN,GAEhFE,EAAc,OAAQ,CAAE,EAAEF,EAAS,IAG5CN,EAAaa,YAAc,qBAoBdC,EAASb,GAAKc,IAcR,IAdSC,MAC1BA,EAAKV,SAAEA,EAAQH,QACfA,EAAOc,KAAEA,EAAIC,SAAEA,EAAQC,MAAEA,EAAKC,eAC9BA,EAAcC,gBAAEA,EAAeV,QAC/BA,EAAOW,KACPA,EAAO,SAAQC,YACfA,EAAWC,UACXA,EAASC,QACTA,EAAOC,SACPA,EAAQC,SACRA,GAAW,EAAKC,UAAEA,EAAY,GAAEC,GAAEA,EAAEzB,KACpCA,EAAIC,OACJA,KACGE,GACSQ,EACZ,MAAMe,EAAuC,GAAGd,GAASV,GAAUyB,aAE7DC,EAAeC,GAAaC,IAC5Bd,GACFc,EAAMC,iBAEJd,IACFa,EAAMb,kBACNa,EAAME,YAAYC,4BAEpB1B,IAAUuB,EAAM,GACf,CAACvB,EAASS,EAAgBC,IAEvBiB,EAAiBL,GAAaC,IAC9BA,EAAMpC,MAAQF,EAAKC,MAAMC,MACvBsB,GACFc,EAAMC,iBAEJd,IACFa,EAAMb,kBACNa,EAAME,YAAYC,4BAEpB1B,IAAUuB,GACZ,GACC,CAACvB,EAASS,EAAgBC,IAE7B,OACEkB,MAAA/B,cAAA,SAAAgC,EAAA,CAEElB,KAAMA,EACNmB,UAAW,EACX9B,QAASqB,EACTU,UAAWJ,EACXV,UAAWe,EACTC,EAAQC,OACR5B,GAAQ2B,EAAQ3B,KAChBd,GAAWyC,EAAQzC,GACnBe,GAAY0B,EAAQ1B,SACpBC,GAASyB,EAAQzB,MACjBQ,GAAYiB,EAAQjB,SACpBJ,GAAeqB,EAAQrB,YACvBC,GAAaoB,EAAQpB,UACrBC,GAAWmB,EAAQnB,QACnBC,GAAYkB,EAAQlB,SACpBE,GAEFC,GAAI,GAAGA,GAAOC,GAAoBgB,EAAUhB,KAC5C,cAAa,GAAIvB,EAAiCwC,YAAexC,EAAiC,gBAAkBsB,GAAOC,GAAoBgB,EAAUhB,MACrJvB,GAEJgC,MAAA/B,cAACR,EAAY,CAACG,QAASA,EAASC,KAAMA,EAAMC,OAAQA,GACjDW,GAASA,EACTV,GAAYA,GAER,IAObQ,EAAOD,YAAc,SAErB,MAAMmC,EAAgB,CACpB,UACA,WACA,YACA,QACA,SACA,OACA,WACA,SAGWC,EAAkChD,GAAuBM,IACpE,MAAM2C,EAAuC,CAAA,EACvCC,EAAqC,CAAA,EAa3C,OAXAC,OAAOC,QAAQ9C,GAAO+C,SAAQC,IAAsC,IAApCC,EAAMC,GAAyBF,EACzDP,EAAcU,SAASF,GAEzBL,EAAUK,GAAQC,EAElBP,EAAYM,GAAQC,CACtB,IAGFN,EAAU7C,SAAWC,EAAMD,SAGzBiC,MAAA/B,cAACM,EAAM0B,KAAMU,EAAW,CAAkBzB,SAAO,IAC9ClB,EAAMoD,aAAepD,EAAMoD,aAC1BpD,EAAMoD,aAAgBpB,MAAA/B,cAACoD,EAAcT,GAChC,IAIbF,EAAWpC,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var t={"overflow-hidden":"button-module_overflow-hidden__Vc5AU","text-truncate":"button-module_text-truncate__a89Bp","text-nowrap":"button-module_text-nowrap__tR-VJ","text-ellipsis":"button-module_text-ellipsis__5MFA9",button:"button-module_button__NDMQS",info:"button-module_info__O6gEW",transparent:"button-module_transparent__zbeBu",success:"button-module_success__gM25y",error:"button-module_error__q9qqo",warning:"button-module_warning__MdmiZ",tiny:"button-module_tiny__pBNwo",fluid:"button-module_fluid__GXxID",truncate:"button-module_truncate__c-G9k",animated:"button-module_animated__gLwPl",hasShadow:"button-module_hasShadow__42BQv",hasIcon:"button-module_hasIcon__dXLlJ",disabled:"button-module_disabled__hEydO"};export{t as default};
|
|
1
|
+
var t={"overflow-hidden":"button-module_overflow-hidden__Vc5AU","text-truncate":"button-module_text-truncate__a89Bp","text-nowrap":"button-module_text-nowrap__tR-VJ","text-ellipsis":"button-module_text-ellipsis__5MFA9",button:"button-module_button__NDMQS",info:"button-module_info__O6gEW",transparent:"button-module_transparent__zbeBu",success:"button-module_success__gM25y",error:"button-module_error__q9qqo",warning:"button-module_warning__MdmiZ",link:"button-module_link__e-4Fu",tiny:"button-module_tiny__pBNwo",fluid:"button-module_fluid__GXxID",truncate:"button-module_truncate__c-G9k",animated:"button-module_animated__gLwPl",hasShadow:"button-module_hasShadow__42BQv",hasIcon:"button-module_hasIcon__dXLlJ",disabled:"button-module_disabled__hEydO"};export{t as default};
|
|
2
2
|
//# sourceMappingURL=button.module.scss.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,useCallback as a,useMemo as l,createElement as n}from"react";import{classNames as o}from"../../../utils/helpers/ui.js";import c from"./field.module.scss.js";let s=()=>"#000000";const i=e=>{s=e};let r=t((function(){return React.createElement("span",null)}));const m=e=>{r=e},p=t((function(t){let{options:a,value:l,inputRef:n,...o}=t;return React.createElement("div",{className:"select"},React.createElement("select",e({},o,{ref:n,defaultValue:l}),a?.map((e=>React.createElement("option",{key:`${JSON.stringify(e)}`,value:"object"==typeof e?e?.value:e},"object"==typeof e?e?.label:e)))))})),u=t((e=>n("textarea",e)));u.displayName="TextAreaComponent";const d=t((e=>n("input",e)));d.displayName="InputComponent";const f=t((t=>{let{label:n,name:i,type:m="text",value:f,defaultValue:h,placeholder:R,inputRef:N,error:g,disabled:E,userDisabled:v,withoutComponent:y,helpTextInfo:C,helpText:b,children:x,iconLeft:j,iconRight:k,addon:F,className:I,onChange:B,onChangeInner:D,onBlur:w,onFocus:T,rightIconClick:V,leftIconClick:$,options:K,style:L,..._}=t,A=d;x||"textarea"!==m||(A=u);const H=a((e=>{v?e?.preventDefault?.():T&&T(e)}),[v,T]),J=a((e=>{v||(D&&e?.target?(e.target.value=D(e.target.value),B&&B(e)):B&&B(e))}),[D,B,v]),O=l((()=>void 0===f?{defaultValue:h}:{value:f}),[f,h]);return React.createElement("div",{className:o(c.field,(E||v)&&c.
|
|
1
|
+
import{extends as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as t,useCallback as a,useMemo as l,createElement as n}from"react";import{classNames as o}from"../../../utils/helpers/ui.js";import c from"./field.module.scss.js";let s=()=>"#000000";const i=e=>{s=e};let r=t((function(){return React.createElement("span",null)}));const m=e=>{r=e},p=t((function(t){let{options:a,value:l,inputRef:n,...o}=t;return React.createElement("div",{className:"select"},React.createElement("select",e({},o,{ref:n,defaultValue:l}),a?.map((e=>React.createElement("option",{key:`${JSON.stringify(e)}`,value:"object"==typeof e?e?.value:e},"object"==typeof e?e?.label:e)))))})),u=t((e=>n("textarea",e)));u.displayName="TextAreaComponent";const d=t((e=>n("input",e)));d.displayName="InputComponent";const f=t((t=>{let{label:n,name:i,type:m="text",value:f,defaultValue:h,placeholder:R,inputRef:N,error:g,disabled:E,userDisabled:v,withoutComponent:y,helpTextInfo:C,helpText:b,children:x,iconLeft:j,iconRight:k,addon:F,className:I,onChange:B,onChangeInner:D,onBlur:w,onFocus:T,rightIconClick:V,leftIconClick:$,options:K,style:L,..._}=t,A=d;x||"textarea"!==m||(A=u);const H=a((e=>{v?e?.preventDefault?.():T&&T(e)}),[v,T]),J=a((e=>{v||(D&&e?.target?(e.target.value=D(e.target.value),B&&B(e)):B&&B(e))}),[D,B,v]),O=l((()=>void 0===f?{defaultValue:h}:{value:f}),[f,h]);return React.createElement("div",{className:o(c.field,(E||v)&&c.disabled,I),style:L},React.createElement("label",{htmlFor:i,className:"label"},n),React.createElement("div",{className:"field "+(F?"has-addons":"")},React.createElement("div",{className:`control mainControl ${j&&!y?"has-icons-left":""} ${k?"has-icons-right":""}`},!y&&(x||"select"!==m&&!K?!x&&React.createElement(A,e({name:i,id:i,ref:N,className:"input "+(g?"is-danger":""),type:m,placeholder:R},O,{onChange:J,onBlur:w,onFocus:H,onKeyDown:H,autoComplete:"off",disabled:E},_)):React.createElement(p,e({name:i,id:i,inputRef:N,className:"input "+(g?"is-danger":""),type:"select",placeholder:R,value:f,options:K,onChange:B,onBlur:w,onFocus:H,onKeyDown:H,autoComplete:"off",disabled:E},_))),j&&!y&&React.createElement("span",{className:"iconLeft icon is-small is-left "+($?"is-action":""),onClick:$},React.createElement(r,{iconName:j,color:s})),k&&React.createElement("span",{className:"iconRight icon is-small is-right "+(V?"is-action":""),onClick:V},React.createElement(r,{iconName:k,color:s})),x&&x),F&&F),C&&React.createElement("p",{className:"help"},C),b&&React.createElement("p",{className:"help "+(g?"is-danger":"")},b))}));f.displayName="Field";export{f as Field,p as Select,i as setIconColor,m as setIconComponent};
|
|
2
2
|
//# sourceMappingURL=Field.js.map
|
|
@@ -1 +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, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\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\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 checked?: 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 style?: CSSProperties\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)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\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 style,\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 <div\n className={classNames(\n classes.field,\n (disabled || userDisabled) && classes.disable,\n className,\n )}\n // TODO fix\n // error={error}\n style={style}\n >\n <label htmlFor={name} className='label'>{label}</label>\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 </div>\n )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","Select","_ref","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","Component","handleFocus","useCallback","event","preventDefault","handleChange","target","valueProps","useMemo","undefined","classNames","classes","field","disable","htmlFor","id","onKeyDown","autoComplete","onClick","iconName"],"mappings":"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"}
|
|
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, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\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\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 checked?: 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 style?: CSSProperties\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)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\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 style,\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 <div\n className={classNames(\n classes.field,\n (disabled || userDisabled) && classes.disabled,\n className,\n )}\n // TODO fix\n // error={error}\n style={style}\n >\n <label htmlFor={name} className='label'>{label}</label>\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 </div>\n )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","Select","_ref","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","Component","handleFocus","useCallback","event","preventDefault","handleChange","target","valueProps","useMemo","undefined","classNames","classes","field","htmlFor","id","onKeyDown","autoComplete","onClick","iconName"],"mappings":"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"}
|
package/dist/ui/index.css
CHANGED
|
@@ -392,6 +392,19 @@
|
|
|
392
392
|
.button-module_button__NDMQS.button-module_warning__MdmiZ.button-module_transparent__zbeBu {
|
|
393
393
|
border: 1px solid #FFCC3D !important;
|
|
394
394
|
}
|
|
395
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu {
|
|
396
|
+
border: none !important;
|
|
397
|
+
background-color: transparent !important;
|
|
398
|
+
background: transparent !important;
|
|
399
|
+
}
|
|
400
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu:hover {
|
|
401
|
+
border: none !important;
|
|
402
|
+
background-color: transparent !important;
|
|
403
|
+
background: transparent !important;
|
|
404
|
+
}
|
|
405
|
+
.button-module_button__NDMQS.button-module_link__e-4Fu:hover * {
|
|
406
|
+
text-decoration: underline !important;
|
|
407
|
+
}
|
|
395
408
|
.button-module_button__NDMQS.button-module_transparent__zbeBu {
|
|
396
409
|
border: none !important;
|
|
397
410
|
background-color: transparent !important;
|
|
@@ -432,6 +445,9 @@
|
|
|
432
445
|
.button-module_button__NDMQS:hover.button-module_animated__gLwPl {
|
|
433
446
|
transform: scale(1.2);
|
|
434
447
|
}
|
|
448
|
+
.button-module_button__NDMQS:hover.button-module_transparent__zbeBu {
|
|
449
|
+
background-color: rgba(197, 197, 197, 0.1254901961) !important;
|
|
450
|
+
}
|
|
435
451
|
.button-module_button__NDMQS.button-module_disabled__hEydO {
|
|
436
452
|
user-select: none;
|
|
437
453
|
pointer-events: none;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("
|
|
1
|
+
"use strict";var e=require("../../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("./button.module.scss.js"),n=require("../text/Link.js"),r=require("../../../../utils/helpers/ui.js"),o=require("../../../../utils/helpers/text.js"),i=require("../../icon/IconBase.js");const s={ENTER:{key:"Enter",keyCode:13}},l=t.memo((e=>{let{variant:a,href:o,target:i,children:s,...l}=e;return"link"===a?t.createElement(n.Link,{width:"100%",href:o,target:i,...l,onClick:r.noop},s):t.createElement("span",{},s)}));l.displayName="InnerElement";const c=t.memo((n=>{let{label:i,children:c,variant:d,tiny:u,truncate:p,fluid:m,preventDefualt:h,stopPropagation:f,onClick:E,type:I="button",transparent:g,hasShadow:k,hasIcon:y,disabled:b,animated:v=!1,className:C="",id:x,href:N,target:j,...q}=n;const B=`${i||c?.toString()}`,P=t.useCallback((e=>{h&&e.preventDefault(),f&&(e.stopPropagation(),e.nativeEvent.stopImmediatePropagation()),E?.(e)}),[E,h,f]),R=t.useCallback((e=>{e.key===s.ENTER.key&&(h&&e.preventDefault(),f&&(e.stopPropagation(),e.nativeEvent.stopImmediatePropagation()),E?.(e))}),[E,h,f]);return React.createElement("button",e.extends({type:I,tabIndex:-1,onClick:P,onKeyDown:R,className:r.classNames(a.default.button,u&&a.default.tiny,d&&a.default[d],p&&a.default.truncate,m&&a.default.fluid,v&&a.default.animated,g&&a.default.transparent,k&&a.default.hasShadow,y&&a.default.hasIcon,b&&a.default.disabled,C),id:`${x||B&&o.composeId(B)}`,"data-testid":`${q.dataTestId||q["data-testid"]||x||B&&o.composeId(B)}`},q),React.createElement(l,{variant:d,href:N,target:j},i&&i,c||c))}));c.displayName="Button";const d=["iconUrl","minWidth","minHeight","width","height","size","fontSize","color"],u=t.memo((t=>{const a={},n={};return Object.entries(t).forEach((e=>{let[t,r]=e;d.includes(t)?n[t]=r:a[t]=r})),n.children=t.children,React.createElement(c,e.extends({},a,{hasIcon:!0}),t.iconContent&&t.iconContent,!t.iconContent&&React.createElement(i.IconBase,n))}));u.displayName="IconButton",exports.Button=c,exports.IconButton=u,exports.keys=s;
|
|
2
2
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"sourcesContent":["import { memo, useCallback, MouseEvent, KeyboardEvent, createElement, FC, HTMLAttributes } from 'react'\n\nimport { classNames, composeId, noop } from '../../../../utils'\nimport { Alerts } from '../../../../constants'\nimport {
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../../../../../src/core/ui/components/atoms/button/Button.tsx"],"sourcesContent":["import { memo, useCallback, MouseEvent, KeyboardEvent, createElement, FC, HTMLAttributes } from 'react'\n\nimport { classNames, composeId, noop } from '../../../../utils'\nimport { Alerts } from '../../../../constants'\nimport { Link } from '../text'\nimport { IconBase, IconBaseProps } from '../../icon'\n\nimport type { ButtonProps, IconButtonProps } from './button.types'\nimport classes from './button.module.scss'\n\n\nexport const keys = {\n ENTER: {\n key: 'Enter',\n keyCode: 13,\n },\n}\n\ntype InnerElementsProps = Partial<ButtonProps> & Partial<HTMLAttributes<HTMLAnchorElement>>\n\nconst InnerElement: FC<InnerElementsProps> = memo(({\n variant, href, target, children, ...props\n}: Omit<InnerElementsProps, 'onClick'>) => {\n if (variant === 'link') {\n return createElement(Link, { width: '100%', href, target, ...props, onClick: noop }, children)\n }\n return createElement('span', {}, children)\n})\n\nInnerElement.displayName = 'InnerElement'\n\n/**\n * Button component for displaying buttons with optional features.\n * @component\n *\n * Generated component from Template\n * @param {object} props - The component props.\n * @param {string} props.label - The value to be displayed in the button.\n * @param {ReactNode} [props.children] - Additional content to be displayed inside the button.\n * @param {string} [props.variant] - The variant of the button (e.g., 'primary', 'secondary').\n * @param {boolean} [props.tiny] - Whether the button should be tiny.\n * @param {boolean} [props.truncate] - Whether the content inside the button should be truncated.\n * @param {boolean} [props.fluid] - Whether the button should have a fluid width.\n * @param {boolean} [props.animated=true] - Whether the button should have animation (default is true).\n * @param {string} [props.className] - Additional classes to be applied to the button.\n * @param {...object} props.props - Additional props to be spread to the underlying div element.\n *\n * @returns {JSX.Element} The rendered Button component.\n */\nexport const Button = memo(({\n label, children,\n variant, tiny, truncate, fluid,\n preventDefualt, stopPropagation,\n onClick,\n type = 'button',\n transparent,\n hasShadow,\n hasIcon,\n disabled,\n animated = false, className = '', id,\n href,\n target,\n ...props\n}: ButtonProps) => {\n const textFromChildren: string | undefined = `${label || children?.toString()}`\n\n const clickHandler = useCallback((event: MouseEvent) => {\n if (preventDefualt) {\n event.preventDefault()\n }\n if (stopPropagation) {\n event.stopPropagation()\n event.nativeEvent.stopImmediatePropagation()\n }\n onClick?.(event)\n }, [onClick, preventDefualt, stopPropagation])\n\n const keyDownHandler = useCallback((event: KeyboardEvent) => {\n if (event.key === keys.ENTER.key) {\n if (preventDefualt) {\n event.preventDefault()\n }\n if (stopPropagation) {\n event.stopPropagation()\n event.nativeEvent.stopImmediatePropagation()\n }\n onClick?.(event)\n }\n }, [onClick, preventDefualt, stopPropagation])\n\n return (\n <button\n // eslint-disable-next-line react/button-has-type\n type={type}\n tabIndex={-1}\n onClick={clickHandler}\n onKeyDown={keyDownHandler}\n className={classNames(\n classes.button,\n tiny && classes.tiny,\n variant && classes[variant as Alerts],\n truncate && classes.truncate,\n fluid && classes.fluid,\n animated && classes.animated,\n transparent && classes.transparent,\n hasShadow && classes.hasShadow,\n hasIcon && classes.hasIcon,\n disabled && classes.disabled,\n className,\n )}\n id={`${id || (textFromChildren && composeId(textFromChildren))}`}\n data-testid={`${(props as Record<string, string>).dataTestId || (props as Record<string, string>)['data-testid'] || id || (textFromChildren && composeId(textFromChildren))}`}\n {...props}\n >\n <InnerElement variant={variant} href={href} target={target}>\n {label && label}\n {children || children}\n </InnerElement>\n </button>\n )\n})\n\nexport type ButtonType = typeof Button\n\n// Set display name for the component.\nButton.displayName = 'Button'\n\nconst iconBaseProps = [\n 'iconUrl',\n 'minWidth',\n 'minHeight',\n 'width',\n 'height',\n 'size',\n 'fontSize',\n 'color',\n]\n\nexport const IconButton: FC<IconButtonProps> = memo<IconButtonProps>((props: IconButtonProps) => {\n const buttonProps: Record<string, unknown> = {}\n const iconProps: Record<string, unknown> = {}\n\n Object.entries(props).forEach(([name, value]: [string, unknown]) => {\n if (iconBaseProps.includes(name)) {\n // eslint-disable-next-line no-param-reassign\n iconProps[name] = value\n } else {\n buttonProps[name] = value\n }\n })\n\n iconProps.children = props.children\n\n return (\n <Button {...(buttonProps as ButtonProps)} hasIcon>\n {props.iconContent && props.iconContent}\n {!props.iconContent && (<IconBase {...(iconProps as IconBaseProps)} />)}\n </Button>\n )\n})\n\nIconButton.displayName = 'IconButton'\n"],"names":["keys","ENTER","key","keyCode","InnerElement","memo","_ref","variant","href","target","children","props","createElement","Link","width","onClick","noop","displayName","Button","_ref2","label","tiny","truncate","fluid","preventDefualt","stopPropagation","type","transparent","hasShadow","hasIcon","disabled","animated","className","id","textFromChildren","toString","clickHandler","useCallback","event","preventDefault","nativeEvent","stopImmediatePropagation","keyDownHandler","React","_extends","tabIndex","onKeyDown","classNames","classes","default","button","composeId","dataTestId","iconBaseProps","IconButton","buttonProps","iconProps","Object","entries","forEach","_ref3","name","value","includes","iconContent","IconBase"],"mappings":"2SAWO,MAAMA,EAAO,CAClBC,MAAO,CACLC,IAAK,QACLC,QAAS,KAMPC,EAAuCC,EAAIA,MAACC,IAEP,IAFQC,QACjDA,EAAOC,KAAEA,EAAIC,OAAEA,EAAMC,SAAEA,KAAaC,GACAL,EACpC,MAAgB,SAAZC,EACKK,EAAAA,cAAcC,EAAAA,KAAM,CAAEC,MAAO,OAAQN,OAAMC,YAAWE,EAAOI,QAASC,EAAAA,MAAQN,GAEhFE,gBAAc,OAAQ,CAAE,EAAEF,EAAS,IAG5CN,EAAaa,YAAc,qBAoBdC,EAASb,EAAIA,MAACc,IAcR,IAdSC,MAC1BA,EAAKV,SAAEA,EAAQH,QACfA,EAAOc,KAAEA,EAAIC,SAAEA,EAAQC,MAAEA,EAAKC,eAC9BA,EAAcC,gBAAEA,EAAeV,QAC/BA,EAAOW,KACPA,EAAO,SAAQC,YACfA,EAAWC,UACXA,EAASC,QACTA,EAAOC,SACPA,EAAQC,SACRA,GAAW,EAAKC,UAAEA,EAAY,GAAEC,GAAEA,EAAEzB,KACpCA,EAAIC,OACJA,KACGE,GACSQ,EACZ,MAAMe,EAAuC,GAAGd,GAASV,GAAUyB,aAE7DC,EAAeC,EAAWA,aAAEC,IAC5Bd,GACFc,EAAMC,iBAEJd,IACFa,EAAMb,kBACNa,EAAME,YAAYC,4BAEpB1B,IAAUuB,EAAM,GACf,CAACvB,EAASS,EAAgBC,IAEvBiB,EAAiBL,EAAWA,aAAEC,IAC9BA,EAAMpC,MAAQF,EAAKC,MAAMC,MACvBsB,GACFc,EAAMC,iBAEJd,IACFa,EAAMb,kBACNa,EAAME,YAAYC,4BAEpB1B,IAAUuB,GACZ,GACC,CAACvB,EAASS,EAAgBC,IAE7B,OACEkB,MAAA/B,cAAA,SAAAgC,UAAA,CAEElB,KAAMA,EACNmB,UAAW,EACX9B,QAASqB,EACTU,UAAWJ,EACXV,UAAWe,EAAUA,WACnBC,EAAOC,QAACC,OACR7B,GAAQ2B,EAAOC,QAAC5B,KAChBd,GAAWyC,EAAAA,QAAQzC,GACnBe,GAAY0B,EAAOC,QAAC3B,SACpBC,GAASyB,UAAQzB,MACjBQ,GAAYiB,EAAAA,QAAQjB,SACpBJ,GAAeqB,EAAAA,QAAQrB,YACvBC,GAAaoB,EAAOC,QAACrB,UACrBC,GAAWmB,EAAOC,QAACpB,QACnBC,GAAYkB,EAAOC,QAACnB,SACpBE,GAEFC,GAAI,GAAGA,GAAOC,GAAoBiB,EAASA,UAACjB,KAC5C,cAAa,GAAIvB,EAAiCyC,YAAezC,EAAiC,gBAAkBsB,GAAOC,GAAoBiB,YAAUjB,MACrJvB,GAEJgC,MAAA/B,cAACR,EAAY,CAACG,QAASA,EAASC,KAAMA,EAAMC,OAAQA,GACjDW,GAASA,EACTV,GAAYA,GAER,IAObQ,EAAOD,YAAc,SAErB,MAAMoC,EAAgB,CACpB,UACA,WACA,YACA,QACA,SACA,OACA,WACA,SAGWC,EAAkCjD,EAAIA,MAAmBM,IACpE,MAAM4C,EAAuC,CAAA,EACvCC,EAAqC,CAAA,EAa3C,OAXAC,OAAOC,QAAQ/C,GAAOgD,SAAQC,IAAsC,IAApCC,EAAMC,GAAyBF,EACzDP,EAAcU,SAASF,GAEzBL,EAAUK,GAAQC,EAElBP,EAAYM,GAAQC,CACtB,IAGFN,EAAU9C,SAAWC,EAAMD,SAGzBiC,MAAA/B,cAACM,EAAM0B,EAAAA,WAAMW,EAAW,CAAkB1B,SAAO,IAC9ClB,EAAMqD,aAAerD,EAAMqD,aAC1BrD,EAAMqD,aAAgBrB,MAAA/B,cAACqD,WAAcT,GAChC,IAIbF,EAAWrC,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.default={"overflow-hidden":"button-module_overflow-hidden__Vc5AU","text-truncate":"button-module_text-truncate__a89Bp","text-nowrap":"button-module_text-nowrap__tR-VJ","text-ellipsis":"button-module_text-ellipsis__5MFA9",button:"button-module_button__NDMQS",info:"button-module_info__O6gEW",transparent:"button-module_transparent__zbeBu",success:"button-module_success__gM25y",error:"button-module_error__q9qqo",warning:"button-module_warning__MdmiZ",tiny:"button-module_tiny__pBNwo",fluid:"button-module_fluid__GXxID",truncate:"button-module_truncate__c-G9k",animated:"button-module_animated__gLwPl",hasShadow:"button-module_hasShadow__42BQv",hasIcon:"button-module_hasIcon__dXLlJ",disabled:"button-module_disabled__hEydO"};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.default={"overflow-hidden":"button-module_overflow-hidden__Vc5AU","text-truncate":"button-module_text-truncate__a89Bp","text-nowrap":"button-module_text-nowrap__tR-VJ","text-ellipsis":"button-module_text-ellipsis__5MFA9",button:"button-module_button__NDMQS",info:"button-module_info__O6gEW",transparent:"button-module_transparent__zbeBu",success:"button-module_success__gM25y",error:"button-module_error__q9qqo",warning:"button-module_warning__MdmiZ",link:"button-module_link__e-4Fu",tiny:"button-module_tiny__pBNwo",fluid:"button-module_fluid__GXxID",truncate:"button-module_truncate__c-G9k",animated:"button-module_animated__gLwPl",hasShadow:"button-module_hasShadow__42BQv",hasIcon:"button-module_hasIcon__dXLlJ",disabled:"button-module_disabled__hEydO"};
|
|
2
2
|
//# sourceMappingURL=button.module.scss.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("../../../utils/helpers/ui.js"),l=require("./field.module.scss.js");let n=()=>"#000000";let o=t.memo((function(){return React.createElement("span",null)}));const s=t.memo((function(t){let{options:a,value:l,inputRef:n,...o}=t;return React.createElement("div",{className:"select"},React.createElement("select",e.extends({},o,{ref:n,defaultValue:l}),a?.map((e=>React.createElement("option",{key:`${JSON.stringify(e)}`,value:"object"==typeof e?e?.value:e},"object"==typeof e?e?.label:e)))))})),c=t.memo((e=>t.createElement("textarea",e)));c.displayName="TextAreaComponent";const r=t.memo((e=>t.createElement("input",e)));r.displayName="InputComponent";const i=t.memo((i=>{let{label:m,name:u,type:p="text",value:d,defaultValue:f,placeholder:h,inputRef:R,error:N,disabled:C,userDisabled:E,withoutComponent:g,helpTextInfo:v,helpText:b,children:y,iconLeft:x,iconRight:k,addon:I,className:F,onChange:j,onChangeInner:q,onBlur:B,onFocus:D,rightIconClick:w,leftIconClick:T,options:V,style:$,...K}=i,L=r;y||"textarea"!==p||(L=c);const S=t.useCallback((e=>{E?e?.preventDefault?.():D&&D(e)}),[E,D]),_=t.useCallback((e=>{E||(q&&e?.target?(e.target.value=q(e.target.value),j&&j(e)):j&&j(e))}),[q,j,E]),A=t.useMemo((()=>void 0===d?{defaultValue:f}:{value:d}),[d,f]);return React.createElement("div",{className:a.classNames(l.default.field,(C||E)&&l.default.
|
|
1
|
+
"use strict";var e=require("../../../../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("../../../utils/helpers/ui.js"),l=require("./field.module.scss.js");let n=()=>"#000000";let o=t.memo((function(){return React.createElement("span",null)}));const s=t.memo((function(t){let{options:a,value:l,inputRef:n,...o}=t;return React.createElement("div",{className:"select"},React.createElement("select",e.extends({},o,{ref:n,defaultValue:l}),a?.map((e=>React.createElement("option",{key:`${JSON.stringify(e)}`,value:"object"==typeof e?e?.value:e},"object"==typeof e?e?.label:e)))))})),c=t.memo((e=>t.createElement("textarea",e)));c.displayName="TextAreaComponent";const r=t.memo((e=>t.createElement("input",e)));r.displayName="InputComponent";const i=t.memo((i=>{let{label:m,name:u,type:p="text",value:d,defaultValue:f,placeholder:h,inputRef:R,error:N,disabled:C,userDisabled:E,withoutComponent:g,helpTextInfo:v,helpText:b,children:y,iconLeft:x,iconRight:k,addon:I,className:F,onChange:j,onChangeInner:q,onBlur:B,onFocus:D,rightIconClick:w,leftIconClick:T,options:V,style:$,...K}=i,L=r;y||"textarea"!==p||(L=c);const S=t.useCallback((e=>{E?e?.preventDefault?.():D&&D(e)}),[E,D]),_=t.useCallback((e=>{E||(q&&e?.target?(e.target.value=q(e.target.value),j&&j(e)):j&&j(e))}),[q,j,E]),A=t.useMemo((()=>void 0===d?{defaultValue:f}:{value:d}),[d,f]);return React.createElement("div",{className:a.classNames(l.default.field,(C||E)&&l.default.disabled,F),style:$},React.createElement("label",{htmlFor:u,className:"label"},m),React.createElement("div",{className:"field "+(I?"has-addons":"")},React.createElement("div",{className:`control mainControl ${x&&!g?"has-icons-left":""} ${k?"has-icons-right":""}`},!g&&(y||"select"!==p&&!V?!y&&React.createElement(L,e.extends({name:u,id:u,ref:R,className:"input "+(N?"is-danger":""),type:p,placeholder:h},A,{onChange:_,onBlur:B,onFocus:S,onKeyDown:S,autoComplete:"off",disabled:C},K)):React.createElement(s,e.extends({name:u,id:u,inputRef:R,className:"input "+(N?"is-danger":""),type:"select",placeholder:h,value:d,options:V,onChange:j,onBlur:B,onFocus:S,onKeyDown:S,autoComplete:"off",disabled:C},K))),x&&!g&&React.createElement("span",{className:"iconLeft icon is-small is-left "+(T?"is-action":""),onClick:T},React.createElement(o,{iconName:x,color:n})),k&&React.createElement("span",{className:"iconRight icon is-small is-right "+(w?"is-action":""),onClick:w},React.createElement(o,{iconName:k,color:n})),y&&y),I&&I),v&&React.createElement("p",{className:"help"},v),b&&React.createElement("p",{className:"help "+(N?"is-danger":"")},b))}));i.displayName="Field",exports.Field=i,exports.Select=s,exports.setIconColor=e=>{n=e},exports.setIconComponent=e=>{o=e};
|
|
2
2
|
//# sourceMappingURL=Field.js.map
|
|
@@ -1 +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, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\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\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 checked?: 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 style?: CSSProperties\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)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\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 style,\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 <div\n className={classNames(\n classes.field,\n (disabled || userDisabled) && classes.disable,\n className,\n )}\n // TODO fix\n // error={error}\n style={style}\n >\n <label htmlFor={name} className='label'>{label}</label>\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 </div>\n )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","IconComponent","memo","React","createElement","setIconComponent","Select","_ref","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","Component","handleFocus","useCallback","event","preventDefault","handleChange","target","valueProps","useMemo","undefined","classNames","classes","default","field","disable","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","color","component"],"mappings":"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"}
|
|
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, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\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\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 checked?: 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 style?: CSSProperties\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)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\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 style,\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 <div\n className={classNames(\n classes.field,\n (disabled || userDisabled) && classes.disabled,\n className,\n )}\n // TODO fix\n // error={error}\n style={style}\n >\n <label htmlFor={name} className='label'>{label}</label>\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 </div>\n )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","IconComponent","memo","React","createElement","setIconComponent","Select","_ref","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","Component","handleFocus","useCallback","event","preventDefault","handleChange","target","valueProps","useMemo","undefined","classNames","classes","default","field","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","color","component"],"mappings":"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"}
|