@sellmate/design-system 1.26.1 → 1.27.0

package/dist/cjs/sd-action-modal.cjs.entry.js

@@ -1,16 +1,18 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
-var component_modal = require('./component.modal-BFelrSMx.js');
+var index = require('./index-BTqAmfdr.js');
+var component_modal = require('./component.modal-CrZe2db_.js');
+var component_overlay = require('./component.overlay-CBhFnzM2.js');
 
 const { modal } = component_modal.modalTokens;
 const action = modal.action;
+const overlayHeader = component_overlay.overlayTokens.overlay.header;
 const ACTION_MODAL_LAYOUT = {
     radius: Number(modal.radius),
     bg: modal.bg,
-    headerPaddingX: Number(action.header.paddingX),
-    headerPaddingY: Number(action.header.paddingY),
-    headerGap: Number(action.header.gap),
+    headerPaddingX: Number(overlayHeader.paddingX),
+    headerPaddingY: Number(overlayHeader.paddingY),
+    headerGap: Number(overlayHeader.gap),
     bodyPaddingX: Number(action.body.paddingX),
     bodyPaddingBottom: Number(action.body.paddingBottom),
     footerPaddingX: Number(action.footer.paddingX),
@@ -20,11 +22,11 @@ const ACTION_MODAL_LAYOUT = {
     footerBorder: action.footer.border,
 };
 const ACTION_MODAL_TITLE = {
-    color: action.title.color,
-    fontFamily: action.title.typography.fontFamily,
-    fontWeight: action.title.typography.fontWeight,
-    fontSize: Number(action.title.typography.fontSize),
-    lineHeight: Number(action.title.typography.lineHeight),
+    color: overlayHeader.title.color,
+    fontFamily: overlayHeader.title.typography.fontFamily,
+    fontWeight: overlayHeader.title.typography.fontWeight,
+    fontSize: Number(overlayHeader.title.typography.fontSize),
+    lineHeight: Number(overlayHeader.title.typography.lineHeight),
 };
 
 const sdActionModalCss = () => `sd-action-modal{display:block}sd-action-modal .sd-action-modal{position:relative;display:flex;flex-direction:column;width:fit-content;min-width:520px;border-radius:var(--sd-action-modal-radius);background:var(--sd-action-modal-bg);box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.2);overflow:hidden}sd-action-modal .sd-action-modal__header{display:flex;align-items:center;flex-shrink:0;gap:var(--sd-action-modal-header-gap);padding:var(--sd-action-modal-header-padding-y) calc(var(--sd-action-modal-header-padding-x) + 20px) var(--sd-action-modal-header-padding-y) var(--sd-action-modal-header-padding-x)}sd-action-modal .sd-action-modal__title{margin:0;color:var(--sd-action-modal-title-color);font-family:var(--sd-action-modal-title-font-family);font-weight:var(--sd-action-modal-title-font-weight);font-size:var(--sd-action-modal-title-font-size);line-height:var(--sd-action-modal-title-line-height);white-space:nowrap}sd-action-modal .sd-action-modal__header-sub{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px}sd-action-modal .sd-action-modal__header-sub:empty{display:none}sd-action-modal .sd-action-modal__close{position:absolute;top:16px;right:16px;cursor:pointer}sd-action-modal .sd-action-modal__body{flex:1 1 auto;min-height:0;padding:0 var(--sd-action-modal-body-padding-x) var(--sd-action-modal-body-padding-bottom);overflow:auto}sd-action-modal .sd-action-modal__footer{display:flex;align-items:center;justify-content:flex-end;flex-shrink:0;gap:var(--sd-action-modal-footer-gap);padding:var(--sd-action-modal-footer-padding-y) var(--sd-action-modal-footer-padding-x);background:var(--sd-action-modal-footer-bg);border-top:1px solid var(--sd-action-modal-footer-border)}sd-action-modal .sd-action-modal__footer-sub{flex:1 1 auto;display:flex;align-items:center;gap:8px;min-width:0}sd-action-modal .sd-action-modal__footer-sub:empty{display:none}`;

package/dist/cjs/sd-badge.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const badge = {
 	red: "#FB4444",

package/dist/cjs/sd-barcode-input.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var index$1 = require('./index-BUvXpPc3.js');
 var component_textinput = require('./component.textinput-Bb-nU5xI.js');
 

package/dist/cjs/{sd-button.config-eTAJM2iW.js → sd-button.config-BH7gFPmM.js}

@@ -90,8 +90,7 @@ const button = {
 			border: "#E30000",
 			content: "#E30000"
 		}
-	}
-};
+	}};
 var buttonTokens = {
 	button: button
 };

