@antscorp/antsomi-ui 1.3.5-beta.31 → 1.3.5-beta.310

package/es/components/organism/FilterSetting/components/common/InputSelectMulti/Tree/index.js

@@ -0,0 +1,57 @@
+/* eslint-disable @typescript-eslint/no-use-before-define */
+// Libraries
+import React from 'react';
+import styled from 'styled-components';
+// Atoms
+import { Tooltip, Icon } from '@antscorp/antsomi-ui/es/components/atoms';
+import { TextField } from '../ColumnSuggestion';
+// Constants
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+export const TreeContentWrapper = props => {
+    const { treeData, onChange, data, onScroll } = props;
+    const showContent = childs => {
+        const result = [];
+        childs.forEach((item, key) => {
+            var _a;
+            result.push(React.createElement(Tooltip, { title: item.title },
+                React.createElement(ListItem, null,
+                    React.createElement(TextField, null, item.title),
+                    React.createElement(Icon, { disabled: data.includes(item.value), size: 10, type: "icon-ants-double-arrow-up", onClick: data.includes(item.value) ? () => { } : e => onChange(item.value), style: {
+                            color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary,
+                            cursor: 'pointer',
+                            transform: 'rotate(90deg)',
+                        } }))));
+        });
+        if (result.length > 0) {
+            return React.createElement(List, null, result);
+        }
+        return null;
+    };
+    return React.createElement(WrapperContent, { onScrollCapture: onScroll }, showContent(treeData));
+};
+export const WrapperContent = styled.div `
+  width: 100%;
+  height: 100%;
+`;
+export const List = styled.ul `
+  width: 100%;
+  height: 90%;
+  overflow: auto;
+  margin-top: 10px;
+`;
+export const ListItem = styled.li `
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 5px;
+  &:hover {
+    background-color: rgba(0, 0, 0, 0.04);
+  }
+`;
+export const Span = styled.div `
+  color: inherit;
+  max-width: 300px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;

package/es/components/organism/FilterSetting/components/common/InputSelectMulti/index.d.ts

@@ -0,0 +1,88 @@
+import React, { ReactNode, UIEventHandler } from 'react';
+import { TreeSelectProps as AntdTreeSelectProps } from 'antd';
+import { CustomerMetadata, EventBoFieldMetadata, EventMetadata, VisitorMetadata } from '@antscorp/antsomi-ui/es/components/atoms/InputDynamic/types';
+interface InputSelectMultiProps {
+    value: string[];
+    extend?: string[];
+    itemTypeId: number | null;
+    itemTypeName: string | null;
+    column: string | null;
+    customerMetadata: CustomerMetadata;
+    visitorMetadata: VisitorMetadata;
+    eventMetadata?: EventBoFieldMetadata | any;
+    valueType?: string;
+    errorMessage?: string;
+    hideSelectField?: boolean;
+    onChange: (val: InputSelectMultiProps['value'], key: any, key2?: any) => void;
+    onChangeMultipleValue: ({ value, event_metadata, visitor_metadata, customer_metadata, value_type, }: {
+        value?: string[];
+        event_metadata?: EventMetadata;
+        visitor_metadata?: VisitorMetadata;
+        customer_metadata?: CustomerMetadata;
+        value_type?: string;
+    }) => void;
+}
+export type TreeData = {
+    value: string;
+    title: string;
+    key: string;
+    isLeaf: boolean;
+}[];
+export type DataSelect = any;
+export declare const InputSelectMulti: React.FC<InputSelectMultiProps>;
+interface SelectMultipleProps extends AntdTreeSelectProps, Omit<SelectMultipleDropdownProps, 'menu'> {
+    loading?: boolean;
+    onChangeTreeData: (treeData: any) => void;
+    onChange: (val: InputSelectMultiProps['value']) => void;
+    mapLabel: {
+        [key: string | number]: string;
+    };
+    dropdownExtraContent?: ReactNode;
+    treeData: TreeData;
+    dataSelect: DataSelect;
+    onChangeOpen: () => void;
+    open?: boolean;
+    onSelectAll: () => void;
+    column?: string | null;
+    extendValue?: any;
+    isCheckDropDown?: boolean;
+    searchValue: any;
+    onSearch: (val: any) => void;
+}
+export declare const SelectMultiple: React.FC<SelectMultipleProps>;
+interface SelectMultipleDropdownProps {
+    menu: ReactNode;
+    isShowCheck: boolean;
+    onChangeIsShowCheck: () => void;
+    onUncheckAll: () => void;
+    onScroll: UIEventHandler<HTMLDivElement>;
+    extraContent?: ReactNode;
+    treeData: TreeData;
+    onChange: (val: InputSelectMultiProps['value']) => void;
+    dataSelect: DataSelect;
+    onChangeOpen: () => void;
+    open?: boolean;
+    onSelectAll: () => void;
+    onApplyExtendValue: (value: any) => void;
+    column?: string | null;
+    extendValue?: any;
+    onChangeRemoveExtend: (value: any) => void;
+    onPopover: () => void;
+    onApply: (data: any) => void;
+    openPopover: boolean;
+    searchValue: any;
+    onSearch: (val: any) => void;
+    loading?: boolean;
+}
+export declare const SelectMultipleDropdown: React.FC<SelectMultipleDropdownProps>;
+export declare const StyledDropdown: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ContainerCustomize: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperContentCustomize: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperContentSuggestion: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperSuggestion: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SuggestionTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SpanSelect: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const HeaderContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperFooterContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export {};