@eleventheye/asui 2.1.15 → 2.2.0

package/dist/apptypes/ASUI.types.d.ts

@@ -1,9 +1,9 @@
-export declare const ASComponentSize: {
+export declare const ComponentSize: {
     readonly Small: "ASSmall";
     readonly Medium: "ASMedium";
     readonly Large: "ASLarge";
 };
-export type ASComponentSize = (typeof ASComponentSize)[keyof typeof ASComponentSize];
+export type ASComponentSize = (typeof ComponentSize)[keyof typeof ComponentSize];
 type ASPaddingSizeTuple = [ASComponentSize, ASComponentSize];
 type ASPaddingSizeTriple = [ASComponentSize, ASComponentSize, ASComponentSize];
 type ASPaddingSizeQuad = [ASComponentSize, ASComponentSize, ASComponentSize, ASComponentSize];
@@ -136,8 +136,31 @@ export type ASTextFieldTheme = {
     placeholderColor: string;
     iconTextShadow: string;
 };
+export type ASDropdownTheme = {
+    dropdownCaratColor: string;
+    dropdownGradientDown: string;
+    dropdownGradientUp: string;
+    dropdownShadowHoverASSmall: string;
+    dropdownShadowHoverASMedium: string;
+    dropdownShadowHoverASLarge: string;
+    dropdownShadowActiveASSmall: string;
+    dropdownShadowActiveASMedium: string;
+    dropdownShadowActiveASLarge: string;
+    dropdownShadowNormal: string;
+    dropdownShadowHover: string;
+    dropdownOutline: string;
+    dropdownTextShadow: string;
+    dropdownTextShadowHover: string;
+    dropdownBg: string;
+    dropdownBgDisabled: string;
+    dropdownColor: string;
+    dropdownColorHover: string;
+    dropdownColorSelected: string;
+    dropdownColorDisabled: string;
+};
 export interface ASTheme {
     textfield: ASTextFieldTheme;
+    dropdown: ASDropdownTheme;
     button: ASButtonTheme;
     loader: ASLoaderTheme;
     colors: ASColorTheme;

package/dist/apptypes/ASUI.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASUI.types.d.ts","sourceRoot":"","sources":["../../src/apptypes/ASUI.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"ASUI.types.d.ts","sourceRoot":"","sources":["../../src/apptypes/ASUI.types.ts"],"names":[],"mappings":"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"}

package/dist/apptypes/ASUI.types.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoaderType = exports.ASComponentSize = void 0;
-exports.ASComponentSize = {
+exports.LoaderType = exports.ComponentSize = void 0;
+exports.ComponentSize = {
     Small: 'ASSmall',
     Medium: 'ASMedium',
     Large: 'ASLarge',

package/dist/asbutton/ASButton.js

@@ -7,7 +7,7 @@ const ASUI_types_1 = require("../apptypes/ASUI.types");
 const asloader_1 = tslib_1.__importDefault(require("../asloader"));
 const astheme_1 = tslib_1.__importDefault(require("../astheme"));
 const styles_1 = require("./styles");
-const ASButton = ({ className = '', onClick = () => undefined, selected = false, toggle = false, size = ASUI_types_1.ASComponentSize.Medium, paddingSize = [ASUI_types_1.ASComponentSize.Medium, ASUI_types_1.ASComponentSize.Medium], theme = astheme_1.default, disabled = false, isLoading = false, children, text, id, style, ...props }) => {
+const ASButton = ({ className = '', onClick = () => undefined, selected = false, toggle = false, size = ASUI_types_1.ComponentSize.Medium, paddingSize = [ASUI_types_1.ComponentSize.Medium, ASUI_types_1.ComponentSize.Medium], theme = astheme_1.default, disabled = false, isLoading = false, children, text, id, style, ...props }) => {
     const [isSelected, setIsSelected] = (0, react_1.useState)(selected);
     (0, react_1.useEffect)(() => {
         setIsSelected(selected);
@@ -27,6 +27,6 @@ const ASButton = ({ className = '', onClick = () => undefined, selected = false,
             }
         }
     };
-    return ((0, jsx_runtime_1.jsx)(styles_1.ASButtonStyled, { theme: theme, role: "button", ref: onEnableDisableHandler, size: size, "aria-disabled": isLoading ? 'true' : disabled.toString(), className: `${className} ${size} ${isSelected ? 'Selected' : ''}`, "data-buttontext": isLoading ? '' : children ?? text, onClick: onClickHandler, style: style, id: id, ...props, children: (0, jsx_runtime_1.jsxs)(styles_1.ButtonPadding, { size: size, children: [(0, jsx_runtime_1.jsx)(asloader_1.default, { size: ASUI_types_1.ASComponentSize.Small, loaderType: ASUI_types_1.LoaderType.Spin, showLoader: isLoading }), !isLoading && (children ?? text), isLoading && (0, jsx_runtime_1.jsx)(styles_1.ASButtonHidden, { children: children ?? text })] }) }));
+    return ((0, jsx_runtime_1.jsx)(styles_1.ASButtonStyled, { theme: theme, role: "button", ref: onEnableDisableHandler, size: size, "aria-disabled": isLoading ? 'true' : disabled.toString(), className: `${className} ${size} ${isSelected ? 'Selected' : ''}`, "data-buttontext": isLoading ? '' : children ?? text, onClick: onClickHandler, style: style, id: id, ...props, children: (0, jsx_runtime_1.jsxs)(styles_1.ButtonPadding, { size: size, children: [(0, jsx_runtime_1.jsx)(asloader_1.default, { size: ASUI_types_1.ComponentSize.Small, loaderType: ASUI_types_1.LoaderType.Spin, showLoader: isLoading }), !isLoading && (children ?? text), isLoading && (0, jsx_runtime_1.jsx)(styles_1.ASButtonHidden, { children: children ?? text })] }) }));
 };
 exports.default = ASButton;

package/dist/asbutton/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asbutton/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAElE,eAAO,MAAM,cAAc;WAAuB,OAAO;UAAQ,eAAe;YAsH/E,CAAC;AAEF,eAAO,MAAM,aAAa;WAAuB,eAAe;YAG/D,CAAC;AAEF,eAAO,MAAM,cAAc,6NAG1B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asbutton/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,OAAO,EAAiB,MAAM,wBAAwB,CAAC;AAEjF,eAAO,MAAM,cAAc;WAAuB,OAAO;UAAQ,eAAe;YAsH/E,CAAC;AAEF,eAAO,MAAM,aAAa;WAAuB,eAAe;YAG/D,CAAC;AAEF,eAAO,MAAM,cAAc,6NAG1B,CAAC"}

package/dist/asbutton/styles.js

@@ -124,7 +124,7 @@ exports.ASButtonStyled = styled_components_1.default.div `
   }
 `;
 exports.ButtonPadding = styled_components_1.default.div `
-  padding: ${({ size }) => size === ASUI_types_1.ASComponentSize.Large ? '5px 50px' : size === ASUI_types_1.ASComponentSize.Medium ? '2px 30px' : '0 10px'};
+  padding: ${({ size }) => size === ASUI_types_1.ComponentSize.Large ? '5px 50px' : size === ASUI_types_1.ComponentSize.Medium ? '2px 30px' : '0 10px'};
 `;
 exports.ASButtonHidden = styled_components_1.default.div `
   opacity: 0;

package/dist/asdropdown/ASDropdown.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ASDropdownProps } from './ASDropdown.types';
+declare const ASDropdown: React.FC<ASDropdownProps>;
+export default ASDropdown;
+//# sourceMappingURL=ASDropdown.d.ts.map

package/dist/asdropdown/ASDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ASDropdown.d.ts","sourceRoot":"","sources":["../../src/asdropdown/ASDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAI/C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAGrD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAiDzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/asdropdown/ASDropdown.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const ASUI_types_1 = require("../apptypes/ASUI.types");
+const astheme_1 = tslib_1.__importDefault(require("../astheme"));
+const styles_1 = require("./styles");
+const ASDropdown = ({ className = '', theme = astheme_1.default, value = '', onChange = () => undefined, options = [], size = ASUI_types_1.ComponentSize.Medium, placeholder = '', Icon = undefined, disabled = false, ...props }) => {
+    const genericId = (0, react_1.useId)();
+    const baseCls = `${size} ${className}`;
+    const iconSize = size === ASUI_types_1.ComponentSize.Large ? 28 : size === ASUI_types_1.ComponentSize.Medium ? 24 : 20;
+    const iconColor = disabled ? theme.dropdown.dropdownColorDisabled : theme.dropdown.dropdownColor;
+    const [selectedValue, setSelectedValue] = (0, react_1.useState)(value || placeholder);
+    const onChangeHandler = (val) => {
+        setSelectedValue(val);
+        onChange(val);
+    };
+    if (placeholder && !value) {
+        options = [placeholder, ...options];
+    }
+    return ((0, jsx_runtime_1.jsxs)(styles_1.ASDropdownStyled, { theme: theme, className: baseCls, "$withIcon": !!Icon, style: props.style, "aria-disabled": disabled, children: [!!Icon && (0, jsx_runtime_1.jsx)(Icon, { className: "IconLayout", size: iconSize, fillColor: iconColor }), (0, jsx_runtime_1.jsx)(styles_1.ASDropdownSelect, { theme: theme, id: props.id ?? genericId, value: selectedValue, onChange: (e) => onChangeHandler(e.target.value), disabled: !!disabled, children: options.map((option) => ((0, jsx_runtime_1.jsx)(styles_1.ASDropdownOption, { theme: theme, value: option, children: option }, option))) })] }));
+};
+exports.default = ASDropdown;

package/dist/asdropdown/ASDropdown.types.d.ts

@@ -0,0 +1,14 @@
+import { ASComponentSize } from '../apptypes/ASUI.types';
+import ASThemeDefault from '../astheme';
+import ASIcon from '../icons/ASIcon';
+export type ASDropdownProps = {
+    className?: string;
+    theme?: typeof ASThemeDefault;
+    value?: string;
+    onChange?: (value: string) => void;
+    size?: ASComponentSize;
+    options?: string[];
+    placeholder?: string;
+    Icon?: typeof ASIcon;
+} & Pick<React.HTMLProps<HTMLDivElement>, 'style' | 'id' | 'disabled'>;
+//# sourceMappingURL=ASDropdown.types.d.ts.map

package/dist/asdropdown/ASDropdown.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ASDropdown.types.d.ts","sourceRoot":"","sources":["../../src/asdropdown/ASDropdown.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,cAAc,MAAM,YAAY,CAAC;AACxC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,MAAM,eAAe,GAAG;IAK5B,SAAS,CAAC,EAAE,MAAM,CAAC;IAMnB,KAAK,CAAC,EAAE,OAAO,cAAc,CAAC;IAM9B,KAAK,CAAC,EAAE,MAAM,CAAC;IAMf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IASnC,IAAI,CAAC,EAAE,eAAe,CAAC;IAQvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IAQnB,WAAW,CAAC,EAAE,MAAM,CAAC;IAQrB,IAAI,CAAC,EAAE,OAAO,MAAM,CAAC;CACtB,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,IAAI,GAAG,UAAU,CAAC,CAAC"}

package/dist/asdropdown/ASDropdown.types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/asdropdown/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './ASDropdown';
+export type { ASDropdownProps } from './ASDropdown.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/asdropdown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/asdropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/asdropdown/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+const tslib_1 = require("tslib");
+var ASDropdown_1 = require("./ASDropdown");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return tslib_1.__importDefault(ASDropdown_1).default; } });

package/dist/asdropdown/styles.d.ts

@@ -0,0 +1,17 @@
+import { ASTheme } from '../apptypes/ASUI.types';
+interface ASDropdownStyledProps {
+    theme: ASTheme;
+    $withIcon?: boolean;
+}
+export declare const ASDropdownStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ASDropdownStyledProps>> & string;
+export declare const ASDropdownSelect: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, {
+    theme: ASTheme;
+}>> & string;
+export declare const ASDropdownOption: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, {
+    theme: ASTheme;
+}>> & string;
+export declare const ASDropdownOptions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").OptgroupHTMLAttributes<HTMLOptGroupElement>, HTMLOptGroupElement>, {
+    theme: ASTheme;
+}>> & string;
+export {};
+//# sourceMappingURL=styles.d.ts.map

package/dist/asdropdown/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asdropdown/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAEjD,UAAU,qBAAqB;IAC7B,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,gBAAgB,0PAmE5B,CAAC;AAEF,eAAO,MAAM,gBAAgB;WAA0B,OAAO;YAoC7D,CAAC;AAEF,eAAO,MAAM,gBAAgB;WAA0B,OAAO;YAI7D,CAAC;AAEF,eAAO,MAAM,iBAAiB;WAA4B,OAAO;YAIhE,CAAC"}

package/dist/asdropdown/styles.js

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ASDropdownOptions = exports.ASDropdownOption = exports.ASDropdownSelect = exports.ASDropdownStyled = void 0;
+const tslib_1 = require("tslib");
+const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+exports.ASDropdownStyled = styled_components_1.default.div `
+  position: relative;
+  display: inline-block;
+  width: 100%;
+
+  &.ASSmall {
+    select {
+      font-size: 1.05rem;
+      padding: ${({ $withIcon }) => ($withIcon ? '5px 30px' : '5px 30px 5px 15px')};
+    }
+    &:after {
+      scale: 0.8;
+      transform: translate(20%, -45%);
+    }
+  }
+
+  &.ASMedium select {
+    font-size: 1.35rem;
+    padding: ${({ $withIcon }) => ($withIcon ? '5px 35px' : '7px 35px 7px 15px')};
+  }
+
+  &.ASLarge select {
+    font-size: 1.55rem;
+    padding: ${({ $withIcon }) => ($withIcon ? '10px 40px' : '10px 40px 10px 20px')};
+  }
+
+  .IconLayout {
+    position: absolute;
+    z-index: 1;
+    top: 50%;
+    transform: translateY(-50%);
+    left: 3%;
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    pointer-events: none;
+    top: 50%;
+    right: 10px;
+    transform: translate(0, -35%);
+    width: 20px;
+    height: 20px;
+    background-color: ${({ theme }) => theme.dropdown.dropdownCaratColor};
+    clip-path: polygon(25% 0, 0 25%, 50% 67%, 100% 25%, 75% 0, 50% 24%);
+  }
+
+  & select:hover {
+    background: ${({ theme }) => theme.dropdown.dropdownGradientDown};
+    background-color: ${({ theme }) => theme.dropdown.dropdownBg};
+    text-shadow: ${({ theme }) => theme.dropdown.dropdownTextShadowHover};
+  }
+
+  &:hover::after {
+    background-color: ${({ theme }) => theme.dropdown.dropdownColorHover};
+  }
+
+  & select:disabled {
+    background: ${({ theme }) => theme.dropdown.dropdownBgDisabled};
+    color: ${({ theme }) => theme.dropdown.dropdownColorDisabled};
+    text-shadow: none;
+    pointer-events: none;
+  }
+
+  &[aria-disabled='true']::after {
+    background-color: ${({ theme }) => theme.dropdown.dropdownColorDisabled};
+  }
+`;
+exports.ASDropdownSelect = styled_components_1.default.select `
+  font-family: inherit;
+  font-weight: 600;
+  display: inline-block;
+  width: 100%;
+  cursor: pointer;
+  background: ${({ theme }) => theme.dropdown.dropdownGradientUp};
+  background-color: ${({ theme }) => theme.dropdown.dropdownBg};
+  outline: 1px solid ${({ theme }) => theme.dropdown.dropdownOutline};
+  border-radius: 40px;
+  border: none;
+  color: ${({ theme }) => theme.dropdown.dropdownColor};
+  text-shadow: ${({ theme }) => theme.dropdown.dropdownTextShadow};
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+
+  [popover] {
+    // top: 25px !important;
+
+    &:popover-open {
+      position: absolute;
+      margin-top: 50px;
+      width: 200px;
+      height: 100px;
+      position: absolute;
+      inset: unset;
+      bottom: 5px;
+      right: 5px;
+      margin: 0;
+    }
+  }
+
+  &::-ms-expand {
+    display: none;
+  }
+`;
+exports.ASDropdownOption = styled_components_1.default.option `
+  fontFamily: inherit,
+  fontSize: '20px',
+  fontWeight: '600',
+`;
+exports.ASDropdownOptions = styled_components_1.default.optgroup `
+  background: yellow;
+  background-color: gold;
+  appearance: 'none';
+`;

package/dist/asloader/ASLoader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASLoader.d.ts","sourceRoot":"","sources":["../../src/asloader/ASLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAgD,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAWlG,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+DrC,CAAC;AAsCF,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,UAAU,EAAE,CAAC"}
+{"version":3,"file":"ASLoader.d.ts","sourceRoot":"","sources":["../../src/asloader/ASLoader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAA+D,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAWjH,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgErC,CAAC;AA0CF,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/dist/asloader/ASLoader.js

@@ -9,7 +9,7 @@ const ASUI_types_1 = require("../apptypes/ASUI.types");
 Object.defineProperty(exports, "LoaderType", { enumerable: true, get: function () { return ASUI_types_1.LoaderType; } });
 const styles_1 = require("../asloader/styles");
 const astheme_1 = tslib_1.__importDefault(require("../astheme"));
-const ASLoader = ({ className = '', loaderType = ASUI_types_1.LoaderType.Grow, size = ASUI_types_1.ASComponentSize.Medium, isModal = false, theme = astheme_1.default.loader, ...props }) => {
+const ASLoader = ({ className = '', loaderClassName = '', loaderType = ASUI_types_1.LoaderType.Grow, size = ASUI_types_1.ComponentSize.Medium, isModal = false, theme = astheme_1.default.loader, ...props }) => {
     const [localLoaderType, setLoaderType] = (0, react_1.useState)(loaderType);
     const [loaderSizeCls, setLoaderSizeCls] = (0, react_1.useState)(size);
     (0, react_1.useEffect)(() => {
@@ -23,30 +23,30 @@ const ASLoader = ({ className = '', loaderType = ASUI_types_1.LoaderType.Grow, s
     const renderLoader = () => {
         switch (localLoaderType) {
             case ASUI_types_1.LoaderType.Spin:
-                return (0, jsx_runtime_1.jsx)(ASLoaderSpin, { size: loaderSizeCls, theme: theme, className: className });
+                return (0, jsx_runtime_1.jsx)(ASLoaderSpin, { size: loaderSizeCls, theme: theme, className: loaderClassName });
             case ASUI_types_1.LoaderType.Dots:
-                return (0, jsx_runtime_1.jsx)(ASLoaderDots, { size: loaderSizeCls, theme: theme, className: className });
+                return (0, jsx_runtime_1.jsx)(ASLoaderDots, { size: loaderSizeCls, theme: theme, className: loaderClassName });
             case ASUI_types_1.LoaderType.Grow:
             default:
-                return (0, jsx_runtime_1.jsx)(ASLoaderGrow, { size: loaderSizeCls, theme: theme, className: className });
+                return (0, jsx_runtime_1.jsx)(ASLoaderGrow, { size: loaderSizeCls, theme: theme, className: loaderClassName });
         }
     };
     const renderLoaderModal = () => {
         return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.showLoader &&
-                (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(styles_1.ASLoaderModalContainer, { className: className, theme: theme, children: renderLoader() }) }), document.body) }));
+                (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(styles_1.ASLoaderModalContainer, { className: className, theme: theme, style: props.style, children: renderLoader() }) }), document.body) }));
     };
     const renderLoaderNonModal = () => {
-        return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.showLoader && ((0, jsx_runtime_1.jsx)(styles_1.ASLoaderNonModalContainer, { className: className, theme: theme, children: renderLoader() })) }));
+        return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: props.showLoader && ((0, jsx_runtime_1.jsx)(styles_1.ASLoaderNonModalContainer, { className: className, theme: theme, style: props.style, children: renderLoader() })) }));
     };
     return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isModal ? renderLoaderModal() : renderLoaderNonModal() });
 };
 exports.default = ASLoader;
-const ASLoaderGrow = ({ size = ASUI_types_1.ASComponentSize.Large, theme = astheme_1.default }) => {
-    return ((0, jsx_runtime_1.jsx)(styles_1.ASLoaderGrowStyled, { className: `${size}`, size: size, theme: theme, children: (0, jsx_runtime_1.jsx)(styles_1.ASLoaderText, { size: size, theme: theme, children: "LOADING" }) }));
+const ASLoaderGrow = ({ className = '', size = ASUI_types_1.ComponentSize.Large, theme = astheme_1.default, }) => {
+    return ((0, jsx_runtime_1.jsx)(styles_1.ASLoaderGrowStyled, { className: `${size} ${className}`, size: size, theme: theme, children: (0, jsx_runtime_1.jsx)(styles_1.ASLoaderText, { size: size, theme: theme, children: "LOADING" }) }));
 };
-const ASLoaderDots = ({ size = ASUI_types_1.ASComponentSize.Large, theme = astheme_1.default.loader, className = '', }) => {
-    return (0, jsx_runtime_1.jsx)(styles_1.ASLoaderDotsStyled, { className: size, size: size, theme: theme });
+const ASLoaderDots = ({ size = ASUI_types_1.ComponentSize.Large, theme = astheme_1.default.loader, className = '', }) => {
+    return (0, jsx_runtime_1.jsx)(styles_1.ASLoaderDotsStyled, { className: `${size} ${className}`, size: size, theme: theme });
 };
-const ASLoaderSpin = ({ className = '', size = ASUI_types_1.ASComponentSize.Large, theme = astheme_1.default.loader, }) => {
+const ASLoaderSpin = ({ className = '', size = ASUI_types_1.ComponentSize.Large, theme = astheme_1.default.loader, }) => {
     return ((0, jsx_runtime_1.jsx)(styles_1.ASLoaderSpinStyled, { className: className, size: size, theme: theme, children: (0, jsx_runtime_1.jsx)(styles_1.ASLoaderInnerSpinStyled, { size: size, theme: theme }) }));
 };

package/dist/asloader/ASLoader.types.d.ts

@@ -2,6 +2,7 @@ import { CSSProperties } from 'react';
 import { ASComponentSize, ASLoaderTheme, ASLoaderType } from '../apptypes/ASUI.types';
 export interface ASLoaderProps {
     className?: string;
+    loaderClassName?: string;
     showLoader?: boolean;
     size?: ASComponentSize;
     loaderType?: ASLoaderType;

package/dist/asloader/ASLoader.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASLoader.types.d.ts","sourceRoot":"","sources":["../../src/asloader/ASLoader.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtF,MAAM,WAAW,aAAa;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IAQnB,UAAU,CAAC,EAAE,OAAO,CAAC;IASrB,IAAI,CAAC,EAAE,eAAe,CAAC;IASvB,UAAU,CAAC,EAAE,YAAY,CAAC;IAQ1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAOlB,KAAK,CAAC,EAAE,aAAa,CAAC;IAQtB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB"}
+{"version":3,"file":"ASLoader.types.d.ts","sourceRoot":"","sources":["../../src/asloader/ASLoader.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtF,MAAM,WAAW,aAAa;IAM5B,SAAS,CAAC,EAAE,MAAM,CAAC;IAOnB,eAAe,CAAC,EAAE,MAAM,CAAC;IAQzB,UAAU,CAAC,EAAE,OAAO,CAAC;IASrB,IAAI,CAAC,EAAE,eAAe,CAAC;IASvB,UAAU,CAAC,EAAE,YAAY,CAAC;IAQ1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAOlB,KAAK,CAAC,EAAE,aAAa,CAAC;IAQtB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB"}

package/dist/asloader/styles.d.ts

@@ -1,25 +1,25 @@
-import { ASLoaderTheme, ASComponentSize as ASSize } from '../apptypes/ASUI.types';
+import { ASComponentSize, ASLoaderTheme } from '../apptypes/ASUI.types';
 export declare const ASLoaderModalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     theme: ASLoaderTheme;
 }>> & string;
 export declare const ASLoaderNonModalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ASLoaderText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
-    size: ASSize;
+    size: ASComponentSize;
     theme: ASLoaderTheme;
 }>> & string;
 export declare const ASLoaderGrowStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    size: ASSize;
+    size: ASComponentSize;
     theme: ASLoaderTheme;
 }>> & string;
 export declare const ASLoaderDotsStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    size: ASSize;
+    size: ASComponentSize;
     theme: ASLoaderTheme;
 }>> & string;
 export declare const ASLoaderSpinStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    size: ASSize;
+    size: ASComponentSize;
 }>> & string;
 export declare const ASLoaderInnerSpinStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    size: ASSize;
+    size: ASComponentSize;
     theme: ASLoaderTheme;
 }>> & string;
 export declare const StorybookLoaderWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/asloader/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asloader/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,eAAe,IAAI,MAAM,EAAE,MAAM,wBAAwB,CAAC;AA2BlF,eAAO,MAAM,sBAAsB;WAAuB,aAAa;YAOtE,CAAC;AAEF,eAAO,MAAM,yBAAyB,6NAKrC,CAAC;AAEF,eAAO,MAAM,YAAY;UAAuB,MAAM;WAAS,aAAa;YAa3E,CAAC;AAGF,eAAO,MAAM,kBAAkB;UAAsB,MAAM;WAAS,aAAa;YAqBhF,CAAC;AAEF,eAAO,MAAM,kBAAkB;UAAsB,MAAM;WAAS,aAAa;YAkBhF,CAAC;AAEF,eAAO,MAAM,kBAAkB;UAAsB,MAAM;YAO1D,CAAC;AAEF,eAAO,MAAM,uBAAuB;UAAsB,MAAM;WAAS,aAAa;YA2BrF,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAGlC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/asloader/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,aAAa,EAAiB,MAAM,wBAAwB,CAAC;AA2BvF,eAAO,MAAM,sBAAsB;WAAuB,aAAa;YAOtE,CAAC;AAEF,eAAO,MAAM,yBAAyB,6NAKrC,CAAC;AAEF,eAAO,MAAM,YAAY;UAAuB,eAAe;WAAS,aAAa;YAcpF,CAAC;AAGF,eAAO,MAAM,kBAAkB;UAAsB,eAAe;WAAS,aAAa;YAqBzF,CAAC;AAEF,eAAO,MAAM,kBAAkB;UAAsB,eAAe;WAAS,aAAa;YAkBzF,CAAC;AAEF,eAAO,MAAM,kBAAkB;UAAsB,eAAe;YAOnE,CAAC;AAEF,eAAO,MAAM,uBAAuB;UAAsB,eAAe;WAAS,aAAa;YA2B9F,CAAC;AAEF,eAAO,MAAM,sBAAsB,6NAGlC,CAAC"}

package/dist/asloader/styles.js

@@ -50,9 +50,9 @@ exports.ASLoaderText = styled_components_1.default.span `
   top: 50%;
   transform: translate(-50%, -50%);
 
-  font-size: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '2.5rem' : size === ASUI_types_1.ASComponentSize.Medium ? '1.85rem' : '1.25rem')};
-  font-weight: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '700' : size === ASUI_types_1.ASComponentSize.Medium ? '500' : '500')};
-  letter-spacing: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Small ? '0.1rem' : '0.2rem')};
+  font-size: ${({ size }) => size === ASUI_types_1.ComponentSize.Large ? '2.5rem' : size === ASUI_types_1.ComponentSize.Medium ? '1.85rem' : '1.25rem'};
+  font-weight: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '700' : size === ASUI_types_1.ComponentSize.Medium ? '500' : '500')};
+  letter-spacing: ${({ size }) => (size === ASUI_types_1.ComponentSize.Small ? '0.1rem' : '0.2rem')};
 `;
 exports.ASLoaderGrowStyled = styled_components_1.default.div `
   position: relative;
