pds-dev-kit-web 2.0.14 → 2.1.0

package/dist/src/mobile/components/Slider/Slider.js

@@ -0,0 +1,197 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var components_1 = require("../../../hybrid/components");
+var styled_components_1 = __importDefault(require("styled-components"));
+var TextLabel_1 = require("../TextLabel");
+function Slider(_a, ref) {
+    var min = _a.min, max = _a.max, _b = _a.step, step = _b === void 0 ? 1 : _b, name = _a.name, defaultValue = _a.defaultValue, tooltipText = _a.tooltipText, _c = _a.state, state = _c === void 0 ? 'normal' : _c, prefixText = _a.prefixText, suffixText = _a.suffixText, customWidth = _a.customWidth, _d = _a.responsiveMode, responsiveMode = _d === void 0 ? 'none' : _d, onChange = _a.onChange, onClick = _a.onClick;
+    var _e = (0, react_1.useState)(false), isTooltipVisible = _e[0], setIsTooltipVisible = _e[1];
+    var _f = (0, react_1.useState)(false), isTouching = _f[0], setIsTouching = _f[1];
+    var trackRef = (0, react_1.useRef)(null);
+    var thumbRef = (0, react_1.useRef)(null);
+    var inputRef = (0, react_1.useRef)(null);
+    var defaultThumbPercentage = ((Number(defaultValue || (max - min) / 2 + min) - min) / (max - min)) * 100;
+    function getPercent(pointValue, width) {
+        if (pointValue <= 0) {
+            return 0;
+        }
+        if (pointValue >= width) {
+            return 1;
+        }
+        return pointValue / width;
+    }
+    function percentToValue(percent, min, max) {
+        return (max - min) * percent + min;
+    }
+    function getInputValue(inputRef, trackValue) {
+        var result = { prevInputValue: '', newInputValue: '' };
+        if (inputRef.current === null) {
+            return result;
+        }
+        result.prevInputValue = inputRef.current.value;
+        inputRef.current.value = String(trackValue);
+        result.newInputValue = inputRef.current.value;
+        return result;
+    }
+    function getThumbOffset(percent, width) {
+        return ((width * percent - width / 2) / (width / 2)) * -10;
+    }
+    var getNewInputValue = function (clientX, left, width) {
+        var percent = getPercent(clientX - (left + 10), width - 20);
+        var newValue = percentToValue(percent, min, max);
+        var _a = getInputValue(inputRef, newValue), prevInputValue = _a.prevInputValue, newInputValue = _a.newInputValue;
+        if (prevInputValue === newInputValue) {
+            return null;
+        }
+        return newInputValue;
+    };
+    var getThumbPositionOnTrack = function (percent, value, width) {
+        var thumbOffset = getThumbOffset(percent, width);
+        return "calc(" + (Number(value) / (max - min)) * 100 + "% + " + thumbOffset + "px)";
+    };
+    var updateFillTrackAndThumb = function (trackElement, thumbElement, thumbPosition) {
+        trackElement.style.backgroundSize = thumbPosition + " 100%";
+        thumbElement.style.left = thumbPosition;
+    };
+    var changeSliderValue = function (clientX) {
+        if (inputRef.current === null || thumbRef.current === null || trackRef.current === null) {
+            return;
+        }
+        var _a = trackRef.current.getBoundingClientRect(), left = _a.left, width = _a.width;
+        var newInputValue = getNewInputValue(clientX, left, width);
+        if (newInputValue === null) {
+            return;
+        }
+        var thumbPosition = getThumbPositionOnTrack(Number(newInputValue) / (max - min), newInputValue, width);
+        updateFillTrackAndThumb(trackRef.current, thumbRef.current, thumbPosition);
+        inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));
+    };
+    var handleTouchMove = function (e) {
+        changeSliderValue(e.changedTouches[0].clientX);
+    };
+    var handleTouchEnd = function () {
+        document.removeEventListener('touchmove', handleTouchMove);
+        setIsTouching(false);
+        if (tooltipText) {
+            setIsTooltipVisible(false);
+        }
+        if (inputRef.current !== null) {
+            inputRef.current.dispatchEvent(new Event('click', { bubbles: true }));
+            inputRef.current.focus();
+        }
+    };
+    var handleTouchStart = function (e) {
+        if (state === 'disabled') {
+            return;
+        }
+        setIsTouching(true);
+        changeSliderValue(e.changedTouches[0].clientX);
+        if (tooltipText) {
+            setIsTooltipVisible(true);
+        }
+        document.addEventListener('touchmove', handleTouchMove);
+        document.addEventListener('touchend', handleTouchEnd, { once: true });
+    };
+    var handleChange = function (e) {
+        if (trackRef.current === null || thumbRef.current === null) {
+            return;
+        }
+        var width = trackRef.current.getBoundingClientRect().width;
+        var thumbPosition = getThumbPositionOnTrack(Number(e.currentTarget.value) / (max - min), e.currentTarget.value, width);
+        updateFillTrackAndThumb(trackRef.current, thumbRef.current, thumbPosition);
+        if (onChange) {
+            onChange(e);
+        }
+    };
+    var handleClick = function (e) {
+        if (onClick) {
+            onClick(e);
+        }
+    };
+    var handleRangeRef = function (node) {
+        if (typeof ref === 'function') {
+            ref(node);
+        }
+        else {
+            ref && (ref.current = node);
+        }
+        inputRef.current = node;
+    };
+    return ((0, jsx_runtime_1.jsxs)(S_SliderBox, __assign({ "x-pds-name": "Slider", "x-pds-element-type": "component", "x-pds-device-type": "mobile" }, { children: [prefixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: prefixText, styleTheme: "caption2Bold", colorTheme: state === 'normal' ? 'sysTextSecondary' : 'sysTextTertiary', singleLineMode: "use", textAlign: "right" }, void 0), (0, jsx_runtime_1.jsx)(components_1.Spacing, { spacingType: "width", size: "spacing_b" }, void 0)] }, void 0)), (0, jsx_runtime_1.jsx)(S_SliderWrapper, __assign({ customWidth: customWidth, responsiveMode: responsiveMode }, { children: (0, jsx_runtime_1.jsxs)(S_Slider, __assign({ customWidth: customWidth, isDisabled: state === 'disabled', responsiveMode: responsiveMode, thumbPercentage: defaultThumbPercentage, onTouchStart: handleTouchStart }, { children: [(0, jsx_runtime_1.jsx)(S_Track, { ref: trackRef, thumbPercentage: defaultThumbPercentage, isDisabled: state === 'disabled' }, void 0), (0, jsx_runtime_1.jsxs)(S_Thumb, __assign({ ref: thumbRef, thumbPercentage: defaultThumbPercentage, isTouching: isTouching, isDisabled: state === 'disabled' }, { children: [(0, jsx_runtime_1.jsx)(S_Range, { ref: handleRangeRef, type: "range", name: name, min: min, max: max, step: step, defaultValue: defaultValue, onInput: handleChange, onClick: handleClick }, void 0), tooltipText && isTooltipVisible && ((0, jsx_runtime_1.jsx)(S_Tooltip, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: tooltipText, styleTheme: "caption2Regular", colorOverride: "ui_cpnt_textlabel_button_tooltip", singleLineMode: "use" }, void 0) }, void 0))] }), void 0)] }), void 0) }), void 0), suffixText && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { spacingType: "width", size: "spacing_b" }, void 0), (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: suffixText, styleTheme: "caption2Bold", colorTheme: state === 'normal' ? 'sysTextSecondary' : 'sysTextTertiary', singleLineMode: "use" }, void 0)] }, void 0))] }), void 0));
+}
+var S_SliderBox = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-direction: row;\n"], ["\n  align-items: center;\n  display: flex;\n  flex-direction: row;\n"])));
+var S_SliderWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  position: relative;\n  width: ", ";\n"], ["\n  display: flex;\n  position: relative;\n  width: ", ";\n"])), function (_a) {
+    var responsiveMode = _a.responsiveMode, customWidth = _a.customWidth;
+    if (customWidth) {
+        return customWidth;
+    }
+    if (responsiveMode === 'use') {
+        return '100%';
+    }
+    return '324px';
+});
+var S_Tooltip = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: ", ";\n  border-radius: 4px;\n  padding: ", ";\n  position: absolute;\n  top: -10px;\n  transform: translateY(-100%);\n"], ["\n  background-color: ", ";\n  border-radius: 4px;\n  padding: ", ";\n  position: absolute;\n  top: -10px;\n  transform: translateY(-100%);\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_button_tooltip_base;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.spacingA + " " + theme.spacing.spacingB;
+});
+var S_Slider = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  align-items: center;\n  cursor: ", ";\n  display: flex;\n  height: 20px;\n  width: ", ";\n"], ["\n  align-items: center;\n  cursor: ", ";\n  display: flex;\n  height: 20px;\n  width: ", ";\n"])), function (_a) {
+    var isDisabled = _a.isDisabled;
+    return (isDisabled ? 'auto' : 'pointer');
+}, function (_a) {
+    var responsiveMode = _a.responsiveMode, customWidth = _a.customWidth;
+    if (customWidth) {
+        return customWidth;
+    }
+    if (responsiveMode === 'use') {
+        return '100%';
+    }
+    return '324px';
+});
+var S_Track = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  background-image: ", ";\n  background-repeat: no-repeat;\n  background-size: ", ";\n  border-radius: 2px;\n  height: 4px;\n  position: absolute;\n  width: inherit;\n"], ["\n  background-color: ", ";\n  background-image: ", ";\n  background-repeat: no-repeat;\n  background-size: ", ";\n  border-radius: 2px;\n  height: 4px;\n  position: absolute;\n  width: inherit;\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.ui_cpnt_slider_track;
+}, function (_a) {
+    var theme = _a.theme, isDisabled = _a.isDisabled;
+    return isDisabled
+        ? "linear-gradient(" + theme.ui_cpnt_slider_track_disabled + ", " + theme.ui_cpnt_slider_track_disabled + ")"
+        : "linear-gradient(" + theme.ui_cpnt_slider_track_active + ", " + theme.ui_cpnt_slider_track_active + ")";
+}, function (_a) {
+    var thumbPercentage = _a.thumbPercentage;
+    return thumbPercentage + "% 100%";
+});
+var S_Thumb = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  background-color: ", ";\n  border-radius: 100%;\n  box-shadow: ", ";\n  display: flex;\n  height: 20px;\n  justify-content: center;\n  left: ", "%;\n  position: absolute;\n  transform: translateX(-10px);\n  width: 20px;\n"], ["\n  background-color: ", ";\n  border-radius: 100%;\n  box-shadow: ", ";\n  display: flex;\n  height: 20px;\n  justify-content: center;\n  left: ", "%;\n  position: absolute;\n  transform: translateX(-10px);\n  width: 20px;\n"])), function (_a) {
+    var theme = _a.theme, isDisabled = _a.isDisabled;
+    return isDisabled ? theme.ui_cpnt_slider_thumb_disabled : theme.ui_cpnt_slider_thumb_normal;
+}, function (_a) {
+    var theme = _a.theme, isTouching = _a.isTouching, isDisabled = _a.isDisabled;
+    return isTouching && !isDisabled ? "0 0 0 8px " + theme.ui_cpnt_slider_thumb_pressed_circle : 'none';
+}, function (_a) {
+    var thumbPercentage = _a.thumbPercentage;
+    return thumbPercentage;
+});
+var S_Range = styled_components_1.default.input(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  clip: rect(0 0 0 0);\n  height: 100%;\n  margin: 0;\n  outline: none;\n  position: absolute;\n  width: 100%;\n"], ["\n  clip: rect(0 0 0 0);\n  height: 100%;\n  margin: 0;\n  outline: none;\n  position: absolute;\n  width: 100%;\n"])));
+exports.default = (0, react_1.forwardRef)(Slider);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/dist/src/mobile/components/Slider/index.d.ts

@@ -0,0 +1 @@
+export { default as Slider } from './Slider';

package/dist/src/mobile/components/Slider/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Slider = void 0;
+var Slider_1 = require("./Slider");
+Object.defineProperty(exports, "Slider", { enumerable: true, get: function () { return __importDefault(Slider_1).default; } });

package/dist/src/mobile/components/index.d.ts

@@ -1,3 +1,4 @@
+import { BasicButtonGroup } from './BasicButtonGroup';
 import { BasicChatListItem } from './BasicChatListItem';
 import { BasicFormGroup } from './BasicFormGroup';
 import { BasicList } from './BasicList';
@@ -24,7 +25,9 @@ import { MobileHeaderBar } from './MobileHeaderBar';
 import { MobileTabBar } from './MobileTabBar';
 import { Radio } from './Radio';
 import { ReactionButton } from './ReactionButton';
+import { SegmentedButtonGroup } from './SegmentedButtonGroup';
 import { Select } from './Select';
+import { Slider } from './Slider';
 import { StatusBlock } from './StatusBlock';
 import { TextButton } from './TextButton';
 import { TextField } from './TextField';
@@ -32,4 +35,4 @@ import { TextLabel } from './TextLabel';
 import { UploadIconButton } from './UploadIconButton';
 import { UploadMainButton } from './UploadMainButton';
 import { UploadTextButton } from './UploadTextButton';
-export { BasicChatListItem, BasicFormGroup, BasicList, BasicListItem, BlogTextField, BodyTextGroup, Card, CardList, ChatBubbleListItem, ChatList, Checkbox, Chip, ContextMenu, ContextMenuItem, Dropdown, FloatingActionButton, HorizontalFormGroup, IconButton, ImageSlide, LottieReactionButton, MainButton, MobileAlertDialog, MobileHeaderBar, MobileTabBar, Radio, ReactionButton, Select, StatusBlock, TextButton, TextField, TextLabel, UploadIconButton, UploadMainButton, UploadTextButton };
+export { BasicButtonGroup, BasicChatListItem, BasicFormGroup, BasicList, BasicListItem, BlogTextField, BodyTextGroup, Card, CardList, ChatBubbleListItem, ChatList, Checkbox, Chip, ContextMenu, ContextMenuItem, Dropdown, FloatingActionButton, HorizontalFormGroup, IconButton, ImageSlide, LottieReactionButton, MainButton, MobileAlertDialog, MobileHeaderBar, MobileTabBar, Radio, ReactionButton, SegmentedButtonGroup, Select, Slider, StatusBlock, TextButton, TextField, TextLabel, UploadIconButton, UploadMainButton, UploadTextButton };

package/dist/src/mobile/components/index.js

@@ -1,6 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.UploadTextButton = exports.UploadMainButton = exports.UploadIconButton = exports.TextLabel = exports.TextField = exports.TextButton = exports.StatusBlock = exports.Select = exports.ReactionButton = exports.Radio = exports.MobileTabBar = exports.MobileHeaderBar = exports.MobileAlertDialog = exports.MainButton = exports.LottieReactionButton = exports.ImageSlide = exports.IconButton = exports.HorizontalFormGroup = exports.FloatingActionButton = exports.Dropdown = exports.ContextMenuItem = exports.ContextMenu = exports.Chip = exports.Checkbox = exports.ChatList = exports.ChatBubbleListItem = exports.CardList = exports.Card = exports.BodyTextGroup = exports.BlogTextField = exports.BasicListItem = exports.BasicList = exports.BasicFormGroup = exports.BasicChatListItem = void 0;
+exports.UploadTextButton = exports.UploadMainButton = exports.UploadIconButton = exports.TextLabel = exports.TextField = exports.TextButton = exports.StatusBlock = exports.Slider = exports.Select = exports.SegmentedButtonGroup = exports.ReactionButton = exports.Radio = exports.MobileTabBar = exports.MobileHeaderBar = exports.MobileAlertDialog = exports.MainButton = exports.LottieReactionButton = exports.ImageSlide = exports.IconButton = exports.HorizontalFormGroup = exports.FloatingActionButton = exports.Dropdown = exports.ContextMenuItem = exports.ContextMenu = exports.Chip = exports.Checkbox = exports.ChatList = exports.ChatBubbleListItem = exports.CardList = exports.Card = exports.BodyTextGroup = exports.BlogTextField = exports.BasicListItem = exports.BasicList = exports.BasicFormGroup = exports.BasicChatListItem = exports.BasicButtonGroup = void 0;
+var BasicButtonGroup_1 = require("./BasicButtonGroup");
+Object.defineProperty(exports, "BasicButtonGroup", { enumerable: true, get: function () { return BasicButtonGroup_1.BasicButtonGroup; } });
 var BasicChatListItem_1 = require("./BasicChatListItem");
 Object.defineProperty(exports, "BasicChatListItem", { enumerable: true, get: function () { return BasicChatListItem_1.BasicChatListItem; } });
 var BasicFormGroup_1 = require("./BasicFormGroup");
@@ -53,8 +55,12 @@ var Radio_1 = require("./Radio");
 Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return Radio_1.Radio; } });
 var ReactionButton_1 = require("./ReactionButton");
 Object.defineProperty(exports, "ReactionButton", { enumerable: true, get: function () { return ReactionButton_1.ReactionButton; } });
