@j2-health/design-system 0.3.2 → 0.4.0
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/README.md +53 -20
- package/dist/src/components/alert/Alert.cjs +12 -2
- package/dist/src/components/alert/Alert.cjs.map +1 -1
- package/dist/src/components/alert/Alert.d.ts +1 -1
- package/dist/src/components/alert/Alert.js +12 -2
- package/dist/src/components/alert/Alert.js.map +1 -1
- package/dist/src/components/alert/Alert.module.css.cjs +1 -1
- package/dist/src/components/alert/Alert.module.css.js +1 -1
- package/dist/src/components/card/Card.cjs +1 -1
- package/dist/src/components/card/Card.cjs.map +1 -1
- package/dist/src/components/card/Card.js +1 -1
- package/dist/src/components/card/Card.js.map +1 -1
- package/dist/src/components/collapse/Collapse.module.css.cjs +3 -3
- package/dist/src/components/collapse/Collapse.module.css.js +3 -3
- package/dist/src/components/drawer/Drawer.cjs +3 -1
- package/dist/src/components/drawer/Drawer.cjs.map +1 -1
- package/dist/src/components/drawer/Drawer.js +3 -1
- package/dist/src/components/drawer/Drawer.js.map +1 -1
- package/dist/src/components/form/Form.cjs +21 -4
- package/dist/src/components/form/Form.cjs.map +1 -1
- package/dist/src/components/form/Form.d.ts +10 -3
- package/dist/src/components/form/Form.js +20 -3
- package/dist/src/components/form/Form.js.map +1 -1
- package/dist/src/components/form/FormItem.cjs +42 -0
- package/dist/src/components/form/FormItem.cjs.map +1 -0
- package/dist/src/components/form/FormItem.d.ts +10 -0
- package/dist/src/components/form/FormItem.js +42 -0
- package/dist/src/components/form/FormItem.js.map +1 -0
- package/dist/src/components/form/FormItemFieldContext.cjs +8 -0
- package/dist/src/components/form/FormItemFieldContext.cjs.map +1 -0
- package/dist/src/components/form/FormItemFieldContext.d.ts +2 -0
- package/dist/src/components/form/FormItemFieldContext.js +8 -0
- package/dist/src/components/form/FormItemFieldContext.js.map +1 -0
- package/dist/src/components/form/FormikField.cjs +20 -0
- package/dist/src/components/form/FormikField.cjs.map +1 -0
- package/dist/src/components/form/FormikField.d.ts +8 -0
- package/dist/src/components/form/FormikField.js +20 -0
- package/dist/src/components/form/FormikField.js.map +1 -0
- package/dist/src/components/input/AntdInput.d.ts +72 -26
- package/dist/src/components/input/AntdSearchInput.d.ts +77 -25
- package/dist/src/components/input/Input.cjs +29 -3
- package/dist/src/components/input/Input.cjs.map +1 -1
- package/dist/src/components/input/Input.d.ts +4 -3
- package/dist/src/components/input/Input.js +29 -3
- package/dist/src/components/input/Input.js.map +1 -1
- package/dist/src/components/inputnumber/InputNumber.cjs +20 -5
- package/dist/src/components/inputnumber/InputNumber.cjs.map +1 -1
- package/dist/src/components/inputnumber/InputNumber.d.ts +4 -3
- package/dist/src/components/inputnumber/InputNumber.js +19 -4
- package/dist/src/components/inputnumber/InputNumber.js.map +1 -1
- package/dist/src/components/inputnumber/InputNumber.module.css.cjs +1 -1
- package/dist/src/components/inputnumber/InputNumber.module.css.js +1 -1
- package/dist/src/components/modal/Modal.cjs +0 -1
- package/dist/src/components/modal/Modal.cjs.map +1 -1
- package/dist/src/components/modal/Modal.js +0 -1
- package/dist/src/components/modal/Modal.js.map +1 -1
- package/dist/src/components/notification/Notification.module.css.cjs +1 -1
- package/dist/src/components/notification/Notification.module.css.js +1 -1
- package/dist/src/components/notification/useNotification.cjs +5 -2
- package/dist/src/components/notification/useNotification.cjs.map +1 -1
- package/dist/src/components/notification/useNotification.js +5 -2
- package/dist/src/components/notification/useNotification.js.map +1 -1
- package/dist/src/components/pagination/Pagination.cjs +2 -0
- package/dist/src/components/pagination/Pagination.cjs.map +1 -1
- package/dist/src/components/pagination/Pagination.js +2 -0
- package/dist/src/components/pagination/Pagination.js.map +1 -1
- package/dist/src/components/popover/Popover.cjs +3 -1
- package/dist/src/components/popover/Popover.cjs.map +1 -1
- package/dist/src/components/popover/Popover.d.ts +1 -1
- package/dist/src/components/popover/Popover.js +3 -1
- package/dist/src/components/popover/Popover.js.map +1 -1
- package/dist/src/components/popover/Popover.module.css.cjs +9 -9
- package/dist/src/components/popover/Popover.module.css.js +9 -9
- package/dist/src/components/select/Select.cjs +29 -13
- package/dist/src/components/select/Select.cjs.map +1 -1
- package/dist/src/components/select/Select.js +29 -13
- package/dist/src/components/select/Select.js.map +1 -1
- package/dist/src/components/select/SummarizedSelect.cjs.map +1 -1
- package/dist/src/components/select/SummarizedSelect.js.map +1 -1
- package/dist/src/components/select/SummarizedSelect.module.css.cjs +8 -8
- package/dist/src/components/select/SummarizedSelect.module.css.js +8 -8
- package/dist/src/components/steps/Steps.cjs +14 -4
- package/dist/src/components/steps/Steps.cjs.map +1 -1
- package/dist/src/components/steps/Steps.d.ts +3 -3
- package/dist/src/components/steps/Steps.js +14 -4
- package/dist/src/components/steps/Steps.js.map +1 -1
- package/dist/src/components/table/Table.cjs +1 -1
- package/dist/src/components/table/Table.cjs.map +1 -1
- package/dist/src/components/table/Table.d.ts +4 -1
- package/dist/src/components/table/Table.js +1 -1
- package/dist/src/components/table/Table.js.map +1 -1
- package/dist/src/components/tag/Tag.cjs +4 -0
- package/dist/src/components/tag/Tag.cjs.map +1 -1
- package/dist/src/components/tag/Tag.d.ts +1 -1
- package/dist/src/components/tag/Tag.js +4 -0
- package/dist/src/components/tag/Tag.js.map +1 -1
- package/dist/style.css +92 -78
- package/package.json +11 -13
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { Select as Select$1 } from "
|
|
3
|
-
import { Spin } from "antd";
|
|
2
|
+
import { Select as Select$1, Spin } from "antd";
|
|
4
3
|
import { LoadingOutlined } from "@ant-design/icons";
|
|
5
4
|
import { XCircleIcon, MagnifyingGlassIcon, CaretDownIcon } from "@phosphor-icons/react";
|
|
6
5
|
import { useState } from "react";
|
|
7
|
-
import {
|
|
6
|
+
import { FormikField } from "../form/FormikField.js";
|
|
8
7
|
const isGroupOption = (opt) => "options" in opt && Array.isArray(opt.options);
|
|
9
8
|
const flattenOptions = (opts) => {
|
|
10
9
|
if (!opts) return [];
|
|
@@ -12,20 +11,25 @@ const flattenOptions = (opts) => {
|
|
|
12
11
|
(o) => isGroupOption(o) ? flattenOptions(o.options) : [o]
|
|
13
12
|
);
|
|
14
13
|
};
|
|
15
|
-
const Select = (props) => {
|
|
14
|
+
const Select = (props) => /* @__PURE__ */ jsx(FormikField, { name: props.name, children: ({ field, form }) => /* @__PURE__ */ jsx(SelectControl, { props, field, form }) });
|
|
15
|
+
const SelectControl = ({
|
|
16
|
+
props,
|
|
17
|
+
field,
|
|
18
|
+
form
|
|
19
|
+
}) => {
|
|
16
20
|
var _a;
|
|
17
21
|
const [isFocused, setIsFocused] = useState(false);
|
|
18
22
|
const [isSearching, setIsSearching] = useState(false);
|
|
19
|
-
const
|
|
23
|
+
const helpers = form.getFieldHelpers(props.name);
|
|
20
24
|
const isMultiple = props.mode === "multiple";
|
|
25
|
+
const isSearchable = props.mode === "tags" || (props.showSearch ?? isMultiple);
|
|
21
26
|
const hasOptions = (((_a = props.options) == null ? void 0 : _a.length) ?? 0) > 0;
|
|
22
27
|
const currentValue = Array.isArray(field.value) ? field.value : [];
|
|
23
28
|
const showSelectAllFooter = isMultiple && !props.loading && !props.disabled && hasOptions && !isSearching;
|
|
24
29
|
const handleSearch = (value) => {
|
|
25
30
|
setIsSearching(value.length > 0);
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
}
|
|
31
|
+
const onSearch = typeof props.showSearch === "object" ? props.showSearch.onSearch ?? props.onSearch : props.onSearch;
|
|
32
|
+
onSearch == null ? void 0 : onSearch(value);
|
|
29
33
|
};
|
|
30
34
|
const handleToggleAll = () => {
|
|
31
35
|
var _a2, _b;
|
|
@@ -83,19 +87,31 @@ const Select = (props) => {
|
|
|
83
87
|
size: "small",
|
|
84
88
|
"data-testid": "loading-spinner"
|
|
85
89
|
}
|
|
86
|
-
) :
|
|
90
|
+
) : isSearchable && isFocused ? /* @__PURE__ */ jsx(MagnifyingGlassIcon, { size: 14, "data-testid": "magnifying-glass" }) : /* @__PURE__ */ jsx(CaretDownIcon, { size: 14, "data-testid": "caret-down" }),
|
|
87
91
|
...props,
|
|
92
|
+
id: props.id ?? props.name,
|
|
93
|
+
value: field.value === "" || field.value === null ? void 0 : field.value,
|
|
94
|
+
onChange: (value, option) => {
|
|
95
|
+
var _a2;
|
|
96
|
+
void helpers.setValue(value);
|
|
97
|
+
(_a2 = props.onChange) == null ? void 0 : _a2.call(props, value, option);
|
|
98
|
+
},
|
|
88
99
|
popupRender: dropdownRender,
|
|
89
100
|
removeIcon: /* @__PURE__ */ jsx(XCircleIcon, { size: 12 }),
|
|
90
101
|
allowClear: props.allowClear ? { clearIcon: /* @__PURE__ */ jsx(XCircleIcon, { size: 14 }) } : false,
|
|
91
|
-
showSearch: props.showSearch,
|
|
92
|
-
onSearch: handleSearch,
|
|
93
|
-
onFocus: () => {
|
|
102
|
+
showSearch: typeof props.showSearch === "object" ? { ...props.showSearch, onSearch: handleSearch } : props.showSearch,
|
|
103
|
+
onSearch: isSearchable ? handleSearch : void 0,
|
|
104
|
+
onFocus: (event) => {
|
|
105
|
+
var _a2;
|
|
94
106
|
setIsFocused(true);
|
|
107
|
+
(_a2 = props.onFocus) == null ? void 0 : _a2.call(props, event);
|
|
95
108
|
},
|
|
96
|
-
onBlur: () => {
|
|
109
|
+
onBlur: (event) => {
|
|
110
|
+
var _a2;
|
|
111
|
+
void helpers.setTouched(true);
|
|
97
112
|
setIsFocused(false);
|
|
98
113
|
setIsSearching(false);
|
|
114
|
+
(_a2 = props.onBlur) == null ? void 0 : _a2.call(props, event);
|
|
99
115
|
},
|
|
100
116
|
size: props.size || "large"
|
|
101
117
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sources":["../../../../src/components/select/Select.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Select as AntDSelect
|
|
1
|
+
{"version":3,"file":"Select.js","sources":["../../../../src/components/select/Select.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Select as AntDSelect, Spin } from 'antd'\nimport { LoadingOutlined } from '@ant-design/icons'\nimport type {\n SelectProps as AntDSelectProps,\n DefaultOptionType,\n} from 'antd/es/select'\nimport {\n CaretDownIcon,\n MagnifyingGlassIcon,\n XCircleIcon,\n} from '@phosphor-icons/react'\nimport { useState } from 'react'\nimport type { FieldProps } from 'formik'\nimport { FormikField } from '../form/FormikField'\n\ntype SelectProps = Expand<AntDSelectProps> & {\n name: string\n}\n\ntype GroupOption = { label?: React.ReactNode; options: DefaultOptionType[] }\n\nconst isGroupOption = (\n opt: DefaultOptionType | GroupOption\n): opt is GroupOption =>\n 'options' in opt && Array.isArray((opt as GroupOption).options)\n\nconst flattenOptions = (\n opts: (DefaultOptionType | GroupOption)[] | undefined\n): DefaultOptionType[] => {\n if (!opts) return []\n return opts.flatMap((o) =>\n isGroupOption(o) ? flattenOptions(o.options) : [o]\n )\n}\n\nexport const Select = (props: SelectProps) => (\n <FormikField name={props.name}>\n {({ field, form }) => (\n <SelectControl props={props} field={field} form={form} />\n )}\n </FormikField>\n)\n\nconst SelectControl = ({\n props,\n field,\n form,\n}: { props: SelectProps } & Pick<FieldProps, 'field' | 'form'>) => {\n const [isFocused, setIsFocused] = useState(false)\n const [isSearching, setIsSearching] = useState(false)\n const helpers = form.getFieldHelpers(props.name)\n\n const isMultiple = props.mode === 'multiple'\n const isSearchable = props.mode === 'tags' || (props.showSearch ?? isMultiple)\n const hasOptions = (props.options?.length ?? 0) > 0\n const currentValue: unknown[] = Array.isArray(field.value) ? field.value : []\n const showSelectAllFooter =\n isMultiple &&\n !props.loading &&\n !props.disabled &&\n hasOptions &&\n !isSearching\n\n const handleSearch = (value: string) => {\n setIsSearching(value.length > 0)\n const onSearch =\n typeof props.showSearch === 'object'\n ? (props.showSearch.onSearch ?? props.onSearch)\n : props.onSearch\n onSearch?.(value)\n }\n\n const handleToggleAll = () => {\n if (props.disabled) return\n\n if (currentValue.length === 0) {\n const flat = flattenOptions(\n props.options as (DefaultOptionType | GroupOption)[] | undefined\n )\n const allOptions = flat.filter(\n (opt) => opt.value !== undefined && opt.value !== null && !opt.disabled\n )\n // antd's labelInValue mode expects values shaped as { value, label }\n // rather than raw scalars; mirror that contract so the field state\n // and downstream onChange payload match what consumers expect.\n const payload = props.labelInValue\n ? allOptions.map((opt) => ({ value: opt.value, label: opt.label }))\n : allOptions.map((opt) => opt.value as string | number)\n void helpers.setValue(payload)\n props.onChange?.(payload, allOptions)\n } else {\n void helpers.setValue([])\n props.onChange?.([], [])\n }\n }\n\n const dropdownRender = (menu: React.ReactElement): React.ReactElement => {\n if (props.loading) {\n return (\n <div className=\"flex items-center justify-between px-3 py-1\">\n <span>Loading...</span>\n <Spin indicator={<LoadingOutlined spin />} size=\"small\" />\n </div>\n )\n }\n\n if (!props.options || (props.options && props.options.length === 0)) {\n return <div className=\"px-3 py-1\">No options</div>\n }\n\n if (!showSelectAllFooter) return menu\n\n const label = currentValue.length === 0 ? 'Select all' : 'Clear all'\n\n return (\n <>\n {menu}\n <div className=\"mt-1 pt-1 border-t border-j2-border-secondary\">\n <button\n type=\"button\"\n aria-label={label}\n title={label}\n onMouseDown={(e) => e.preventDefault()}\n onClick={handleToggleAll}\n className=\"w-full text-center font-semibold text-sm py-1.5 rounded cursor-pointer text-j2-primary hover:bg-j2-primary-bg-hover bg-transparent border-0\"\n >\n {label}\n </button>\n </div>\n </>\n )\n }\n\n return (\n <AntDSelect\n suffixIcon={\n props.loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : isSearchable && isFocused ? (\n <MagnifyingGlassIcon size={14} data-testid=\"magnifying-glass\" />\n ) : (\n <CaretDownIcon size={14} data-testid=\"caret-down\" />\n )\n }\n {...props}\n id={props.id ?? props.name}\n value={\n field.value === '' || field.value === null ? undefined : field.value\n }\n onChange={(value, option) => {\n void helpers.setValue(value)\n props.onChange?.(value, option)\n }}\n popupRender={dropdownRender}\n removeIcon={<XCircleIcon size={12} />}\n allowClear={\n props.allowClear ? { clearIcon: <XCircleIcon size={14} /> } : false\n }\n showSearch={\n typeof props.showSearch === 'object'\n ? { ...props.showSearch, onSearch: handleSearch }\n : props.showSearch\n }\n onSearch={isSearchable ? handleSearch : undefined}\n onFocus={(event) => {\n setIsFocused(true)\n props.onFocus?.(event)\n }}\n onBlur={(event) => {\n void helpers.setTouched(true)\n setIsFocused(false)\n setIsSearching(false)\n props.onBlur?.(event)\n }}\n size={props.size || 'large'}\n />\n )\n}\n"],"names":["_a","AntDSelect"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummarizedSelect.cjs","sources":["../../../../src/components/select/SummarizedSelect.tsx"],"sourcesContent":["import {\n Dropdown as AntdDropdown,\n Select,\n Spin,\n Input,\n SelectProps,\n InputRef,\n Typography,\n} from 'antd'\nimport { DefaultOptionType } from 'antd/es/select'\nimport { useState, useMemo, useRef, useEffect } from 'react'\nimport { LoadingOutlined } from '@ant-design/icons'\nimport type { FlattenOptionData } from 'rc-select/lib/interface'\nimport * as icons from '../icons'\nimport { Tag } from '../tag'\nimport cx from 'classnames'\n\nimport styles from './SummarizedSelect.module.css'\n\ntype Option = DefaultOptionType\ntype OptionWithLogo = Option & {\n logo: React.ReactNode\n}\n\ntype GroupOption = {\n label: string\n options: Option[]\n}\n\nexport type SelectOption = Option | GroupOption | OptionWithLogo\n\nexport type SummarizedSelectVariant = SelectProps['variant'] | 'headlined'\n\nexport type SummarizedSelectTrigger = 'select' | 'dropdown'\n\ntype BaseProps = Omit<\n SelectProps<string | string[], SelectOption>,\n 'mode' | 'value' | 'onChange' | 'variant'\n> & {\n searchPlaceholder?: string\n formControlPlaceholder?: string\n rootClassName?: string\n popupClassName?: string\n variant?: SummarizedSelectVariant\n /**\n * Shape of the control that opens the popup.\n * - `'select'` (default): antd Select, styled by `variant`.\n * - `'dropdown'`: antd Dropdown with a `Typography.Link` target (label + caret).\n * Ignores `variant` — the trigger is always a link.\n */\n trigger?: SummarizedSelectTrigger\n defaultOpen?: boolean\n\n loading?: boolean\n}\n\ntype SingleProps = {\n multiple?: false\n renderLabel?: undefined\n value: string | undefined\n onChange: (newValue: string) => void\n}\n\ntype MultiProps = {\n multiple: true\n renderLabel: (count: number) => string\n value: string[]\n onChange: (newValue: string[]) => void\n}\n\nexport type Props = BaseProps & (SingleProps | MultiProps)\n\nconst isGroupOption = (option: SelectOption): option is GroupOption => {\n return 'options' in option\n}\n\nconst getAllOptions = (options: SelectOption[] | undefined): Option[] => {\n if (!options) return []\n\n return options.flatMap((option) =>\n isGroupOption(option) ? option.options : [option]\n )\n}\n\nconst filterOptions = (\n options: SelectOption[] | undefined,\n searchValue: string\n): SelectOption[] => {\n if (!options) return []\n if (!searchValue) return options\n\n return options\n .map((option) => {\n if (isGroupOption(option)) {\n const filteredSubOptions = option.options.filter((subOption) =>\n subOption.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n return filteredSubOptions.length > 0\n ? { ...option, options: filteredSubOptions }\n : null\n } else {\n return option.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n ? option\n : null\n }\n })\n .filter((option): option is SelectOption => option !== null)\n}\n\nexport function SummarizedSelect({\n searchPlaceholder,\n formControlPlaceholder,\n loading,\n multiple,\n value,\n onChange,\n options,\n renderLabel,\n rootClassName,\n popupClassName,\n variant,\n trigger = 'select',\n defaultOpen = false,\n ...props\n}: Props) {\n const isHeadline = variant === 'headlined'\n const antVariant = isHeadline ? 'borderless' : variant\n const [searchValue, setSearchValue] = useState('')\n const [focusTrigger, setFocusTrigger] = useState(defaultOpen ? 1 : 0)\n const [isOpen, setIsOpen] = useState(defaultOpen)\n const inputRef = useRef<InputRef>(null)\n const measureSpanRef = useRef<HTMLSpanElement>(null)\n const [measuredWidth, setMeasuredWidth] = useState<number>()\n\n const displayText = useMemo(() => {\n if (multiple && value.length > 0) {\n return renderLabel(value.length)\n }\n if (!multiple && value) {\n const option = getAllOptions(options).find((opt) => opt.value === value)\n return option ? String(option.label) : String(value)\n }\n return formControlPlaceholder ?? ''\n }, [multiple, value, options, renderLabel, formControlPlaceholder])\n\n useEffect(() => {\n if (!measureSpanRef.current) return\n // padding (22px = 11px each side) + arrow (18px) + border (6px)\n setMeasuredWidth(Math.ceil(measureSpanRef.current.offsetWidth) + 46)\n }, [displayText])\n\n useEffect(() => {\n if (focusTrigger > 0) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setTimeout(() => {\n inputRef.current?.focus({ cursor: 'end' })\n }, 100)\n })\n })\n }\n }, [focusTrigger])\n\n const filteredOptions = useMemo(() => {\n return filterOptions(options, searchValue)\n }, [searchValue, options])\n\n const flatFilteredOptions = useMemo(() => {\n return getAllOptions(filteredOptions)\n }, [filteredOptions])\n\n const allFlatOptions = useMemo(() => {\n return getAllOptions(options)\n }, [options])\n\n const handleTagClose = (removedValue: string) => {\n if (!multiple) return\n\n onChange(value.filter((x) => x !== removedValue))\n }\n\n const handleToggleAll = () => {\n if (!multiple) return\n\n const allFilteredValues = getAllOptions(filteredOptions).map(\n (opt) => opt.value as string\n )\n const someSelected = allFilteredValues.some((val) => value.includes(val))\n\n if (someSelected) {\n onChange(value.filter((val) => !allFilteredValues.includes(val)))\n }\n }\n\n const handleSelectFirstOption = () => {\n if (flatFilteredOptions.length === 0) return\n\n const firstOption = flatFilteredOptions[0]\n if (!firstOption) return\n\n const optionValue = firstOption.value as string\n\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleOptionClick = (optionValue: string) => {\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n // Allow these navigation keys to bubble up to Select's native keyboard handler\n const navigationKeys = ['ArrowUp', 'ArrowDown']\n\n // Handle Enter - select first filtered option (custom behavior)\n if (e.key === 'Enter') {\n e.preventDefault()\n e.stopPropagation()\n handleSelectFirstOption()\n return\n }\n\n // Handle Escape - close dropdown (custom behavior)\n if (e.key === 'Escape') {\n e.preventDefault()\n e.stopPropagation()\n setIsOpen(false)\n return\n }\n\n // For arrow keys, prevent cursor movement but allow propagation to Select\n if (navigationKeys.includes(e.key)) {\n e.preventDefault() // Prevents cursor from moving to start/end of input text\n // Do NOT call stopPropagation() - let event bubble to Select component\n return\n }\n\n // For all other keys (including Backspace), stop propagation\n // This prevents backspace from removing tags in multiple mode\n e.stopPropagation()\n }\n\n const optionRender = (option: FlattenOptionData<SelectOption>) => {\n if ('logo' in option.data && option.data.logo) {\n return (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">{option.data.logo}</div>\n <span className=\"overflow-ellipsis overflow-hidden\">\n {option.label}\n </span>\n </div>\n )\n }\n return <div>{option.label}</div>\n }\n\n const popupRender = (menu: React.ReactElement) => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div>\n <div className=\"mb-2 px-2 pb-2 border-b -mx-1 mt-1\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n e.preventDefault()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 ? (\n <div className=\"px-2 pb-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((value) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={value}\n status=\"default\"\n closable\n onClose={() => handleTagClose(value)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(value)}\n >\n {valueToLabel(value)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n ) : null}\n <div\n className={cx(styles.menuContainer, 'rounded-lg', {\n [styles.headlinedMenuContainer]: isHeadline,\n [styles.menuContainerMultiple]: multiple,\n })}\n >\n {menu}\n </div>\n <div className=\"flex justify-between items-center\">\n {multiple && (\n <div className=\"w-full mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n aria-selected=\"false\"\n className={cx(\n 'ant-select-item ant-select-item-option w-full',\n styles.clearAllButton\n )}\n title=\"Clear all\"\n onClick={handleToggleAll}\n >\n <div className=\"ant-select-item-option-content text-center font-semibold\">\n Clear all\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n }\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open)\n if (open) {\n // Trigger focus by updating the counter\n setFocusTrigger((prev) => prev + 1)\n } else {\n setSearchValue('')\n }\n }\n\n const renderDropdownOptionRow = (option: Option) => {\n const optionValue = option.value as string\n const isSelected = multiple\n ? value.includes(optionValue)\n : value === optionValue\n const hasLogo = 'logo' in option && (option as OptionWithLogo).logo\n return (\n <div\n key={optionValue}\n role=\"option\"\n aria-selected={isSelected}\n onClick={() => handleOptionClick(optionValue)}\n className={cx(\n 'px-3 py-1.5 rounded cursor-pointer text-sm',\n isSelected\n ? 'bg-[var(--j2-color-primary)] text-white hover:bg-[var(--j2-color-primary)]'\n : 'hover:bg-[var(--j2-color-bg-hover)]'\n )}\n >\n {hasLogo ? (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">\n {(option as OptionWithLogo).logo}\n </div>\n <span className=\"overflow-hidden overflow-ellipsis\">\n {option.label}\n </span>\n </div>\n ) : (\n option.label\n )}\n </div>\n )\n }\n\n const dropdownPopupRender = () => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div className=\"bg-white rounded-lg shadow-md p-2 min-w-[240px]\">\n <div className=\"pb-2 border-b border-j2-border-secondary\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 && (\n <div className=\"px-1 pt-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((v) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={v}\n status=\"default\"\n closable\n onClose={() => handleTagClose(v)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(v)}\n >\n {valueToLabel(v)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n )}\n <div\n className=\"max-h-72 overflow-y-auto py-1\"\n role=\"listbox\"\n aria-multiselectable={multiple || undefined}\n >\n {filteredOptions.length === 0 ? (\n <div className=\"px-3 py-2 text-sm text-[var(--j2-color-text-secondary)]\">\n No options found\n </div>\n ) : (\n filteredOptions.map((opt) => {\n if (isGroupOption(opt)) {\n return (\n <div key={`group-${opt.label}`}>\n <div className=\"px-3 pt-2 pb-1 text-xs font-semibold uppercase tracking-wide text-[var(--j2-color-text-tertiary)]\">\n {opt.label}\n </div>\n {opt.options.map(renderDropdownOptionRow)}\n </div>\n )\n }\n return renderDropdownOptionRow(opt)\n })\n )}\n </div>\n {multiple && value.length > 0 && (\n <div className=\"mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n role=\"button\"\n aria-label=\"Clear all\"\n title=\"Clear all\"\n onClick={handleToggleAll}\n className={cx(\n 'text-center font-semibold text-sm py-1.5 rounded cursor-pointer',\n styles.clearAllButton\n )}\n >\n Clear all\n </div>\n </div>\n )}\n </div>\n )\n }\n\n if (trigger === 'dropdown') {\n const hasSelection = multiple ? value.length > 0 : Boolean(value)\n const triggerContent = (\n <span className=\"inline-flex items-center gap-1\">\n {hasSelection ? displayText : (formControlPlaceholder ?? 'Select')}\n {loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon weight=\"regular\" data-testid=\"caret-down\" />\n )}\n </span>\n )\n\n return (\n <AntdDropdown\n open={isOpen}\n onOpenChange={handleOpenChange}\n trigger={['click']}\n disabled={props.disabled}\n popupRender={dropdownPopupRender}\n >\n <Typography.Link\n disabled={props.disabled}\n className={cx('inline-flex', rootClassName)}\n >\n {triggerContent}\n </Typography.Link>\n </AntdDropdown>\n )\n }\n\n return (\n <>\n <span\n ref={measureSpanRef}\n aria-hidden\n style={{\n position: 'absolute',\n visibility: 'hidden',\n whiteSpace: 'nowrap',\n fontSize: 'inherit',\n }}\n >\n {displayText}\n </span>\n <Select<string | string[], SelectOption>\n open={isOpen}\n showSearch={false}\n style={{ width: measuredWidth }}\n suffixIcon={\n loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon size={14} data-testid=\"caret-down\" />\n )\n }\n placeholder={formControlPlaceholder}\n mode={multiple ? 'multiple' : undefined}\n value={value}\n maxTagCount={0}\n maxTagPlaceholder={multiple ? () => renderLabel(value.length) : value}\n options={filteredOptions}\n onChange={(val) => {\n if (multiple) {\n if (Array.isArray(val)) {\n onChange(val)\n } else {\n throw new Error('Value should be an array in multiple mode')\n }\n } else {\n if (typeof val === 'string') {\n onChange(val)\n } else {\n throw new Error(\n 'Value should be a string in single selection mode'\n )\n }\n }\n }}\n popupRender={popupRender}\n optionRender={optionRender}\n onOpenChange={handleOpenChange}\n classNames={{\n root: cx(rootClassName, styles.summarizedSelect, {\n [styles.hemisphericSelect]:\n variant !== 'underlined' && variant !== 'headlined',\n [styles.isActive]:\n multiple &&\n value.length > 0 &&\n variant !== 'underlined' &&\n variant !== 'headlined',\n [styles.headlinedSelect]: isHeadline,\n }),\n popup: { root: popupClassName },\n }}\n variant={antVariant}\n {...props}\n />\n </>\n )\n}\n"],"names":["_a","useState","useRef","useMemo","useEffect","jsxs","jsx","Input","icons.MagnifyingGlassIcon","value","Tag","styles","Spin","LoadingOutlined","icons.CaretDownIcon","AntdDropdown","Typography","Fragment","Select"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SummarizedSelect.cjs","sources":["../../../../src/components/select/SummarizedSelect.tsx"],"sourcesContent":["import {\n Dropdown as AntdDropdown,\n Select,\n Spin,\n Input,\n SelectProps,\n InputRef,\n Typography,\n} from 'antd'\nimport { DefaultOptionType } from 'antd/es/select'\nimport { useState, useMemo, useRef, useEffect } from 'react'\nimport { LoadingOutlined } from '@ant-design/icons'\nimport * as icons from '../icons'\nimport { Tag } from '../tag'\nimport cx from 'classnames'\n\nimport styles from './SummarizedSelect.module.css'\n\ntype Option = DefaultOptionType\ntype OptionWithLogo = Option & {\n logo: React.ReactNode\n}\n\ntype GroupOption = {\n label: string\n options: Option[]\n}\n\nexport type SelectOption = Option | GroupOption | OptionWithLogo\n\nexport type SummarizedSelectVariant = SelectProps['variant'] | 'headlined'\n\nexport type SummarizedSelectTrigger = 'select' | 'dropdown'\n\ntype BaseProps = Omit<\n SelectProps<string | string[], SelectOption>,\n 'mode' | 'value' | 'onChange' | 'variant'\n> & {\n searchPlaceholder?: string\n formControlPlaceholder?: string\n rootClassName?: string\n popupClassName?: string\n variant?: SummarizedSelectVariant\n /**\n * Shape of the control that opens the popup.\n * - `'select'` (default): antd Select, styled by `variant`.\n * - `'dropdown'`: antd Dropdown with a `Typography.Link` target (label + caret).\n * Ignores `variant` — the trigger is always a link.\n */\n trigger?: SummarizedSelectTrigger\n defaultOpen?: boolean\n\n loading?: boolean\n}\n\ntype SingleProps = {\n multiple?: false\n renderLabel?: undefined\n value: string | undefined\n onChange: (newValue: string) => void\n}\n\ntype MultiProps = {\n multiple: true\n renderLabel: (count: number) => string\n value: string[]\n onChange: (newValue: string[]) => void\n}\n\nexport type Props = BaseProps & (SingleProps | MultiProps)\n\nconst isGroupOption = (option: SelectOption): option is GroupOption => {\n return 'options' in option\n}\n\nconst getAllOptions = (options: SelectOption[] | undefined): Option[] => {\n if (!options) return []\n\n return options.flatMap((option) =>\n isGroupOption(option) ? option.options : [option]\n )\n}\n\nconst filterOptions = (\n options: SelectOption[] | undefined,\n searchValue: string\n): SelectOption[] => {\n if (!options) return []\n if (!searchValue) return options\n\n return options\n .map((option) => {\n if (isGroupOption(option)) {\n const filteredSubOptions = option.options.filter((subOption) =>\n subOption.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n return filteredSubOptions.length > 0\n ? { ...option, options: filteredSubOptions }\n : null\n } else {\n return option.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n ? option\n : null\n }\n })\n .filter((option): option is SelectOption => option !== null)\n}\n\nexport function SummarizedSelect({\n searchPlaceholder,\n formControlPlaceholder,\n loading,\n multiple,\n value,\n onChange,\n options,\n renderLabel,\n rootClassName,\n popupClassName,\n variant,\n trigger = 'select',\n defaultOpen = false,\n ...props\n}: Props) {\n const isHeadline = variant === 'headlined'\n const antVariant = isHeadline ? 'borderless' : variant\n const [searchValue, setSearchValue] = useState('')\n const [focusTrigger, setFocusTrigger] = useState(defaultOpen ? 1 : 0)\n const [isOpen, setIsOpen] = useState(defaultOpen)\n const inputRef = useRef<InputRef>(null)\n const measureSpanRef = useRef<HTMLSpanElement>(null)\n const [measuredWidth, setMeasuredWidth] = useState<number>()\n\n const displayText = useMemo(() => {\n if (multiple && value.length > 0) {\n return renderLabel(value.length)\n }\n if (!multiple && value) {\n const option = getAllOptions(options).find((opt) => opt.value === value)\n return option ? String(option.label) : String(value)\n }\n return formControlPlaceholder ?? ''\n }, [multiple, value, options, renderLabel, formControlPlaceholder])\n\n useEffect(() => {\n if (!measureSpanRef.current) return\n // padding (22px = 11px each side) + arrow (18px) + border (6px)\n setMeasuredWidth(Math.ceil(measureSpanRef.current.offsetWidth) + 46)\n }, [displayText])\n\n useEffect(() => {\n if (focusTrigger > 0) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setTimeout(() => {\n inputRef.current?.focus({ cursor: 'end' })\n }, 100)\n })\n })\n }\n }, [focusTrigger])\n\n const filteredOptions = useMemo(() => {\n return filterOptions(options, searchValue)\n }, [searchValue, options])\n\n const flatFilteredOptions = useMemo(() => {\n return getAllOptions(filteredOptions)\n }, [filteredOptions])\n\n const allFlatOptions = useMemo(() => {\n return getAllOptions(options)\n }, [options])\n\n const handleTagClose = (removedValue: string) => {\n if (!multiple) return\n\n onChange(value.filter((x) => x !== removedValue))\n }\n\n const handleToggleAll = () => {\n if (!multiple) return\n\n const allFilteredValues = getAllOptions(filteredOptions).map(\n (opt) => opt.value as string\n )\n const someSelected = allFilteredValues.some((val) => value.includes(val))\n\n if (someSelected) {\n onChange(value.filter((val) => !allFilteredValues.includes(val)))\n }\n }\n\n const handleSelectFirstOption = () => {\n if (flatFilteredOptions.length === 0) return\n\n const firstOption = flatFilteredOptions[0]\n if (!firstOption) return\n\n const optionValue = firstOption.value as string\n\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleOptionClick = (optionValue: string) => {\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n // Allow these navigation keys to bubble up to Select's native keyboard handler\n const navigationKeys = ['ArrowUp', 'ArrowDown']\n\n // Handle Enter - select first filtered option (custom behavior)\n if (e.key === 'Enter') {\n e.preventDefault()\n e.stopPropagation()\n handleSelectFirstOption()\n return\n }\n\n // Handle Escape - close dropdown (custom behavior)\n if (e.key === 'Escape') {\n e.preventDefault()\n e.stopPropagation()\n setIsOpen(false)\n return\n }\n\n // For arrow keys, prevent cursor movement but allow propagation to Select\n if (navigationKeys.includes(e.key)) {\n e.preventDefault() // Prevents cursor from moving to start/end of input text\n // Do NOT call stopPropagation() - let event bubble to Select component\n return\n }\n\n // For all other keys (including Backspace), stop propagation\n // This prevents backspace from removing tags in multiple mode\n e.stopPropagation()\n }\n\n const optionRender: NonNullable<\n SelectProps<string | string[], SelectOption>['optionRender']\n > = (option) => {\n if ('logo' in option.data && option.data.logo) {\n return (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">{option.data.logo}</div>\n <span className=\"overflow-ellipsis overflow-hidden\">\n {option.label}\n </span>\n </div>\n )\n }\n return <div>{option.label}</div>\n }\n\n const popupRender = (menu: React.ReactElement) => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div>\n <div className=\"mb-2 px-2 pb-2 border-b -mx-1 mt-1\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n e.preventDefault()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 ? (\n <div className=\"px-2 pb-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((value) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={value}\n status=\"default\"\n closable\n onClose={() => handleTagClose(value)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(value)}\n >\n {valueToLabel(value)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n ) : null}\n <div\n className={cx(styles.menuContainer, 'rounded-lg', {\n [styles.headlinedMenuContainer]: isHeadline,\n [styles.menuContainerMultiple]: multiple,\n })}\n >\n {menu}\n </div>\n <div className=\"flex justify-between items-center\">\n {multiple && (\n <div className=\"w-full mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n aria-selected=\"false\"\n className={cx(\n 'ant-select-item ant-select-item-option w-full',\n styles.clearAllButton\n )}\n title=\"Clear all\"\n onClick={handleToggleAll}\n >\n <div className=\"ant-select-item-option-content text-center font-semibold\">\n Clear all\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n }\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open)\n if (open) {\n // Trigger focus by updating the counter\n setFocusTrigger((prev) => prev + 1)\n } else {\n setSearchValue('')\n }\n }\n\n const renderDropdownOptionRow = (option: Option) => {\n const optionValue = option.value as string\n const isSelected = multiple\n ? value.includes(optionValue)\n : value === optionValue\n const hasLogo = 'logo' in option && (option as OptionWithLogo).logo\n return (\n <div\n key={optionValue}\n role=\"option\"\n aria-selected={isSelected}\n onClick={() => handleOptionClick(optionValue)}\n className={cx(\n 'px-3 py-1.5 rounded cursor-pointer text-sm',\n isSelected\n ? 'bg-[var(--j2-color-primary)] text-white hover:bg-[var(--j2-color-primary)]'\n : 'hover:bg-[var(--j2-color-bg-hover)]'\n )}\n >\n {hasLogo ? (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">\n {(option as OptionWithLogo).logo}\n </div>\n <span className=\"overflow-hidden overflow-ellipsis\">\n {option.label}\n </span>\n </div>\n ) : (\n option.label\n )}\n </div>\n )\n }\n\n const dropdownPopupRender = () => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div className=\"bg-white rounded-lg shadow-md p-2 min-w-[240px]\">\n <div className=\"pb-2 border-b border-j2-border-secondary\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 && (\n <div className=\"px-1 pt-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((v) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={v}\n status=\"default\"\n closable\n onClose={() => handleTagClose(v)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(v)}\n >\n {valueToLabel(v)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n )}\n <div\n className=\"max-h-72 overflow-y-auto py-1\"\n role=\"listbox\"\n aria-multiselectable={multiple || undefined}\n >\n {filteredOptions.length === 0 ? (\n <div className=\"px-3 py-2 text-sm text-[var(--j2-color-text-secondary)]\">\n No options found\n </div>\n ) : (\n filteredOptions.map((opt) => {\n if (isGroupOption(opt)) {\n return (\n <div key={`group-${opt.label}`}>\n <div className=\"px-3 pt-2 pb-1 text-xs font-semibold uppercase tracking-wide text-[var(--j2-color-text-tertiary)]\">\n {opt.label}\n </div>\n {opt.options.map(renderDropdownOptionRow)}\n </div>\n )\n }\n return renderDropdownOptionRow(opt)\n })\n )}\n </div>\n {multiple && value.length > 0 && (\n <div className=\"mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n role=\"button\"\n aria-label=\"Clear all\"\n title=\"Clear all\"\n onClick={handleToggleAll}\n className={cx(\n 'text-center font-semibold text-sm py-1.5 rounded cursor-pointer',\n styles.clearAllButton\n )}\n >\n Clear all\n </div>\n </div>\n )}\n </div>\n )\n }\n\n if (trigger === 'dropdown') {\n const hasSelection = multiple ? value.length > 0 : Boolean(value)\n const triggerContent = (\n <span className=\"inline-flex items-center gap-1\">\n {hasSelection ? displayText : (formControlPlaceholder ?? 'Select')}\n {loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon weight=\"regular\" data-testid=\"caret-down\" />\n )}\n </span>\n )\n\n return (\n <AntdDropdown\n open={isOpen}\n onOpenChange={handleOpenChange}\n trigger={['click']}\n disabled={props.disabled}\n popupRender={dropdownPopupRender}\n >\n <Typography.Link\n disabled={props.disabled}\n className={cx('inline-flex', rootClassName)}\n >\n {triggerContent}\n </Typography.Link>\n </AntdDropdown>\n )\n }\n\n return (\n <>\n <span\n ref={measureSpanRef}\n aria-hidden\n style={{\n position: 'absolute',\n visibility: 'hidden',\n whiteSpace: 'nowrap',\n fontSize: 'inherit',\n }}\n >\n {displayText}\n </span>\n <Select<string | string[], SelectOption>\n open={isOpen}\n showSearch={false}\n style={{ width: measuredWidth }}\n suffixIcon={\n loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon size={14} data-testid=\"caret-down\" />\n )\n }\n placeholder={formControlPlaceholder}\n mode={multiple ? 'multiple' : undefined}\n value={value}\n maxTagCount={0}\n maxTagPlaceholder={multiple ? () => renderLabel(value.length) : value}\n options={filteredOptions}\n onChange={(val) => {\n if (multiple) {\n if (Array.isArray(val)) {\n onChange(val)\n } else {\n throw new Error('Value should be an array in multiple mode')\n }\n } else {\n if (typeof val === 'string') {\n onChange(val)\n } else {\n throw new Error(\n 'Value should be a string in single selection mode'\n )\n }\n }\n }}\n popupRender={popupRender}\n optionRender={optionRender}\n onOpenChange={handleOpenChange}\n classNames={{\n root: cx(rootClassName, styles.summarizedSelect, {\n [styles.hemisphericSelect]:\n variant !== 'underlined' && variant !== 'headlined',\n [styles.isActive]:\n multiple &&\n value.length > 0 &&\n variant !== 'underlined' &&\n variant !== 'headlined',\n [styles.headlinedSelect]: isHeadline,\n }),\n popup: { root: popupClassName },\n }}\n variant={antVariant}\n {...props}\n />\n </>\n )\n}\n"],"names":["_a","useState","useRef","useMemo","useEffect","jsxs","jsx","Input","icons.MagnifyingGlassIcon","value","Tag","styles","Spin","LoadingOutlined","icons.CaretDownIcon","AntdDropdown","Typography","Fragment","Select"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummarizedSelect.js","sources":["../../../../src/components/select/SummarizedSelect.tsx"],"sourcesContent":["import {\n Dropdown as AntdDropdown,\n Select,\n Spin,\n Input,\n SelectProps,\n InputRef,\n Typography,\n} from 'antd'\nimport { DefaultOptionType } from 'antd/es/select'\nimport { useState, useMemo, useRef, useEffect } from 'react'\nimport { LoadingOutlined } from '@ant-design/icons'\nimport type { FlattenOptionData } from 'rc-select/lib/interface'\nimport * as icons from '../icons'\nimport { Tag } from '../tag'\nimport cx from 'classnames'\n\nimport styles from './SummarizedSelect.module.css'\n\ntype Option = DefaultOptionType\ntype OptionWithLogo = Option & {\n logo: React.ReactNode\n}\n\ntype GroupOption = {\n label: string\n options: Option[]\n}\n\nexport type SelectOption = Option | GroupOption | OptionWithLogo\n\nexport type SummarizedSelectVariant = SelectProps['variant'] | 'headlined'\n\nexport type SummarizedSelectTrigger = 'select' | 'dropdown'\n\ntype BaseProps = Omit<\n SelectProps<string | string[], SelectOption>,\n 'mode' | 'value' | 'onChange' | 'variant'\n> & {\n searchPlaceholder?: string\n formControlPlaceholder?: string\n rootClassName?: string\n popupClassName?: string\n variant?: SummarizedSelectVariant\n /**\n * Shape of the control that opens the popup.\n * - `'select'` (default): antd Select, styled by `variant`.\n * - `'dropdown'`: antd Dropdown with a `Typography.Link` target (label + caret).\n * Ignores `variant` — the trigger is always a link.\n */\n trigger?: SummarizedSelectTrigger\n defaultOpen?: boolean\n\n loading?: boolean\n}\n\ntype SingleProps = {\n multiple?: false\n renderLabel?: undefined\n value: string | undefined\n onChange: (newValue: string) => void\n}\n\ntype MultiProps = {\n multiple: true\n renderLabel: (count: number) => string\n value: string[]\n onChange: (newValue: string[]) => void\n}\n\nexport type Props = BaseProps & (SingleProps | MultiProps)\n\nconst isGroupOption = (option: SelectOption): option is GroupOption => {\n return 'options' in option\n}\n\nconst getAllOptions = (options: SelectOption[] | undefined): Option[] => {\n if (!options) return []\n\n return options.flatMap((option) =>\n isGroupOption(option) ? option.options : [option]\n )\n}\n\nconst filterOptions = (\n options: SelectOption[] | undefined,\n searchValue: string\n): SelectOption[] => {\n if (!options) return []\n if (!searchValue) return options\n\n return options\n .map((option) => {\n if (isGroupOption(option)) {\n const filteredSubOptions = option.options.filter((subOption) =>\n subOption.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n return filteredSubOptions.length > 0\n ? { ...option, options: filteredSubOptions }\n : null\n } else {\n return option.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n ? option\n : null\n }\n })\n .filter((option): option is SelectOption => option !== null)\n}\n\nexport function SummarizedSelect({\n searchPlaceholder,\n formControlPlaceholder,\n loading,\n multiple,\n value,\n onChange,\n options,\n renderLabel,\n rootClassName,\n popupClassName,\n variant,\n trigger = 'select',\n defaultOpen = false,\n ...props\n}: Props) {\n const isHeadline = variant === 'headlined'\n const antVariant = isHeadline ? 'borderless' : variant\n const [searchValue, setSearchValue] = useState('')\n const [focusTrigger, setFocusTrigger] = useState(defaultOpen ? 1 : 0)\n const [isOpen, setIsOpen] = useState(defaultOpen)\n const inputRef = useRef<InputRef>(null)\n const measureSpanRef = useRef<HTMLSpanElement>(null)\n const [measuredWidth, setMeasuredWidth] = useState<number>()\n\n const displayText = useMemo(() => {\n if (multiple && value.length > 0) {\n return renderLabel(value.length)\n }\n if (!multiple && value) {\n const option = getAllOptions(options).find((opt) => opt.value === value)\n return option ? String(option.label) : String(value)\n }\n return formControlPlaceholder ?? ''\n }, [multiple, value, options, renderLabel, formControlPlaceholder])\n\n useEffect(() => {\n if (!measureSpanRef.current) return\n // padding (22px = 11px each side) + arrow (18px) + border (6px)\n setMeasuredWidth(Math.ceil(measureSpanRef.current.offsetWidth) + 46)\n }, [displayText])\n\n useEffect(() => {\n if (focusTrigger > 0) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setTimeout(() => {\n inputRef.current?.focus({ cursor: 'end' })\n }, 100)\n })\n })\n }\n }, [focusTrigger])\n\n const filteredOptions = useMemo(() => {\n return filterOptions(options, searchValue)\n }, [searchValue, options])\n\n const flatFilteredOptions = useMemo(() => {\n return getAllOptions(filteredOptions)\n }, [filteredOptions])\n\n const allFlatOptions = useMemo(() => {\n return getAllOptions(options)\n }, [options])\n\n const handleTagClose = (removedValue: string) => {\n if (!multiple) return\n\n onChange(value.filter((x) => x !== removedValue))\n }\n\n const handleToggleAll = () => {\n if (!multiple) return\n\n const allFilteredValues = getAllOptions(filteredOptions).map(\n (opt) => opt.value as string\n )\n const someSelected = allFilteredValues.some((val) => value.includes(val))\n\n if (someSelected) {\n onChange(value.filter((val) => !allFilteredValues.includes(val)))\n }\n }\n\n const handleSelectFirstOption = () => {\n if (flatFilteredOptions.length === 0) return\n\n const firstOption = flatFilteredOptions[0]\n if (!firstOption) return\n\n const optionValue = firstOption.value as string\n\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleOptionClick = (optionValue: string) => {\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n // Allow these navigation keys to bubble up to Select's native keyboard handler\n const navigationKeys = ['ArrowUp', 'ArrowDown']\n\n // Handle Enter - select first filtered option (custom behavior)\n if (e.key === 'Enter') {\n e.preventDefault()\n e.stopPropagation()\n handleSelectFirstOption()\n return\n }\n\n // Handle Escape - close dropdown (custom behavior)\n if (e.key === 'Escape') {\n e.preventDefault()\n e.stopPropagation()\n setIsOpen(false)\n return\n }\n\n // For arrow keys, prevent cursor movement but allow propagation to Select\n if (navigationKeys.includes(e.key)) {\n e.preventDefault() // Prevents cursor from moving to start/end of input text\n // Do NOT call stopPropagation() - let event bubble to Select component\n return\n }\n\n // For all other keys (including Backspace), stop propagation\n // This prevents backspace from removing tags in multiple mode\n e.stopPropagation()\n }\n\n const optionRender = (option: FlattenOptionData<SelectOption>) => {\n if ('logo' in option.data && option.data.logo) {\n return (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">{option.data.logo}</div>\n <span className=\"overflow-ellipsis overflow-hidden\">\n {option.label}\n </span>\n </div>\n )\n }\n return <div>{option.label}</div>\n }\n\n const popupRender = (menu: React.ReactElement) => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div>\n <div className=\"mb-2 px-2 pb-2 border-b -mx-1 mt-1\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n e.preventDefault()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 ? (\n <div className=\"px-2 pb-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((value) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={value}\n status=\"default\"\n closable\n onClose={() => handleTagClose(value)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(value)}\n >\n {valueToLabel(value)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n ) : null}\n <div\n className={cx(styles.menuContainer, 'rounded-lg', {\n [styles.headlinedMenuContainer]: isHeadline,\n [styles.menuContainerMultiple]: multiple,\n })}\n >\n {menu}\n </div>\n <div className=\"flex justify-between items-center\">\n {multiple && (\n <div className=\"w-full mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n aria-selected=\"false\"\n className={cx(\n 'ant-select-item ant-select-item-option w-full',\n styles.clearAllButton\n )}\n title=\"Clear all\"\n onClick={handleToggleAll}\n >\n <div className=\"ant-select-item-option-content text-center font-semibold\">\n Clear all\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n }\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open)\n if (open) {\n // Trigger focus by updating the counter\n setFocusTrigger((prev) => prev + 1)\n } else {\n setSearchValue('')\n }\n }\n\n const renderDropdownOptionRow = (option: Option) => {\n const optionValue = option.value as string\n const isSelected = multiple\n ? value.includes(optionValue)\n : value === optionValue\n const hasLogo = 'logo' in option && (option as OptionWithLogo).logo\n return (\n <div\n key={optionValue}\n role=\"option\"\n aria-selected={isSelected}\n onClick={() => handleOptionClick(optionValue)}\n className={cx(\n 'px-3 py-1.5 rounded cursor-pointer text-sm',\n isSelected\n ? 'bg-[var(--j2-color-primary)] text-white hover:bg-[var(--j2-color-primary)]'\n : 'hover:bg-[var(--j2-color-bg-hover)]'\n )}\n >\n {hasLogo ? (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">\n {(option as OptionWithLogo).logo}\n </div>\n <span className=\"overflow-hidden overflow-ellipsis\">\n {option.label}\n </span>\n </div>\n ) : (\n option.label\n )}\n </div>\n )\n }\n\n const dropdownPopupRender = () => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div className=\"bg-white rounded-lg shadow-md p-2 min-w-[240px]\">\n <div className=\"pb-2 border-b border-j2-border-secondary\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 && (\n <div className=\"px-1 pt-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((v) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={v}\n status=\"default\"\n closable\n onClose={() => handleTagClose(v)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(v)}\n >\n {valueToLabel(v)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n )}\n <div\n className=\"max-h-72 overflow-y-auto py-1\"\n role=\"listbox\"\n aria-multiselectable={multiple || undefined}\n >\n {filteredOptions.length === 0 ? (\n <div className=\"px-3 py-2 text-sm text-[var(--j2-color-text-secondary)]\">\n No options found\n </div>\n ) : (\n filteredOptions.map((opt) => {\n if (isGroupOption(opt)) {\n return (\n <div key={`group-${opt.label}`}>\n <div className=\"px-3 pt-2 pb-1 text-xs font-semibold uppercase tracking-wide text-[var(--j2-color-text-tertiary)]\">\n {opt.label}\n </div>\n {opt.options.map(renderDropdownOptionRow)}\n </div>\n )\n }\n return renderDropdownOptionRow(opt)\n })\n )}\n </div>\n {multiple && value.length > 0 && (\n <div className=\"mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n role=\"button\"\n aria-label=\"Clear all\"\n title=\"Clear all\"\n onClick={handleToggleAll}\n className={cx(\n 'text-center font-semibold text-sm py-1.5 rounded cursor-pointer',\n styles.clearAllButton\n )}\n >\n Clear all\n </div>\n </div>\n )}\n </div>\n )\n }\n\n if (trigger === 'dropdown') {\n const hasSelection = multiple ? value.length > 0 : Boolean(value)\n const triggerContent = (\n <span className=\"inline-flex items-center gap-1\">\n {hasSelection ? displayText : (formControlPlaceholder ?? 'Select')}\n {loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon weight=\"regular\" data-testid=\"caret-down\" />\n )}\n </span>\n )\n\n return (\n <AntdDropdown\n open={isOpen}\n onOpenChange={handleOpenChange}\n trigger={['click']}\n disabled={props.disabled}\n popupRender={dropdownPopupRender}\n >\n <Typography.Link\n disabled={props.disabled}\n className={cx('inline-flex', rootClassName)}\n >\n {triggerContent}\n </Typography.Link>\n </AntdDropdown>\n )\n }\n\n return (\n <>\n <span\n ref={measureSpanRef}\n aria-hidden\n style={{\n position: 'absolute',\n visibility: 'hidden',\n whiteSpace: 'nowrap',\n fontSize: 'inherit',\n }}\n >\n {displayText}\n </span>\n <Select<string | string[], SelectOption>\n open={isOpen}\n showSearch={false}\n style={{ width: measuredWidth }}\n suffixIcon={\n loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon size={14} data-testid=\"caret-down\" />\n )\n }\n placeholder={formControlPlaceholder}\n mode={multiple ? 'multiple' : undefined}\n value={value}\n maxTagCount={0}\n maxTagPlaceholder={multiple ? () => renderLabel(value.length) : value}\n options={filteredOptions}\n onChange={(val) => {\n if (multiple) {\n if (Array.isArray(val)) {\n onChange(val)\n } else {\n throw new Error('Value should be an array in multiple mode')\n }\n } else {\n if (typeof val === 'string') {\n onChange(val)\n } else {\n throw new Error(\n 'Value should be a string in single selection mode'\n )\n }\n }\n }}\n popupRender={popupRender}\n optionRender={optionRender}\n onOpenChange={handleOpenChange}\n classNames={{\n root: cx(rootClassName, styles.summarizedSelect, {\n [styles.hemisphericSelect]:\n variant !== 'underlined' && variant !== 'headlined',\n [styles.isActive]:\n multiple &&\n value.length > 0 &&\n variant !== 'underlined' &&\n variant !== 'headlined',\n [styles.headlinedSelect]: isHeadline,\n }),\n popup: { root: popupClassName },\n }}\n variant={antVariant}\n {...props}\n />\n </>\n )\n}\n"],"names":["_a","icons.MagnifyingGlassIcon","value","icons.CaretDownIcon","AntdDropdown"],"mappings":";;;;;;;;AAwEA,MAAM,gBAAgB,CAAC,WAAgD;AACrE,SAAO,aAAa;AACtB;AAEA,MAAM,gBAAgB,CAAC,YAAkD;AACvE,MAAI,CAAC,QAAS,QAAO,CAAA;AAErB,SAAO,QAAQ;AAAA,IAAQ,CAAC,WACtB,cAAc,MAAM,IAAI,OAAO,UAAU,CAAC,MAAM;AAAA,EAAA;AAEpD;AAEA,MAAM,gBAAgB,CACpB,SACA,gBACmB;AACnB,MAAI,CAAC,QAAS,QAAO,CAAA;AACrB,MAAI,CAAC,YAAa,QAAO;AAEzB,SAAO,QACJ,IAAI,CAAC,WAAW;;AACf,QAAI,cAAc,MAAM,GAAG;AACzB,YAAM,qBAAqB,OAAO,QAAQ;AAAA,QAAO,CAAC,cAAA;;AAChD,kBAAAA,MAAA,UAAU,UAAV,gBAAAA,IACI,WACD,cACA,SAAS,YAAY,YAAA;AAAA;AAAA,MAAa;AAEvC,aAAO,mBAAmB,SAAS,IAC/B,EAAE,GAAG,QAAQ,SAAS,uBACtB;AAAA,IACN,OAAO;AACL,eAAO,YAAO,UAAP,mBACH,WACD,cACA,SAAS,YAAY,kBACpB,SACA;AAAA,IACN;AAAA,EACF,CAAC,EACA,OAAO,CAAC,WAAmC,WAAW,IAAI;AAC/D;AAEO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd,GAAG;AACL,GAAU;AACR,QAAM,aAAa,YAAY;AAC/B,QAAM,aAAa,aAAa,eAAe;AAC/C,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AACjD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,cAAc,IAAI,CAAC;AACpE,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,WAAW;AAChD,QAAM,WAAW,OAAiB,IAAI;AACtC,QAAM,iBAAiB,OAAwB,IAAI;AACnD,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAA;AAE1C,QAAM,cAAc,QAAQ,MAAM;AAChC,QAAI,YAAY,MAAM,SAAS,GAAG;AAChC,aAAO,YAAY,MAAM,MAAM;AAAA,IACjC;AACA,QAAI,CAAC,YAAY,OAAO;AACtB,YAAM,SAAS,cAAc,OAAO,EAAE,KAAK,CAAC,QAAQ,IAAI,UAAU,KAAK;AACvE,aAAO,SAAS,OAAO,OAAO,KAAK,IAAI,OAAO,KAAK;AAAA,IACrD;AACA,WAAO,0BAA0B;AAAA,EACnC,GAAG,CAAC,UAAU,OAAO,SAAS,aAAa,sBAAsB,CAAC;AAElE,YAAU,MAAM;AACd,QAAI,CAAC,eAAe,QAAS;AAE7B,qBAAiB,KAAK,KAAK,eAAe,QAAQ,WAAW,IAAI,EAAE;AAAA,EACrE,GAAG,CAAC,WAAW,CAAC;AAEhB,YAAU,MAAM;AACd,QAAI,eAAe,GAAG;AACpB,4BAAsB,MAAM;AAC1B,8BAAsB,MAAM;AAC1B,qBAAW,MAAM;;AACf,2BAAS,YAAT,mBAAkB,MAAM,EAAE,QAAQ;UACpC,GAAG,GAAG;AAAA,QACR,CAAC;AAAA,MACH,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO,cAAc,SAAS,WAAW;AAAA,EAC3C,GAAG,CAAC,aAAa,OAAO,CAAC;AAEzB,QAAM,sBAAsB,QAAQ,MAAM;AACxC,WAAO,cAAc,eAAe;AAAA,EACtC,GAAG,CAAC,eAAe,CAAC;AAEpB,QAAM,iBAAiB,QAAQ,MAAM;AACnC,WAAO,cAAc,OAAO;AAAA,EAC9B,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,iBAAiB,CAAC,iBAAyB;AAC/C,QAAI,CAAC,SAAU;AAEf,aAAS,MAAM,OAAO,CAAC,MAAM,MAAM,YAAY,CAAC;AAAA,EAClD;AAEA,QAAM,kBAAkB,MAAM;AAC5B,QAAI,CAAC,SAAU;AAEf,UAAM,oBAAoB,cAAc,eAAe,EAAE;AAAA,MACvD,CAAC,QAAQ,IAAI;AAAA,IAAA;AAEf,UAAM,eAAe,kBAAkB,KAAK,CAAC,QAAQ,MAAM,SAAS,GAAG,CAAC;AAExE,QAAI,cAAc;AAChB,eAAS,MAAM,OAAO,CAAC,QAAQ,CAAC,kBAAkB,SAAS,GAAG,CAAC,CAAC;AAAA,IAClE;AAAA,EACF;AAEA,QAAM,0BAA0B,MAAM;AACpC,QAAI,oBAAoB,WAAW,EAAG;AAEtC,UAAM,cAAc,oBAAoB,CAAC;AACzC,QAAI,CAAC,YAAa;AAElB,UAAM,cAAc,YAAY;AAEhC,QAAI,UAAU;AACZ,UAAI,MAAM,SAAS,WAAW,GAAG;AAC/B,iBAAS,MAAM,OAAO,CAAC,MAAM,MAAM,WAAW,CAAC;AAAA,MACjD,OAAO;AACL,iBAAS,CAAC,GAAG,OAAO,WAAW,CAAC;AAAA,MAClC;AAAA,IACF,OAAO;AACL,eAAS,WAAW;AACpB,gBAAU,KAAK;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,oBAAoB,CAAC,gBAAwB;AACjD,QAAI,UAAU;AACZ,UAAI,MAAM,SAAS,WAAW,GAAG;AAC/B,iBAAS,MAAM,OAAO,CAAC,MAAM,MAAM,WAAW,CAAC;AAAA,MACjD,OAAO;AACL,iBAAS,CAAC,GAAG,OAAO,WAAW,CAAC;AAAA,MAClC;AAAA,IACF,OAAO;AACL,eAAS,WAAW;AACpB,gBAAU,KAAK;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,gBAAgB,CAAC,MAA6C;AAElE,UAAM,iBAAiB,CAAC,WAAW,WAAW;AAG9C,QAAI,EAAE,QAAQ,SAAS;AACrB,QAAE,eAAA;AACF,QAAE,gBAAA;AACF,8BAAA;AACA;AAAA,IACF;AAGA,QAAI,EAAE,QAAQ,UAAU;AACtB,QAAE,eAAA;AACF,QAAE,gBAAA;AACF,gBAAU,KAAK;AACf;AAAA,IACF;AAGA,QAAI,eAAe,SAAS,EAAE,GAAG,GAAG;AAClC,QAAE,eAAA;AAEF;AAAA,IACF;AAIA,MAAE,gBAAA;AAAA,EACJ;AAEA,QAAM,eAAe,CAAC,WAA4C;AAChE,QAAI,UAAU,OAAO,QAAQ,OAAO,KAAK,MAAM;AAC7C,aACE,qBAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,QAAA,oBAAC,OAAA,EAAI,WAAU,gBAAgB,UAAA,OAAO,KAAK,MAAK;AAAA,QAChD,oBAAC,QAAA,EAAK,WAAU,qCACb,iBAAO,MAAA,CACV;AAAA,MAAA,GACF;AAAA,IAEJ;AACA,WAAO,oBAAC,OAAA,EAAK,UAAA,OAAO,MAAA,CAAM;AAAA,EAC5B;AAEA,QAAM,cAAc,CAAC,SAA6B;AAChD,UAAM,eAAe,CAAC,QAAgB;AACpC,YAAM,SAAS,eAAe,KAAK,CAAC,QAAQ,IAAI,UAAU,GAAG;AAC7D,aAAO,SAAU,OAAO,QAAmB;AAAA,IAC7C;AAEA,gCACG,OAAA,EACC,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,sCACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK;AAAA,UAEL,WAAS;AAAA,UACT,aAAa,qBAAqB;AAAA,UAClC,OAAO;AAAA,UACP,UAAU,CAAC,MAAM;AACf,2BAAe,EAAE,OAAO,KAAK;AAC7B,cAAE,gBAAA;AACF,cAAE,eAAA;AAAA,UACJ;AAAA,UACA,WAAW;AAAA,UACX,SAAS,CAAC,MAAM,EAAE,gBAAA;AAAA,UAClB,QACE;AAAA,YAACC;AAAAA,YAAA;AAAA,cACC,MAAM;AAAA,cACN,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,UAGd,YAAU;AAAA,QAAA;AAAA,QAjBL;AAAA,MAAA,GAmBT;AAAA,MACC,YAAY,MAAM,SAAS,wBACzB,OAAA,EAAI,WAAU,aACb,UAAA,oBAAC,SAAI,WAAU,0BACX,UAAA,MAAmB,IAAI,CAACC,WACxB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UAEV,QAAO;AAAA,UACP,UAAQ;AAAA,UACR,SAAS,MAAM,eAAeA,MAAK;AAAA,UAEnC,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO,aAAaA,MAAK;AAAA,cAExB,uBAAaA,MAAK;AAAA,YAAA;AAAA,UAAA;AAAA,QACrB;AAAA,QAVKA;AAAAA,MAAA,CAYR,EAAA,CACH,EAAA,CACF,IACE;AAAA,MACJ;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,GAAG,OAAO,eAAe,cAAc;AAAA,YAChD,CAAC,OAAO,sBAAsB,GAAG;AAAA,YACjC,CAAC,OAAO,qBAAqB,GAAG;AAAA,UAAA,CACjC;AAAA,UAEA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAEH,oBAAC,SAAI,WAAU,qCACZ,sBACC,oBAAC,OAAA,EAAI,WAAU,wDACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,iBAAc;AAAA,UACd,WAAW;AAAA,YACT;AAAA,YACA,OAAO;AAAA,UAAA;AAAA,UAET,OAAM;AAAA,UACN,SAAS;AAAA,UAET,UAAA,oBAAC,OAAA,EAAI,WAAU,4DAA2D,UAAA,YAAA,CAE1E;AAAA,QAAA;AAAA,MAAA,GAEJ,EAAA,CAEJ;AAAA,IAAA,GACF;AAAA,EAEJ;AAEA,QAAM,mBAAmB,CAAC,SAAkB;AAC1C,cAAU,IAAI;AACd,QAAI,MAAM;AAER,sBAAgB,CAAC,SAAS,OAAO,CAAC;AAAA,IACpC,OAAO;AACL,qBAAe,EAAE;AAAA,IACnB;AAAA,EACF;AAEA,QAAM,0BAA0B,CAAC,WAAmB;AAClD,UAAM,cAAc,OAAO;AAC3B,UAAM,aAAa,WACf,MAAM,SAAS,WAAW,IAC1B,UAAU;AACd,UAAM,UAAU,UAAU,UAAW,OAA0B;AAC/D,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,MAAK;AAAA,QACL,iBAAe;AAAA,QACf,SAAS,MAAM,kBAAkB,WAAW;AAAA,QAC5C,WAAW;AAAA,UACT;AAAA,UACA,aACI,+EACA;AAAA,QAAA;AAAA,QAGL,UAAA,UACC,qBAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAU,gBACX,UAAA,OAA0B,MAC9B;AAAA,UACA,oBAAC,QAAA,EAAK,WAAU,qCACb,iBAAO,MAAA,CACV;AAAA,QAAA,EAAA,CACF,IAEA,OAAO;AAAA,MAAA;AAAA,MArBJ;AAAA,IAAA;AAAA,EAyBX;AAEA,QAAM,sBAAsB,MAAM;AAChC,UAAM,eAAe,CAAC,QAAgB;AACpC,YAAM,SAAS,eAAe,KAAK,CAAC,QAAQ,IAAI,UAAU,GAAG;AAC7D,aAAO,SAAU,OAAO,QAAmB;AAAA,IAC7C;AAEA,WACE,qBAAC,OAAA,EAAI,WAAU,mDACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAK;AAAA,UAEL,WAAS;AAAA,UACT,aAAa,qBAAqB;AAAA,UAClC,OAAO;AAAA,UACP,UAAU,CAAC,MAAM;AACf,2BAAe,EAAE,OAAO,KAAK;AAC7B,cAAE,gBAAA;AAAA,UACJ;AAAA,UACA,WAAW;AAAA,UACX,SAAS,CAAC,MAAM,EAAE,gBAAA;AAAA,UAClB,QACE;AAAA,YAACD;AAAAA,YAAA;AAAA,cACC,MAAM;AAAA,cACN,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,UAGd,YAAU;AAAA,QAAA;AAAA,QAhBL;AAAA,MAAA,GAkBT;AAAA,MACC,YAAY,MAAM,SAAS,yBACzB,OAAA,EAAI,WAAU,aACb,UAAA,oBAAC,SAAI,WAAU,0BACX,UAAA,MAAmB,IAAI,CAAC,MACxB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UAEV,QAAO;AAAA,UACP,UAAQ;AAAA,UACR,SAAS,MAAM,eAAe,CAAC;AAAA,UAE/B,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO,aAAa,CAAC;AAAA,cAEpB,uBAAa,CAAC;AAAA,YAAA;AAAA,UAAA;AAAA,QACjB;AAAA,QAVK;AAAA,MAAA,CAYR,GACH,EAAA,CACF;AAAA,MAEF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL,wBAAsB,YAAY;AAAA,UAEjC,UAAA,gBAAgB,WAAW,IAC1B,oBAAC,OAAA,EAAI,WAAU,2DAA0D,UAAA,mBAAA,CAEzE,IAEA,gBAAgB,IAAI,CAAC,QAAQ;AAC3B,gBAAI,cAAc,GAAG,GAAG;AACtB,0CACG,OAAA,EACC,UAAA;AAAA,gBAAA,oBAAC,OAAA,EAAI,WAAU,qGACZ,UAAA,IAAI,OACP;AAAA,gBACC,IAAI,QAAQ,IAAI,uBAAuB;AAAA,cAAA,EAAA,GAJhC,SAAS,IAAI,KAAK,EAK5B;AAAA,YAEJ;AACA,mBAAO,wBAAwB,GAAG;AAAA,UACpC,CAAC;AAAA,QAAA;AAAA,MAAA;AAAA,MAGJ,YAAY,MAAM,SAAS,KAC1B,oBAAC,OAAA,EAAI,WAAU,iDACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,cAAW;AAAA,UACX,OAAM;AAAA,UACN,SAAS;AAAA,UACT,WAAW;AAAA,YACT;AAAA,YACA,OAAO;AAAA,UAAA;AAAA,UAEV,UAAA;AAAA,QAAA;AAAA,MAAA,EAED,CACF;AAAA,IAAA,GAEJ;AAAA,EAEJ;AAEA,MAAI,YAAY,YAAY;AAC1B,UAAM,eAAe,WAAW,MAAM,SAAS,IAAI,QAAQ,KAAK;AAChE,UAAM,iBACJ,qBAAC,QAAA,EAAK,WAAU,kCACb,UAAA;AAAA,MAAA,eAAe,cAAe,0BAA0B;AAAA,MACxD,UACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,oBAAC,iBAAA,EAAgB,MAAI,KAAA,CAAC;AAAA,UACjC,MAAK;AAAA,UACL,eAAY;AAAA,QAAA;AAAA,MAAA,wBAGbE,eAAA,EAAoB,QAAO,WAAU,eAAY,aAAA,CAAa;AAAA,IAAA,GAEnE;AAGF,WACE;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,cAAc;AAAA,QACd,SAAS,CAAC,OAAO;AAAA,QACjB,UAAU,MAAM;AAAA,QAChB,aAAa;AAAA,QAEb,UAAA;AAAA,UAAC,WAAW;AAAA,UAAX;AAAA,YACC,UAAU,MAAM;AAAA,YAChB,WAAW,GAAG,eAAe,aAAa;AAAA,YAEzC,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAGN;AAEA,SACE,qBAAA,UAAA,EACE,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL,eAAW;AAAA,QACX,OAAO;AAAA,UACL,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,UAAU;AAAA,QAAA;AAAA,QAGX,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEH;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN,YAAY;AAAA,QACZ,OAAO,EAAE,OAAO,cAAA;AAAA,QAChB,YACE,UACE;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,oBAAC,iBAAA,EAAgB,MAAI,KAAA,CAAC;AAAA,YACjC,MAAK;AAAA,YACL,eAAY;AAAA,UAAA;AAAA,QAAA,wBAGbD,eAAA,EAAoB,MAAM,IAAI,eAAY,cAAa;AAAA,QAG5D,aAAa;AAAA,QACb,MAAM,WAAW,aAAa;AAAA,QAC9B;AAAA,QACA,aAAa;AAAA,QACb,mBAAmB,WAAW,MAAM,YAAY,MAAM,MAAM,IAAI;AAAA,QAChE,SAAS;AAAA,QACT,UAAU,CAAC,QAAQ;AACjB,cAAI,UAAU;AACZ,gBAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,uBAAS,GAAG;AAAA,YACd,OAAO;AACL,oBAAM,IAAI,MAAM,2CAA2C;AAAA,YAC7D;AAAA,UACF,OAAO;AACL,gBAAI,OAAO,QAAQ,UAAU;AAC3B,uBAAS,GAAG;AAAA,YACd,OAAO;AACL,oBAAM,IAAI;AAAA,gBACR;AAAA,cAAA;AAAA,YAEJ;AAAA,UACF;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAc;AAAA,QACd,YAAY;AAAA,UACV,MAAM,GAAG,eAAe,OAAO,kBAAkB;AAAA,YAC/C,CAAC,OAAO,iBAAiB,GACvB,YAAY,gBAAgB,YAAY;AAAA,YAC1C,CAAC,OAAO,QAAQ,GACd,YACA,MAAM,SAAS,KACf,YAAY,gBACZ,YAAY;AAAA,YACd,CAAC,OAAO,eAAe,GAAG;AAAA,UAAA,CAC3B;AAAA,UACD,OAAO,EAAE,MAAM,eAAA;AAAA,QAAe;AAAA,QAEhC,SAAS;AAAA,QACR,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GACF;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"SummarizedSelect.js","sources":["../../../../src/components/select/SummarizedSelect.tsx"],"sourcesContent":["import {\n Dropdown as AntdDropdown,\n Select,\n Spin,\n Input,\n SelectProps,\n InputRef,\n Typography,\n} from 'antd'\nimport { DefaultOptionType } from 'antd/es/select'\nimport { useState, useMemo, useRef, useEffect } from 'react'\nimport { LoadingOutlined } from '@ant-design/icons'\nimport * as icons from '../icons'\nimport { Tag } from '../tag'\nimport cx from 'classnames'\n\nimport styles from './SummarizedSelect.module.css'\n\ntype Option = DefaultOptionType\ntype OptionWithLogo = Option & {\n logo: React.ReactNode\n}\n\ntype GroupOption = {\n label: string\n options: Option[]\n}\n\nexport type SelectOption = Option | GroupOption | OptionWithLogo\n\nexport type SummarizedSelectVariant = SelectProps['variant'] | 'headlined'\n\nexport type SummarizedSelectTrigger = 'select' | 'dropdown'\n\ntype BaseProps = Omit<\n SelectProps<string | string[], SelectOption>,\n 'mode' | 'value' | 'onChange' | 'variant'\n> & {\n searchPlaceholder?: string\n formControlPlaceholder?: string\n rootClassName?: string\n popupClassName?: string\n variant?: SummarizedSelectVariant\n /**\n * Shape of the control that opens the popup.\n * - `'select'` (default): antd Select, styled by `variant`.\n * - `'dropdown'`: antd Dropdown with a `Typography.Link` target (label + caret).\n * Ignores `variant` — the trigger is always a link.\n */\n trigger?: SummarizedSelectTrigger\n defaultOpen?: boolean\n\n loading?: boolean\n}\n\ntype SingleProps = {\n multiple?: false\n renderLabel?: undefined\n value: string | undefined\n onChange: (newValue: string) => void\n}\n\ntype MultiProps = {\n multiple: true\n renderLabel: (count: number) => string\n value: string[]\n onChange: (newValue: string[]) => void\n}\n\nexport type Props = BaseProps & (SingleProps | MultiProps)\n\nconst isGroupOption = (option: SelectOption): option is GroupOption => {\n return 'options' in option\n}\n\nconst getAllOptions = (options: SelectOption[] | undefined): Option[] => {\n if (!options) return []\n\n return options.flatMap((option) =>\n isGroupOption(option) ? option.options : [option]\n )\n}\n\nconst filterOptions = (\n options: SelectOption[] | undefined,\n searchValue: string\n): SelectOption[] => {\n if (!options) return []\n if (!searchValue) return options\n\n return options\n .map((option) => {\n if (isGroupOption(option)) {\n const filteredSubOptions = option.options.filter((subOption) =>\n subOption.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n )\n return filteredSubOptions.length > 0\n ? { ...option, options: filteredSubOptions }\n : null\n } else {\n return option.label\n ?.toString()\n .toLowerCase()\n .includes(searchValue.toLowerCase())\n ? option\n : null\n }\n })\n .filter((option): option is SelectOption => option !== null)\n}\n\nexport function SummarizedSelect({\n searchPlaceholder,\n formControlPlaceholder,\n loading,\n multiple,\n value,\n onChange,\n options,\n renderLabel,\n rootClassName,\n popupClassName,\n variant,\n trigger = 'select',\n defaultOpen = false,\n ...props\n}: Props) {\n const isHeadline = variant === 'headlined'\n const antVariant = isHeadline ? 'borderless' : variant\n const [searchValue, setSearchValue] = useState('')\n const [focusTrigger, setFocusTrigger] = useState(defaultOpen ? 1 : 0)\n const [isOpen, setIsOpen] = useState(defaultOpen)\n const inputRef = useRef<InputRef>(null)\n const measureSpanRef = useRef<HTMLSpanElement>(null)\n const [measuredWidth, setMeasuredWidth] = useState<number>()\n\n const displayText = useMemo(() => {\n if (multiple && value.length > 0) {\n return renderLabel(value.length)\n }\n if (!multiple && value) {\n const option = getAllOptions(options).find((opt) => opt.value === value)\n return option ? String(option.label) : String(value)\n }\n return formControlPlaceholder ?? ''\n }, [multiple, value, options, renderLabel, formControlPlaceholder])\n\n useEffect(() => {\n if (!measureSpanRef.current) return\n // padding (22px = 11px each side) + arrow (18px) + border (6px)\n setMeasuredWidth(Math.ceil(measureSpanRef.current.offsetWidth) + 46)\n }, [displayText])\n\n useEffect(() => {\n if (focusTrigger > 0) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setTimeout(() => {\n inputRef.current?.focus({ cursor: 'end' })\n }, 100)\n })\n })\n }\n }, [focusTrigger])\n\n const filteredOptions = useMemo(() => {\n return filterOptions(options, searchValue)\n }, [searchValue, options])\n\n const flatFilteredOptions = useMemo(() => {\n return getAllOptions(filteredOptions)\n }, [filteredOptions])\n\n const allFlatOptions = useMemo(() => {\n return getAllOptions(options)\n }, [options])\n\n const handleTagClose = (removedValue: string) => {\n if (!multiple) return\n\n onChange(value.filter((x) => x !== removedValue))\n }\n\n const handleToggleAll = () => {\n if (!multiple) return\n\n const allFilteredValues = getAllOptions(filteredOptions).map(\n (opt) => opt.value as string\n )\n const someSelected = allFilteredValues.some((val) => value.includes(val))\n\n if (someSelected) {\n onChange(value.filter((val) => !allFilteredValues.includes(val)))\n }\n }\n\n const handleSelectFirstOption = () => {\n if (flatFilteredOptions.length === 0) return\n\n const firstOption = flatFilteredOptions[0]\n if (!firstOption) return\n\n const optionValue = firstOption.value as string\n\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleOptionClick = (optionValue: string) => {\n if (multiple) {\n if (value.includes(optionValue)) {\n onChange(value.filter((v) => v !== optionValue))\n } else {\n onChange([...value, optionValue])\n }\n } else {\n onChange(optionValue)\n setIsOpen(false)\n }\n }\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n // Allow these navigation keys to bubble up to Select's native keyboard handler\n const navigationKeys = ['ArrowUp', 'ArrowDown']\n\n // Handle Enter - select first filtered option (custom behavior)\n if (e.key === 'Enter') {\n e.preventDefault()\n e.stopPropagation()\n handleSelectFirstOption()\n return\n }\n\n // Handle Escape - close dropdown (custom behavior)\n if (e.key === 'Escape') {\n e.preventDefault()\n e.stopPropagation()\n setIsOpen(false)\n return\n }\n\n // For arrow keys, prevent cursor movement but allow propagation to Select\n if (navigationKeys.includes(e.key)) {\n e.preventDefault() // Prevents cursor from moving to start/end of input text\n // Do NOT call stopPropagation() - let event bubble to Select component\n return\n }\n\n // For all other keys (including Backspace), stop propagation\n // This prevents backspace from removing tags in multiple mode\n e.stopPropagation()\n }\n\n const optionRender: NonNullable<\n SelectProps<string | string[], SelectOption>['optionRender']\n > = (option) => {\n if ('logo' in option.data && option.data.logo) {\n return (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">{option.data.logo}</div>\n <span className=\"overflow-ellipsis overflow-hidden\">\n {option.label}\n </span>\n </div>\n )\n }\n return <div>{option.label}</div>\n }\n\n const popupRender = (menu: React.ReactElement) => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div>\n <div className=\"mb-2 px-2 pb-2 border-b -mx-1 mt-1\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n e.preventDefault()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 ? (\n <div className=\"px-2 pb-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((value) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={value}\n status=\"default\"\n closable\n onClose={() => handleTagClose(value)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(value)}\n >\n {valueToLabel(value)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n ) : null}\n <div\n className={cx(styles.menuContainer, 'rounded-lg', {\n [styles.headlinedMenuContainer]: isHeadline,\n [styles.menuContainerMultiple]: multiple,\n })}\n >\n {menu}\n </div>\n <div className=\"flex justify-between items-center\">\n {multiple && (\n <div className=\"w-full mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n aria-selected=\"false\"\n className={cx(\n 'ant-select-item ant-select-item-option w-full',\n styles.clearAllButton\n )}\n title=\"Clear all\"\n onClick={handleToggleAll}\n >\n <div className=\"ant-select-item-option-content text-center font-semibold\">\n Clear all\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n )\n }\n\n const handleOpenChange = (open: boolean) => {\n setIsOpen(open)\n if (open) {\n // Trigger focus by updating the counter\n setFocusTrigger((prev) => prev + 1)\n } else {\n setSearchValue('')\n }\n }\n\n const renderDropdownOptionRow = (option: Option) => {\n const optionValue = option.value as string\n const isSelected = multiple\n ? value.includes(optionValue)\n : value === optionValue\n const hasLogo = 'logo' in option && (option as OptionWithLogo).logo\n return (\n <div\n key={optionValue}\n role=\"option\"\n aria-selected={isSelected}\n onClick={() => handleOptionClick(optionValue)}\n className={cx(\n 'px-3 py-1.5 rounded cursor-pointer text-sm',\n isSelected\n ? 'bg-[var(--j2-color-primary)] text-white hover:bg-[var(--j2-color-primary)]'\n : 'hover:bg-[var(--j2-color-bg-hover)]'\n )}\n >\n {hasLogo ? (\n <div className=\"flex items-center gap-2\">\n <div className=\"h-4 shrink-0\">\n {(option as OptionWithLogo).logo}\n </div>\n <span className=\"overflow-hidden overflow-ellipsis\">\n {option.label}\n </span>\n </div>\n ) : (\n option.label\n )}\n </div>\n )\n }\n\n const dropdownPopupRender = () => {\n const valueToLabel = (val: string) => {\n const option = allFlatOptions.find((opt) => opt.value === val)\n return option ? (option.label as string) : val\n }\n\n return (\n <div className=\"bg-white rounded-lg shadow-md p-2 min-w-[240px]\">\n <div className=\"pb-2 border-b border-j2-border-secondary\">\n <Input\n ref={inputRef}\n key={focusTrigger}\n autoFocus\n placeholder={searchPlaceholder || 'Search...'}\n value={searchValue}\n onChange={(e) => {\n setSearchValue(e.target.value)\n e.stopPropagation()\n }}\n onKeyDown={handleKeyDown}\n onClick={(e) => e.stopPropagation()}\n prefix={\n <icons.MagnifyingGlassIcon\n size={16}\n className=\"text-j2-text-placeholder\"\n />\n }\n allowClear\n />\n </div>\n {multiple && value.length > 0 && (\n <div className=\"px-1 pt-2\">\n <div className=\"flex flex-wrap gap-y-1\">\n {(value as string[]).map((v) => (\n <Tag\n className=\"opacity-100 z-10 flex max-w-full\"\n key={v}\n status=\"default\"\n closable\n onClose={() => handleTagClose(v)}\n >\n <span\n className=\"overflow-ellipsis overflow-hidden\"\n title={valueToLabel(v)}\n >\n {valueToLabel(v)}\n </span>\n </Tag>\n ))}\n </div>\n </div>\n )}\n <div\n className=\"max-h-72 overflow-y-auto py-1\"\n role=\"listbox\"\n aria-multiselectable={multiple || undefined}\n >\n {filteredOptions.length === 0 ? (\n <div className=\"px-3 py-2 text-sm text-[var(--j2-color-text-secondary)]\">\n No options found\n </div>\n ) : (\n filteredOptions.map((opt) => {\n if (isGroupOption(opt)) {\n return (\n <div key={`group-${opt.label}`}>\n <div className=\"px-3 pt-2 pb-1 text-xs font-semibold uppercase tracking-wide text-[var(--j2-color-text-tertiary)]\">\n {opt.label}\n </div>\n {opt.options.map(renderDropdownOptionRow)}\n </div>\n )\n }\n return renderDropdownOptionRow(opt)\n })\n )}\n </div>\n {multiple && value.length > 0 && (\n <div className=\"mt-1 pt-1 border-t border-j2-border-secondary\">\n <div\n role=\"button\"\n aria-label=\"Clear all\"\n title=\"Clear all\"\n onClick={handleToggleAll}\n className={cx(\n 'text-center font-semibold text-sm py-1.5 rounded cursor-pointer',\n styles.clearAllButton\n )}\n >\n Clear all\n </div>\n </div>\n )}\n </div>\n )\n }\n\n if (trigger === 'dropdown') {\n const hasSelection = multiple ? value.length > 0 : Boolean(value)\n const triggerContent = (\n <span className=\"inline-flex items-center gap-1\">\n {hasSelection ? displayText : (formControlPlaceholder ?? 'Select')}\n {loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon weight=\"regular\" data-testid=\"caret-down\" />\n )}\n </span>\n )\n\n return (\n <AntdDropdown\n open={isOpen}\n onOpenChange={handleOpenChange}\n trigger={['click']}\n disabled={props.disabled}\n popupRender={dropdownPopupRender}\n >\n <Typography.Link\n disabled={props.disabled}\n className={cx('inline-flex', rootClassName)}\n >\n {triggerContent}\n </Typography.Link>\n </AntdDropdown>\n )\n }\n\n return (\n <>\n <span\n ref={measureSpanRef}\n aria-hidden\n style={{\n position: 'absolute',\n visibility: 'hidden',\n whiteSpace: 'nowrap',\n fontSize: 'inherit',\n }}\n >\n {displayText}\n </span>\n <Select<string | string[], SelectOption>\n open={isOpen}\n showSearch={false}\n style={{ width: measuredWidth }}\n suffixIcon={\n loading ? (\n <Spin\n indicator={<LoadingOutlined spin />}\n size=\"small\"\n data-testid=\"loading-spinner\"\n />\n ) : (\n <icons.CaretDownIcon size={14} data-testid=\"caret-down\" />\n )\n }\n placeholder={formControlPlaceholder}\n mode={multiple ? 'multiple' : undefined}\n value={value}\n maxTagCount={0}\n maxTagPlaceholder={multiple ? () => renderLabel(value.length) : value}\n options={filteredOptions}\n onChange={(val) => {\n if (multiple) {\n if (Array.isArray(val)) {\n onChange(val)\n } else {\n throw new Error('Value should be an array in multiple mode')\n }\n } else {\n if (typeof val === 'string') {\n onChange(val)\n } else {\n throw new Error(\n 'Value should be a string in single selection mode'\n )\n }\n }\n }}\n popupRender={popupRender}\n optionRender={optionRender}\n onOpenChange={handleOpenChange}\n classNames={{\n root: cx(rootClassName, styles.summarizedSelect, {\n [styles.hemisphericSelect]:\n variant !== 'underlined' && variant !== 'headlined',\n [styles.isActive]:\n multiple &&\n value.length > 0 &&\n variant !== 'underlined' &&\n variant !== 'headlined',\n [styles.headlinedSelect]: isHeadline,\n }),\n popup: { root: popupClassName },\n }}\n variant={antVariant}\n {...props}\n />\n </>\n )\n}\n"],"names":["_a","icons.MagnifyingGlassIcon","value","icons.CaretDownIcon","AntdDropdown"],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
|
-
const hemisphericSelect = "
|
|
4
|
-
const summarizedSelect = "
|
|
5
|
-
const isActive = "
|
|
6
|
-
const menuContainer = "
|
|
7
|
-
const menuContainerMultiple = "
|
|
8
|
-
const headlinedSelect = "
|
|
9
|
-
const headlinedMenuContainer = "
|
|
10
|
-
const clearAllButton = "
|
|
3
|
+
const hemisphericSelect = "_hemisphericSelect_1g8eb_1";
|
|
4
|
+
const summarizedSelect = "_summarizedSelect_1g8eb_9";
|
|
5
|
+
const isActive = "_isActive_1g8eb_35";
|
|
6
|
+
const menuContainer = "_menuContainer_1g8eb_47";
|
|
7
|
+
const menuContainerMultiple = "_menuContainerMultiple_1g8eb_57";
|
|
8
|
+
const headlinedSelect = "_headlinedSelect_1g8eb_72";
|
|
9
|
+
const headlinedMenuContainer = "_headlinedMenuContainer_1g8eb_115";
|
|
10
|
+
const clearAllButton = "_clearAllButton_1g8eb_126";
|
|
11
11
|
const styles = {
|
|
12
12
|
hemisphericSelect,
|
|
13
13
|
summarizedSelect,
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
const hemisphericSelect = "
|
|
2
|
-
const summarizedSelect = "
|
|
3
|
-
const isActive = "
|
|
4
|
-
const menuContainer = "
|
|
5
|
-
const menuContainerMultiple = "
|
|
6
|
-
const headlinedSelect = "
|
|
7
|
-
const headlinedMenuContainer = "
|
|
8
|
-
const clearAllButton = "
|
|
1
|
+
const hemisphericSelect = "_hemisphericSelect_1g8eb_1";
|
|
2
|
+
const summarizedSelect = "_summarizedSelect_1g8eb_9";
|
|
3
|
+
const isActive = "_isActive_1g8eb_35";
|
|
4
|
+
const menuContainer = "_menuContainer_1g8eb_47";
|
|
5
|
+
const menuContainerMultiple = "_menuContainerMultiple_1g8eb_57";
|
|
6
|
+
const headlinedSelect = "_headlinedSelect_1g8eb_72";
|
|
7
|
+
const headlinedMenuContainer = "_headlinedMenuContainer_1g8eb_115";
|
|
8
|
+
const clearAllButton = "_clearAllButton_1g8eb_126";
|
|
9
9
|
const styles = {
|
|
10
10
|
hemisphericSelect,
|
|
11
11
|
summarizedSelect,
|
|
@@ -11,9 +11,14 @@ const Steps = ({
|
|
|
11
11
|
current,
|
|
12
12
|
setCurrent,
|
|
13
13
|
dot = false,
|
|
14
|
+
direction,
|
|
15
|
+
orientation,
|
|
16
|
+
size,
|
|
17
|
+
labelPlacement,
|
|
18
|
+
titlePlacement,
|
|
14
19
|
...props
|
|
15
20
|
}) => {
|
|
16
|
-
const isVertical =
|
|
21
|
+
const isVertical = (orientation ?? direction) === "vertical";
|
|
17
22
|
const totalSteps = (items == null ? void 0 : items.length) || 0;
|
|
18
23
|
const { current: currentStep, setCurrent: setCurrentStep } = useSteps.useSteps({
|
|
19
24
|
current,
|
|
@@ -25,17 +30,22 @@ const Steps = ({
|
|
|
25
30
|
{
|
|
26
31
|
className: "j2Steps",
|
|
27
32
|
...props,
|
|
33
|
+
orientation: orientation ?? direction,
|
|
34
|
+
titlePlacement: titlePlacement ?? labelPlacement,
|
|
35
|
+
size: size === "default" ? "medium" : size,
|
|
28
36
|
current: currentStep,
|
|
29
37
|
onChange: (curr) => setCurrentStep(curr),
|
|
30
|
-
...dot && {
|
|
38
|
+
...dot && { type: "dot" },
|
|
31
39
|
items: items == null ? void 0 : items.map((item, index) => {
|
|
40
|
+
const { description, ...restItem } = item;
|
|
32
41
|
return {
|
|
33
|
-
...
|
|
42
|
+
...restItem,
|
|
43
|
+
content: item.content ?? description,
|
|
34
44
|
icon: !dot && currentStep > index ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
35
45
|
"div",
|
|
36
46
|
{
|
|
37
47
|
className: cx(
|
|
38
|
-
`check-${
|
|
48
|
+
`check-${size === "small" ? "small" : "medium"}`,
|
|
39
49
|
isVertical ? `vertical-check-icon` : `check-icon`
|
|
40
50
|
),
|
|
41
51
|
children: /* @__PURE__ */ jsxRuntime.jsx(react.CheckIcon, { size: 16 })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Steps.cjs","sources":["../../../../src/components/steps/Steps.tsx"],"sourcesContent":["import { Steps as AntdSteps, StepsProps
|
|
1
|
+
{"version":3,"file":"Steps.cjs","sources":["../../../../src/components/steps/Steps.tsx"],"sourcesContent":["import { Steps as AntdSteps, StepsProps } from 'antd'\nimport './Steps.css'\nimport { CheckIcon } from '@phosphor-icons/react'\nimport cx from 'classnames'\nimport { useSteps } from './useSteps'\n\ntype AllProps = StepsProps & {\n items: NonNullable<StepsProps['items']>\n dot?: boolean\n current?: number\n setCurrent?: (current: number) => void\n}\n\ntype Props = Expand<AllProps>\n\nexport const Steps = ({\n items,\n current,\n setCurrent,\n dot = false,\n direction,\n orientation,\n size,\n labelPlacement,\n titlePlacement,\n ...props\n}: Props) => {\n const isVertical = (orientation ?? direction) === 'vertical'\n const totalSteps = items?.length || 0\n\n const { current: currentStep, setCurrent: setCurrentStep } = useSteps({\n current,\n setCurrent,\n totalSteps,\n })\n\n return (\n <AntdSteps\n className=\"j2Steps\"\n {...props}\n orientation={orientation ?? direction}\n titlePlacement={titlePlacement ?? labelPlacement}\n size={size === 'default' ? 'medium' : size}\n current={currentStep}\n onChange={(curr) => setCurrentStep(curr)}\n {...(dot && { type: 'dot' })}\n items={items?.map((item, index) => {\n const { description, ...restItem } = item\n return {\n ...restItem,\n content: item.content ?? description,\n icon:\n !dot && currentStep > index ? (\n <div\n className={cx(\n `check-${size === 'small' ? 'small' : 'medium'}`,\n isVertical ? `vertical-check-icon` : `check-icon`\n )}\n >\n <CheckIcon size={16} />\n </div>\n ) : (\n item.icon\n ),\n }\n })}\n />\n )\n}\n"],"names":["useSteps","jsx","AntdSteps","CheckIcon"],"mappings":";;;;;;;;AAeO,MAAM,QAAQ,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,cAAc,eAAe,eAAe;AAClD,QAAM,cAAa,+BAAO,WAAU;AAEpC,QAAM,EAAE,SAAS,aAAa,YAAY,eAAA,IAAmBA,SAAAA,SAAS;AAAA,IACpE;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SACEC,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACT,GAAG;AAAA,MACJ,aAAa,eAAe;AAAA,MAC5B,gBAAgB,kBAAkB;AAAA,MAClC,MAAM,SAAS,YAAY,WAAW;AAAA,MACtC,SAAS;AAAA,MACT,UAAU,CAAC,SAAS,eAAe,IAAI;AAAA,MACtC,GAAI,OAAO,EAAE,MAAM,MAAA;AAAA,MACpB,OAAO,+BAAO,IAAI,CAAC,MAAM,UAAU;AACjC,cAAM,EAAE,aAAa,GAAG,SAAA,IAAa;AACrC,eAAO;AAAA,UACL,GAAG;AAAA,UACH,SAAS,KAAK,WAAW;AAAA,UACzB,MACE,CAAC,OAAO,cAAc,QACpBD,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,SAAS,SAAS,UAAU,UAAU,QAAQ;AAAA,gBAC9C,aAAa,wBAAwB;AAAA,cAAA;AAAA,cAGvC,UAAAA,2BAAAA,IAACE,MAAAA,WAAA,EAAU,MAAM,GAAA,CAAI;AAAA,YAAA;AAAA,UAAA,IAGvB,KAAK;AAAA,QAAA;AAAA,MAGb;AAAA,IAAC;AAAA,EAAA;AAGP;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { StepsProps
|
|
1
|
+
import { StepsProps } from 'antd';
|
|
2
2
|
type AllProps = StepsProps & {
|
|
3
|
-
items:
|
|
3
|
+
items: NonNullable<StepsProps['items']>;
|
|
4
4
|
dot?: boolean;
|
|
5
5
|
current?: number;
|
|
6
6
|
setCurrent?: (current: number) => void;
|
|
7
7
|
};
|
|
8
8
|
type Props = Expand<AllProps>;
|
|
9
|
-
export declare const Steps: ({ items, current, setCurrent, dot, ...props }: Props) => import("react").JSX.Element;
|
|
9
|
+
export declare const Steps: ({ items, current, setCurrent, dot, direction, orientation, size, labelPlacement, titlePlacement, ...props }: Props) => import("react").JSX.Element;
|
|
10
10
|
export {};
|
|
@@ -9,9 +9,14 @@ const Steps = ({
|
|
|
9
9
|
current,
|
|
10
10
|
setCurrent,
|
|
11
11
|
dot = false,
|
|
12
|
+
direction,
|
|
13
|
+
orientation,
|
|
14
|
+
size,
|
|
15
|
+
labelPlacement,
|
|
16
|
+
titlePlacement,
|
|
12
17
|
...props
|
|
13
18
|
}) => {
|
|
14
|
-
const isVertical =
|
|
19
|
+
const isVertical = (orientation ?? direction) === "vertical";
|
|
15
20
|
const totalSteps = (items == null ? void 0 : items.length) || 0;
|
|
16
21
|
const { current: currentStep, setCurrent: setCurrentStep } = useSteps({
|
|
17
22
|
current,
|
|
@@ -23,17 +28,22 @@ const Steps = ({
|
|
|
23
28
|
{
|
|
24
29
|
className: "j2Steps",
|
|
25
30
|
...props,
|
|
31
|
+
orientation: orientation ?? direction,
|
|
32
|
+
titlePlacement: titlePlacement ?? labelPlacement,
|
|
33
|
+
size: size === "default" ? "medium" : size,
|
|
26
34
|
current: currentStep,
|
|
27
35
|
onChange: (curr) => setCurrentStep(curr),
|
|
28
|
-
...dot && {
|
|
36
|
+
...dot && { type: "dot" },
|
|
29
37
|
items: items == null ? void 0 : items.map((item, index) => {
|
|
38
|
+
const { description, ...restItem } = item;
|
|
30
39
|
return {
|
|
31
|
-
...
|
|
40
|
+
...restItem,
|
|
41
|
+
content: item.content ?? description,
|
|
32
42
|
icon: !dot && currentStep > index ? /* @__PURE__ */ jsx(
|
|
33
43
|
"div",
|
|
34
44
|
{
|
|
35
45
|
className: cx(
|
|
36
|
-
`check-${
|
|
46
|
+
`check-${size === "small" ? "small" : "medium"}`,
|
|
37
47
|
isVertical ? `vertical-check-icon` : `check-icon`
|
|
38
48
|
),
|
|
39
49
|
children: /* @__PURE__ */ jsx(CheckIcon, { size: 16 })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Steps.js","sources":["../../../../src/components/steps/Steps.tsx"],"sourcesContent":["import { Steps as AntdSteps, StepsProps
|
|
1
|
+
{"version":3,"file":"Steps.js","sources":["../../../../src/components/steps/Steps.tsx"],"sourcesContent":["import { Steps as AntdSteps, StepsProps } from 'antd'\nimport './Steps.css'\nimport { CheckIcon } from '@phosphor-icons/react'\nimport cx from 'classnames'\nimport { useSteps } from './useSteps'\n\ntype AllProps = StepsProps & {\n items: NonNullable<StepsProps['items']>\n dot?: boolean\n current?: number\n setCurrent?: (current: number) => void\n}\n\ntype Props = Expand<AllProps>\n\nexport const Steps = ({\n items,\n current,\n setCurrent,\n dot = false,\n direction,\n orientation,\n size,\n labelPlacement,\n titlePlacement,\n ...props\n}: Props) => {\n const isVertical = (orientation ?? direction) === 'vertical'\n const totalSteps = items?.length || 0\n\n const { current: currentStep, setCurrent: setCurrentStep } = useSteps({\n current,\n setCurrent,\n totalSteps,\n })\n\n return (\n <AntdSteps\n className=\"j2Steps\"\n {...props}\n orientation={orientation ?? direction}\n titlePlacement={titlePlacement ?? labelPlacement}\n size={size === 'default' ? 'medium' : size}\n current={currentStep}\n onChange={(curr) => setCurrentStep(curr)}\n {...(dot && { type: 'dot' })}\n items={items?.map((item, index) => {\n const { description, ...restItem } = item\n return {\n ...restItem,\n content: item.content ?? description,\n icon:\n !dot && currentStep > index ? (\n <div\n className={cx(\n `check-${size === 'small' ? 'small' : 'medium'}`,\n isVertical ? `vertical-check-icon` : `check-icon`\n )}\n >\n <CheckIcon size={16} />\n </div>\n ) : (\n item.icon\n ),\n }\n })}\n />\n )\n}\n"],"names":["AntdSteps"],"mappings":";;;;;;AAeO,MAAM,QAAQ,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,cAAc,eAAe,eAAe;AAClD,QAAM,cAAa,+BAAO,WAAU;AAEpC,QAAM,EAAE,SAAS,aAAa,YAAY,eAAA,IAAmB,SAAS;AAAA,IACpE;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AAED,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACT,GAAG;AAAA,MACJ,aAAa,eAAe;AAAA,MAC5B,gBAAgB,kBAAkB;AAAA,MAClC,MAAM,SAAS,YAAY,WAAW;AAAA,MACtC,SAAS;AAAA,MACT,UAAU,CAAC,SAAS,eAAe,IAAI;AAAA,MACtC,GAAI,OAAO,EAAE,MAAM,MAAA;AAAA,MACpB,OAAO,+BAAO,IAAI,CAAC,MAAM,UAAU;AACjC,cAAM,EAAE,aAAa,GAAG,SAAA,IAAa;AACrC,eAAO;AAAA,UACL,GAAG;AAAA,UACH,SAAS,KAAK,WAAW;AAAA,UACzB,MACE,CAAC,OAAO,cAAc,QACpB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW;AAAA,gBACT,SAAS,SAAS,UAAU,UAAU,QAAQ;AAAA,gBAC9C,aAAa,wBAAwB;AAAA,cAAA;AAAA,cAGvC,UAAA,oBAAC,WAAA,EAAU,MAAM,GAAA,CAAI;AAAA,YAAA;AAAA,UAAA,IAGvB,KAAK;AAAA,QAAA;AAAA,MAGb;AAAA,IAAC;AAAA,EAAA;AAGP;"}
|
|
@@ -23,7 +23,7 @@ const Table = ({
|
|
|
23
23
|
var _a, _b;
|
|
24
24
|
const defaultLoadingProps = {
|
|
25
25
|
indicator: /* @__PURE__ */ jsxRuntime.jsx(Spinner.Spinner, { className: "!w-fit !h-fit !mx-0 translate-x-[-50%]" }),
|
|
26
|
-
|
|
26
|
+
description: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-20", children: [
|
|
27
27
|
/* @__PURE__ */ jsxRuntime.jsx("h4", { children: "Loading this chart" }),
|
|
28
28
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg", children: "Please wait a moment" })
|
|
29
29
|
] })
|