@sellmate/design-system 0.0.35 → 0.0.36

package/dist/components/{p-BzdIpn5T.js → p-kLlPK7H2.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, F as Fragment } from './p-CbnL1UUF.js';
 import { T as TooltipArrow } from './p-wA4KCOG0.js';
-import { d as defineCustomElement$3 } from './p-CqpahWAy.js';
-import { d as defineCustomElement$2 } from './p-GNK9vrin.js';
+import { d as defineCustomElement$3 } from './p-DNEKh1qk.js';
+import { d as defineCustomElement$2 } from './p-InrZhOLL.js';
 import { d as defineCustomElement$1 } from './p-BG0UE2wL.js';
 
 const sdTooltipCss = "sd-tooltip [slot=content]{display:none}sd-tooltip .sd-tooltip{position:relative;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.sd-tooltip-menu{width:fit-content;padding:8px 16px;border-radius:4px;font-size:12px;position:relative;box-sizing:border-box;display:flex;align-items:start;justify-content:center;gap:12px}.sd-tooltip-menu--with-close{padding-right:12px !important}.sd-tooltip-menu__arrow{position:absolute;display:flex;width:9.6px;height:7.2px}.sd-tooltip-menu__arrow svg{width:100%;height:100%}.sd-tooltip-menu__arrow--top{bottom:-7.2px;left:50%;transform:translateX(-50%)}.sd-tooltip-menu__arrow--bottom{top:-7.2px;left:50%;transform:translateX(-50%) rotate(180deg)}.sd-tooltip-menu__arrow--left{right:-7.2px;top:50%;transform:translateY(-50%) rotate(-90deg)}.sd-tooltip-menu__arrow--right{left:-7.2px;top:50%;transform:translateY(-50%) rotate(90deg)}.sd-tooltip-menu__content{line-height:20px;font-weight:500}.sd-tooltip-menu__content p{margin:0}.sd-tooltip-menu__close-button{padding-top:4px;display:flex}.sd-tooltip-menu__close-button button{padding:0;background:none;border:none;cursor:pointer}";
@@ -116,6 +116,6 @@ function defineCustomElement() {
 }
 
 export { SdTooltip as S, defineCustomElement as d };
-//# sourceMappingURL=p-BzdIpn5T.js.map
+//# sourceMappingURL=p-kLlPK7H2.js.map
 
-//# sourceMappingURL=p-BzdIpn5T.js.map
+//# sourceMappingURL=p-kLlPK7H2.js.map

package/dist/components/{p-BzdIpn5T.js.map → p-kLlPK7H2.js.map}