+var SegmentedButtonGroup_1 = require("./SegmentedButtonGroup");
+Object.defineProperty(exports, "SegmentedButtonGroup", { enumerable: true, get: function () { return SegmentedButtonGroup_1.SegmentedButtonGroup; } });
 var Select_1 = require("./Select");
 Object.defineProperty(exports, "Select", { enumerable: true, get: function () { return Select_1.Select; } });
+var Slider_1 = require("./Slider");
+Object.defineProperty(exports, "Slider", { enumerable: true, get: function () { return Slider_1.Slider; } });
 var StatusBlock_1 = require("./StatusBlock");
 Object.defineProperty(exports, "StatusBlock", { enumerable: true, get: function () { return StatusBlock_1.StatusBlock; } });
 var TextButton_1 = require("./TextButton");

package/dist/src/mobile/index.d.ts

@@ -9,5 +9,5 @@ export { ContainersBox as MPContainersBox } from './layout/LayoutMP/ContainersBo
 export { LayoutMS } from './layout/LayoutMS';
 export { NavigationContainer as MSNavigationContainer } from './layout/LayoutMS/Containers';
 export { ContainersBox as MSContainersBox } from './layout/LayoutMS/ContainersBox';
-export { BasicChatListItem as M_BasicChatListItem, BasicFormGroup as M_BasicFormGroup, BasicList as M_BasicList, BasicListItem as M_BasicListItem, BlogTextField as M_BlogTextField, BodyTextGroup as M_BodyTextGroup, Card as M_Card, CardList as M_CardList, ChatBubbleListItem as M_ChatBubbleListItem, ChatList as M_ChatList, Checkbox as M_Checkbox, Chip as M_Chip, ContextMenu as M_ContextMenu, ContextMenuItem as M_ContextMenuItem, Dropdown as M_Dropdown, FloatingActionButton as M_FloatingActionButton, HorizontalFormGroup as M_HorizontalFormGroup, IconButton as M_IconButton, ImageSlide as M_ImageSlide, LottieReactionButton as M_LottieReactionButton, MainButton as M_MainButton, MobileAlertDialog as M_MobileAlertDialog, MobileHeaderBar as M_MobileHeaderBar, MobileTabBar as M_MobileTabBar, Radio as M_Radio, ReactionButton as M_ReactionButton, Select as M_Select, StatusBlock as M_StatusBlock, TextButton as M_TextButton, TextField as M_TextField, TextLabel as M_TextLabel, UploadIconButton as M_UploadIconButton, UploadMainButton as M_UploadMainButton, UploadTextButton as M_UploadTextButton } from './components';
+export { BasicButtonGroup as M_BasicButtonGroup, BasicChatListItem as M_BasicChatListItem, BasicFormGroup as M_BasicFormGroup, BasicList as M_BasicList, BasicListItem as M_BasicListItem, BlogTextField as M_BlogTextField, BodyTextGroup as M_BodyTextGroup, Card as M_Card, CardList as M_CardList, ChatBubbleListItem as M_ChatBubbleListItem, ChatList as M_ChatList, Checkbox as M_Checkbox, Chip as M_Chip, ContextMenu as M_ContextMenu, ContextMenuItem as M_ContextMenuItem, Dropdown as M_Dropdown, FloatingActionButton as M_FloatingActionButton, HorizontalFormGroup as M_HorizontalFormGroup, IconButton as M_IconButton, ImageSlide as M_ImageSlide, LottieReactionButton as M_LottieReactionButton, MainButton as M_MainButton, MobileAlertDialog as M_MobileAlertDialog, MobileHeaderBar as M_MobileHeaderBar, MobileTabBar as M_MobileTabBar, Radio as M_Radio, ReactionButton as M_ReactionButton, SegmentedButtonGroup as M_SegmentedButtonGroup, Select as M_Select, Slider as M_Slider, StatusBlock as M_StatusBlock, TextButton as M_TextButton, TextField as M_TextField, TextLabel as M_TextLabel, UploadIconButton as M_UploadIconButton, UploadMainButton as M_UploadMainButton, UploadTextButton as M_UploadTextButton } from './components';
 export { AnnotationSheet as M_AnnotationSheet, ContentSheet as M_ContentSheet, MobileBasicModal as M_MobileBasicModal, SectionSheet as M_SectionSheet } from './panels';

