pds-dev-kit-web-test 0.2.28 → 0.2.30

package/dist/src/common/decorators/withFormProvider.js

@@ -23,6 +23,6 @@ var withFormProvider = function (storyFn) {
         // eslint-disable-next-line no-console
         console.log('submit success', data);
     };
-    return ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, methods, { children: (0, jsx_runtime_1.jsx)(components_1.Form, __assign({ onSubmit: methods.handleSubmit(handleSubmit) }, { children: storyFn() }), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, methods, { children: (0, jsx_runtime_1.jsx)(components_1.Form, __assign({ onSubmit: methods.handleSubmit(handleSubmit) }, { children: storyFn() })) })));
 };
 exports.withFormProvider = withFormProvider;

package/dist/src/common/hooks/useDetectOverflow.d.ts

@@ -1,4 +1,4 @@
-declare type Ref = {
+type Ref = {
     node: HTMLDivElement | HTMLUListElement | null;
 };
 declare function useDetectOverflow(ref: Ref, detectOnResize?: boolean): {

package/dist/src/common/index.js

@@ -1,6 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Form = exports.theme = exports.customTheme = exports.uiColors = exports.spacing = exports.boxShadow = exports.mobileEditorLineHeight = exports.mobileEditorFontSize = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopEditorLineHeight = exports.desktopEditorFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
+// types
+var ui_type_1 = require("./styles/colorSet/ui-type");
+var types_1 = require("./types");
 // theme
 var theme_1 = require("./styles/theme");
 Object.defineProperty(exports, "fontWeight", { enumerable: true, get: function () { return theme_1.fontWeight; } });

package/dist/src/common/styles/ToneTest/ToneTest.js

@@ -357,27 +357,27 @@ function ToneTest() {
             setTone('LIGHT');
         }
     };
-    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.BrowserRouter, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(styled_components_1.ThemeProvider, __assign({ theme: (0, theme_1.themeByGivenTone)(customTone) }, { children: (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)(react_router_dom_1.BrowserRouter, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(styled_components_1.ThemeProvider, __assign({ theme: (0, theme_1.themeByGivenTone)(customTone) }, { children: (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
                             src: 'http://i.imgur.com/zVKjblJ.png',
                             text: 'PEPSI',
                             href: '/'
                         }, userProfile: {
                             src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
                             href: '/'
-                        }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC758 \uC601\uD5A5\uC744 \uBC1B\uC9C0 \uC54A\uACE0 transparent \uC801\uC6A9 \uB41C \uBD80\uBD84\uC785\uB2C8\uB2E4." }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(styled_components_1.ThemeProvider, __assign({ theme: (0, theme_1.themeByGivenTone)(customTone) }, { children: (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
+                        }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" }) })), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC758 \uC601\uD5A5\uC744 \uBC1B\uC9C0 \uC54A\uACE0 transparent \uC801\uC6A9 \uB41C \uBD80\uBD84\uC785\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(styled_components_1.ThemeProvider, __assign({ theme: (0, theme_1.themeByGivenTone)(customTone) }, { children: (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
                             src: 'http://i.imgur.com/zVKjblJ.png',
                             text: 'PEPSI',
                             href: '/'
                         }, userProfile: {
                             src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
                             href: '/'
-                        }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation", colorTheme: "transparent" }, void 0) }), void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Divider, {}, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }, void 0), (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
+                        }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation", colorTheme: "transparent" }) })), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e" }), (0, jsx_runtime_1.jsx)(hybrid_1.Divider, {}), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_d" }), (0, jsx_runtime_1.jsx)(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
                         src: 'http://i.imgur.com/zVKjblJ.png',
                         text: 'PEPSI',
                         href: '/'
                     }, userProfile: {
                         src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
                         href: '/'
-                    }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" }, void 0)] }, void 0) }, void 0));
+                    }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })] }) }));
 }
 exports.default = ToneTest;

package/dist/src/common/styles/colorSet/PaletteColor_Dark.json

@@ -86,7 +86,7 @@
     "sys_papp_vod_background": "lightpink500",
     "sys_papp_vodplus_background": "pink500",
     "sys_papp_live_background": "pink300",
-    "sys_selcontrols_base_off_disabled": "darkgrey400/opacity65",
+    "sys_selcontrols_base_off_disabled": "darkgrey400/opacity35",
     "sys_selcontrols_base_on_disabled": "darklightgreen500/opacity65",
     "sys_component_base_blue_opacity10": "blue500/opacity10",
     "sys_component_base_05": "grey950",

package/dist/src/common/styles/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/dist/src/common/styles/theme.d.ts

@@ -110,6 +110,6 @@ export declare const spacing: {
     spacingN: string;
 };
 declare const theme: DefaultTheme;
-declare type ToneType = 'DARK' | 'LIGHT';
+type ToneType = 'DARK' | 'LIGHT';
 export declare const themeByGivenTone: (tone: ToneType) => any;
 export default theme;