@@ -1 +1 @@
-{"file":"p-BzdIpn5T.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["sd-tooltip {\n [slot='content'] {\n  display: none;\n }\n\n .sd-tooltip {\n  position: relative;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n }\n}\n\n.sd-tooltip-menu {\n width: fit-content;\n padding: 8px 16px;\n border-radius: 4px;\n font-size: 12px;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: start;\n justify-content: center;\n gap: 12px;\n\n &--with-close {\n  padding-right: 12px !important;\n }\n\n &__arrow {\n  position: absolute;\n  display: flex;\n  width: 9.6px;\n  height: 7.2px;\n  svg {\n   width: 100%;\n   height: 100%;\n  }\n  &--top {\n   bottom: -7.2px;\n   left: 50%;\n   transform: translateX(-50%);\n  }\n  &--bottom {\n   top: -7.2px;\n   left: 50%;\n   transform: translateX(-50%) rotate(180deg);\n  }\n  &--left {\n   right: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(-90deg);\n  }\n  &--right {\n   left: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(90deg);\n  }\n }\n\n &__content {\n  line-height: 20px;\n  font-weight: 500;\n\n  p {\n   margin: 0;\n  }\n }\n\n &__close-button {\n  padding-top: 4px;\n  display: flex;\n  button {\n   padding: 0;\n   background: none;\n   border: none;\n   cursor: pointer;\n  }\n }\n}\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\nimport { TooltipArrow } from '../assets/tooltipArrow';\n\n@Component({\n tag: 'sd-tooltip',\n styleUrl: 'sd-tooltip.scss',\n})\nexport class SdTooltip {\n @Element() el!: HTMLElement;\n\n @Prop() trigger: 'hover' | 'click' = 'hover';\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n @Prop() color: string = '#01BB4B';\n @Prop() type: 'default' | 'caution' | 'notice' | 'accent' = 'default';\n\n @Prop() icon: IconName = 'helpOutline';\n @Prop() iconSize: number = 12;\n\n @Prop() label: string = '';\n @Prop() buttonSize: ButtonSize = 'sm';\n @Prop() buttonVariant: ButtonVariant = 'primary';\n\n @Prop() noHover: boolean = true;\n\n @Prop() useClose: boolean = false;\n\n @State() showTooltip: boolean = false;\n @State() slotContent: HTMLElement | null = null;\n\n private static readonly COLOR_OF_TYPE = {\n  default: { background: 'oceanblue_85', text: 'white' },\n  caution: { background: 'red_20', text: 'red_70' },\n  notice: { background: 'orange_10', text: 'orange_65' },\n  accent: { background: 'brilliantblue_20', text: 'brilliantblue_75' },\n };\n\n private buttonEl?: HTMLStencilElement;\n\n private handleClose = () => {\n  this.showTooltip = false;\n };\n\n // 현재 tooltip popover가 조건부 렌더링이여서 초기 slot이 렌더링 되지 않은 시점에\n // 데이터 매핑에 실패 (light dom에 저장된 slot내용을 shadow dom을 찾지못해 매핑 실패)\n // 따라서 slot내용을 받은 후에 복제하여 state에 저장\n componentWillLoad() {\n  const contentEl = this.el.querySelector('[slot=\"content\"]');\n  if (contentEl) {\n   this.slotContent = contentEl.cloneNode(true) as HTMLElement;\n  }\n }\n\n render() {\n  const handleTrigger =\n   this.trigger === 'hover'\n    ? {\n       onMouseEnter: () => (this.showTooltip = true),\n       onMouseLeave: () => (this.showTooltip = false),\n      }\n    : {\n       onClick: () => (this.showTooltip = !this.showTooltip),\n      };\n\n  return (\n   <Fragment>\n    {this.label ? (\n     <sd-button\n      ref={el => (this.buttonEl = el)}\n      label={this.label}\n      icon={this.icon}\n      size={this.buttonSize}\n      color={this.color}\n      variant={this.buttonVariant}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-button>\n    ) : (\n     <sd-icon\n      ref={el => (this.buttonEl = el)}\n      name={this.icon}\n      size={this.iconSize}\n      color={this.color}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-icon>\n    )}\n\n    {this.showTooltip && (\n     <sd-tooltip-portal\n      parentRef={this.buttonEl}\n      onSdClose={() => this.handleClose()}\n      placement={this.placement}\n     >\n      <div\n       class={{\n        'sd-tooltip-menu': true,\n        [`sd-tooltip-menu--${this.type}`]: true,\n        [`sd-tooltip-menu--${this.placement}`]: true,\n        'sd-tooltip-menu--with-close': this.useClose,\n        [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n        [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,\n       }}\n      >\n       <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\n        <TooltipArrow\n         class={{\n          [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n         }}\n        ></TooltipArrow>\n       </i>\n\n       <div\n        class=\"sd-tooltip-menu__content\"\n        ref={el => {\n         if (el && this.slotContent && !el.hasChildNodes()) {\n          el.appendChild(this.slotContent.cloneNode(true));\n         }\n        }}\n       >\n        {!this.slotContent && <span>{this.el.textContent}</span>}\n       </div>\n\n       {this.useClose && (\n        <div class=\"sd-tooltip-menu__close-button\">\n         <button\n          type=\"button\"\n          aria-label=\"Close tooltip\"\n          title=\"Close tooltip\"\n          onClick={() => this.handleClose()}\n         >\n          <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\n         </button>\n        </div>\n       )}\n      </div>\n     </sd-tooltip-portal>\n    )}\n   </Fragment>\n  );\n }\n}\n"],"version":3}
+{"file":"p-kLlPK7H2.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/sd-tooltip/sd-tooltip.scss?tag=sd-tooltip","src/components/sd-tooltip/sd-tooltip.tsx"],"sourcesContent":["sd-tooltip {\n [slot='content'] {\n  display: none;\n }\n\n .sd-tooltip {\n  position: relative;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n }\n}\n\n.sd-tooltip-menu {\n width: fit-content;\n padding: 8px 16px;\n border-radius: 4px;\n font-size: 12px;\n position: relative;\n box-sizing: border-box;\n display: flex;\n align-items: start;\n justify-content: center;\n gap: 12px;\n\n &--with-close {\n  padding-right: 12px !important;\n }\n\n &__arrow {\n  position: absolute;\n  display: flex;\n  width: 9.6px;\n  height: 7.2px;\n  svg {\n   width: 100%;\n   height: 100%;\n  }\n  &--top {\n   bottom: -7.2px;\n   left: 50%;\n   transform: translateX(-50%);\n  }\n  &--bottom {\n   top: -7.2px;\n   left: 50%;\n   transform: translateX(-50%) rotate(180deg);\n  }\n  &--left {\n   right: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(-90deg);\n  }\n  &--right {\n   left: -7.2px;\n   top: 50%;\n   transform: translateY(-50%) rotate(90deg);\n  }\n }\n\n &__content {\n  line-height: 20px;\n  font-weight: 500;\n\n  p {\n   margin: 0;\n  }\n }\n\n &__close-button {\n  padding-top: 4px;\n  display: flex;\n  button {\n   padding: 0;\n   background: none;\n   border: none;\n   cursor: pointer;\n  }\n }\n}\n","import { Component, Element, Fragment, Prop, State, h } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport { ButtonSize, ButtonVariant } from '../sd-button/sd-button';\nimport { TooltipArrow } from '../assets/tooltipArrow';\n\n@Component({\n tag: 'sd-tooltip',\n styleUrl: 'sd-tooltip.scss',\n})\nexport class SdTooltip {\n @Element() el!: HTMLElement;\n\n @Prop() trigger: 'hover' | 'click' = 'hover';\n @Prop() placement: 'top' | 'bottom' | 'left' | 'right' = 'top';\n @Prop() color: string = '#01BB4B';\n @Prop() type: 'default' | 'caution' | 'notice' | 'accent' = 'default';\n\n @Prop() icon: IconName = 'helpOutline';\n @Prop() iconSize: number = 12;\n\n @Prop() label: string = '';\n @Prop() buttonSize: ButtonSize = 'sm';\n @Prop() buttonVariant: ButtonVariant = 'primary';\n\n @Prop() noHover: boolean = true;\n\n @Prop() useClose: boolean = false;\n\n @State() showTooltip: boolean = false;\n @State() slotContent: HTMLElement | null = null;\n\n private static readonly COLOR_OF_TYPE = {\n  default: { background: 'oceanblue_85', text: 'white' },\n  caution: { background: 'red_20', text: 'red_70' },\n  notice: { background: 'orange_10', text: 'orange_65' },\n  accent: { background: 'brilliantblue_20', text: 'brilliantblue_75' },\n };\n\n private buttonEl?: HTMLStencilElement;\n\n private handleClose = () => {\n  this.showTooltip = false;\n };\n\n // 현재 tooltip popover가 조건부 렌더링이여서 초기 slot이 렌더링 되지 않은 시점에\n // 데이터 매핑에 실패 (light dom에 저장된 slot내용을 shadow dom을 찾지못해 매핑 실패)\n // 따라서 slot내용을 받은 후에 복제하여 state에 저장\n componentWillLoad() {\n  const contentEl = this.el.querySelector('[slot=\"content\"]');\n  if (contentEl) {\n   this.slotContent = contentEl.cloneNode(true) as HTMLElement;\n  }\n }\n\n render() {\n  const handleTrigger =\n   this.trigger === 'hover'\n    ? {\n       onMouseEnter: () => (this.showTooltip = true),\n       onMouseLeave: () => (this.showTooltip = false),\n      }\n    : {\n       onClick: () => (this.showTooltip = !this.showTooltip),\n      };\n\n  return (\n   <Fragment>\n    {this.label ? (\n     <sd-button\n      ref={el => (this.buttonEl = el)}\n      label={this.label}\n      icon={this.icon}\n      size={this.buttonSize}\n      color={this.color}\n      variant={this.buttonVariant}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-button>\n    ) : (\n     <sd-icon\n      ref={el => (this.buttonEl = el)}\n      name={this.icon}\n      size={this.iconSize}\n      color={this.color}\n      class=\"sd-tooltip\"\n      {...handleTrigger}\n     ></sd-icon>\n    )}\n\n    {this.showTooltip && (\n     <sd-tooltip-portal\n      parentRef={this.buttonEl}\n      onSdClose={() => this.handleClose()}\n      placement={this.placement}\n     >\n      <div\n       class={{\n        'sd-tooltip-menu': true,\n        [`sd-tooltip-menu--${this.type}`]: true,\n        [`sd-tooltip-menu--${this.placement}`]: true,\n        'sd-tooltip-menu--with-close': this.useClose,\n        [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n        [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,\n       }}\n      >\n       <i class={`sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}`}>\n        <TooltipArrow\n         class={{\n          [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,\n         }}\n        ></TooltipArrow>\n       </i>\n\n       <div\n        class=\"sd-tooltip-menu__content\"\n        ref={el => {\n         if (el && this.slotContent && !el.hasChildNodes()) {\n          el.appendChild(this.slotContent.cloneNode(true));\n         }\n        }}\n       >\n        {!this.slotContent && <span>{this.el.textContent}</span>}\n       </div>\n\n       {this.useClose && (\n        <div class=\"sd-tooltip-menu__close-button\">\n         <button\n          type=\"button\"\n          aria-label=\"Close tooltip\"\n          title=\"Close tooltip\"\n          onClick={() => this.handleClose()}\n         >\n          <sd-icon name=\"close\" size=\"12\" color=\"#AAAAAA\"></sd-icon>\n         </button>\n        </div>\n       )}\n      </div>\n     </sd-tooltip-portal>\n    )}\n   </Fragment>\n  );\n }\n}\n"],"version":3}

package/dist/components/sd-badge.js

@@ -15,7 +15,7 @@ const SdBadge$1 = /*@__PURE__*/ proxyCustomElement(class SdBadge extends H {
     label = '';
     render() {
         const resolvedColor = resolveColor(this.color);
-        return (h(Host, { key: '0eb736c6520c69a3b46d7ace56cd49d33afeec81' }, h("div", { key: 'f321c100d3703be8ea3c60448233bc81c8f5c117', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, h("div", { key: 'f7970257ffcf0ad5bd90f7e5d0dbbfb18a35e535', class: "sd-badge__dot" }), h("div", { key: '117d13f51ff77d9d240c297bfd9a3251ad220d92', class: "sd-badge__label" }, this.label))));
+        return (h(Host, { key: '6fc1c113b707f4419fa48c8b4b78be6a7bbf6b83' }, h("div", { key: 'ab3297321ee0e6e742acd408901dce1b5894d200', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, h("div", { key: '02f42d0ba064db273d83671e9c271c543787daf8', class: "sd-badge__dot" }), h("div", { key: 'f6a175282ab77e9a8ac2098029ac1aab5cb66190', class: "sd-badge__label" }, this.label))));
     }
     static get style() { return sdBadgeCss; }
 }, [770, "sd-badge", {

package/dist/components/sd-button.js

@@ -1,4 +1,4 @@
-import { S as SdButton$1, d as defineCustomElement$1 } from './p-CqpahWAy.js';
+import { S as SdButton$1, d as defineCustomElement$1 } from './p-DNEKh1qk.js';
 
 const SdButton = SdButton$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-card.js

@@ -12,7 +12,7 @@ const SdCard$1 = /*@__PURE__*/ proxyCustomElement(class SdCard extends H {
     bordered = true;
     class = '';
     render() {
-        return (h(Host, { key: '42ba538ab9341ea02415932b7d9332571bbb13e7' }, h("div", { key: 'b1f7b23f18b070adb2f42eea1ccdf4bc2a5ab092', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, h("slot", { key: 'bcb88ca0c2916e6dce00f7b503e32f522245dc4c' }))));
+        return (h(Host, { key: 'f00cdc166da4589d81d732fb4bc84d0258efaccb' }, h("div", { key: 'c640a9db7ef09eee390ca0c0e8484a5802d17cbd', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, h("slot", { key: '07421b4249bf7a94aa1a574011b33f7082fa984a' }))));
     }
     static get style() { return sdCardCss; }
 }, [772, "sd-card", {

package/dist/components/sd-checkbox.js

@@ -1,4 +1,4 @@
-import { S as SdCheckbox$1, d as defineCustomElement$1 } from './p-Du8-vyL0.js';
+import { S as SdCheckbox$1, d as defineCustomElement$1 } from './p-DpcL5xdv.js';
 
 const SdCheckbox = SdCheckbox$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-date-picker.js

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
 import { u as useDatePicker, t as today } from './p-QZbqqKSO.js';
 import { d as defineCustomElement$5 } from './p-CVg_jkEo.js';
-import { d as defineCustomElement$4 } from './p-GNK9vrin.js';
-import { d as defineCustomElement$3 } from './p-ntW8MKYi.js';
-import { d as defineCustomElement$2 } from './p-BEq3cGoC.js';
+import { d as defineCustomElement$4 } from './p-InrZhOLL.js';
+import { d as defineCustomElement$3 } from './p-D7IsBL9J.js';
+import { d as defineCustomElement$2 } from './p-C075_t2h.js';
 
 const sdDatePickerCss = ".sd-date-picker.sc-sd-date-picker-h{width:160px;display:inline-block}.sd-date-picker__menu.sc-sd-date-picker{width:304px;box-sizing:border-box;border-radius:8px;padding:24px 19px;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.2);background:white}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker{display:flex;flex-flow:row nowrap;align-items:center;gap:20px;font-size:14px;padding:0 5px;height:24px;line-height:24px}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .year-nav.sc-sd-date-picker,.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .month-nav.sc-sd-date-picker{display:flex;flex-flow:row nowrap;align-items:center;gap:12px}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .year-nav.sc-sd-date-picker button.sc-sd-date-picker,.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .month-nav.sc-sd-date-picker button.sc-sd-date-picker{background:none;border:none;cursor:pointer;margin:0;padding:0}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .year-nav__current.sc-sd-date-picker{width:40px;text-align:center}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__header.sc-sd-date-picker .month-nav__current.sc-sd-date-picker{width:100px;text-align:center}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__days.sc-sd-date-picker{margin-top:8px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));column-gap:10px;padding:0 5px}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__days.sc-sd-date-picker .day.sc-sd-date-picker{width:28px;height:20px;font-size:12px;line-height:20px;text-align:center;color:#888888}.sd-date-picker__menu.sc-sd-date-picker .sd-date-picker__body.sc-sd-date-picker{margin-top:12px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr))}";
 
@@ -87,9 +87,9 @@ const SdDatePicker$1 = /*@__PURE__*/ proxyCustomElement(class SdDatePicker exten
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: '9f910fccd26ab417911edb655d63608045d5c41e', class: "sd-date-picker" }, h("sd-input", { key: '45a1a6ad305af7d47fe599baa4d037776db96150', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: '056414534f658c5e77fedf40d94e578299b437cc', class: "sd-date-picker" }, h("sd-input", { key: 'eb65e6bb246b604287088a3857681f2a18c06464', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: '16e1f67a61cd25816347f0bb8d89f402dbc1a203', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: 'f5fa53258f895e9c5052e9812e08a1175caddf4d', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '072a2ae86e666678581d35f3e357fe5b756646ff', class: "sd-date-picker__menu" }, h("div", { key: 'c81834631a65d4f3b91939748051b3687addaeed', class: "sd-date-picker__header" }, h("div", { key: '817d4e0279ac94ab83f0ca654f0cc57670457f2e', class: "year-nav" }, h("button", { key: '50c420fa3bc7f2959f66ca0f85aefaa404b19a9e', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: '33079e3ffd9d5d4152c88b57ce0ba37e6ab8ab41', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '93a7065db1490dc60585c94ab0bac376bce0180e', class: "year-nav__current" }, this.currentYear), h("button", { key: 'c16a36aa9a036789efb45dd957eec6e96b82d04c', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: '421b6366168d75c9e02eba4f3c7f207bbb42cb4d', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '3c9cebfb11efcf592f02ff007462ff13d332f7d3', class: "month-nav" }, h("button", { key: 'aa0ec3de458a3f0b0ac5f16c8a74a0caa8c9fb12', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: '7c5b1ddb7c3c0d77c6cc1037429ee1f9f3750854', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '2560f52cdc0d9200dfca89fac02e8ca8be0c57d5', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: 'f4245f1dbf538225f30221d2a51cf44bca9457bf', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: 'b2f721184bc7f863bd372e3fe2bdf57903324f8f', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: '0e9b74e1ef69dd639a883b762fa974659f9c544e', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: 'dcef9e0f8ee2a31c52c6807882c85a14aa03d1c3', class: "sd-date-picker__body" }, [
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'd71e7a84bef6b956e77fb7f718568e8d1df59562', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '0cb4ff03893ddf4a095760f326104d91bdb6265b', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '7a3bbe3f4cd379d94832005653aacc166e6b66cf', class: "sd-date-picker__menu" }, h("div", { key: '6b33cab1222e71e3004425b07afbdffef0ec0a6b', class: "sd-date-picker__header" }, h("div", { key: 'acc16c94cfea8399ce5d210de7286760238c0963', class: "year-nav" }, h("button", { key: '6f577329b27057306e163c0c92ae16eff29a15b4', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: 'c8174f406a3ba95d98ae31c6f4004f4178f6ac5f', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: 'cdcb96cd0fbf6abedcaaa7b5cca8a56c90b62284', class: "year-nav__current" }, this.currentYear), h("button", { key: '9aba8e6ebde34b7a29e52525cff8fbe8a243ae6a', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: '423d3b35b56f32006edfd0bdf6f457dd46a591b5', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: 'c5dd3a1b495e48c2c980207591f161486042c361', class: "month-nav" }, h("button", { key: '48265eec87bdb40c3189d07ef1711bf95bb55381', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: '7274e698f9c7a06369c8fe6064ec0acd9fce62c8', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '54e15aaad9ac9563f66a6bb4dc7b19f7dc01d7c0', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: '32da2302da74ef7bc8805138ce414b903d247878', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: '041809657b4288519ca476953be773403912c858', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: 'd32cd40e6df89c95f4b2639c6bc98f7156a09bc2', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: 'e6fafbf9ec82a8f3abe9d67c61279598498a7396', class: "sd-date-picker__body" }, [
             ...this.calendar.prevMonthDays,
             ...this.calendar.days,
             ...this.calendar.afterMonthDays,

package/dist/components/sd-date-range-picker.js

@@ -1,9 +1,9 @@
 import { p as proxyCustomElement, H, d as createEvent, h, F as Fragment, c as Host } from './p-CbnL1UUF.js';
 import { u as useDatePicker, t as today } from './p-QZbqqKSO.js';
 import { d as defineCustomElement$5 } from './p-CVg_jkEo.js';
-import { d as defineCustomElement$4 } from './p-GNK9vrin.js';
-import { d as defineCustomElement$3 } from './p-ntW8MKYi.js';
-import { d as defineCustomElement$2 } from './p-BEq3cGoC.js';
+import { d as defineCustomElement$4 } from './p-InrZhOLL.js';
+import { d as defineCustomElement$3 } from './p-D7IsBL9J.js';
+import { d as defineCustomElement$2 } from './p-C075_t2h.js';
 
 const addDays = (inputDate, days) => {
     const [year, month, day] = inputDate.split('-').map(Number);
@@ -162,9 +162,9 @@ const SdDateRangePicker$1 = /*@__PURE__*/ proxyCustomElement(class SdDateRangePi
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: '32819a4bb1098493ff7eeeb5c01f3d76e5b1bcbc', class: "sd-date-range-picker" }, h("sd-input", { key: '3ce75d2544e24fb09b6ed853f35295834ad48c0d', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: '9c7457b54e433a167193eeaafa8a0e7755ca24db', class: "sd-date-range-picker" }, h("sd-input", { key: '85b4c4fca2e6157ae7f6291593a20329086fe372', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'a38e381819ac1c469cfab99e8da3eca641d9dff5', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '05ea74ce59f9bfbe14404eea31a877fc007ab105', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: 'ec87b0e8dc56d880ad21f8bd233ba04b150bb6f0', class: "sd-date-range-picker__menu" }, h("div", { key: 'e6115593eef709220a1d0cf100b8896741b16553', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: 'a823d93eaf49bd691bf6e851056b5e2a95be3af9', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: 'ebfad0c30a3a6847eb7fc3420a41c421560a83b1', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: '4f65c1f3b510d7c527fcd61369046944186a101b', class: "header-label" }, this.prevYear), h("button", { key: '61d7903a7ee28d864f8d92dc6e79642ea5100660', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: '3a18bb2fc66635ac7313a533b484a339be121e41', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '579d6c2ec0866798b19f0bc2f5a3d23d1beea64a', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'e38b9dde8571369ff85bf10baff71437b0cf48f4', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '2f85011e2a47bb0717239da419fcd27c8410db81', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '21f147563f6ab7c9a1a2b08cf1951bb11a8a0302', class: "sd-date-range-picker__menu" }, h("div", { key: '2dad8cef33d07db263a73cd3760dbf44e33dd7ab', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: '53ccd475c6ebec5999158b2669878b0426e505d1', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: 'aba2465aae092388568006a7a968c27446476470', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: 'd4384c1901a5e5221d55a18e014c0955af561660', class: "header-label" }, this.prevYear), h("button", { key: '26f2e7f9da0f4571d4ca2cf0a668ceb4784af9c6', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: 'fc670a78e443dc7de8fbb05fe3233ae5bd6544d4', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: 'fb2157002f772dee6c4ff4b76cd3c942d4bb9965', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
             ? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
             : `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), h("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), h("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (h("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
                 this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: today ===

package/dist/components/sd-guide.js

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-CbnL1UUF.js';
 import { c as colors } from './p-BYf-ybt2.js';
-import { d as defineCustomElement$4 } from './p-CqpahWAy.js';
-import { d as defineCustomElement$3 } from './p-GNK9vrin.js';
-import { d as defineCustomElement$2 } from './p-BEq3cGoC.js';
+import { d as defineCustomElement$4 } from './p-DNEKh1qk.js';
+import { d as defineCustomElement$3 } from './p-InrZhOLL.js';
+import { d as defineCustomElement$2 } from './p-C075_t2h.js';
 
 const sdGuideCss = "@charset \"UTF-8\";.sd-button{text-decoration:none;cursor:pointer;border-radius:4px;transition:all 0.2s ease-in-out;position:relative;overflow:hidden;white-space:nowrap;-webkit-user-select:none;user-select:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.sd-button--xs{padding:0 8px;font-size:12px;font-weight:500;line-height:20px;min-height:24px}.sd-button--sm{padding:0 12px;font-size:12px;font-weight:500;line-height:20px;min-height:28px}.sd-button--md{padding:0 20px;font-size:16px;font-weight:500;line-height:26px;min-height:34px}.sd-button--lg{padding:0 28px;font-size:18px;font-weight:500;line-height:30px;min-height:62px}.sd-button--primary{background-color:var(--button-color);color:white;transition:filter 0.2s ease}.sd-button--primary::before{content:\"\";position:absolute;inset:0;background:#000000;opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--primary:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.25}.sd-button--outline{background:white;border:1px solid var(--button-color);color:var(--button-color)}.sd-button--outline::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--outline:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--outline .sd-button__content{position:relative;z-index:1}.sd-button--ghost{background-color:transparent;color:var(--button-color);border-color:transparent}.sd-button--ghost::before{content:\"\";position:absolute;inset:0;background:var(--button-color);opacity:0;transition:opacity 0.2s ease;z-index:0}.sd-button--ghost:hover:not(.sd-button--disabled):not(.sd-button--loading)::before{opacity:0.15}.sd-button--ghost .sd-button__content{position:relative;z-index:1}.sd-button--disabled{border:1px solid #cccccc;background:#e1e1e1;color:#888888;cursor:not-allowed !important}.sd-button--icon-only{padding:0;width:fit-content;height:fit-content;aspect-ratio:1/1}.sd-button--no-hover:hover::before{opacity:0 !important}.sd-button .sd-button__content{display:inline-flex;align-items:center;justify-content:center;gap:4px;z-index:1;font-weight:500}sd-guide{display:inline-block;height:fit-content}sd-guide .sd-guide{display:inline-block}sd-guide .sd-guide .sd-button{padding:0 16px 0 12px;border-radius:16px;color:#333333 !important;display:flex;align-items:center;transition:none}sd-guide .sd-guide .sd-button .sd-button__content{color:#333333 !important}sd-guide .sd-guide .sd-button .sd-button__content .sd-button__label{color:#333333 !important;margin-left:4px}sd-guide .sd-guide--active .sd-button{border:1px solid #12b553}sd-guide .sd-guide--active .sd-button .sd-button__content .sd-button__label{color:white !important}.sd-guide__popup{position:relative;padding:20px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.1);background:white}.sd-guide__popup>.sd-guide__popup__close{position:absolute;top:12px;right:12px}.sd-guide__popup__header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.sd-guide__popup__header .sd-guide__popup__title{margin-top:0;font-size:16px;font-weight:700;line-height:26px;color:#333333}.sd-guide__popup__list{width:100%;padding:0;margin:0}.sd-guide__popup__list__item{display:flex;width:100%;align-items:start;list-style:none;color:#333333;font-size:12px;font-weight:400}.sd-guide__popup__list__item p{width:100%;padding:0;margin:0;word-wrap:break-word;word-break:break-word;white-space:normal;overflow-wrap:break-word;min-width:0}.sd-guide__popup__list__item::before{display:block;content:\"-\";width:6px;color:#333333;font-size:12px;font-weight:400;margin-left:10px;margin-right:12px;flex-shrink:0}.sd-guide__popup__list__item--depth-2::before{content:\"•\"}.sd-guide__popup__list__item--depth-2{padding-left:26px}";
 
@@ -59,11 +59,11 @@ const SdGuide$1 = /*@__PURE__*/ proxyCustomElement(class SdGuide extends H {
     };
     render() {
         const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
-        return (h(Host, { key: '456a4ced90ec49ddf4969c1e9a87d68fc503355c', style: {
+        return (h(Host, { key: 'cc560b500dc857dd2fb9817d5f870e702cfe6420', style: {
                 '--sd-guide-color': GUIDE_ICON[this.type].color,
-            } }, h("sd-button", { key: '64e61ca7e8d475abac27191f6f7e2ee33d7b8bc8', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (h("sd-portal", { key: '6139d4b7436c3d90e1b0228e1d105a15be240b60', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: 'b83b58048bc943f28decd421eca8eca78cfb87fd', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, h("sd-button", { key: 'd5a27f011f1ef48f7b02cd1a12684a322b077dbf', class: "sd-guide__popup__close", icon: "close", color: colors.grey_65, size: "md", variant: "ghost", noHover: true,
+            } }, h("sd-button", { key: '4abbeb9eb5a021b790516ad6356ca61a8c81e30d', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (h("sd-portal", { key: 'acdee17ca7be22d52bbb7309430d3ce27bab8784', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: '8e7402bcf9308e9c3890a4ad55a54efe5f440c95', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, h("sd-button", { key: '05eb16594e9a2b16974e957988149114ac2bc0f9', class: "sd-guide__popup__close", icon: "close", color: colors.grey_65, size: "md", variant: "ghost", noHover: true,
             // buttonStyle={{ padding: '0px', minHeight: '0px' }}
-            onSdClick: this.closeDropdown }), h("div", { key: '400884e7c9d5bc84a21a45bb6eb8bf83974d65a6', class: "sd-guide__popup__header" }, h("sd-icon", { key: '87c70c74d58100ab13de6daa338760856b20bebe', name: "helpOutline", size: 24, color: colors.green_65 }), h("h3", { key: '1ac10ed9ddc9fad160df651e4f6df90929c75b96', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), h("ul", { key: '17aebdd0710223e0ddfe6502ebb14c74f3e6cdb2', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
+            onSdClick: this.closeDropdown }), h("div", { key: 'fc36f51b032fd41e63d53024f0714fbf974b37a3', class: "sd-guide__popup__header" }, h("sd-icon", { key: 'bb6a8005b45704029d7c8fdde7908d52c7fb2bd1', name: "helpOutline", size: 24, color: colors.green_65 }), h("h3", { key: 'bafff977e7a4c36515c035fc05074d5445a111bb', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), h("ul", { key: '1adafdaf539257ba4b61b958ef3a21362d5e44bf', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
     }
     // 현재 2depth까지만 스타일 적용
     renderListItem(message, depth = 0) {

package/dist/components/sd-icon.js

@@ -1,4 +1,4 @@
-import { S as SdIcon$1, d as defineCustomElement$1 } from './p-GNK9vrin.js';
+import { S as SdIcon$1, d as defineCustomElement$1 } from './p-InrZhOLL.js';
 
 const SdIcon = SdIcon$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-input.js

@@ -1,4 +1,4 @@
-import { S as SdInput$1, d as defineCustomElement$1 } from './p-ntW8MKYi.js';
+import { S as SdInput$1, d as defineCustomElement$1 } from './p-D7IsBL9J.js';
 
 const SdInput = SdInput$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-loading-spinner.js

@@ -1,4 +1,4 @@
-import { S as SdLoadingSpinner$1, d as defineCustomElement$1 } from './p-5yzkkdZ2.js';
+import { S as SdLoadingSpinner$1, d as defineCustomElement$1 } from './p-D2x4IHr5.js';
 
 const SdLoadingSpinner = SdLoadingSpinner$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-pagination.js

@@ -1,4 +1,4 @@
-import { S as SdPagination$1, d as defineCustomElement$1 } from './p-CSnKPDQz.js';
+import { S as SdPagination$1, d as defineCustomElement$1 } from './p-0B7EuAJt.js';
 
 const SdPagination = SdPagination$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-popover.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, F as Fragment } from './p-CbnL1UUF.js';
 import { T as TooltipArrow } from './p-wA4KCOG0.js';
-import { d as defineCustomElement$4 } from './p-CqpahWAy.js';
-import { d as defineCustomElement$3 } from './p-GNK9vrin.js';
+import { d as defineCustomElement$4 } from './p-DNEKh1qk.js';
+import { d as defineCustomElement$3 } from './p-InrZhOLL.js';
 import { d as defineCustomElement$2 } from './p-BG0UE2wL.js';
 
 const sdPopoverCss = ".sd-popover{position:relative;cursor:pointer;display:inline-block}";
@@ -44,11 +44,11 @@ const SdPopover$1 = /*@__PURE__*/ proxyCustomElement(class SdPopover extends H {
         this.showPopover = false;
     };
     render() {
-        return (h(Fragment, { key: 'c589194a99064c6d4dcba4a3041fabc86e629190' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '8ad8df3d02c2889a404366a7a1486ee001415423', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: 'a45f59c40dfbdbe3ad70ea4733459841ddbd6ca2', class: {
+        return (h(Fragment, { key: 'a58d208a0a9ba1e954568512f1dbe0df88922623' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '7ffbc49de8f33edbc05beec6cb554820bdbde2b6', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: 'fcf1b9069831494c3c2ee5e274037c211f342993', class: {
                 'sd-popover-menu': true,
                 [`sd-popover-menu--${this.placement}`]: true,
                 [this.menuClass]: !!this.menuClass,
-            } }, h("i", { key: '37666b148d9638512cdcf9880b4d4f928c617398', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '34801580a143b2a9a0e4fd2a754e3b7df84715bb' })), h("div", { key: 'f6ed764d4c50b2573188164f387df4ec4df04430', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: 'd038bbede4912070b58772daac3f264908c7b0ef', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: '0bc6407b1deb2fdc2194fe8b45af199c797ad9de', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '77f310b36aabbd66ed92cbf3caa9edf619875f0e', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: 'd48a8945ff2419ff4f45f62bddc4b56cccf608e2', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '821ce775843d2958b2288f7deba565b1b5aa4cda', name: "close", size: "12", color: "#AAAAAA" }))))))));
+            } }, h("i", { key: 'e1bd244e2c8c2e1c8a4759f96ce44e5cdda41bcc', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '36cf86a871f7454f2916ce8157e7d9234d808666' })), h("div", { key: '8fcd872f31d3dfcad2b8b7d26c7956368289d8cf', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: '435f956e668910900948999a2ae23a7ffbdf67cd', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: '80eaa27446106e6380712fb00ad9df4752ebb70b', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: 'b4845d8ac339559c2b612a219517a6addb47aaca', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: '56ab62d73d4e71d871165d28adf7ecd4efd92870', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: 'ea93c1a46baef7cb4b7a849b8744043afc11de79', name: "close", size: "12", color: "#AAAAAA" }))))))));
     }
     static get watchers() { return {
         "show": ["watchShowHandler"]

package/dist/components/sd-portal.js

@@ -1,4 +1,4 @@
-import { S as SdPortal$1, d as defineCustomElement$1 } from './p-BEq3cGoC.js';
+import { S as SdPortal$1, d as defineCustomElement$1 } from './p-C075_t2h.js';
 
 const SdPortal = SdPortal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-progress.js

@@ -22,10 +22,10 @@ const SdProgress$1 = /*@__PURE__*/ proxyCustomElement(class SdProgress extends H
         error: '#FB4444',
     };
     render() {
-        return (h(Host, { key: 'f086ff0b5357c038b83f8b8b457cd7aa3c99ba03', style: {
+        return (h(Host, { key: '5ac52da4809e45fc5bc69991aea3bd423b72ffdc', style: {
                 '--progress-color': this.statusColor[this.status],
                 '--progress-percentage': `${this.percentage}%`,
-            } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && h("div", { key: '2e8ce5a1fe1206f95f4268eaa571264f7daa7b8f', class: "sd-progress__label" }, this.label)));
+            } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && h("div", { key: '7758a60580ab05cd2dd396b16cc4483d890e0498', class: "sd-progress__label" }, this.label)));
     }
     renderBarProgress() {
         return (h("div", { class: `sd-progress__bar sd-progress__bar--${this.status}` }, h("div", { class: ['sd-progress__bar__percent', this.percentage < 100 ? 'proceed' : ''].join(' ') }), h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.percentage, "%"), h("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.percentage, "%")));

package/dist/components/sd-select-multiple-group.js

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, d as createEvent, h, c as Host, F as Fragment } from './p-CbnL1UUF.js';
 import { B as BaseDropdownEvent, S as SelectKeyboardNavigation } from './p-BvuTaRpn.js';
-import { d as defineCustomElement$6 } from './p-Du8-vyL0.js';
-import { d as defineCustomElement$5 } from './p-GNK9vrin.js';
-import { d as defineCustomElement$4 } from './p-ntW8MKYi.js';
-import { d as defineCustomElement$3 } from './p-BEq3cGoC.js';
-import { d as defineCustomElement$2 } from './p-B8lMIjWB.js';
+import { d as defineCustomElement$6 } from './p-DpcL5xdv.js';
+import { d as defineCustomElement$5 } from './p-InrZhOLL.js';
+import { d as defineCustomElement$4 } from './p-D7IsBL9J.js';
+import { d as defineCustomElement$3 } from './p-C075_t2h.js';
+import { d as defineCustomElement$2 } from './p-CzYhjjIE.js';
 
 const sdSelectMultipleGroupCss = ".sd-select-multiple-group__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple-group__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple-group__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple-group__dropdown::-webkit-scrollbar-track{background-color:transparent}sd-select-multiple-group{display:inline-block;height:fit-content}sd-select-multiple-group .sd-select-multiple-group{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white;color:#333333}sd-select-multiple-group .sd-select-multiple-group:hover:not(.sd-select-multiple-group--disabled){background:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__label{border-right:1px solid #cccccc}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger{color:#888888}sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-visible,sd-select-multiple-group .sd-select-multiple-group.sd-select-multiple-group--disabled .sd-select-multiple-group__trigger:focus-within{outline:none !important}sd-select-multiple-group .sd-select-multiple-group__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}sd-select-multiple-group .sd-select-multiple-group__container{position:relative;width:100%;display:flex}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__trigger .sd-select-multiple-group__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}sd-select-multiple-group .sd-select-multiple-group__container .sd-select-multiple-group__arrow--open{transform:rotate(180deg)}.sd-select-multiple-group__dropdown{width:var(--select-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container sd-input{width:100%}.sd-select-multiple-group__dropdown .sd-select-multiple-group__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple-group__dropdown .sd-select-multiple-group__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px}";
 

package/dist/components/sd-select-multiple.js

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
 import { B as BaseDropdownEvent, S as SelectKeyboardNavigation } from './p-BvuTaRpn.js';
-import { d as defineCustomElement$6 } from './p-Du8-vyL0.js';
-import { d as defineCustomElement$5 } from './p-GNK9vrin.js';
-import { d as defineCustomElement$4 } from './p-ntW8MKYi.js';
-import { d as defineCustomElement$3 } from './p-BEq3cGoC.js';
-import { d as defineCustomElement$2 } from './p-BEDQ2CIp.js';
+import { d as defineCustomElement$6 } from './p-DpcL5xdv.js';
+import { d as defineCustomElement$5 } from './p-InrZhOLL.js';
+import { d as defineCustomElement$4 } from './p-D7IsBL9J.js';
+import { d as defineCustomElement$3 } from './p-C075_t2h.js';
+import { d as defineCustomElement$2 } from './p-DTUSoHK4.js';
 
 const sdSelectMultipleCss = ".sd-select-multiple__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select-multiple__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select-multiple__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select-multiple__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select-multiple__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select-multiple__dropdown::-webkit-scrollbar-track{background-color:transparent}:host{display:inline-block;height:fit-content;position:relative}.sd-select-multiple{display:flex;flex-wrap:nowrap;width:var(--select-width, 200px);height:28px;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select-multiple:hover:not(.sd-select-multiple--disabled){background:#f6f6f6}.sd-select-multiple.sd-select-multiple--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__label{border-right:1px solid #cccccc}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger{color:#888888}.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-visible,.sd-select-multiple.sd-select-multiple--disabled .sd-select-multiple__trigger:focus-within{outline:none !important}.sd-select-multiple__label{font-size:12px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6}.sd-select-multiple__container{position:relative;width:100%;display:flex}.sd-select-multiple__container .sd-select-multiple__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400}.sd-select-multiple__container .sd-select-multiple__trigger .sd-select-multiple__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select-multiple__container .sd-select-multiple__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select-multiple__container .sd-select-multiple__arrow--open{transform:rotate(180deg)}.sd-select-multiple__dropdown{width:var(--select-dropdown-width, 200px);max-height:var(--select-dropdown-height, 260px);padding-bottom:2px;background-color:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);border-radius:4px;overflow-y:auto;color:#333333}.sd-select-multiple__dropdown .sd-select-multiple__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px;z-index:1}.sd-select-multiple__dropdown .sd-select-multiple__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select-multiple__dropdown .sd-select-multiple__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
 
@@ -220,11 +220,11 @@ const SdSelectMultiple$1 = /*@__PURE__*/ proxyCustomElement(class SdSelectMultip
             '--select-width': this.width || '200px',
             '--select-dropdown-height': this.dropdownHeight || '260px',
         };
-        return (h(Host, { key: '3c3cd8714a8d2a7e3f7ca5057c19b281488aa159', style: style }, h("div", { key: '877950e58b715002bb1976b11ead8abd41984534', class: {
+        return (h(Host, { key: '5dd79017c9796e6412984675fcd3ec2d03e32012', style: style }, h("div", { key: '777e5c8c777fb421c06ccc99ad114077918d3091', class: {
                 'sd-select-multiple': true,
                 'sd-select-multiple--open': this.isOpen,
                 'sd-select-multiple--disabled': this.disabled,
-            }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), h("div", { key: '2839ca7bfa830226ace0a32e8deb62c03f1feb62', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
+            }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), h("div", { key: '897dbc13dddd89e3bf3be9b77efe5aa04600ea1f', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
     }
     renderLabel(label) {
         if (!label)

package/dist/components/sd-select-option-group.js

@@ -1,4 +1,4 @@
-import { S as SdSelectOptionGroup$1, d as defineCustomElement$1 } from './p-B8lMIjWB.js';
+import { S as SdSelectOptionGroup$1, d as defineCustomElement$1 } from './p-CzYhjjIE.js';
 
 const SdSelectOptionGroup = SdSelectOptionGroup$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-select-option.js

@@ -1,4 +1,4 @@
-import { S as SdSelectOption$1, d as defineCustomElement$1 } from './p-BEDQ2CIp.js';
+import { S as SdSelectOption$1, d as defineCustomElement$1 } from './p-DTUSoHK4.js';
 
 const SdSelectOption = SdSelectOption$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-select.js

@@ -1,4 +1,4 @@
-import { S as SdSelect$1, d as defineCustomElement$1 } from './p-ybbnPl4X.js';
+import { S as SdSelect$1, d as defineCustomElement$1 } from './p-Ce6LhsfH.js';
 
 const SdSelect = SdSelect$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/sd-table-backup.js

@@ -1,17 +1,17 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-CbnL1UUF.js';
-import { d as defineCustomElement$c } from './p-CqpahWAy.js';
-import { d as defineCustomElement$b } from './p-Du8-vyL0.js';
-import { d as defineCustomElement$a } from './p-GNK9vrin.js';
-import { d as defineCustomElement$9 } from './p-ntW8MKYi.js';
-import { d as defineCustomElement$8 } from './p-5yzkkdZ2.js';
-import { d as defineCustomElement$7 } from './p-CSnKPDQz.js';
-import { d as defineCustomElement$6 } from './p-BEq3cGoC.js';
-import { d as defineCustomElement$5 } from './p-ybbnPl4X.js';
-import { d as defineCustomElement$4 } from './p-BEDQ2CIp.js';
-import { d as defineCustomElement$3 } from './p-BzdIpn5T.js';
+import { d as defineCustomElement$c } from './p-DNEKh1qk.js';
+import { d as defineCustomElement$b } from './p-DpcL5xdv.js';
+import { d as defineCustomElement$a } from './p-InrZhOLL.js';
+import { d as defineCustomElement$9 } from './p-D7IsBL9J.js';
+import { d as defineCustomElement$8 } from './p-D2x4IHr5.js';
+import { d as defineCustomElement$7 } from './p-0B7EuAJt.js';
+import { d as defineCustomElement$6 } from './p-C075_t2h.js';
+import { d as defineCustomElement$5 } from './p-Ce6LhsfH.js';
+import { d as defineCustomElement$4 } from './p-DTUSoHK4.js';
+import { d as defineCustomElement$3 } from './p-kLlPK7H2.js';
 import { d as defineCustomElement$2 } from './p-BG0UE2wL.js';
 
-const sdTableCss = ".sd-table__wrapper .sd-table__container .sd-table__middle{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:horizontal{height:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:vertical{width:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-track{background-color:transparent}.sd-table__wrapper{height:var(--table-height, auto);width:var(--table-width, 100%);color:#222222}.sd-table__wrapper .sd-table__container{width:100%;height:auto;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position;height:var(--table-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable td.sd-td--selected,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable th.sd-th--selected{width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-header thead{position:sticky;top:0;z-index:120}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-right{position:sticky;background-color:#f5faff;z-index:110 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-right{position:sticky;background-color:white;z-index:100 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-left{left:var(--sticky-left-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-right{right:var(--sticky-right-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-cell{position:sticky;z-index:102;background-color:#f5faff}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-cell{position:sticky;z-index:101;background-color:white}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge:after{content:\"\";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge:after{content:\"\";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead{opacity:0.4}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead tr th.sd-th{border-bottom:1px solid rgba(225, 225, 225, 0.4) !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-td,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-th,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table .sd-th__content--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead{height:36px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr{width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th{background:#f5faff;height:36px;padding:0 16px;font-weight:500;vertical-align:middle;border-bottom:1px solid #e1e1e1;-webkit-user-select:none;user-select:none;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th.sd-th .sd-th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:4px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th.sd-th .sd-th__content--left{justify-content:flex-start}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th.sd-th .sd-th__content--center{justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th.sd-th .sd-th__content--right{justify-content:flex-end}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead sd-tr sd-th.sd-th .sd-th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:16px;cursor:col-resize;z-index:3;border-left:1px solid #cccccc;border-right:1px solid #cccccc}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody .sd-table__loading{position:absolute;top:0;left:0;width:100%;height:calc(var(--table-height, auto) - 36px);min-height:calc(100% - 36px);background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody sd-tr:last-of-type sd-td{border-bottom:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody sd-tr sd-td{height:44px;padding:0 16px;border-bottom:1px solid #e1e1e1;background:white;vertical-align:middle}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody sd-tr sd-td.sd-td--left{text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody sd-tr sd-td.sd-td--center{text-align:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-tbody sd-tr sd-td.sd-td--right{text-align:right}.sd-table__wrapper .sd-table__container .sd-table__bottom{background:white;text-align:center}.sd-table__wrapper .sd-table__pagination{position:relative;background:#f9f9f9;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #e1e1e1;border-top:none;border-radius:8px}.sd-table__wrapper .sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}";
+const sdTableBackupCss = ".sd-table__wrapper .sd-table__container .sd-table__middle{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:horizontal{height:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:vertical{width:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-track{background-color:transparent}.sd-table__wrapper{height:var(--table-height, auto);width:var(--table-width, 100%);color:#222222}.sd-table__wrapper .sd-table__container{width:100%;height:auto;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;position:relative;will-change:scroll-position;height:var(--table-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table{background-color:white;display:table;width:100%;height:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable td.sd-td--selected,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable th.sd-th--selected{width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-header thead{position:sticky;top:0;z-index:120}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-right{position:sticky;background-color:#f5faff;z-index:110 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-right{position:sticky;background-color:white;z-index:100 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-left{left:var(--sticky-left-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-right{right:var(--sticky-right-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-cell{position:sticky;z-index:102;background-color:#f5faff}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-cell{position:sticky;z-index:101;background-color:white}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge:after{content:\"\";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge:after{content:\"\";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead{opacity:0.4}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead tr th.sd-th{border-bottom:1px solid rgba(225, 225, 225, 0.4) !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-td,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-th,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table .sd-th__content--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead{height:36px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr{width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th{background:#f5faff;height:36px;padding:0 16px;font-weight:500;vertical-align:middle;border-bottom:1px solid #e1e1e1;-webkit-user-select:none;user-select:none;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:4px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--left{justify-content:flex-start}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--center{justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--right{justify-content:flex-end}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:16px;cursor:col-resize;z-index:3;border-left:1px solid #cccccc;border-right:1px solid #cccccc}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody{flex-grow:1}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__loading{position:absolute;top:0;left:0;width:100%;height:100%;min-height:100%;background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__no-data-row td{text-align:center;color:#888888}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr:last-of-type td{border-bottom:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td{height:44px;padding:0 16px;border-bottom:1px solid #e1e1e1;background:white;vertical-align:middle}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--left{text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--center{text-align:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--right{text-align:right}.sd-table__wrapper .sd-table__container .sd-table__bottom{background:white;text-align:center}.sd-table__wrapper .sd-table__pagination{position:relative;background:#f9f9f9;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #e1e1e1;border-top:none;border-radius:8px}.sd-table__wrapper .sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}";
 
 const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
     constructor(registerHost) {
@@ -72,6 +72,9 @@ const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
         this.innerRows = [...(this.rows || [])];
         this.innerSelected = new Set(this.selected);
         this.columnWidths = (this.columns || []).map(c => parseInt(c.width || '120', 10));
+        if (this.pagination?.page) {
+            this.currentPage = this.pagination.page;
+        }
     }
     componentDidLoad() {
         // SSR 환경 체크
@@ -209,7 +212,7 @@ const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
             }, style: this.getStickyStyle(colIdx) }, h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, h("slot", { name: `header-cell-${col.name}` }, h("div", { class: "sd-th__content--label" }, col.label)), col.usePageMoveIcon && h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (h("sd-tooltip", { ...col.tooltipOptions }, h("div", { slot: "content" }, col.tooltip.map(text => (h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(colIdx, evt) }))))))));
     }
     renderBody() {
-        return (h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }) }, this.isLoading && (h("div", { class: "sd-table__loading" }, h("sd-loading-spinner", null))), !this.paginatedRows.length ? (h("tr", null, h("td", { colSpan: this.visibleColumns.length + (this.selectable ? 1 : 0) }, h("slot", { name: "no-data" }, this.noDataLabel)))) : (this.paginatedRows.map((row, rowIdx) => (h("tr", { key: row[this.rowKey], class: "hover:bg-Grey_Lighten-6" }, this.selectable && (h("td", { class: {
+        return (h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }) }, this.isLoading && (h("div", { class: "sd-table__loading" }, h("sd-loading-spinner", null))), !this.paginatedRows.length ? (h("tr", { class: "sd-table__no-data-row" }, h("td", { colSpan: this.visibleColumns.length + (this.selectable ? 1 : 0) }, h("slot", { name: "no-data" }, this.noDataLabel)))) : (this.paginatedRows.map((row, rowIdx) => (h("tr", { key: row[this.rowKey], class: "hover:bg-Grey_Lighten-6" }, this.selectable && (h("td", { class: {
                 'sd-td': true,
                 'sd-td--selected': true,
                 'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
@@ -231,10 +234,13 @@ const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
         })))))));
     }
     render() {
-        return (h(Host, { key: '0ac0006dea3c0e4cde082f8b396513234ac60749' }, h("div", { key: '36aa811fed020945b72ab21c9318a03c3595d0d2', class: "sd-table__wrapper", style: {
+        return (h(Host, { key: '06f553b40a89351df1054a07191d3fe9d92dd1a4' }, h("div", { key: 'cfd19ef986b2a839791dfc6dbe0998fa4268bcc8', class: "sd-table__wrapper", style: {
                 '--table-width': this.width,
                 '--table-height': this.height,
-            } }, h("div", { key: 'd785153b7c08bbe1250dcb389b66c624382bdfd2', class: "sd-table__container" }, h("div", { key: '034db5c0eb677a87d6fa3a84d824c6e5078676ea', class: "sd-table__middle" }, h("table", { key: '43841e0ed748a887156b3ba80038602ddb8fd207', part: "table", class: this.sdTableClasses }, this.renderHeader(), this.renderBody())), h("div", { key: '391f134001037c03a39f1c428681053aa8004a11', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (h("div", { key: '73e38e427afc2ff69fd5adea0057d30351ade0fc', class: "sd-table__pagination" }, h("sd-pagination", { key: '61e9c37239109c493d03d731bd0643670325cf97', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => {
+            } }, h("div", { key: 'ee2eb7c178fd4df207c096640f12061994340058', class: "sd-table__container" }, h("div", { key: 'fa2ca46bba403928152d9d087b3ec990615507d4', class: {
+                'sd-table__middle': true,
+                'sd-table__middle--loading': this.isLoading,
+            } }, h("table", { key: 'c5248468da6f986da45233ca86dcf68a53001cd6', part: "table", class: this.sdTableClasses }, this.renderHeader(), this.renderBody())), h("div", { key: 'd959e9785b3eab0a9e9864761c6377d561e6987c', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (h("div", { key: 'b592fee0e0747a34b3970e4ff7286afe37e79621', class: "sd-table__pagination" }, h("sd-pagination", { key: '05e7ed73d7beba2c14a4bcf07e8686a4d2cf664e', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => {
                 if (!this.useInternalPagination) {
                     this.sdPageChange.emit(e.detail);
                 }
@@ -242,7 +248,7 @@ const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
                     this.currentPage = e.detail;
                     this.sdPageChange.emit(this.currentPage);
                 }
-            } }), this.useRowsPerPageSelect && (h("sd-select", { key: 'ce5ea8221b621ab7f67558a2be228f473c22cca6', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
+            } }), this.useRowsPerPageSelect && (h("sd-select", { key: 'f0e4ad4e7ec0f857feac4fc669f5a523401120d6', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
                 const changedRowsPerPage = e.detail.value ? Number(e.detail.value) : 0;
                 if (!this.useInternalPagination) {
                     this.sdRowsPerPageChange.emit(changedRowsPerPage);
@@ -270,7 +276,7 @@ const SdTable = /*@__PURE__*/ proxyCustomElement(class SdTable extends H {
         "selected": ["handleSelectedChange"],
         "pagination": ["handlePaginationChange"]
     }; }
-    static get style() { return sdTableCss; }
+    static get style() { return sdTableBackupCss; }
 }, [772, "sd-table-backup", {
         "columns": [16],
         "rows": [1040],