package/dist/src/mobile/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.M_SectionSheet = exports.M_MobileBasicModal = exports.M_ContentSheet = exports.M_AnnotationSheet = exports.M_UploadTextButton = exports.M_UploadMainButton = exports.M_UploadIconButton = exports.M_TextLabel = exports.M_TextField = exports.M_TextButton = exports.M_StatusBlock = exports.M_Select = exports.M_ReactionButton = exports.M_Radio = exports.M_MobileTabBar = exports.M_MobileHeaderBar = exports.M_MobileAlertDialog = exports.M_MainButton = exports.M_LottieReactionButton = exports.M_ImageSlide = exports.M_IconButton = exports.M_HorizontalFormGroup = exports.M_FloatingActionButton = exports.M_Dropdown = exports.M_ContextMenuItem = exports.M_ContextMenu = exports.M_Chip = exports.M_Checkbox = exports.M_ChatList = exports.M_ChatBubbleListItem = exports.M_CardList = exports.M_Card = exports.M_BodyTextGroup = exports.M_BlogTextField = exports.M_BasicListItem = exports.M_BasicList = exports.M_BasicFormGroup = exports.M_BasicChatListItem = exports.MSContainersBox = exports.MSNavigationContainer = exports.LayoutMS = exports.MPContainersBox = exports.MPTabContainer = exports.MPNavigationContainer = exports.LayoutMP = exports.MMContainersBox = exports.MMNavigationContainer = exports.LayoutMM = exports.MFContainersBox = exports.LayoutMF = void 0;
+exports.M_AnnotationSheet = exports.M_UploadTextButton = exports.M_UploadMainButton = exports.M_UploadIconButton = exports.M_TextLabel = exports.M_TextField = exports.M_TextButton = exports.M_StatusBlock = exports.M_Slider = exports.M_Select = exports.M_SegmentedButtonGroup = exports.M_ReactionButton = exports.M_Radio = exports.M_MobileTabBar = exports.M_MobileHeaderBar = exports.M_MobileAlertDialog = exports.M_MainButton = exports.M_LottieReactionButton = exports.M_ImageSlide = exports.M_IconButton = exports.M_HorizontalFormGroup = exports.M_FloatingActionButton = exports.M_Dropdown = exports.M_ContextMenuItem = exports.M_ContextMenu = exports.M_Chip = exports.M_Checkbox = exports.M_ChatList = exports.M_ChatBubbleListItem = exports.M_CardList = exports.M_Card = exports.M_BodyTextGroup = exports.M_BlogTextField = exports.M_BasicListItem = exports.M_BasicList = exports.M_BasicFormGroup = exports.M_BasicChatListItem = exports.M_BasicButtonGroup = exports.MSContainersBox = exports.MSNavigationContainer = exports.LayoutMS = exports.MPContainersBox = exports.MPTabContainer = exports.MPNavigationContainer = exports.LayoutMP = exports.MMContainersBox = exports.MMNavigationContainer = exports.LayoutMM = exports.MFContainersBox = exports.LayoutMF = void 0;
+exports.M_SectionSheet = exports.M_MobileBasicModal = exports.M_ContentSheet = void 0;
 // layoutMF
 var LayoutMF_1 = require("./layout/LayoutMF");
 Object.defineProperty(exports, "LayoutMF", { enumerable: true, get: function () { return LayoutMF_1.LayoutMF; } });