package/dist/src/common/types/components.d.ts

@@ -1,30 +1,30 @@
 import type { FillIconNameKeys, LineIconNameKeys } from './icon';
 import type { PDSTextType } from './text';
 import type { ForwardedRef } from 'react';
-export declare type PDSValueOption = {
+export type PDSValueOption = {
     text: PDSTextType;
     value: string | number | null | boolean;
 };
-export declare type PDSTabItemOption = {
+export type PDSTabItemOption = {
     title: PDSTextType;
     isActive: boolean;
     onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
 };
-export declare type ContextMenuItemValueOption = {
+export type ContextMenuItemValueOption = {
     text?: PDSTextType;
     value: string | number | null | boolean;
     iconName?: FillIconNameKeys | LineIconNameKeys;
     iconFillType?: 'fill' | 'line';
     fontWeight?: 'bold' | 'regular';
 };
-export declare type DropdownValueOption = ContextMenuItemValueOption & {
+export type DropdownValueOption = ContextMenuItemValueOption & {
     state?: 'normal' | 'disabled';
 };
-export declare type AdminListDropdownValueOption = {
+export type AdminListDropdownValueOption = {
     text: DropdownValueOption['text'];
     value: DropdownValueOption['value'];
 };
-export declare type BasicButtonGroupValueOption = {
+export type BasicButtonGroupValueOption = {
     iconName: FillIconNameKeys | LineIconNameKeys;
     iconFillType?: 'fill' | 'line';
     state?: 'normal' | 'disabled';
@@ -34,7 +34,7 @@ export declare type BasicButtonGroupValueOption = {
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
     onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
 };
-export declare type SegmentedButtonGroupValueOption = Pick<PDSValueOption, 'value'> & {
+export type SegmentedButtonGroupValueOption = Pick<PDSValueOption, 'value'> & {
     iconName: FillIconNameKeys | LineIconNameKeys;
     iconFillType?: 'fill' | 'line';
     state?: 'normal' | 'disabled';
@@ -42,4 +42,4 @@ export declare type SegmentedButtonGroupValueOption = Pick<PDSValueOption, 'valu
     tooltipText?: PDSTextType;
     tooltipPosition?: 'left_top' | 'left_bottom' | 'center_top' | 'center_bottom' | 'right_top' | 'right_bottom';
 };
-export declare type ForwardedRefType<T> = ForwardedRef<T | null>;
+export type ForwardedRefType<T> = ForwardedRef<T | null>;

package/dist/src/common/types/icon.d.ts

@@ -1,5 +1,5 @@
 import type fillIcons from '../assets/icons/fill';
 import type lineIcons from '../assets/icons/line';
-export declare type FillIconNameKeys = keyof typeof fillIcons;
-export declare type LineIconNameKeys = keyof typeof lineIcons;
-export declare type PDSIconType = FillIconNameKeys | LineIconNameKeys;
+export type FillIconNameKeys = keyof typeof fillIcons;
+export type LineIconNameKeys = keyof typeof lineIcons;
+export type PDSIconType = FillIconNameKeys | LineIconNameKeys;

package/dist/src/common/types/index.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];

package/dist/src/common/types/styled-components.d.ts

@@ -111,5 +111,5 @@ export interface PdsDevKitTheme {
         spacingN: '320px';
     };
 }
-export declare type DesktopFontSize = keyof typeof desktopFontSize;
-export declare type FontWeight = keyof typeof fontWeight;
+export type DesktopFontSize = keyof typeof desktopFontSize;
+export type FontWeight = keyof typeof fontWeight;

package/dist/src/common/types/text.d.ts

@@ -1,2 +1,2 @@
 import type { TFunctionResult } from 'i18next';
-export declare type PDSTextType = number | TFunctionResult;
+export type PDSTextType = number | TFunctionResult;

package/dist/src/common/types/uiColors.d.ts

@@ -1,2 +1,2 @@
 import type { uiColors } from '../styles/ui-colors';
-export declare type UiColors = keyof typeof uiColors;
+export type UiColors = keyof typeof uiColors;

package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { Path } from 'react-hook-form';
 import { DesktopFontSize, FontWeight, IFormValues, PDSTextType, UiColors } from '../../../../common';
-export declare type TextFieldBaseProps = {
+export type TextFieldBaseProps = {
     name: Path<IFormValues>;
     hintText?: PDSTextType;
     defaultText?: PDSTextType;

package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js

@@ -16,7 +16,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -139,11 +143,11 @@ function TextFieldBase(_a) {
         }
         if (autoMinRows === 1) {
             textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
             return;
         }
-        textAreaRef.current.style.height = fieldHeight - 2 + "px";
-        textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
+        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
     }, []);
     /**
      * 텍스트 필드 내부 value에 맞게 초기 height 값을 부여한다.
@@ -156,7 +160,7 @@ function TextFieldBase(_a) {
             return;
         }
         if (getValues(name)) {
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
         }
     }, [getValues(name)]);
     var handleResizeHeight = (0, react_1.useCallback)(function () {
@@ -165,11 +169,11 @@ function TextFieldBase(_a) {
         }
         if (autoMinRows === 1) {
             textAreaRef.current.style.height = '0';
-            textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+            textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
             return;
         }
-        textAreaRef.current.style.height = fieldHeight - 2 + "px";
-        textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
+        textAreaRef.current.style.height = "".concat(fieldHeight - 2, "px");
+        textAreaRef.current.style.height = "".concat(textAreaRef.current.scrollHeight, "px");
     }, []);
     function deleteValue() {
         setValue(name, '', { shouldDirty: true });
@@ -193,12 +197,12 @@ function TextFieldBase(_a) {
     }
     var S_TextFieldBase = function () {
         if (textLineType === 'single') {
-            return ((0, jsx_runtime_1.jsxs)(S_InputWrapper, { children: [stepperMode === 'use' && ((0, jsx_runtime_1.jsxs)(S_IconBox, __assign({ innerSpinButtonSize: innerSpinButtonSize, isFocused: isFocused, stepperRightSpacing: stepperRightSpacing }, { children: [(0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_up_stepper", fillType: "fill", size: innerSpinButtonSize }, void 0), (0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_down_stepper", fillType: "fill", size: innerSpinButtonSize }, void 0)] }), void 0)), (0, jsx_runtime_1.jsx)(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, colorTheme: colorTheme, min: min, max: max, autoComplete: autoComplete, stepperMode: stepperMode, innerSpinButtonSize: innerSpinButtonSize, step: step, deleteIconMode: deleteIconMode, suffixText: suffixText, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing, isFocused: isFocused, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: function (e) {
+            return ((0, jsx_runtime_1.jsxs)(S_InputWrapper, { children: [stepperMode === 'use' && ((0, jsx_runtime_1.jsxs)(S_IconBox, __assign({ innerSpinButtonSize: innerSpinButtonSize, isFocused: isFocused, stepperRightSpacing: stepperRightSpacing }, { children: [(0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_up_stepper", fillType: "fill", size: innerSpinButtonSize }), (0, jsx_runtime_1.jsx)(components_2.Icon, { iconName: "ic_arrow_down_stepper", fillType: "fill", size: innerSpinButtonSize })] }))), (0, jsx_runtime_1.jsx)(S_Input, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, type: inputType, state: state, readOnly: state === 'read_only', disabled: state === 'disabled', maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, colorTheme: colorTheme, min: min, max: max, autoComplete: autoComplete, stepperMode: stepperMode, innerSpinButtonSize: innerSpinButtonSize, step: step, deleteIconMode: deleteIconMode, suffixText: suffixText, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing, isFocused: isFocused, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: function (e) {
                             ref(e);
                             if (inputRef) {
                                 inputRef.current = e;
                             }
-                        } }), void 0), (deleteIconMode === 'use' || suffixText) && ((0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, innerSpinButtonSize: innerSpinButtonSize }, { children: [deleteIconMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ innerSpinButtonSize: innerSpinButtonSize, deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, isFocused: isFocused, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing }, { children: isFocused && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue }, void 0)) }), void 0)), suffixText && ((0, jsx_runtime_1.jsxs)(S_SuffixTextBox, __assign({ ref: suffixTextRef }, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", colorOverride: stepperMode === 'use' && isFocused ? 'ui_106' : undefined, textAlign: "right", singleLineMode: "use" }, void 0), suffixTextRightSpacingMode === 'use' && ((0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }, void 0))] }), void 0))] }), void 0))] }, void 0));
+                        } })), (deleteIconMode === 'use' || suffixText) && ((0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, innerSpinButtonSize: innerSpinButtonSize }, { children: [deleteIconMode === 'use' && ((0, jsx_runtime_1.jsx)(S_IconButtonWrapper, __assign({ innerSpinButtonSize: innerSpinButtonSize, deleteIconMode: deleteIconMode, stepperMode: stepperMode, suffixText: suffixText, isFocused: isFocused, suffixTextWidth: suffixTextWidth, stepperRightSpacing: stepperRightSpacing }, { children: isFocused && ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { iconName: "ic_delete", baseSize: "small", shapeType: "rectangle", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconSize: deleteIconSize, iconColorKey: deleteIconColor, iconFillType: "fill", state: state === 'disabled' ? 'disabled' : 'normal', tabIndex: -1, onMouseDown: deleteValue })) }))), suffixText && ((0, jsx_runtime_1.jsxs)(S_SuffixTextBox, __assign({ ref: suffixTextRef }, { children: [(0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: suffixText, styleTheme: "caption1Bold", colorTheme: "sysTextTertiary", colorOverride: stepperMode === 'use' && isFocused ? 'ui_106' : undefined, textAlign: "right", singleLineMode: "use" }), suffixTextRightSpacingMode === 'use' && ((0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_b", spacingType: "width" }))] })))] })))] }));
         }
         if (textLineType === 'multi') {
             return ((0, jsx_runtime_1.jsx)(S_Multi, __assign({}, register(name, validation), rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, rows: multiRows, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, colorTheme: colorTheme, autoComplete: autoComplete, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: function (e) {
@@ -206,7 +210,7 @@ function TextFieldBase(_a) {
                     if (inputRef) {
                         inputRef.current = e;
                     }
-                } }), void 0));
+                } })));
         }
         if (textLineType === 'auto') {
             return ((0, jsx_runtime_1.jsx)(S_Auto, __assign({}, refRest, rest, { name: name, defaultValue: defaultText, placeholder: hintText, textAlign: textAlign, autoMinRows: autoMinRows, autoMaxRows: autoMaxRows, state: state, readOnly: state === 'read_only' && true, disabled: state === 'disabled' && true, maxLength: maxLength, textSize: textSize, textWeight: textWeight, fieldPaddingRight: fieldPaddingRight, fieldPaddingLeft: fieldPaddingLeft, fieldHeight: fieldHeight, colorTheme: colorTheme, autoComplete: autoComplete, onFocus: handleFocus, onChange: handleChange, onBlur: handleBlur, onKeyDown: handleKeyDown, onKeyUp: handleKeyUp, ref: function (e) {
@@ -217,14 +221,14 @@ function TextFieldBase(_a) {
                     if (inputRef) {
                         inputRef.current = e;
                     }
-                }, onInput: handleResizeHeight }), void 0));
+                }, onInput: handleResizeHeight })));
         }
     };
-    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: S_TextFieldBase() }, void 0);
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: S_TextFieldBase() });
 }
 var stepper_and_delete_style = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  right: ", ";\n"], ["\n  position: absolute;\n  right: ", ";\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize, stepperRightSpacing = _a.stepperRightSpacing;
-    return innerSpinButtonSize && stepperRightSpacing && innerSpinButtonSize + stepperRightSpacing + "px";
+    return innerSpinButtonSize && stepperRightSpacing && "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
 });
 var S_IconButtonWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n\n  ", "\n"], ["\n  ", ";\n\n  ", "\n"])), function (_a) {
     var deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText;
@@ -235,7 +239,7 @@ var S_IconButtonWrapper = styled_components_1.default.div(templateObject_2 || (t
         if (isFocused) {
             if (innerSpinButtonSize) {
                 if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE > suffixTextWidth) {
-                    return "margin-right: " + (innerSpinButtonSize - suffixTextWidth + stepperRightSpacing) + "px;";
+                    return "margin-right: ".concat(innerSpinButtonSize - suffixTextWidth + stepperRightSpacing, "px;");
                 }
                 return;
             }
@@ -256,13 +260,13 @@ var S_RightBox = styled_components_1.default.div(templateObject_3 || (templateOb
 });
 var S_IconBox = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-direction: column;\n  height: ", ";\n  justify-content: center;\n  position: absolute;\n  right: ", ";\n  width: ", ";\n  visibility: hidden;\n\n  ", ";\n"], ["\n  align-items: center;\n  display: flex;\n  flex-direction: column;\n  height: ", ";\n  justify-content: center;\n  position: absolute;\n  right: ", ";\n  width: ", ";\n  visibility: hidden;\n\n  ", ";\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize * 2 + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize * 2, "px");
 }, function (_a) {
     var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && stepperRightSpacing + "px";
+    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 }, function (_a) {
     var isFocused = _a.isFocused;
     return isFocused && 'visibility: visible;';
@@ -337,10 +341,10 @@ var basicStyle = (0, styled_components_1.css)(templateObject_9 || (templateObjec
         }[state];
 }, function (_a) {
     var fieldPaddingRight = _a.fieldPaddingRight;
-    return fieldPaddingRight && "padding-right: " + fieldPaddingRight + "px;";
+    return fieldPaddingRight && "padding-right: ".concat(fieldPaddingRight, "px;");
 }, function (_a) {
     var fieldPaddingLeft = _a.fieldPaddingLeft;
-    return fieldPaddingLeft && "padding-left: " + fieldPaddingLeft + "px;";
+    return fieldPaddingLeft && "padding-left: ".concat(fieldPaddingLeft, "px;");
 }, function (_a) {
     var deleteIconMode = _a.deleteIconMode, stepperMode = _a.stepperMode, suffixText = _a.suffixText;
     if (deleteIconMode === 'use' && stepperMode === 'use' && suffixText) {
@@ -364,19 +368,19 @@ var delete_stepper_suffix = (0, styled_components_1.css)(templateObject_10 || (t
             if (innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing <
                 constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth) {
                 if (fieldPaddingRight) {
-                    return constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + fieldPaddingRight + "px";
+                    return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + fieldPaddingRight, "px");
                 }
-                return constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth + "px";
+                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + suffixTextWidth, "px");
             }
             if (fieldPaddingRight) {
-                return constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + fieldPaddingRight + stepperRightSpacing + "px";
+                return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + fieldPaddingRight + stepperRightSpacing, "px");
             }
-            return constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(constants_1.DELETE_BUTTON_BASE_SIZE + innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return suffixTextWidth + fieldPaddingRight + "px";
+            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
         }
-        return suffixTextWidth + "px";
+        return "".concat(suffixTextWidth, "px");
     }
     return;
 });
@@ -385,12 +389,12 @@ var delete_stepper = (0, styled_components_1.css)(templateObject_11 || (template
     if (innerSpinButtonSize && stepperRightSpacing) {
         if (isFocused) {
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + fieldPaddingRight + stepperRightSpacing + "px";
+                return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + fieldPaddingRight + stepperRightSpacing, "px");
             }
-            return innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + constants_1.DELETE_BUTTON_BASE_SIZE + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return fieldPaddingRight + "px";
+            return "".concat(fieldPaddingRight, "px");
         }
         return;
     }
@@ -402,19 +406,19 @@ var stepper_suffix = (0, styled_components_1.css)(templateObject_12 || (template
         if (isFocused) {
             if (innerSpinButtonSize + stepperRightSpacing < suffixTextWidth) {
                 if (fieldPaddingRight) {
-                    return suffixTextWidth + fieldPaddingRight + "px";
+                    return "".concat(suffixTextWidth + fieldPaddingRight, "px");
                 }
-                return suffixTextWidth + "px";
+                return "".concat(suffixTextWidth, "px");
             }
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight + "px";
+                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
             }
-            return innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return suffixTextWidth + fieldPaddingRight + "px";
+            return "".concat(suffixTextWidth + fieldPaddingRight, "px");
         }
-        return suffixTextWidth + "px";
+        return "".concat(suffixTextWidth, "px");
     }
     return;
 });
@@ -423,12 +427,12 @@ var stepper = (0, styled_components_1.css)(templateObject_13 || (templateObject_
     if (innerSpinButtonSize && stepperRightSpacing) {
         if (isFocused) {
             if (fieldPaddingRight) {
-                return innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight + "px";
+                return "".concat(innerSpinButtonSize + stepperRightSpacing + fieldPaddingRight, "px");
             }
-            return innerSpinButtonSize + stepperRightSpacing + "px";
+            return "".concat(innerSpinButtonSize + stepperRightSpacing, "px");
         }
         if (fieldPaddingRight) {
-            return fieldPaddingRight + "px";
+            return "".concat(fieldPaddingRight, "px");
         }
         return;
     }
@@ -436,19 +440,19 @@ var stepper = (0, styled_components_1.css)(templateObject_13 || (templateObject_
 });
 var inputInnerSpinButtonStyle = (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  -webkit-appearance: none;\n  z-index: 1;\n  cursor: pointer;\n  height: ", ";\n  margin-left: ", ";\n  opacity: 1;\n  width: ", ";\n  position: absolute;\n  right: ", ";\n  top: calc(\n    50% - ", "\n  );\n"], ["\n  -webkit-appearance: none;\n  z-index: 1;\n  cursor: pointer;\n  height: ", ";\n  margin-left: ", ";\n  opacity: 1;\n  width: ", ";\n  position: absolute;\n  right: ", ";\n  top: calc(\n    50% - ", "\n  );\n"])), function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize * 2 + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize * 2, "px");
 }, function (_a) {
     var theme = _a.theme;
     return theme.spacing.spacingB;
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 }, function (_a) {
     var stepperRightSpacing = _a.stepperRightSpacing;
-    return stepperRightSpacing && stepperRightSpacing + "px";
+    return stepperRightSpacing && "".concat(stepperRightSpacing, "px");
 }, function (_a) {
     var innerSpinButtonSize = _a.innerSpinButtonSize;
-    return innerSpinButtonSize && innerSpinButtonSize + "px";
+    return innerSpinButtonSize && "".concat(innerSpinButtonSize, "px");
 });
 var S_Input = styled_components_1.default.input(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  ", "\n  flex: 1;\n  line-height: ", ";\n  position: relative;\n\n  ::-webkit-inner-spin-button {\n    ", "\n  }\n  ::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n"], ["\n  ", "\n  flex: 1;\n  line-height: ", ";\n  position: relative;\n\n  ::-webkit-inner-spin-button {\n    ", "\n  }\n  ::-webkit-outer-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n"])), basicStyle, function (_a) {
     var theme = _a.theme;
@@ -463,16 +467,16 @@ var S_Auto = styled_components_1.default.textarea(templateObject_16 || (template
     var autoMaxRows = _a.autoMaxRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
     return autoMaxRows &&
         fieldHeight &&
-        "max-height: " + Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
+        "max-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
             Number(common_1.desktopLineHeight[textSize]) *
-            autoMaxRows + "px;";
+            autoMaxRows, "px;");
 }, function (_a) {
     var autoMinRows = _a.autoMinRows, textSize = _a.textSize, fieldHeight = _a.fieldHeight;
     return autoMinRows &&
         fieldHeight &&
-        "min-height: " + Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
+        "min-height: ".concat(Number(common_1.desktopFontSize[textSize].substring(0, 2)) *
             Number(common_1.desktopLineHeight[textSize]) *
-            autoMinRows + "px;";
+            autoMinRows, "px;");
 });
 var S_Multi = styled_components_1.default.textarea(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n"], ["\n  ", "\n  display: block;\n  overflow-y: auto;\n  resize: none;\n"])), basicStyle);
 exports.default = TextFieldBase;

package/dist/src/desktop/components/AdminList/AdminList.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 import type { AdminListDropdownValueOption } from '../../../common';
 import type { TFunctionResult } from 'i18next';
-declare type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
-declare type Props = {
+type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
+type Props = {
     selectionMode?: 'none' | 'single' | 'multi';
     headerRowMode?: 'none' | 'use';
     column2HeaderText: TFunctionResult;

package/dist/src/desktop/components/AdminList/AdminList.js

@@ -16,7 +16,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -190,7 +194,7 @@ function AdminList(_a) {
             }
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(S_AdminList, __assign({ "x-pds-name": "AdminList", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [isBulkActionBarOpen && ((0, jsx_runtime_1.jsx)(BulkActionBar_1.default, { itemCount: totalItemCount, dropdownMode: dropdownMode, dropdown1Value: dropdown1Value, dropdown2Value: dropdown2Value, dropdown3Value: dropdown3Value, dropdown1DefaultText: dropdown1DefaultText, dropdown2DefaultText: dropdown2DefaultText, dropdown3DefaultText: dropdown3DefaultText, dropdown1HintText: dropdown1HintText, dropdown2HintText: dropdown2HintText, dropdown3HintText: dropdown3HintText, dropdown1ValueArray: dropdown1ValueArray, dropdown2ValueArray: dropdown2ValueArray, dropdown3ValueArray: dropdown3ValueArray, tBtnMode: btnMode(), tBtn1Text: tBtn1Text || mBtn1Text, tBtn2Text: tBtn2Text || mBtn2Text, tBtn3Text: tBtn3Text || mBtn3Text, onChangeDropdown1: onChangeDropdown1, onChangeDropdown2: onChangeDropdown2, onChangeDropdown3: onChangeDropdown3, onClickTBtn1: onClickTBtn1 || onClickMBtn1, onClickTBtn2: onClickTBtn2 || onClickMBtn2, onClickTBtn3: onClickTBtn3 || onClickMBtn3 }, void 0)), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: (0, jsx_runtime_1.jsx)(HeaderRow_1.default, { headerRowCheckboxName: headerRowCheckboxName, selectionMode: selectionMode, column2HeaderText: column2HeaderText, column3HeaderText: column3HeaderText, column3HeaderWidth: column3Width, column4HeaderText: column4HeaderText, column4HeaderWidth: column4Width, column5HeaderText: column5HeaderText, column5HeaderWidth: column5Width, column6HeaderText: column6HeaderText, column6HeaderWidth: column6Width, column7HeaderText: column7HeaderText, column7HeaderWidth: column7Width, column8HeaderText: column8HeaderText, column8HeaderWidth: column8Width, column9HeaderText: column9HeaderText, column9HeaderWidth: column9Width, column10HeaderText: column10HeaderText, column10HeaderWidth: column10Width, quickActionBtnType: quickActionBtnType, quickActionButtonCount: getActionButtonCount(), flexibleHideInfoMode: flexibleHideInfoMode, onClickSelectAllCheckbox: handleSelectAllCheckbox }, void 0) }, void 0) }), void 0)), (0, jsx_runtime_1.jsx)(S_ScrollBox, __assign({ scrollMode: scrollMode, scrollVisibleType: scrollVisibleType }, { children: react_1.default.Children.count(children) ? ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, checkboxMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: childrenWithWidthProps }, void 0) }), void 0)) : ((0, jsx_runtime_1.jsx)(S_EmptyTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: emptyText, colorTheme: "sysTextTertiary", textAlign: "center", styleTheme: "body2Regular" }, void 0) }, void 0)) }), void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)(S_AdminList, __assign({ "x-pds-name": "AdminList", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [isBulkActionBarOpen && ((0, jsx_runtime_1.jsx)(BulkActionBar_1.default, { itemCount: totalItemCount, dropdownMode: dropdownMode, dropdown1Value: dropdown1Value, dropdown2Value: dropdown2Value, dropdown3Value: dropdown3Value, dropdown1DefaultText: dropdown1DefaultText, dropdown2DefaultText: dropdown2DefaultText, dropdown3DefaultText: dropdown3DefaultText, dropdown1HintText: dropdown1HintText, dropdown2HintText: dropdown2HintText, dropdown3HintText: dropdown3HintText, dropdown1ValueArray: dropdown1ValueArray, dropdown2ValueArray: dropdown2ValueArray, dropdown3ValueArray: dropdown3ValueArray, tBtnMode: btnMode(), tBtn1Text: tBtn1Text || mBtn1Text, tBtn2Text: tBtn2Text || mBtn2Text, tBtn3Text: tBtn3Text || mBtn3Text, onChangeDropdown1: onChangeDropdown1, onChangeDropdown2: onChangeDropdown2, onChangeDropdown3: onChangeDropdown3, onClickTBtn1: onClickTBtn1 || onClickMBtn1, onClickTBtn2: onClickTBtn2 || onClickMBtn2, onClickTBtn3: onClickTBtn3 || onClickMBtn3 })), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: (0, jsx_runtime_1.jsx)(HeaderRow_1.default, { headerRowCheckboxName: headerRowCheckboxName, selectionMode: selectionMode, column2HeaderText: column2HeaderText, column3HeaderText: column3HeaderText, column3HeaderWidth: column3Width, column4HeaderText: column4HeaderText, column4HeaderWidth: column4Width, column5HeaderText: column5HeaderText, column5HeaderWidth: column5Width, column6HeaderText: column6HeaderText, column6HeaderWidth: column6Width, column7HeaderText: column7HeaderText, column7HeaderWidth: column7Width, column8HeaderText: column8HeaderText, column8HeaderWidth: column8Width, column9HeaderText: column9HeaderText, column9HeaderWidth: column9Width, column10HeaderText: column10HeaderText, column10HeaderWidth: column10Width, quickActionBtnType: quickActionBtnType, quickActionButtonCount: getActionButtonCount(), flexibleHideInfoMode: flexibleHideInfoMode, onClickSelectAllCheckbox: handleSelectAllCheckbox }) }) }))), (0, jsx_runtime_1.jsx)(S_ScrollBox, __assign({ scrollMode: scrollMode, scrollVisibleType: scrollVisibleType }, { children: react_1.default.Children.count(children) ? ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, checkboxMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: childrenWithWidthProps }) }))) : ((0, jsx_runtime_1.jsx)(S_EmptyTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: emptyText, colorTheme: "sysTextTertiary", textAlign: "center", styleTheme: "body2Regular" }) })) }))] })));
 }
 var scrollInvisible = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  &::-webkit-scrollbar {\n    all: unset;\n    display: block;\n  }\n"], ["\n  &::-webkit-scrollbar {\n    all: unset;\n    display: block;\n  }\n"])));
 var scrollVisible = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"], ["\n  &::-webkit-scrollbar {\n    display: none;\n  }\n"])));

package/dist/src/desktop/components/AdminList/BulkActionBar.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { AdminListDropdownValueOption } from '../../../common/types';
 import type { TFunctionResult } from 'i18next';
-declare type Props = {
+type Props = {
     itemCount?: number;
     dropdownMode: 'none' | 'dropdown_amount1' | 'dropdown_amount2' | 'dropdown_amount3';
     dropdown1Value?: AdminListDropdownValueOption;

package/dist/src/desktop/components/AdminList/BulkActionBar.js

@@ -17,10 +17,10 @@ var TextLabel_1 = require("../TextLabel");
 function BulkActionBar(_a) {
     var _b = _a.itemCount, itemCount = _b === void 0 ? 1 : _b, _c = _a.dropdownMode, dropdownMode = _c === void 0 ? 'dropdown_amount1' : _c, dropdown1Value = _a.dropdown1Value, dropdown2Value = _a.dropdown2Value, dropdown3Value = _a.dropdown3Value, dropdown1DefaultText = _a.dropdown1DefaultText, dropdown2DefaultText = _a.dropdown2DefaultText, dropdown3DefaultText = _a.dropdown3DefaultText, dropdown1HintText = _a.dropdown1HintText, dropdown2HintText = _a.dropdown2HintText, dropdown3HintText = _a.dropdown3HintText, dropdown1ValueArray = _a.dropdown1ValueArray, dropdown2ValueArray = _a.dropdown2ValueArray, dropdown3ValueArray = _a.dropdown3ValueArray, tBtnMode = _a.tBtnMode, tBtn1Text = _a.tBtn1Text, tBtn2Text = _a.tBtn2Text, tBtn3Text = _a.tBtn3Text, onChangeDropdown1 = _a.onChangeDropdown1, onChangeDropdown2 = _a.onChangeDropdown2, onChangeDropdown3 = _a.onChangeDropdown3, onClickTBtn1 = _a.onClickTBtn1, onClickTBtn2 = _a.onClickTBtn2, onClickTBtn3 = _a.onClickTBtn3;
     var t = (0, react_i18next_1.useTranslation)('translation').t;
-    return ((0, jsx_runtime_1.jsxs)(S_BulkActionBar, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: t('str_n_selected', {
+    return ((0, jsx_runtime_1.jsxs)(S_BulkActionBar, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: t('str_n_selected', {
                     itemSelected: itemCount
-                }), styleTheme: "body2Bold", colorTheme: "sysTextWhite" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Divider, { direction: "vertical", height: 16 }, void 0), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }, void 0), dropdownMode !== 'none' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [dropdown1ValueArray && ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown1ValueArray, defaultValue: dropdown1DefaultText, hintText: dropdown1HintText, value: dropdown1Value, onChange: onChangeDropdown1, size: "small", colorTheme: "dark" }, void 0)), (dropdownMode === 'dropdown_amount2' || dropdownMode === 'dropdown_amount3') &&
-                        dropdown2ValueArray && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown2ValueArray, defaultValue: dropdown2DefaultText, hintText: dropdown2HintText, value: dropdown2Value, onChange: onChangeDropdown2, size: "small", colorTheme: "dark" }, void 0)] }, void 0)), dropdownMode === 'dropdown_amount3' && dropdown3ValueArray && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown3ValueArray, defaultValue: dropdown3DefaultText, hintText: dropdown3HintText, value: dropdown3Value, onChange: onChangeDropdown3, size: "small", colorTheme: "dark" }, void 0)] }, void 0))] }, void 0)), tBtnMode !== 'none' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn1Text, onClick: onClickTBtn1, colorTheme: "white" }, void 0), (tBtnMode === 'tbtn_amount2' || tBtnMode === 'tbtn_amount3') && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn2Text, onClick: onClickTBtn2, colorTheme: "white" }, void 0)] }, void 0)), tBtnMode === 'tbtn_amount3' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }, void 0), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn3Text, onClick: onClickTBtn3, colorTheme: "white" }, void 0)] }, void 0))] }, void 0)), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }, void 0)] }, void 0));
+                }), styleTheme: "body2Bold", colorTheme: "sysTextWhite" }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }), (0, jsx_runtime_1.jsx)(hybrid_1.Divider, { direction: "vertical", height: 16 }), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" }), dropdownMode !== 'none' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [dropdown1ValueArray && ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown1ValueArray, defaultValue: dropdown1DefaultText, hintText: dropdown1HintText, value: dropdown1Value, onChange: onChangeDropdown1, size: "small", colorTheme: "dark" })), (dropdownMode === 'dropdown_amount2' || dropdownMode === 'dropdown_amount3') &&
+                        dropdown2ValueArray && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown2ValueArray, defaultValue: dropdown2DefaultText, hintText: dropdown2HintText, value: dropdown2Value, onChange: onChangeDropdown2, size: "small", colorTheme: "dark" })] })), dropdownMode === 'dropdown_amount3' && dropdown3ValueArray && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { valueArray: dropdown3ValueArray, defaultValue: dropdown3DefaultText, hintText: dropdown3HintText, value: dropdown3Value, onChange: onChangeDropdown3, size: "small", colorTheme: "dark" })] }))] })), tBtnMode !== 'none' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn1Text, onClick: onClickTBtn1, colorTheme: "white" }), (tBtnMode === 'tbtn_amount2' || tBtnMode === 'tbtn_amount3') && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn2Text, onClick: onClickTBtn2, colorTheme: "white" })] })), tBtnMode === 'tbtn_amount3' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }), (0, jsx_runtime_1.jsx)(TextButton_1.TextButton, { size: "small", text: tBtn3Text, onClick: onClickTBtn3, colorTheme: "white" })] }))] })), (0, jsx_runtime_1.jsx)(hybrid_1.Spacing, { size: "spacing_e", spacingType: "width" })] }));
 }
 var S_BulkActionBar = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: 56px;\n  min-height: 56px;\n"], ["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: 56px;\n  min-height: 56px;\n"])), function (_a) {
     var theme = _a.theme;

package/dist/src/desktop/components/AdminList/HeaderRow.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { TFunctionResult } from 'i18next';
-declare type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
-declare type Props = {
+type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
+type Props = {
     selectionMode: 'none' | 'single' | 'multi';
     column2HeaderText?: TFunctionResult;
     column3HeaderText?: TFunctionResult;