@@ -73,8 +73,8 @@ exports.ASLoaderGrowStyled = styled_components_1.default.div `
     animation: ${loaderGrow} 2s infinite alternate;
   }
 
-  width: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '200px' : size === ASUI_types_1.ASComponentSize.Medium ? '160px' : '120px')};
-  height: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '44px' : size === ASUI_types_1.ASComponentSize.Medium ? '34px' : '24px')};
+  width: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '200px' : size === ASUI_types_1.ComponentSize.Medium ? '160px' : '120px')};
+  height: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '44px' : size === ASUI_types_1.ComponentSize.Medium ? '34px' : '24px')};
 `;
 exports.ASLoaderDotsStyled = styled_components_1.default.div `
   width: 64px;
@@ -90,17 +90,17 @@ exports.ASLoaderDotsStyled = styled_components_1.default.div `
   top: 50%;
   transform: translate(-50%, -50%);
 
-  width: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '64px' : size === ASUI_types_1.ASComponentSize.Medium ? '32px' : '16px')};
-  height: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '64px' : size === ASUI_types_1.ASComponentSize.Medium ? '32px' : '16px')};
-  background-size: ${({ size }) => size === ASUI_types_1.ASComponentSize.Large ? '24px 24px' : size === ASUI_types_1.ASComponentSize.Medium ? '12px 12px' : '6px 6px'};
+  width: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '64px' : size === ASUI_types_1.ComponentSize.Medium ? '32px' : '16px')};
+  height: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '64px' : size === ASUI_types_1.ComponentSize.Medium ? '32px' : '16px')};
+  background-size: ${({ size }) => size === ASUI_types_1.ComponentSize.Large ? '24px 24px' : size === ASUI_types_1.ComponentSize.Medium ? '12px 12px' : '6px 6px'};
 `;
 exports.ASLoaderSpinStyled = styled_components_1.default.div `
   position: relative;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