package/dist/cjs/sd-button_2.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
-var sdButton_config = require('./sd-button.config-eTAJM2iW.js');
+var index = require('./index-BTqAmfdr.js');
+var sdButton_config = require('./sd-button.config-BH7gFPmM.js');
 
 const Add = (props) => {
     const { size = 24, ...rest } = props;

package/dist/cjs/sd-calendar_2.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var useDatePicker = require('./useDatePicker-iMd6WToc.js');
 var sdDatePicker_config = require('./sd-date-picker.config-CtXmufyj.js');
 require('./component.datepicker-CUQbDSku.js');

package/dist/cjs/sd-callout.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
 
 const callout$1 = {

package/dist/cjs/sd-card.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const sdCardCss = () => `sd-card{display:block;height:fit-content}sd-card .sd-card{border-radius:8px;background:white}sd-card .sd-card--bordered{border:1px solid #E1E1E1}`;
 

package/dist/cjs/sd-checkbox.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const checkbox = {
 	size: "16",

package/dist/cjs/sd-chip-input.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var index$1 = require('./index-BUvXpPc3.js');
 var system = require('./system-MjrAugX-.js');
 var component_listItem = require('./component.listItem-Bnh0r_CA.js');

package/dist/cjs/sd-chip.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var sdChip_config = require('./sd-chip.config-DCNCzV8s.js');
 
 const sdChipCss = () => `sd-chip{display:inline-flex;width:fit-content;max-width:100%;height:fit-content}sd-chip .sd-chip{display:inline-flex;align-items:center;justify-content:center;gap:var(--sd-chip-gap);max-width:100%;height:var(--sd-chip-height);padding:0 var(--sd-chip-padding-x);border-radius:var(--sd-chip-radius);background:var(--sd-chip-bg);color:var(--sd-chip-content);border:var(--sd-chip-border-width) solid var(--sd-chip-border-color);font-family:var(--sd-chip-font-family);font-size:var(--sd-chip-font-size);font-weight:var(--sd-chip-font-weight);line-height:var(--sd-chip-line-height);box-sizing:border-box;white-space:nowrap;overflow:hidden;-webkit-user-select:none;user-select:none}sd-chip .sd-chip--editable:not(.sd-chip--focus){cursor:text}sd-chip .sd-chip--disabled{cursor:not-allowed;opacity:0.6}sd-chip .sd-chip__label{display:inline-flex;align-items:center;min-width:0;overflow:hidden;text-overflow:ellipsis}sd-chip .sd-chip__input{display:inline-block;min-width:1ch;outline:none;background:transparent;color:inherit;font:inherit;white-space:nowrap;cursor:text}sd-chip .sd-chip__input:empty::before{content:attr(data-placeholder);color:inherit;opacity:0.6;pointer-events:none}sd-chip .sd-chip__remove{flex-shrink:0}`;

package/dist/cjs/sd-circle-progress.cjs.entry.js

@@ -1,26 +1,16 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
-var component_progress = require('./component.progress-Bmg3vAAy.js');
+var index = require('./index-BTqAmfdr.js');
+var component_progress = require('./component.progress-DimGJZAd.js');
 var system = require('./system-MjrAugX-.js');
 
-const spinner = {
-	color: {
-		track: "#EEEEEE",
-		arc: "#2D8DFF"
-	}
-};
-var spinnerTokens = {
-	spinner: spinner
-};
-
 const CIRCLE_PROGRESS_LABEL_COLOR = component_progress.progressTokens.progress.color.label;
 const CIRCLE_PROGRESS_PERCENT_ZERO_COLOR = system.systemTokens.color.fg.tertiary;
 // TODO: error/complete 색상 및 inverse 흰색은 토큰 반영 후 교체
 const CIRCLE_PROGRESS_COLOR_MAP = {
     primary: {
-        arc: spinnerTokens.spinner.color.arc,
-        track: spinnerTokens.spinner.color.track,
+        arc: component_progress.progressTokens.progress.active.color,
+        track: component_progress.progressTokens.progress.color.track,
     },
     inverse: {
         arc: '#FFFFFF',
@@ -28,11 +18,11 @@ const CIRCLE_PROGRESS_COLOR_MAP = {
     },
     error: {
         arc: '#E30000',
-        track: spinnerTokens.spinner.color.track,
+        track: component_progress.progressTokens.progress.color.track,
     },
     complete: {
         arc: '#01BB4B',
-        track: spinnerTokens.spinner.color.track,
+        track: component_progress.progressTokens.progress.color.track,
     },
 };
 const CIRCLE_PROGRESS_VIEWBOX_SIZE = 80;

package/dist/cjs/sd-confirm-modal_2.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
-var component_modal = require('./component.modal-BFelrSMx.js');
+var component_modal = require('./component.modal-CrZe2db_.js');
 
 const CONFIRM_MODAL_DEFAULT_BUTTON = {
     positive: 'primary_md',

package/dist/cjs/sd-date-box.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const sdDateBoxCss = () => `.sd-date-box.sc-sd-date-box{display:flex;align-items:center;justify-content:center;width:38px;height:36px;font-size:14px;position:relative;box-sizing:border-box;text-align:center;transition:background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);border-radius:14px}.sd-date-box.sc-sd-date-box .sd-date-box__content.sc-sd-date-box{width:28px;height:28px;border-radius:14px;position:relative}.sd-date-box.sc-sd-date-box .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{position:relative;z-index:2;-webkit-user-select:none;user-select:none;line-height:28px}.sd-date-box.sd-date-box--disabled.sc-sd-date-box{color:#CCCCCC;cursor:default !important;pointer-events:none}.sd-date-box.sc-sd-date-box:not(.sd-date-box--disabled){color:#333333;cursor:pointer}.sd-date-box.sd-hoverable.sc-sd-date-box:hover .sd-date-box__content.sc-sd-date-box{background:#D9EAFF}.sd-date-box.sd-date-box--in-range.sc-sd-date-box:not(.sd-date-box--disabled) .sd-date-box__content.sc-sd-date-box::before{content:"";position:absolute;top:0;left:-5px;width:calc(100% + 10px);height:100%;background:#D9EAFF}.sd-date-box.sd-date-box--in-range.sd-date-box--type-start.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::before{left:auto !important;width:19px !important;right:-5px}.sd-date-box.sd-date-box--in-range.sd-date-box--type-end.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::before{width:19px !important}.sd-date-box.sd-date-box--in-range.sc-sd-date-box .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{font-weight:500}.sd-date-box.sd-date-box--selected.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-start.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-end.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::after{content:"";position:absolute;inset:0;background:#0075FF;border-radius:14px;z-index:1}.sd-date-box.sd-date-box--selected.sc-sd-date-box .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box,.sd-date-box.sd-date-box--type-start.sc-sd-date-box .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box,.sd-date-box.sd-date-box--type-end.sc-sd-date-box .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{color:white;font-weight:700}.sd-date-box.sd-date-box--start-date.sd-date-box--end-date.sc-sd-date-box .sd-date-box__content.sc-sd-date-box::before{display:none !important}.sd-date-box.sd-date-box--today.sc-sd-date-box:not(.sd-date-box--selected) .sd-date-box__content.sc-sd-date-box::after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:28px;height:28px;border:1px solid #E1E1E1 !important;border-radius:14px}`;
 

package/dist/cjs/sd-date-picker_7.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var index$1 = require('./index-BUvXpPc3.js');
 var sdDatePicker_config = require('./sd-date-picker.config-CtXmufyj.js');
 var component_textinput = require('./component.textinput-Bb-nU5xI.js');

package/dist/cjs/sd-date-range-picker-calendar.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var useDatePicker = require('./useDatePicker-iMd6WToc.js');
 var component_datepicker = require('./component.datepicker-CUQbDSku.js');
 

package/dist/cjs/sd-divider.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var system = require('./system-MjrAugX-.js');
 
 const DIVIDER_COLORS = {

package/dist/cjs/sd-dropdown-button.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
-var sdButton_config = require('./sd-button.config-eTAJM2iW.js');
+var sdButton_config = require('./sd-button.config-BH7gFPmM.js');
 var system = require('./system-MjrAugX-.js');
 
 class DropdownManager {

package/dist/cjs/sd-field_3.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var component_field = require('./component.field-YIQ9TAhV.js');
-var tooltipArrow = require('./tooltipArrow-VQq73W83.js');
+var tooltipArrow = require('./tooltipArrow-CiM3irtY.js');
 
 const FIELD_ADDON_ALIGN_MAP = {
     start: 'flex-start',

package/dist/cjs/sd-form.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const SdForm = class {
     constructor(hostRef) {

package/dist/cjs/sd-ghost-button_3.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const ghostButton = {
 	xxs: {
@@ -57,8 +57,7 @@ const ghostButton = {
 		hover: {
 			bg: "#FFFFFF"
 		}
-	}
-};
+	}};
 var ghostButtonTokens = {
 	ghostButton: ghostButton
 };

package/dist/cjs/sd-guide.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var system = require('./system-MjrAugX-.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
 

package/dist/cjs/sd-key-value-table.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var system = require('./system-MjrAugX-.js');
-var component_table = require('./component.table-DIxmbGBT.js');
+var component_table = require('./component.table-BrI3b--h.js');
 
 const t = component_table.tableTokens.table;
 const KEY_VALUE_TABLE_LAYOUT = {
@@ -10,7 +10,7 @@ const KEY_VALUE_TABLE_LAYOUT = {
     thWidth: 120,
     borderRadius: Number(t.radius),
     thPaddingX: Number(t.header.paddingX),
-    padding: Number(t.keyValue.body.padding),
+    padding: Number(t.keyValue.body.paddingY),
     helpIconSize: 16,
     requiredIconSize: 12,
     gap: Number(t.header.gap),

package/dist/cjs/sd-linear-progress.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
-var component_progress = require('./component.progress-Bmg3vAAy.js');
+var index = require('./index-BTqAmfdr.js');
+var component_progress = require('./component.progress-DimGJZAd.js');
 var system = require('./system-MjrAugX-.js');
 
 const LINEAR_PROGRESS_COLORS = {

package/dist/cjs/sd-loading-container.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const sdLoadingContainerCss = () => `sd-loading-container .sd-loading-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:var(--sd-loading-container-z-index, 999);opacity:0;visibility:hidden;transition:opacity 0.2s ease, visibility 0s linear 0.2s;pointer-events:none}sd-loading-container .sd-loading-container--visible{opacity:1;visibility:visible;transition:opacity 0.2s ease, visibility 0s linear 0s;pointer-events:auto}sd-loading-container .sd-loading-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4)}sd-loading-container .sd-loading-container__content{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px}sd-loading-container .sd-loading-container__message{margin:0;color:#ffffff;font-size:14px;font-weight:500;line-height:22px;text-align:center;max-width:400px;word-break:keep-all}`;
 

package/dist/cjs/sd-modal-container.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var modalStack = require('./modal-stack-DucFLON7.js');
 
 const sdModalContainerCss = () => `sd-modal-container{display:block}sd-modal-container .sd-modal-container{position:fixed;inset:0;z-index:var(--sd-modal-container-z-index, 997);pointer-events:none}sd-modal-container .sd-modal-container__layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}sd-modal-container .sd-modal-container__backdrop{position:absolute;inset:0;background:rgba(0, 0, 0, 0.4);opacity:0;transition:opacity 0.3s ease-out;pointer-events:none}sd-modal-container .sd-modal-container__backdrop--visible{opacity:1;pointer-events:auto}sd-modal-container .sd-modal-container__modal{position:relative;z-index:1;opacity:0;transform:scale(0);pointer-events:auto;transition:opacity 0.3s ease-out, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1)}sd-modal-container .sd-modal-container__modal--visible{opacity:1;transform:scale(1)}sd-modal-container .sd-modal-container__modal--shake{animation:modal-shake 0.3s ease-out}@keyframes modal-shake{0%,100%{transform:scale(1)}25%{transform:scale(1.03)}50%{transform:scale(0.97)}75%{transform:scale(1.01)}}`;

package/dist/cjs/sd-pagination_4.cjs.entry.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var constants = require('./constants-DJRV1upE.js');
-var sdTable_config = require('./sd-table.config-B7MuRLoR.js');
-require('./component.table-DIxmbGBT.js');
+var sdTable_config = require('./sd-table.config-DzC55sap.js');
+require('./component.table-BrI3b--h.js');
 require('./system-MjrAugX-.js');
 
 const pagination = {

package/dist/cjs/sd-popover.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
-var tooltipArrow = require('./tooltipArrow-VQq73W83.js');
+var index = require('./index-BTqAmfdr.js');
+var tooltipArrow = require('./tooltipArrow-CiM3irtY.js');
 
 const popover = {
 	"default": {

package/dist/cjs/sd-popup.cjs.entry.js

@@ -1,6 +1,7 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
+var component_overlay = require('./component.overlay-CBhFnzM2.js');
 var system = require('./system-MjrAugX-.js');
 
 const popup$1 = {
@@ -17,14 +18,7 @@ const popup$1 = {
 			fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
 			fontWeight: "700",
 			fontSize: "18",
-			lineHeight: "30"}
-	},
-	footer: {
-		bg: "#FFFFFF",
-		paddingX: "20",
-		paddingY: "8",
-		gap: "16"
-	},
+			lineHeight: "30"}},
 	bg: "#EEEEEE"
 };
 var popupTokens = {
@@ -32,6 +26,7 @@ var popupTokens = {
 };
 
 const { popup } = popupTokens;
+const { overlay } = component_overlay.overlayTokens;
 const shadowSpreadMd = system.systemTokens.shadow.spread.md;
 const POPUP_LAYOUT = {
     bodyBg: popup.bg,
@@ -54,10 +49,10 @@ const POPUP_HEADER = {
     paddingY: 10,
 };
 const POPUP_FOOTER = {
-    bg: popup.footer.bg,
-    paddingX: Number(popup.footer.paddingX),
-    paddingY: Number(popup.footer.paddingY),
-    gap: Number(popup.footer.gap),
+    bg: overlay.footer.bg.default,
+    paddingX: Number(overlay.footer.paddingX),
+    paddingY: Number(overlay.footer.paddingY),
+    gap: Number(overlay.footer.gap),
     height: 52,
     slotHeight: 36,
     shadow: `${shadowSpreadMd.x}px ${shadowSpreadMd.y}px ${shadowSpreadMd.blur}px ${shadowSpreadMd.spread}px ${shadowSpreadMd.color}`,

package/dist/cjs/sd-radio-button.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const radioButton = {
 	xs: {

package/dist/cjs/sd-radio.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const radio = {
 	size: "16",

package/dist/cjs/sd-select-list-item_2.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var sdSelect_config = require('./sd-select.config-C9Ohe1QA.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
 require('./component.listItem-Bnh0r_CA.js');

package/dist/cjs/sd-select_3.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var index$1 = require('./index-BUvXpPc3.js');
 var sdSelect_config = require('./sd-select.config-C9Ohe1QA.js');
 var sanitizeInlineHtml = require('./sanitize-inline-html-CRCAeQ46.js');
@@ -314,7 +314,7 @@ const SdSelect = class {
 };
 SdSelect.style = sdSelectCss();
 
-const sdSelectListboxCss = () => `:host{display:block}:host .sd-select-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}:host .sd-select-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}:host .sd-select-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
+const sdSelectListboxCss = () => `:host{display:block}:host .sd-select-listbox{display:flex;flex-direction:column;width:var(--listbox-trigger-width);max-width:var(--listbox-max-width);max-height:var(--listbox-max-height);border-radius:var(--listbox-radius);background:white;box-shadow:2px 2px 12px 2px rgba(0, 0, 0, 0.1);overflow:hidden;outline:none}:host .sd-select-listbox__list{flex:1;min-height:0;overflow-y:auto;padding-bottom:0}:host .sd-select-listbox__list::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}:host .sd-select-listbox__list::-webkit-scrollbar:horizontal{height:8px}:host .sd-select-listbox__list::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}:host .sd-select-listbox__list::-webkit-scrollbar-track{background-color:#E5E5E5}:host .sd-select-listbox__empty{padding:12px;text-align:center;font-size:12px;line-height:20px;color:#888888}`;
 
 const SdSelectListbox = class {
     constructor(hostRef) {

package/dist/cjs/sd-switch.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 var switchTokens = {
 	"switch": {

package/dist/cjs/sd-table.cjs.entry.js

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var constants = require('./constants-DJRV1upE.js');
-var sdTable_config = require('./sd-table.config-B7MuRLoR.js');
-require('./component.table-DIxmbGBT.js');
+var sdTable_config = require('./sd-table.config-DzC55sap.js');
+require('./component.table-BrI3b--h.js');
 require('./system-MjrAugX-.js');
 
 let urlAlphabet =
@@ -19,7 +19,7 @@ let nanoid = (size = 21) => {
   return id
 };
 
-const sdTableCss = () => `sd-table,:host{display:block;width:100%;height:var(--table-host-height);max-width:100%;min-width:0}sd-table *,:host *{box-sizing:border-box}.sd-table__container{height:100%;width:var(--table-width, 100%);max-width:100%;min-width:0;color:#222222;display:flex;flex-direction:column}.sd-table__wrapper{width:100%;min-width:0;height:calc(100% - var(--pagination-height, 0px));border:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);border-radius:var(--table-radius, 8px);overflow:hidden}.sd-table__wrapper--radius-useTop{border-radius:0 0 var(--table-radius, 8px) var(--table-radius, 8px)}.sd-table__wrapper--radius-full{border-radius:0}.sd-table__scroll-container{width:100%;height:100%;display:flex;flex-direction:column;position:relative;font-family:var(--table-body-font-family, inherit);font-weight:var(--table-body-font-weight, 400);font-size:var(--table-body-font-size, 12px);line-height:var(--table-body-line-height, 20px);text-decoration:var(--table-body-text-decoration, none);overflow:auto;background:#FFFFFF}.sd-table__scroll-container--loading{overflow:hidden !important;pointer-events:none}.sd-table__scroll-container--no-data{overflow:hidden;pointer-events:none}.sd-table__no-data{position:absolute;top:36px;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:var(--table-body-font-size, 12px);color:#888888;pointer-events:none;z-index:200;background:rgba(255, 255, 255, 0.6)}.sd-table__no-data-header-overlay{position:absolute;top:0;left:0;right:0;height:36px;background:rgba(255, 255, 255, 0.6);z-index:210;pointer-events:none}.sd-table__no-data-content{pointer-events:auto;min-height:60px;width:100%;display:flex;align-items:center;justify-content:center}.sd-table__loading{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center;pointer-events:none}.sd-table{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table--selectable sd-thead,.sd-table--selectable sd-tbody{--selectable:true}.sd-table--sticky-header sd-thead thead{position:sticky;top:0;z-index:120}.sd-table--sticky-column sd-thead,.sd-table--sticky-column sd-tbody{--sticky-column:true}.sd-table--scrolled-left sd-thead,.sd-table--scrolled-left sd-tbody{--scrolled-left:true}.sd-table--scrolled-right sd-thead,.sd-table--scrolled-right sd-tbody{--scrolled-right:true}.sd-table--resizable sd-thead{--resizable:true}.sd-table--no-data sd-thead{opacity:0.4}.sd-table__pagination{position:relative;background:#F9F9F9;height:48px;display:flex;align-items:center;justify-content:center;border:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);margin-top:-1px;border-radius:var(--table-radius, 8px)}.sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}`;
+const sdTableCss = () => `sd-table,:host{display:block;width:100%;height:var(--table-host-height);max-width:100%;min-width:0}sd-table *,:host *{box-sizing:border-box}.sd-table__container{height:100%;width:var(--table-width, 100%);max-width:100%;min-width:0;color:#222222;display:flex;flex-direction:column}.sd-table__wrapper{width:100%;min-width:0;height:calc(100% - var(--pagination-height, 0px));border:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);border-radius:var(--table-radius, 8px);overflow:hidden}.sd-table__wrapper--radius-useTop{border-radius:0 0 var(--table-radius, 8px) var(--table-radius, 8px)}.sd-table__wrapper--radius-full{border-radius:0}.sd-table__scroll-container{width:100%;height:100%;display:flex;flex-direction:column;position:relative;font-family:var(--table-body-font-family, inherit);font-weight:var(--table-body-font-weight, 400);font-size:var(--table-body-font-size, 12px);line-height:var(--table-body-line-height, 20px);text-decoration:var(--table-body-text-decoration, none);overflow:auto;background:#FFFFFF}.sd-table__scroll-container::-webkit-scrollbar{opacity:0;width:8px;background:#E5E5E5}.sd-table__scroll-container::-webkit-scrollbar:horizontal{height:8px}.sd-table__scroll-container::-webkit-scrollbar-thumb{height:80px;background-color:#CCCCCC;border-radius:4px}.sd-table__scroll-container::-webkit-scrollbar-track{background-color:#E5E5E5}.sd-table__scroll-container--loading{overflow:hidden !important;pointer-events:none}.sd-table__scroll-container--no-data{overflow:hidden;pointer-events:none}.sd-table__no-data{position:absolute;top:36px;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:var(--table-body-font-size, 12px);color:#888888;pointer-events:none;z-index:200;background:rgba(255, 255, 255, 0.6)}.sd-table__no-data-header-overlay{position:absolute;top:0;left:0;right:0;height:36px;background:rgba(255, 255, 255, 0.6);z-index:210;pointer-events:none}.sd-table__no-data-content{pointer-events:auto;min-height:60px;width:100%;display:flex;align-items:center;justify-content:center}.sd-table__loading{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center;pointer-events:none}.sd-table{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table--selectable sd-thead,.sd-table--selectable sd-tbody{--selectable:true}.sd-table--sticky-header sd-thead thead{position:sticky;top:0;z-index:120}.sd-table--sticky-column sd-thead,.sd-table--sticky-column sd-tbody{--sticky-column:true}.sd-table--scrolled-left sd-thead,.sd-table--scrolled-left sd-tbody{--scrolled-left:true}.sd-table--scrolled-right sd-thead,.sd-table--scrolled-right sd-tbody{--scrolled-right:true}.sd-table--resizable sd-thead{--resizable:true}.sd-table--no-data sd-thead{opacity:0.4}.sd-table__pagination{position:relative;background:#F9F9F9;height:48px;display:flex;align-items:center;justify-content:center;border:var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);margin-top:-1px;border-radius:var(--table-radius, 8px)}.sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}`;
 
 const SdTable = class {
     constructor(hostRef) {

package/dist/cjs/{sd-table.config-B7MuRLoR.js → sd-table.config-DzC55sap.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var component_table = require('./component.table-DIxmbGBT.js');
+var component_table = require('./component.table-BrI3b--h.js');
 var system = require('./system-MjrAugX-.js');
 
 // ── Header Tokens ──
@@ -33,8 +33,8 @@ const TABLE_BODY_LAYOUT = {
         height: component_table.tableTokens.table.body.dense.height,
         paddingY: component_table.tableTokens.table.body.dense.paddingY,
     },
-    paddingX: component_table.tableTokens.table.body.paddingX,
-    framePadding: component_table.tableTokens.table.body.frame.padding,
+    paddingX: component_table.tableTokens.table.body.paddingX.default,
+    framePadding: component_table.tableTokens.table.body.paddingX.frame,
 };
 const TABLE_BODY_TYPOGRAPHY = {
     fontFamily: component_table.tableTokens.table.body.typography.fontFamily,

package/dist/cjs/sd-tabs.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const tab = {
 	main: {

package/dist/cjs/sd-td.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 var constants = require('./constants-DJRV1upE.js');
 
 const sdTdCss = () => `sd-td *{box-sizing:border-box}sd-td{display:contents}sd-td.align-left{text-align:left}sd-td.align-center{text-align:center}sd-td.align-right{text-align:right}`;

package/dist/cjs/sd-text-link.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const textLink = {
 	sm: {
@@ -69,8 +69,7 @@ const textLink = {
 		},
 		gap: "8",
 		icon: "20"
-	}
-};
+	}};
 var textLinkTokens = {
 	textLink: textLink
 };

package/dist/cjs/sd-toast-container.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const DEFAULT_DURATION = 4000;
 const DEFAULT_MAX_VISIBLE = 3;

package/dist/cjs/sd-toast.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const toast = {
 	icon: "16",

package/dist/cjs/sd-toggle.cjs.entry.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const toggle = {
 	height: "28",
@@ -30,8 +30,7 @@ const toggle = {
 		hover: "#FFFFFF",
 		select: "#0075FF",
 		disabled: "#888888"
-	}
-};
+	}};
 var toggleTokens = {
 	toggle: toggle
 };

package/dist/cjs/{tooltipArrow-VQq73W83.js → tooltipArrow-CiM3irtY.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BuaQW9U4.js');
+var index = require('./index-BTqAmfdr.js');
 
 const TooltipArrow = (props) => (index.h("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, index.h("path", { d: "M8.83205 10.7519C8.43623 11.3457 7.56377 11.3457 7.16795 10.7519L1.04907e-06 -1.39876e-06L16 0L8.83205 10.7519Z", fill: "currentColor" })));