armtek-uikit-react 1.0.15 → 1.0.16

package/cjs/ui/Form/Select/Select.js

@@ -0,0 +1,143 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.getOptionValue = exports.default = void 0;
+var _TextField = _interopRequireDefault(require("../TextField/TextField"));
+var _react = require("react");
+var _ButtonIcon = _interopRequireDefault(require("../../ButtonIcon"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _ListItem = _interopRequireDefault(require("../../List/ListItem"));
+var _useClickOutside = _interopRequireDefault(require("../../../lib/hooks/useClickOutside"));
+var _SelectModule = _interopRequireDefault(require("./Select.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['select', 'select__input_wrapper', 'select__input', 'options', 'options_inline'];
+
+// const css = getCssPrefix(CssClasses)
+
+const getOptionValue = option => option.value || option.text;
+exports.getOptionValue = getOptionValue;
+function Select(props) {
+  var _options$find;
+  let {
+    options,
+    endAdornment,
+    className,
+    inline,
+    multiple = false,
+    value,
+    defaultValue,
+    onChange,
+    ...inputProps
+  } = props;
+  let [active, setActive] = (0, _react.useState)(false);
+  let [selected, setSelected] = (0, _react.useState)(defaultValue || (multiple ? [] : ''));
+  let selectRef = (0, _react.useRef)(null);
+  let optRef = (0, _useClickOutside.default)(() => setActive(false));
+  const handleActive = flag => {
+    setActive(prev => flag !== undefined ? flag : !prev);
+  };
+  const handleSelect = option => {
+    let v = getOptionValue(option);
+    let mSelected = selected;
+    let newValueS = v;
+    let newValueM = mSelected.includes(v) ? mSelected.filter(item => item !== v) : mSelected.concat(v);
+    setSelected(multiple ? newValueM : newValueS);
+    if (onChange) onChange(multiple ? newValueM : newValueS);
+    if (!multiple) setActive(false);
+
+    // if(selectRef.current)
+    // 	selectRef.current.dispatchEvent(new Event('change', { bubbles: true }))
+  };
+
+  // const handleChange = (e: ChangeEvent<HTMLSelectElement>) => {
+  // let option = options.find(item => getOptionValue(item) === e.target.value)
+  // if( option )
+  // {
+  // 	let v = getOptionValue(option)
+  // 	setSelected(!multiple ? v : prev => prev?.concat(v) || [v])
+  // 	if( !multiple )
+  // 		setActive(false)
+  // }
+  // }
+
+  let selectEndAdornment = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [endAdornment, /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonIcon.default, {
+      onClick: () => handleActive,
+      size: 'small',
+      variant: 'transparent',
+      className: 'material_icon',
+      children: "arrow_drop_down"
+    })]
+  });
+  let selectProps = {};
+  // if( value !== undefined )
+  // {
+  // 	selectProps.value = value
+  // 	selectProps.onChange = handleChange
+  // }
+
+  let realValue = value !== undefined ? value : selected;
+  let selectedText = multiple ? options.filter(item => realValue == null ? void 0 : realValue.includes(getOptionValue(item))).map(item => item.text).join(', ') : ((_options$find = options.find(item => getOptionValue(item) === realValue)) == null ? void 0 : _options$find.text) || '';
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: _SelectModule.default.select,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: _SelectModule.default.select__input_wrapper,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("select", {
+          multiple: multiple,
+          ref: selectRef,
+          ...selectProps,
+          style: {
+            display: 'none'
+          },
+          children: options.map(item => /*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
+            children: item.text
+          }, item.text))
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+          ...inputProps,
+          value: selectedText,
+          onClick: () => setActive(true),
+          className: (0, _clsx.default)(_SelectModule.default.select__input, className),
+          endAdornment: selectEndAdornment
+        })]
+      }), active && /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectOptions, {
+        ref: optRef,
+        options: options,
+        multiple: multiple,
+        value: realValue,
+        inline: inline,
+        onClick: handleSelect
+      })]
+    })
+  });
+}
+const SelectOptions = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  let {
+    options,
+    value,
+    multiple,
+    inline,
+    onClick
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      ref: ref,
+      className: (0, _clsx.default)(_SelectModule.default.options, {
+        [_SelectModule.default.options_inline]: !!inline
+      }),
+      children: options.map((item, index) => {
+        let optValue = getOptionValue(item);
+        let active = multiple === true && value ? value.includes(optValue) : optValue === value;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItem.default, {
+          active: active,
+          onClick: () => onClick(item),
+          children: item.text
+        }, index);
+      })
+    })
+  });
+});
+var _default = Select;
+exports.default = _default;

package/cjs/ui/Form/Switch/Switch.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _clsx = _interopRequireDefault(require("clsx"));
+var _SwitchModule = _interopRequireDefault(require("./Switch.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['switch', 'switch__input', 'switch__slider', 'switch_small'];
+
+// const css = getCssPrefix(CssClasses)
+
+const Switch = props => {
+  let {
+    onChange,
+    size,
+    ...restProps
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
+      className: (0, _clsx.default)(_SwitchModule.default.switch, _SwitchModule.default['switch_' + props.size]),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        className: _SwitchModule.default.switch__input,
+        ...restProps,
+        type: "checkbox"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: _SwitchModule.default.switch__slider
+      })]
+    })
+  });
+};
+var _default = Switch;
+exports.default = _default;
+module.exports = exports.default;

package/cjs/ui/Form/TextArea/TextArea.js

@@ -0,0 +1,50 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _TextField = _interopRequireDefault(require("../TextField/TextField"));
+var _react = require("react");
+var _clsx = _interopRequireDefault(require("clsx"));
+var _TextAreaModule = _interopRequireDefault(require("./TextArea.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['textarea', 'size_small'];
+
+// const css = getCssPrefix(CssClasses)
+
+const TextArea = props => {
+  var _textareaRef$current, _textareaRef$current2;
+  let {
+    onChange,
+    className,
+    ...restProps
+  } = props;
+  let [value, setValue] = (0, _react.useState)('');
+  let [minHeight, setMinHeight] = (0, _react.useState)(0);
+  let textareaRef = (0, _react.useRef)();
+  const handleChange = e => {
+    setValue(e.target.value);
+    if (onChange) onChange(e);
+  };
+  (0, _react.useEffect)(() => {
+    if (textareaRef.current) setMinHeight(textareaRef.current.clientHeight);
+  }, [textareaRef]);
+  let textHeight = (((_textareaRef$current = textareaRef.current) == null ? void 0 : _textareaRef$current.scrollHeight) || 0) < minHeight ? minHeight : (_textareaRef$current2 = textareaRef.current) == null ? void 0 : _textareaRef$current2.scrollHeight;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+      ref: textareaRef,
+      value: value,
+      ...restProps,
+      className: (0, _clsx.default)(_TextAreaModule.default.textarea, _TextAreaModule.default['size_' + restProps.size], className),
+      onChange: handleChange,
+      multiline: true,
+      style: {
+        height: textHeight + 'px'
+      }
+    })
+  });
+};
+var _default = TextArea;
+exports.default = _default;
+module.exports = exports.default;

package/cjs/ui/Form/TextField/TextField.js

@@ -0,0 +1,156 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = exports.TextFieldInput = exports.TextFieldContainer = void 0;
+var _react = require("react");
+var _clsx = _interopRequireDefault(require("clsx"));
+var _HelperText = _interopRequireDefault(require("../../HelperText/HelperText"));
+var _TextFieldModule = _interopRequireDefault(require("./TextField.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['textfield__container_outlined', 'textfield__container', 'textfield', 'textfield_outlined', '_focused', '_disabled', '_error', '_label', 'textfield__label_focused', 'textfield__label_small', 'textfield__label_error', 'textfield__label', 'textfield__input', 'textfield__input_outlined', 'size_small', 'textfield__adornment', 'textfield__helperText', 'textfield__icon'];
+
+// const css = getCssPrefix(CssClasses)
+
+const TextField = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  let {
+    error,
+    success,
+    label,
+    helperText,
+    size = 'large',
+    variant = 'solid',
+    endAdornment,
+    className,
+    multiline = false,
+    ...inputProps
+  } = props;
+  let [value, setValue] = (0, _react.useState)('');
+  let [focused, setFocused] = (0, _react.useState)(false);
+  const inputRef = (0, _react.useRef)();
+  const handleFocus = e => {
+    setFocused(true);
+    if (inputProps.onFocus) inputProps.onFocus(e);
+  };
+  const handleBlur = e => {
+    setFocused(false);
+    if (inputProps.onBlur) inputProps.onBlur(e);
+  };
+  let endContent = /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: _TextFieldModule.default.textfield__adornment,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: _TextFieldModule.default.textfield__icon,
+      children: endAdornment
+    }), error && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _clsx.default)('material_icon', 'text_error', _TextFieldModule.default.textfield__icon),
+      children: "error_outline"
+    }), success && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _clsx.default)('material_icon', 'text_success', _TextFieldModule.default.textfield__icon),
+      children: "done"
+    })]
+  });
+  let endContentExists = endAdornment || error || success;
+  let Component = multiline ? 'textarea' : 'input';
+  let realRef = ref || inputRef;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(TextFieldContainer, {
+      size: size,
+      variant: variant,
+      disabled: inputProps.disabled,
+      focused: focused,
+      onClick: () => {
+        var _realRef$current;
+        return (_realRef$current = realRef.current) == null ? void 0 : _realRef$current.focus();
+      },
+      className: className,
+      error: error,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TextFieldInput, {
+        Component: Component,
+        ref: realRef,
+        value: value,
+        onChange: e => setValue(e.target.value),
+        size: size,
+        variant: variant,
+        label: label,
+        focused: focused,
+        error: error,
+        multiline: multiline,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        ...inputProps
+      }), endContentExists && endContent]
+    }), helperText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_HelperText.default, {
+      className: _TextFieldModule.default.textfield__helperText,
+      error: error,
+      children: helperText
+    })]
+  });
+});
+const TextFieldContainer = props => {
+  let {
+    focused,
+    disabled,
+    variant,
+    size,
+    className,
+    children,
+    error,
+    ...restProps
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      ...restProps,
+      className: (0, _clsx.default)(_TextFieldModule.default.textfield, _TextFieldModule.default['textfield_' + variant], _TextFieldModule.default['size_' + size], {
+        [_TextFieldModule.default._focused]: focused,
+        [_TextFieldModule.default._disabled]: disabled,
+        [_TextFieldModule.default._error]: error
+      }, className),
+      children: children
+    })
+  });
+};
+exports.TextFieldContainer = TextFieldContainer;
+const TextFieldInput = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
+  let {
+    Component = 'input',
+    size,
+    variant,
+    multiline,
+    error,
+    focused,
+    label,
+    value,
+    className,
+    ...inputProps
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _clsx.default)(_TextFieldModule.default.textfield__container, _TextFieldModule.default['size_' + size], {
+        [_TextFieldModule.default._label]: !!label,
+        [_TextFieldModule.default.textfield__container_outlined]: variant === 'outlined'
+      }),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+        ref: ref,
+        value: value,
+        ...inputProps,
+        className: (0, _clsx.default)(_TextFieldModule.default.textfield__input, _TextFieldModule.default['size_' + size], _TextFieldModule.default['textfield__input_' + variant], {
+          [_TextFieldModule.default._label]: !!label,
+          [_TextFieldModule.default._focused]: focused,
+          [_TextFieldModule.default._error]: !!error,
+          [_TextFieldModule.default.textarea]: multiline
+        }, className)
+      }), label && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: (0, _clsx.default)(_TextFieldModule.default.textfield__label, {
+          [_TextFieldModule.default.textfield__label_focused]: focused || !!value || !!props.value,
+          [_TextFieldModule.default.textfield__label_small]: size === 'small',
+          [_TextFieldModule.default.textfield__label_error]: error
+        }),
+        children: label
+      })]
+    })
+  });
+});
+exports.TextFieldInput = TextFieldInput;
+var _default = TextField;
+exports.default = _default;

package/cjs/ui/HelperText/HelperText.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _clsx = _interopRequireDefault(require("clsx"));
+var _HelperTextModule = _interopRequireDefault(require("./HelperText.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['helperText', 'helperText_error'];
+
+// const css = getCssPrefix(CssClasses)
+
+const HelperText = props => {
+  let {
+    className,
+    error,
+    children,
+    ...restProps
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      ...restProps,
+      className: (0, _clsx.default)(_HelperTextModule.default.helperText, {
+        [_HelperTextModule.default.helperText_error]: !!error
+      }, className),
+      children: children
+    })
+  });
+};
+var _default = HelperText;
+exports.default = _default;
+module.exports = exports.default;

package/cjs/ui/List/ListItem.js

@@ -0,0 +1,64 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Checkbox = _interopRequireDefault(require("../Form/Checkbox/Checkbox"));
+var _Adornment = _interopRequireWildcard(require("../Adornment/Adornment"));
+var _ListItemModule = _interopRequireDefault(require("./ListItem.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const CssClasses = ['listitem', 'listitem_active', 'listitem_divider', 'listitemText'];
+
+// const css = getCssPrefix(CssClasses)
+
+const ListItem = props => {
+  let {
+    children,
+    className,
+    active,
+    divider,
+    checked,
+    startAdornment,
+    endAdornment,
+    ...restProps
+  } = props;
+  let withStartAdornment = checked !== undefined || !!startAdornment;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
+      ...restProps,
+      className: (0, _clsx.default)(_ListItemModule.default.listitem, className, {
+        [_ListItemModule.default.listitem_active]: !!active || !!checked,
+        [_ListItemModule.default.listitem_divider]: !!divider,
+        [_ListItemModule.default.listitem_endAdornment]: !!endAdornment,
+        [_ListItemModule.default.listitem_startAdornment]: withStartAdornment
+      }),
+      children: [withStartAdornment && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Adornment.AdornmentContainer, {
+        children: [checked !== undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Adornment.default, {
+          position: 'start',
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
+            checked: checked,
+            size: 'small'
+          })
+        }), !!startAdornment && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Adornment.default, {
+          position: 'start',
+          children: startAdornment
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: _ListItemModule.default.listitemText,
+        children: children
+      }), !!endAdornment && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Adornment.AdornmentContainer, {
+        position: 'end',
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Adornment.default, {
+          position: 'end',
+          children: endAdornment
+        })
+      })]
+    })
+  });
+};
+var _default = ListItem;
+exports.default = _default;
+module.exports = exports.default;

package/cjs/ui/Loader/Loader.js

@@ -0,0 +1,124 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _clsx = _interopRequireDefault(require("clsx"));
+var _LoaderModule = _interopRequireDefault(require("./Loader.module.scss"));
+var _jsxRuntime = require("react/jsx-runtime");
+const CssClasses = ['loader'];
+
+// const css = getCssPrefix(CssClasses)
+
+const Loader = props => {
+  let width = props.size === 'large' ? 25 : props.size === 'medium' ? 23 : props.size === 'small' ? 21 : 27;
+  let height = props.size === 'large' ? 24 : props.size === 'medium' ? 22 : props.size === 'small' ? 20 : 26;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _clsx.default)(_LoaderModule.default.loader, 'material_icon'),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: width,
+        height: height,
+        viewBox: `0 0 ${width} ${height}`,
+        fill: "none",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("circle", {
+          opacity: "0.3",
+          cx: "12.0003",
+          cy: "12",
+          r: "8.47059",
+          stroke: "#DFE2E6",
+          strokeWidth: "1.41176"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+          filter: "url(#filter0_f_1024_93554)",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M19.575 12.745C20.0016 8.47797 17.0747 4.67221 12.8076 4.24564L12.9481 2.84088C17.9909 3.34501 21.8325 7.87742 21.3283 12.9203C21.2815 13.3888 20.8734 13.7602 20.364 13.7093C19.9468 13.6676 19.5194 13.3009 19.575 12.745Z",
+            fill: "url(#paint0_radial_1024_93554)"
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M12.0006 4.23529C7.71225 4.23529 4.23588 7.71167 4.23588 12H2.82411C2.82411 6.93198 6.93256 2.82353 12.0006 2.82353V4.23529Z",
+          fill: "url(#paint1_radial_1024_93554)"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M19.5805 12.0194C19.5805 7.73103 16.2889 4.23529 12.0006 4.23529V2.82353C17.0686 2.82353 21.3426 6.95133 21.3426 12.0194C21.3426 12.4901 20.9734 12.9004 20.4616 12.9004C20.0422 12.9004 19.5805 12.578 19.5805 12.0194Z",
+          fill: "url(#paint2_radial_1024_93554)"
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("defs", {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("filter", {
+            id: "filter0_f_1024_93554",
+            x: "9.9841",
+            y: "0.0173481",
+            width: "14.2122",
+            height: "16.5202",
+            filterUnits: "userSpaceOnUse",
+            colorInterpolationFilters: "sRGB",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("feFlood", {
+              floodOpacity: "0",
+              result: "BackgroundImageFix"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("feBlend", {
+              mode: "normal",
+              in: "SourceGraphic",
+              in2: "BackgroundImageFix",
+              result: "shape"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("feGaussianBlur", {
+              stdDeviation: "1.41176",
+              result: "effect1_foregroundBlur_1024_93554"
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("radialGradient", {
+            id: "paint0_radial_1024_93554",
+            cx: "0",
+            cy: "0",
+            r: "1",
+            gradientUnits: "userSpaceOnUse",
+            gradientTransform: "translate(20.3817 13.7111) rotate(-126.186) scale(12.6961 11.7694)",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "0.395833",
+              stopColor: "#98A4B0"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "1",
+              stopColor: "#98A4B0",
+              stopOpacity: "0"
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("radialGradient", {
+            id: "paint1_radial_1024_93554",
+            cx: "0",
+            cy: "0",
+            r: "1",
+            gradientUnits: "userSpaceOnUse",
+            gradientTransform: "translate(20.4793 12.9004) rotate(-145.457) scale(17.1491 15.8974)",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "0.395833",
+              stopColor: "#98A4B0"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "1",
+              stopColor: "#98A4B0",
+              stopOpacity: "0"
+            })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("radialGradient", {
+            id: "paint2_radial_1024_93554",
+            cx: "0",
+            cy: "0",
+            r: "1",
+            gradientUnits: "userSpaceOnUse",
+            gradientTransform: "translate(20.4793 12.9004) rotate(-145.457) scale(17.1491 15.8974)",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "0.395833",
+              stopColor: "#98A4B0"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
+              offset: "1",
+              stopColor: "#98A4B0",
+              stopOpacity: "0"
+            })]
+          })]
+        })]
+      })
+    })
+  });
+};
+var _default = Loader;
+exports.default = _default;
+module.exports = exports.default;