-  width: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '100px' : size === ASUI_types_1.ASComponentSize.Medium ? '50px' : '30px')};
-  height: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '100px' : size === ASUI_types_1.ASComponentSize.Medium ? '50px' : '30px')};
+  width: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '100px' : size === ASUI_types_1.ComponentSize.Medium ? '50px' : '30px')};
+  height: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '100px' : size === ASUI_types_1.ComponentSize.Medium ? '50px' : '30px')};
 `;
 exports.ASLoaderInnerSpinStyled = styled_components_1.default.div `
   display: grid;
@@ -109,9 +109,9 @@ exports.ASLoaderInnerSpinStyled = styled_components_1.default.div `
   border-radius: 50%;
   border-color: ${({ theme }) => theme.loaderSpinBorderColor};
   animation: ${loaderSpin} 6s infinite linear;
-  width: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '84px' : size === ASUI_types_1.ASComponentSize.Medium ? '42px' : '26px')};
-  height: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '84px' : size === ASUI_types_1.ASComponentSize.Medium ? '42px' : '26px')};
-  border-width: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '8px' : size === ASUI_types_1.ASComponentSize.Medium ? '4px' : '2px')};
+  width: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '84px' : size === ASUI_types_1.ComponentSize.Medium ? '42px' : '26px')};
+  height: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '84px' : size === ASUI_types_1.ComponentSize.Medium ? '42px' : '26px')};
+  border-width: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '8px' : size === ASUI_types_1.ComponentSize.Medium ? '4px' : '2px')};
 
   &::before,
   &::after {
@@ -120,7 +120,7 @@ exports.ASLoaderInnerSpinStyled = styled_components_1.default.div `
     border: inherit;
     border-radius: 50%;
     border-color: ${({ theme }) => theme.loaderSpinBorderBeforeColor};
