@antscorp/antsomi-ui 1.3.2-beta.9 → 1.3.3

package/es/components/molecules/Select/Select.d.ts

@@ -0,0 +1,15 @@
+import { SelectProps as AntdSelectProps } from 'antd';
+import React from 'react';
+export interface SelectProps extends AntdSelectProps {
+}
+declare const Select: (<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: AntdSelectProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & {
+    ref?: React.Ref<import("antd").RefSelectProps> | undefined;
+}) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    SECRET_COMBOBOX_MODE_DO_NOT_USE: string;
+    Option: import("rc-select/lib/Option").OptionFC;
+    OptGroup: import("rc-select/lib/OptGroup").OptionGroupFC;
+    _InternalPanelDoNotUseOrYouWillBeFired: any;
+} & React.FC<SelectProps>;
+export { Select };

package/es/components/molecules/Select/Select.js

@@ -0,0 +1,29 @@
+var _a;
+// Libraries
+import { Select as AntdSelect } from 'antd';
+import React from 'react';
+// Icons
+import Icon from '@antscorp/icons';
+// Constants
+import { THEME } from '../../../constants';
+import { StyledTag, TagCloseBtn } from './styled';
+const tagRender = (props) => {
+    const { label, closable, onClose } = props;
+    const onPreventMouseDown = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+    };
+    return (React.createElement(StyledTag, { onMouseDown: onPreventMouseDown, closable: closable, onClose: onClose, closeIcon: React.createElement(TagCloseBtn, null,
+            React.createElement(Icon, { type: "icon-ants-remove", className: "ants-text-primary", style: {
+                    fontSize: 10,
+                } })) }, label));
+};
+const CustomSelect = props => React.createElement(AntdSelect, Object.assign({}, props));
+const Select = CustomSelect;
+Select.OptGroup = AntdSelect.OptGroup;
+Select.Option = AntdSelect.Option;
+Select.defaultProps = {
+    suffixIcon: (React.createElement(Icon, { type: "icon-ants-expand-more", style: { fontSize: 16, color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.bw10 } })),
+    tagRender,
+};
+export { Select };

package/es/components/molecules/Select/Test.d.ts

@@ -0,0 +1,2 @@
+declare const SelectTest: () => JSX.Element;
+export default SelectTest;

package/es/components/molecules/Select/Test.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Select } from './index';
+const options = [
+    {
+        value: '1',
+        label: 'Item 1',
+    },
+    {
+        value: '2',
+        label: 'Item 2',
+    },
+    {
+        value: '3',
+        label: 'Item 3',
+    },
+    {
+        value: '4',
+        label: 'Item 4',
+    },
+];
+const SelectTest = () => React.createElement(Select, { options: options });
+export default SelectTest;

package/es/components/molecules/Select/index.d.ts

@@ -0,0 +1,2 @@
+export { Select } from './Select';
+export type { SelectProps } from './Select';

package/es/components/molecules/Select/index.js

@@ -0,0 +1 @@
+export { Select } from './Select';

package/es/components/molecules/Select/styled.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledTag: import("styled-components").StyledComponent<import("antd").TagType, any, {}, never>;
+export declare const TagCloseBtn: import("styled-components").StyledComponent<"div", any, {
+    borderColor?: string | undefined;
+}, never>;

package/es/components/molecules/Select/styled.js

@@ -0,0 +1,41 @@
+var _a, _b, _c;
+// Libraries
+import styled from 'styled-components';
+// Components
+import { Tag } from '../../atoms';
+// Constants
+import { THEME } from '../../../constants';
+export const StyledTag = styled(Tag) `
+  position: relative;
+  background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.blue2} !important;
+  padding: 3px 10px !important;
+  margin: 0px !important;
+  border-radius: 15px !important;
+  border: none !important;
+  font-size: ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.fontSize}px !important;
+
+  .antsomi-tag-close-icon {
+    opacity: 0;
+    transition: all 0.3s;
+  }
+
+  &:hover {
+    .antsomi-tag-close-icon {
+      opacity: 1;
+    }
+  }
+`;
+export const TagCloseBtn = styled.div `
+  position: absolute;
+  top: 3px;
+  right: 3px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  border-radius: 100%;
+  border: 2.5px solid ${p => (p.borderColor ? p.borderColor : '#cae5fe')};
+  background-color: #fff;
+  color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.colorPrimary};
+`;

package/es/components/molecules/SettingWrapper/index.d.ts

@@ -0,0 +1,13 @@
+import React, { CSSProperties } from 'react';
+interface SettingWrapperProps {
+    label: string;
+    className?: string;
+    labelColor?: string;
+    labelClassName?: string;
+    labelStyle?: Record<string, any>;
+    containerStyle?: Partial<CSSProperties>;
+    vertical?: boolean;
+    children?: React.ReactNode;
+}
+export declare const SettingWrapper: React.FC<SettingWrapperProps>;
+export {};