@@ -30,6 +31,7 @@ var ContainersBox_4 = require("./layout/LayoutMS/ContainersBox");
 Object.defineProperty(exports, "MSContainersBox", { enumerable: true, get: function () { return ContainersBox_4.ContainersBox; } });
 // components
 var components_1 = require("./components");
+Object.defineProperty(exports, "M_BasicButtonGroup", { enumerable: true, get: function () { return components_1.BasicButtonGroup; } });
 Object.defineProperty(exports, "M_BasicChatListItem", { enumerable: true, get: function () { return components_1.BasicChatListItem; } });
 Object.defineProperty(exports, "M_BasicFormGroup", { enumerable: true, get: function () { return components_1.BasicFormGroup; } });
 Object.defineProperty(exports, "M_BasicList", { enumerable: true, get: function () { return components_1.BasicList; } });
@@ -56,7 +58,9 @@ Object.defineProperty(exports, "M_MobileHeaderBar", { enumerable: true, get: fun
 Object.defineProperty(exports, "M_MobileTabBar", { enumerable: true, get: function () { return components_1.MobileTabBar; } });
 Object.defineProperty(exports, "M_Radio", { enumerable: true, get: function () { return components_1.Radio; } });
 Object.defineProperty(exports, "M_ReactionButton", { enumerable: true, get: function () { return components_1.ReactionButton; } });
+Object.defineProperty(exports, "M_SegmentedButtonGroup", { enumerable: true, get: function () { return components_1.SegmentedButtonGroup; } });
 Object.defineProperty(exports, "M_Select", { enumerable: true, get: function () { return components_1.Select; } });
+Object.defineProperty(exports, "M_Slider", { enumerable: true, get: function () { return components_1.Slider; } });
 Object.defineProperty(exports, "M_StatusBlock", { enumerable: true, get: function () { return components_1.StatusBlock; } });
 Object.defineProperty(exports, "M_TextButton", { enumerable: true, get: function () { return components_1.TextButton; } });
 Object.defineProperty(exports, "M_TextField", { enumerable: true, get: function () { return components_1.TextField; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pds-dev-kit-web",
-  "version": "2.0.14",
+  "version": "2.1.0",
   "license": "MIT",
   "private": false,
   "main": "dist/index.js",

package/release-note.md

@@ -1,15 +1,10 @@
 # PDS-DEV-KIT-WEB Release Notes
-## [v2.0.14]
-## daily|https://design.storybook.publ.biz/
+## [v2.1.0]
+## release|https://design.storybook.publ.biz/
 
 ### components
-* Icon
-    * ic_dotted_circle line icon 추가
-* IconButton
-    * tooltip 기능 추가
-* TextField
-    * stepper 기능 추가 
-### layout
-* WSI_1 생성
-### Color
-* 컬러 키 값 23.06.21 18시 30분 기준 싱크
+* BasicButtonGroup 생성
+* Dropdown
+    * displayType prop 추가 (icon 활용 가능하게 업데이트)
+* SegmentedButtonGroup 생성
+* Slider 생성