-    margin: ${({ size }) => (size === ASUI_types_1.ASComponentSize.Large ? '16px' : size === ASUI_types_1.ASComponentSize.Medium ? '8px' : '4px')};
+    margin: ${({ size }) => (size === ASUI_types_1.ComponentSize.Large ? '16px' : size === ASUI_types_1.ComponentSize.Medium ? '8px' : '4px')};
   }
 
   &::before {

package/dist/astextfield/ASTextField.js

@@ -7,7 +7,7 @@ const ASUI_types_1 = require("../apptypes/ASUI.types");
 const astheme_1 = tslib_1.__importDefault(require("../astheme"));
 const icons_1 = require("../icons");
 const styles_1 = require("./styles");
-const ASTextField = ({ className = '', theme = astheme_1.default, value = '', onChange = () => undefined, size = ASUI_types_1.ASComponentSize.Medium, type = 'text', showClearButton = false, showSearchIcon = false, disableAutofill = false, ...props }) => {
+const ASTextField = ({ className = '', theme = astheme_1.default, value = '', onChange = () => undefined, size = ASUI_types_1.ComponentSize.Medium, type = 'text', showClearButton = false, showSearchIcon = false, disableAutofill = false, ...props }) => {
     const passwordTypeRef = (0, react_1.useRef)(false);
     const genericId = (0, react_1.useId)();
     const textFieldId = props.id || genericId;

package/dist/astheme/ASThemeDefault.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ASThemeDefault.d.ts","sourceRoot":"","sources":["../../src/astheme/ASThemeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAwEjD,QAAA,MAAM,cAAc,EAAE,OA0DrB,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ASThemeDefault.d.ts","sourceRoot":"","sources":["../../src/astheme/ASThemeDefault.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAwEjD,QAAA,MAAM,cAAc,EAAE,OAgFrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/astheme/ASThemeDefault.js

@@ -122,6 +122,28 @@ const ASThemeDefault = {
         placeholderColor: colors.mainGray66,
         iconTextShadow: colors.mainGray97,
     },
+    dropdown: {
+        dropdownCaratColor: colors.mainGray33,
+        dropdownGradientDown: `linear-gradient(to bottom, ${colors.yellow30} 0%, ${colors.mainYellow} 100%)`,
+        dropdownGradientUp: `linear-gradient(to top, ${colors.yellow30} 0%, ${colors.mainYellow} 100%)`,
+        dropdownShadowHoverASSmall: `inset 0 0 5px 0 ${colors.mainGray47}`,
+        dropdownShadowHoverASMedium: `inset 0 0 10px 0 ${colors.mainGray47}`,
+        dropdownShadowHoverASLarge: `inset 0 0 15px 0 ${colors.mainGray47}`,
+        dropdownShadowActiveASSmall: `inset 0 0 5px 1px ${colors.mainBlack}`,
+        dropdownShadowActiveASMedium: `inset 0 0 8px 2px ${colors.mainBlack}`,
+        dropdownShadowActiveASLarge: `inset 0 0 11px 3px ${colors.mainBlack}`,
+        dropdownShadowNormal: `inset 0 0 1px 0 ${colors.yellow30}`,
+        dropdownShadowHover: `inset 0 0 1px 0 ${colors.yellow80}`,
+        dropdownOutline: colors.mainYellow,
+        dropdownTextShadow: '-1px -1px 1px rgba(255, 255, 255, 0.3), 1px 1px 1px rgba(0, 0, 0, 0.2)',
+        dropdownTextShadowHover: '-1px -1px 1px rgba(255, 255, 255, 0.3), 0 0 1px rgba(0, 0, 0, 0.2)',
+        dropdownBg: colors.yellow30,
+        dropdownBgDisabled: colors.mainGray33,
+        dropdownColor: colors.mainGray58,
+        dropdownColorHover: colors.mainGray41,
+        dropdownColorSelected: colors.mainGray33,
+        dropdownColorDisabled: colors.mainGray99,
+    },
     borderRadius: '35px',
 };
 exports.default = ASThemeDefault;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eleventheye/asui",
-  "version": "2.1.15",
+  "version": "2.2.0",
   "private": false,
   "description": "AS UI React Library by eleventheye (another one!)",
   "keywords": [