package/es/components/molecules/SettingWrapper/index.js

@@ -0,0 +1,20 @@
+// Libraries
+import React, { memo } from 'react';
+import classNames from 'classnames';
+// Atoms
+import { Text } from '@antscorp/antsomi-ui/es/components/atoms';
+// Styled
+import { StyledSettingWrapper } from './styled';
+export const SettingWrapper = memo(props => {
+    // Props
+    const { label, className, labelClassName, containerStyle, labelStyle, labelColor, vertical, children, } = props;
+    return (React.createElement(StyledSettingWrapper, { className: className, vertical: vertical, style: containerStyle },
+        label && (React.createElement(Text, { className: classNames(labelClassName), color: labelColor, style: labelStyle, title: label }, label)),
+        React.createElement("div", { style: { flexShrink: 0 } }, children)));
+});
+SettingWrapper.defaultProps = {
+    label: '',
+    className: '',
+    labelColor: '#666666',
+    labelClassName: '',
+};

package/es/components/molecules/SettingWrapper/styled.d.ts

@@ -0,0 +1,5 @@
+interface StyledSettingWrapperProps {
+    vertical?: boolean;
+}
+export declare const StyledSettingWrapper: import("styled-components").StyledComponent<"div", any, StyledSettingWrapperProps, never>;
+export {};

package/es/components/molecules/SettingWrapper/styled.js

@@ -0,0 +1,17 @@
+// Libraries
+import styled, { css } from 'styled-components';
+export const StyledSettingWrapper = styled.div `
+  display: flex;
+
+  ${props => props.vertical
+    ? css `
+          flex-direction: column;
+          margin-top: 5px;
+          margin-bottom: 5px;
+        `
+    : css `
+          align-items: center;
+          justify-content: space-between;
+          flex-wrap: wrap;
+        `}
+`;

package/es/components/molecules/SliderWithInputNumber/index.d.ts

@@ -0,0 +1,11 @@
+import React, { CSSProperties } from 'react';
+import { SliderProps } from '@antscorp/antsomi-ui/es/components/atoms/Slider';
+interface SliderWithInputNumberProps extends SliderProps {
+    precision?: number;
+    label?: React.ReactNode;
+    labelClassName?: string;
+    labelStyling?: Partial<CSSProperties>;
+    inputStyling?: Partial<CSSProperties>;
+}
+export declare const SliderWithInputNumber: React.FC<SliderWithInputNumberProps>;
+export {};

package/es/components/molecules/SliderWithInputNumber/index.js

@@ -0,0 +1,62 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+// Libraries
+import React, { useEffect, useState } from 'react';
+// Atoms
+import { Slider } from '@antscorp/antsomi-ui/es/components/atoms/Slider';
+// Molecules
+import { InputNumber } from '@antscorp/antsomi-ui/es/components/molecules/InputNumber';
+// Styled
+import { SliderWithInputNumberWrapper } from './styled';
+// Utils
+import { handleError } from '@antscorp/antsomi-ui/es/utils';
+const PATH = '@antscorp/antsomi-ui/es/components/molecules/SliderWithInputNumber/index.tsx';
+export const SliderWithInputNumber = props => {
+    // Props
+    const { label, labelClassName, labelStyling, inputStyling, defaultValue, min, max, step, precision } = props, restOf = __rest(props, ["label", "labelClassName", "labelStyling", "inputStyling", "defaultValue", "min", "max", "step", "precision"]);
+    // State
+    const [value, setValue] = useState(defaultValue);
+    useEffect(() => {
+        if (props.value !== undefined) {
+            setValue(props.value);
+        }
+    }, [props.value]);
+    const onChangeInputNumber = (value) => {
+        try {
+            if (value !== null) {
+                setValue(value);
+                typeof props.onAfterChange === 'function' && props.onAfterChange(value);
+            }
+        }
+        catch (error) {
+            handleError(error, {
+                path: PATH,
+                name: 'onChange',
+                args: {},
+            });
+        }
+    };
+    return (React.createElement(SliderWithInputNumberWrapper, null,
+        React.createElement("div", { className: labelClassName, style: labelStyling }, label),
+        React.createElement("div", { style: {
+                display: 'flex',
+                alignItems: 'center',
+                width: '100%',
+            } },
+            React.createElement(Slider, Object.assign({ defaultValue: defaultValue, min: min, max: max, step: step }, restOf, { onChange: value => setValue(value), value: value })),
+            React.createElement(InputNumber, { defaultValue: defaultValue, value: value, min: min, max: max, step: step || 1, style: Object.assign({ flexShrink: 0, width: 57, marginLeft: 20 }, inputStyling), 
+                // precision={precision}
+                onChange: onChangeInputNumber }))));
+};
+SliderWithInputNumber.defaultProps = {
+    defaultValue: 0,
+};

package/es/components/molecules/SliderWithInputNumber/styled.d.ts

@@ -0,0 +1 @@
+export declare const SliderWithInputNumberWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/components/molecules/SliderWithInputNumber/styled.js

@@ -0,0 +1,8 @@
+var _a;
+// Libraries
+import styled from 'styled-components';
+// Constants
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+export const SliderWithInputNumberWrapper = styled.div `
+  font-size: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.fontSize}px;
+`;

package/es/components/molecules/Tabs/Tabs.d.ts

@@ -0,0 +1 @@
+export { Tabs } from 'antd';

package/es/components/molecules/Tabs/Tabs.js

@@ -0,0 +1 @@
+export { Tabs } from 'antd';

package/es/components/molecules/Tabs/index.d.ts

@@ -0,0 +1 @@
+export { Tabs } from './Tabs';

package/es/components/molecules/Tabs/index.js

@@ -0,0 +1 @@
+export { Tabs } from './Tabs';

package/es/components/molecules/TreeSelect/TreeSelect.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const TreeSelect: (<ValueType = any, OptionType extends import("rc-tree-select/lib/TreeSelect").BaseOptionType | import("rc-tree-select/lib/TreeSelect").DefaultOptionType = import("rc-tree-select/lib/TreeSelect").DefaultOptionType>(props: import("antd").TreeSelectProps<ValueType, OptionType> & {
+    children?: import("react").ReactNode;
+} & {
+    ref?: import("react").Ref<import("antd").RefSelectProps> | undefined;
+}) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & {
+    TreeNode: import("react").FC<import("rc-tree-select/lib/TreeNode").TreeNodeProps>;
+    SHOW_ALL: "SHOW_ALL";
+    SHOW_PARENT: "SHOW_PARENT";
+    SHOW_CHILD: "SHOW_CHILD";
+    _InternalPanelDoNotUseOrYouWillBeFired: any;
+};

package/es/components/molecules/TreeSelect/TreeSelect.js

@@ -0,0 +1,2 @@
+import { TreeSelect as AntdTreeSelect } from 'antd';
+export const TreeSelect = AntdTreeSelect;

package/es/components/molecules/TreeSelect/index.d.ts

@@ -0,0 +1 @@
+export { TreeSelect } from './TreeSelect';

package/es/components/molecules/TreeSelect/index.js

@@ -0,0 +1 @@
+export { TreeSelect } from './TreeSelect';

package/es/components/molecules/UploadImage/MediaIcon.d.ts

@@ -0,0 +1,2 @@
+declare const MediaIcon: (_props: any) => JSX.Element;
+export default MediaIcon;

package/es/components/molecules/UploadImage/MediaIcon.js

@@ -0,0 +1,8 @@
+import React from 'react';
+const MediaIcon = _props => (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", 
+    // eslint-disable-next-line react/no-unknown-property
+    // xmlns:svg="http://www.w3.org/2000/svg"
+    className: "MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiBox-root css-1om0hkc", focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", width: 24, height: 24, fill: "rgba(0, 0, 0, 0.54)", "data-testid": "PermMediaIcon", version: "1.1", id: "svg4" },
+    React.createElement("defs", { id: "defs8" }),
+    React.createElement("path", { d: "M2 6H0v5h.01L0 20c0 1.1.9 2 2 2h18v-2H2V6zm20-2h-8l-2-2H6c-1.1 0-1.99.9-1.99 2L4 16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zM7 15l4.5-6 3.5 4.51 2.5-3.01L21 15H7z", id: "path2" })));
+export default MediaIcon;

package/es/components/molecules/UploadImage/index.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { UploadProps as AntdUploadProps } from 'antd/lib/upload';
+interface UploadImageProps extends AntdUploadProps {
+    labelHeadingModal?: string;
+    labelButtonSelect?: string;
+    searchPlaceholder?: string;
+    onRemoveImage?: Function;
+    onChangeImage?: Function;
+    selectedImage?: UploadImageObject;
+    isOpen?: boolean;
+    isInputMode?: boolean;
+    width?: any;
+    errors?: Array<any>;
+    extensions?: string[];
+    maxSize?: number;
+    title?: string;
+    showImageURL?: boolean;
+    placeholder?: string;
+    domainMedia: string;
+    slug: string;
+    paramConfigs?: {
+        token?: string;
+        userId?: string;
+        accountId: string;
+    };
+    required?: boolean;
+    focused?: boolean;
+}
+interface UploadImageObject {
+    url: string;
+}
+export declare const UploadImage: React.FC<UploadImageProps>;
+export {};