@sellmate/design-system 0.0.52 → 0.0.53

package/hydrate/index.js

@@ -2,9 +2,100 @@
 
 var stream = require('stream');
 
+// src/app-data/index.ts
+var BUILD = {
+  allRenderFn: false,
+  element: true,
+  event: true,
+  hasRenderFn: true,
+  hostListener: true,
+  hostListenerTargetWindow: true,
+  hostListenerTargetDocument: true,
+  hostListenerTargetBody: true,
+  hostListenerTargetParent: false,
+  hostListenerTarget: true,
+  member: true,
+  method: true,
+  mode: true,
+  observeAttribute: true,
+  prop: true,
+  propMutable: true,
+  reflect: true,
+  scoped: true,
+  shadowDom: true,
+  slot: true,
+  cssAnnotations: true,
+  state: true,
+  style: true,
+  formAssociated: false,
+  svg: true,
+  updatable: true,
+  vdomAttribute: true,
+  vdomXlink: true,
+  vdomClass: true,
+  vdomFunctional: true,
+  vdomKey: true,
+  vdomListener: true,
+  vdomRef: true,
+  vdomPropOrAttr: true,
+  vdomRender: true,
+  vdomStyle: true,
+  vdomText: true,
+  propChangeCallback: true,
+  taskQueue: true,
+  hotModuleReplacement: false,
+  isDebug: false,
+  isDev: false,
+  isTesting: false,
+  hydrateServerSide: false,
+  hydrateClientSide: false,
+  lifecycleDOMEvents: false,
+  lazyLoad: false,
+  profile: false,
+  slotRelocation: true,
+  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
+  appendChildSlotFix: false,
+  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
+  cloneNodeFix: false,
+  hydratedAttribute: false,
+  hydratedClass: true,
+  // TODO(STENCIL-1305): remove this option
+  scriptDataOpts: false,
+  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
+  scopedSlotTextContentFix: false,
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
+  shadowDomShim: false,
+  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
+  slotChildNodesFix: false,
+  invisiblePrehydration: true,
+  propBoolean: true,
+  propNumber: true,
+  propString: true,
+  constructableCSS: true,
+  devTools: false,
+  shadowDelegatesFocus: true,
+  initializeNextTick: false,
+  asyncLoading: true,
+  asyncQueue: false,
+  // TODO: deprecated in favour of `setTagTransformer` and `transformTag`. Remove in 5.0
+  transformTagName: false,
+  attachStyles: true,
+  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
+  experimentalSlotFixes: false
+};
+var Env = {};
+var NAMESPACE = (
+  /* default */
+  "app"
+);
+
 const modeResolutionChain = [];
 
 function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResults, $stencilAfterHydrate, $stencilHydrateResolve) {
+  var everywhere;
+  try { everywhere = global || globalThis; } 
+  catch (e) { everywhere = window || globalThis; }
+
   var globalThis = $stencilWindow;
   var self = $stencilWindow;
   var top = $stencilWindow;
@@ -130,7 +221,7 @@ const NAMESPACE = 'design-system';
 const BUILD = /* design-system */ { hydratedSelectorName: "hydrated", slotRelocation: true, state: true, updatable: true};
 
 /*
- Stencil Hydrate Platform v4.38.3 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.39.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -644,6 +735,9 @@ var attachStyles = (hostRef) => {
 };
 var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
 var h = (nodeName, vnodeData, ...children) => {
+  if (typeof nodeName === "string") {
+    nodeName = transformTag(nodeName);
+  }
   let child = null;
   let key = null;
   let slotName = null;
@@ -800,7 +894,7 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
     const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
     const node = childRenderNode.$elm$;
     if (!shadowRoot) {
-      node["s-hn"] = tagName.toUpperCase();
+      node["s-hn"] = transformTag(tagName).toUpperCase();
       if (childRenderNode.$tag$ === "slot") {
         node["s-cr"] = hostElm["s-cr"];
       }
@@ -2778,6 +2872,9 @@ var getHostListenerTarget = (doc, elm, flags) => {
   return elm;
 };
 var hostListenerOpts = (flags) => (flags & 2 /* Capture */) !== 0;
+function transformTag(tag) {
+  return tag;
+}
 
 // src/runtime/vdom/vdom-annotations.ts
 var insertVdomAnnotations = (doc, staticComponents) => {
@@ -3335,9 +3432,15 @@ var isMemberInElement = (elm, memberName) => {
 var registerComponents = (Cstrs) => {
   for (const Cstr of Cstrs) {
     const exportName = Cstr.cmpMeta.$tagName$;
+    const transformedTagName = everywhere.tagTransform(exportName);
     cmpModules.set(exportName, {
       [exportName]: Cstr
     });
+    if (transformedTagName !== exportName) {
+      cmpModules.set(transformedTagName, {
+        [transformedTagName]: Cstr
+      });
+    }
   }
 };
 var win = window;
@@ -3680,7 +3783,7 @@ function resolveColor(input, fallback = '#025497') {
     return mapped || input;
 }
 
-const sdBadgeCss = ".sd-badge.sc-sd-badge{display:inline-flex;align-items:center;justify-content:center}.sd-badge.sc-sd-badge .sd-badge__dot.sc-sd-badge{background:var(--sd-badge-color, #0075ff)}.sd-badge.sc-sd-badge .sd-badge__label.sc-sd-badge{margin-left:8px;font-size:12px;font-weight:500;line-height:20px;color:#333333}.sd-badge--sm.sc-sd-badge .sd-badge__dot.sc-sd-badge{width:4px;height:4px;min-width:4px;min-height:4px;border-radius:2px}.sd-badge--md.sc-sd-badge .sd-badge__dot.sc-sd-badge{width:8px;height:8px;min-width:8px;min-height:8px;border-radius:4px}";
+const sdBadgeCss = () => `.sd-badge.sc-sd-badge{display:inline-flex;align-items:center;justify-content:center}.sd-badge.sc-sd-badge .sd-badge__dot.sc-sd-badge{background:var(--sd-badge-color, #0075ff)}.sd-badge.sc-sd-badge .sd-badge__label.sc-sd-badge{margin-left:8px;font-size:12px;font-weight:500;line-height:20px;color:#333333}.sd-badge--sm.sc-sd-badge .sd-badge__dot.sc-sd-badge{width:4px;height:4px;min-width:4px;min-height:4px;border-radius:2px}.sd-badge--md.sc-sd-badge .sd-badge__dot.sc-sd-badge{width:8px;height:8px;min-width:8px;min-height:8px;border-radius:4px}`;
 
 class SdBadge {
     constructor(hostRef) {
@@ -3691,9 +3794,9 @@ class SdBadge {
     label = '';
     render() {
         const resolvedColor = resolveColor(this.color);
-        return (hAsync(Host, { key: '2599667a6e14485cc9aeb5cb7f9f8c2fa6be9730' }, hAsync("div", { key: '411c02845794514d4ae7c0849e4e9479bfce257b', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: '72c8fe5094b0c8dc4065dd0646200c052cd7cfca', class: "sd-badge__dot" }), hAsync("div", { key: 'e9e338154b11ba92b32a748d11d09899fad29442', class: "sd-badge__label" }, this.label))));
+        return (hAsync(Host, { key: '3e165b8e2f95b48fb1e80173a3e30c87d5da29db' }, hAsync("div", { key: '6bb4a29f27dd191881a5764b347db47511718c3a', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, hAsync("div", { key: 'f766cbca2d033075ef6d1c15bec084e2bfa7aec2', class: "sd-badge__dot" }), hAsync("div", { key: '07f2de048fa03232d1dcee43bf389f95cd691c06', class: "sd-badge__label" }, this.label))));
     }
-    static get style() { return sdBadgeCss; }
+    static get style() { return sdBadgeCss(); }
     static get cmpMeta() { return {
         "$flags$": 770,
         "$tagName$": "sd-badge",
@@ -3708,7 +3811,7 @@ class SdBadge {
     }; }
 }
 
-const sdButtonCss = "sd-button{display:inline-block;width:fit-content;height:fit-content}.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}";
+const sdButtonCss = () => `sd-button{display:inline-block;width:fit-content;height:fit-content}.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}`;
 
 const ICON_SIZES = {
     xs: 12,
@@ -3765,7 +3868,7 @@ class SdButton {
         const resolvedColor = resolveColor(this.color);
         return (hAsync(Host, { key: 'b30c8006e2f187fb971bcd47f8ce4a91d1dc47a6', style: { '--button-color': resolvedColor } }, hAsync("button", { key: 'f494c93fc0b9d55537b468f5c6458569df962633', class: `${buttonClasses} ${this.class}`, type: this.type, disabled: this.disabled, onClick: this.handleClick }, hAsync("div", { key: '7d64a6526baeac8569cccc60d9befacef3e3777d', class: "sd-button__content" }, this.icon && (hAsync("sd-icon", { key: '9439e9456783aa5b057d383252a6b0c45a44b588', class: "sd-button__icon sd-button__icon--left", name: this.icon, size: this.iconSize ? this.iconSize : ICON_SIZES[this.size], color: this.iconColor ? this.iconColor : this.variant === 'primary' ? '#fff' : resolvedColor })), this.label && hAsync("div", { key: '324371a6f8864c444cda39e7b349b4c9ec19b7f6', class: "sd-button__label" }, this.label), this.iconRight && (hAsync("sd-icon", { key: '733790ceda6e1822c71911b17e66f527936b15a2', class: "sd-button__icon sd-button__icon--right", name: this.iconRight, size: ICON_SIZES[this.size], color: this.variant === 'primary' ? '#fff' : resolvedColor }))))));
     }
-    static get style() { return sdButtonCss; }
+    static get style() { return sdButtonCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-button",
@@ -3789,7 +3892,7 @@ class SdButton {
     }; }
 }
 
-const sdCardCss = "sd-card{display:block;height:fit-content}sd-card .sd-card{border-radius:8px;background:white}sd-card .sd-card.sd-card--bordered{border:1px solid #e1e1e1}";
+const sdCardCss = () => `sd-card{display:block;height:fit-content}sd-card .sd-card{border-radius:8px;background:white}sd-card .sd-card.sd-card--bordered{border:1px solid #e1e1e1}`;
 
 class SdCard {
     constructor(hostRef) {
@@ -3798,9 +3901,9 @@ class SdCard {
     bordered = true;
     class = '';
     render() {
-        return (hAsync(Host, { key: 'f19b796cbe69bb22165a52864cf0eef7c8afeac1' }, hAsync("div", { key: '2a6272608b5fca143883d477ddb7f8fdb60acb0d', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, hAsync("slot", { key: '60f687272faa536e182e9a65ea0c07a233194bd8' }))));
+        return (hAsync(Host, { key: '4a44b9ef84a83b91879dabaa099a21b499baad2c' }, hAsync("div", { key: 'cb8499ddef896bf1e2ba753dd4b0a35f41f7e39f', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, hAsync("slot", { key: 'e7d6f9ffa8ad8d5061471a6e8cbeb5c4d5d5f2b4' }))));
     }
-    static get style() { return sdCardCss; }
+    static get style() { return sdCardCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-card",
@@ -3814,7 +3917,7 @@ class SdCard {
     }; }
 }
 
-const sdCheckboxCss = "sd-checkbox{display:inline-block;height:20px;line-height:0}sd-checkbox .sd-checkbox{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px}sd-checkbox .sd-checkbox>input{display:none}sd-checkbox .sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg,sd-checkbox .sd-checkbox:hover.sd-checkbox--indeterminate .sd-checkbox__bg{border-color:#005cc9;background:#005cc9}sd-checkbox .sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg{border:1px solid #0075ff;background:#d9eaff}sd-checkbox .sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg{border:1px solid transparent;background:#eeeeee}sd-checkbox .sd-checkbox__bg{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}sd-checkbox .sd-checkbox__label{font-size:12px;color:#333333;line-height:20px}sd-checkbox .sd-checkbox--checked.sd-checkbox--disabled .sd-checkbox__bg,sd-checkbox .sd-checkbox--indeterminate.sd-checkbox--disabled .sd-checkbox__bg{background:#eeeeee;border:1px solid #cccccc !important}sd-checkbox .sd-checkbox--checked .sd-checkbox__bg,sd-checkbox .sd-checkbox--indeterminate .sd-checkbox__bg{border:1px solid #0075ff;background:#0075ff}sd-checkbox .sd-checkbox--unchecked .sd-checkbox__bg{background:white}sd-checkbox .sd-checkbox--disabled{cursor:not-allowed}sd-checkbox .sd-checkbox--disabled .sd-checkbox__bg{background:#eeeeee;border:1px solid #cccccc !important}";
+const sdCheckboxCss = () => `sd-checkbox{display:inline-block;height:20px;line-height:0}sd-checkbox .sd-checkbox{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px;max-height:20px}sd-checkbox .sd-checkbox>input{display:none}sd-checkbox .sd-checkbox:hover.sd-checkbox--checked .sd-checkbox__bg,sd-checkbox .sd-checkbox:hover.sd-checkbox--indeterminate .sd-checkbox__bg{border-color:#005cc9;background:#005cc9}sd-checkbox .sd-checkbox:hover.sd-checkbox--unchecked .sd-checkbox__bg{border:1px solid #0075ff;background:#d9eaff}sd-checkbox .sd-checkbox:hover.sd-checkbox--disabled .sd-checkbox__bg{border:1px solid transparent;background:#eeeeee}sd-checkbox .sd-checkbox__bg{width:16px;height:16px;border-radius:2px;border:1px solid #888888;box-sizing:border-box;display:inline-flex;justify-content:center;align-items:center;overflow:hidden;line-height:0}sd-checkbox .sd-checkbox__label{font-size:12px;color:#333333;line-height:20px}sd-checkbox .sd-checkbox--checked.sd-checkbox--disabled .sd-checkbox__bg,sd-checkbox .sd-checkbox--indeterminate.sd-checkbox--disabled .sd-checkbox__bg{background:#eeeeee;border:1px solid #cccccc !important}sd-checkbox .sd-checkbox--checked .sd-checkbox__bg,sd-checkbox .sd-checkbox--indeterminate .sd-checkbox__bg{border:1px solid #0075ff;background:#0075ff}sd-checkbox .sd-checkbox--unchecked .sd-checkbox__bg{background:white}sd-checkbox .sd-checkbox--disabled{cursor:not-allowed}sd-checkbox .sd-checkbox--disabled .sd-checkbox__bg{background:#eeeeee;border:1px solid #cccccc !important}`;
 
 class SdCheckbox {
     constructor(hostRef) {
@@ -3893,7 +3996,7 @@ class SdCheckbox {
     static get watchers() { return {
         "checked": ["watchValueHandler"]
     }; }
-    static get style() { return sdCheckboxCss; }
+    static get style() { return sdCheckboxCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-checkbox",
@@ -3910,7 +4013,7 @@ class SdCheckbox {
     }; }
 }
 
-const sdDateBoxCss = ".sd-date-box.sc-sd-date-box-h{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-h .sd-date-box__content.sc-sd-date-box{width:28px;height:28px;border-radius:14px;position:relative}.sd-date-box.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{position:relative;z-index:2;user-select:none;line-height:28px}.sd-date-box.sd-date-box--disabled.sc-sd-date-box-h{color:#cccccc;cursor:default !important;pointer-events:none}.sd-date-box.sc-sd-date-box-h:not(.sd-date-box--disabled){cursor:pointer}.sd-date-box.sd-hoverable.sc-sd-date-box-h:hover .sd-date-box__content.sc-sd-date-box{background:#d9eaff}.sd-date-box.sd-date-box--in-range.sc-sd-date-box-h: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-h .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-h .sd-date-box__content.sc-sd-date-box::before{width:19px !important}.sd-date-box.sd-date-box--selected.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-start.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-end.sc-sd-date-box-h .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-h .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-h .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-h .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--today.sc-sd-date-box-h: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}";
+const sdDateBoxCss = () => `.sd-date-box.sc-sd-date-box-h{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-h .sd-date-box__content.sc-sd-date-box{width:28px;height:28px;border-radius:14px;position:relative}.sd-date-box.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box .sd-date-box__label.sc-sd-date-box{position:relative;z-index:2;user-select:none;line-height:28px}.sd-date-box.sd-date-box--disabled.sc-sd-date-box-h{color:#cccccc;cursor:default !important;pointer-events:none}.sd-date-box.sc-sd-date-box-h:not(.sd-date-box--disabled){cursor:pointer}.sd-date-box.sd-hoverable.sc-sd-date-box-h:hover .sd-date-box__content.sc-sd-date-box{background:#d9eaff}.sd-date-box.sd-date-box--in-range.sc-sd-date-box-h: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-h .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-h .sd-date-box__content.sc-sd-date-box::before{width:19px !important}.sd-date-box.sd-date-box--selected.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-start.sc-sd-date-box-h .sd-date-box__content.sc-sd-date-box::after,.sd-date-box.sd-date-box--type-end.sc-sd-date-box-h .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-h .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-h .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-h .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--today.sc-sd-date-box-h: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}`;
 
 class SdDateBox {
     constructor(hostRef) {
@@ -3954,7 +4057,7 @@ class SdDateBox {
                 'sd-date-box--type-end': this.type === 'end',
             }, onClick: () => this.handleClickDate(), onMouseOver: () => this.handleHoverDate() }, hAsync("div", { key: 'c2c7dcc9b384e8d000d8803fa4e4a5fcc1f2e527', class: "sd-date-box__content" }, hAsync("div", { key: '7c002c5356d9c3fcf8ec0c8f751e97fd42e59645', class: "sd-date-box__label" }, this.date))));
     }
-    static get style() { return sdDateBoxCss; }
+    static get style() { return sdDateBoxCss(); }
     static get cmpMeta() { return {
         "$flags$": 770,
         "$tagName$": "sd-date-box",
@@ -4030,7 +4133,7 @@ const useDatePicker = () => {
     return { formatDate, createCalendar, calculateYearMonth };
 };
 
-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))}";
+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))}`;
 
 class SdDatePicker {
     constructor(hostRef) {
@@ -4109,7 +4212,7 @@ class SdDatePicker {
         this.isOpen = false;
     };
     render() {
-        return (hAsync(Host, { key: '6f835c6778d618a0285dc070c43022e4787e9eb6', class: "sd-date-picker" }, hAsync("sd-input", { key: '9d09bd679c1c239ad6106464b9b6b2bd2fd164cc', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: 'd3790bf739adeef7b381e983bb7426e8684b9e66', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '6e6833f13a1ec4083f06b09ebc61e378e47599cf', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: 'd6b36f1a26904a8287bcb3b3d64981a0f628a911', class: "sd-date-picker__menu" }, hAsync("div", { key: '37b9795686360b719b69a9a385a7e4bf27c217e5', class: "sd-date-picker__header" }, hAsync("div", { key: 'c885554693c93eddb3d1148e12ca8610f23625a4', class: "year-nav" }, hAsync("button", { key: '8628fca079f02183aaf07f953ebcf9e4141060f3', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: '3597f373c01ff11b4dcc97e692cedc31bcd8d548', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: 'ed71145dc3a34b8ae491088f65ea43b4cd0acec3', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: 'b1bbd644e7ff7bb8141758e3b897c93f5d2c1a38', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: '5a55e81f9e01f3acb73bbb7b6c6f4034430ad2a4', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '1e95092fd966e7d8c2480fd8823e8886a141c83b', class: "month-nav" }, hAsync("button", { key: 'e49b6e1528ff2f814e021fb70a7df0425f0efb11', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: '4d0e61ccb0fcf006d11b48acff31593c95426acd', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '8eacea2970a8b9f2963f4afd3f0e7aa4ee2bdca9', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: 'd209068e6b0e244b572c42cdc5a3ece8ed4be0fa', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: 'a067b7c5e59ae9b32f1e13e1a80b49055b451a80', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: 'c99e6a24b1113f5c78d17586a9491053e23ee053', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: '9e243d5edf78f0fd606e787b714ae993c549b828', class: "sd-date-picker__body" }, [
+        return (hAsync(Host, { key: 'b60ea48c6ea76b984c48040b32c83358ab7776df', class: "sd-date-picker" }, hAsync("sd-input", { key: 'a55a5d6b0e752081e919fa317761a9529b58b75c', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", onClick: () => this.openMenu() }, hAsync("sd-icon", { key: '707f8c0a38a72651581228d1ac887bd38fbb33b0', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '4fb84ae1246c05546dc063abfce4d89e2440c8ff', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: 'c8dae2a875b66cb90a2de898fb5588e4429e01a2', class: "sd-date-picker__menu" }, hAsync("div", { key: '35d9d132bb2e68156c12019cb9ca20eaef7cd5dc', class: "sd-date-picker__header" }, hAsync("div", { key: '327bb3fe00fb31c4ec9fde79bc6984fe176462c9', class: "year-nav" }, hAsync("button", { key: '4e67fe3d237cb864e9d5cbf3d4ace942ac8f02cc', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, hAsync("sd-icon", { key: 'd97729c331c93fe122b51ee2dee4f4b9ddf70ad8', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '8c75d30528776992327504b05688cacbcab513d3', class: "year-nav__current" }, this.currentYear), hAsync("button", { key: '5f4c36b216ab1230719998e0d8a00bba59fd49bd', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, hAsync("sd-icon", { key: '79b2a3efdbac3f4fe32105ddaf77e023bdb7ac43', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: 'b8d141899f9ad45f4b16e376d78e181f710e28df', class: "month-nav" }, hAsync("button", { key: '07b81a1875dab96062d32129a58efcf50c11b660', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, hAsync("sd-icon", { key: 'b5447e3e134cda07140c1d6e2708a97cc87e2b32', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("span", { key: '4161405b68aa5166423974167a455fa411891272', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), hAsync("button", { key: '3fd84295b94f92ff0fbb8347ffb03c4d5d20423c', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, hAsync("sd-icon", { key: 'c9879eb2a25d727cc76f538b974588ca19a3f85e', name: "arrowRight", size: "12", color: "#CCCCCC" })))), hAsync("div", { key: '3030bd477ec7b4f4aae9e36b33962dad48492c9a', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("div", { key: day, class: "day" }, day)))), hAsync("div", { key: 'e384b514d1fe0cca98935d0e5ad272291421eb34', class: "sd-date-picker__body" }, [
             ...this.calendar.prevMonthDays,
             ...this.calendar.days,
             ...this.calendar.afterMonthDays,
@@ -4120,7 +4223,7 @@ class SdDatePicker {
                     : undefined }));
         })))))));
     }
-    static get style() { return sdDatePickerCss; }
+    static get style() { return sdDatePickerCss(); }
     static get cmpMeta() { return {
         "$flags$": 770,
         "$tagName$": "sd-date-picker",
@@ -4140,7 +4243,7 @@ class SdDatePicker {
     }; }
 }
 
-const sdDateRangePickerCss = ".sd-date-range-picker.sc-sd-date-range-picker-h{width:210px;display:inline-block}.sd-date-range-picker__menu.sc-sd-date-range-picker{width:609px;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-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker{margin-bottom:16px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker .header-label.sc-sd-date-range-picker{margin:0 12px;width:40px;text-align:center;font-size:14px;line-height:24px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker{display:flex;flex-flow:row nowrap;align-items:stretch;gap:19px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker{width:266px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker{width:100%;height:24px;line-height:24px;font-size:14px;text-align:center;position:relative;padding:0 5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.sc-sd-date-range-picker{position:absolute;top:50%;transform:translateY(-50%)}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-prev.sc-sd-date-range-picker{left:5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-next.sc-sd-date-range-picker{right:5px;left:auto}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker{padding:0 5px;margin-top:8px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));column-gap:10px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker .day.sc-sd-date-range-picker{width:28px;height:20px;font-size:12px;line-height:20px;text-align:center;color:#888888}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-body.sc-sd-date-range-picker{margin-top:12px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr))}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .separator.sc-sd-date-range-picker{width:1px;background-color:#d8d8d8}";
+const sdDateRangePickerCss = () => `.sd-date-range-picker.sc-sd-date-range-picker-h{width:210px;display:inline-block}.sd-date-range-picker__menu.sc-sd-date-range-picker{width:609px;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-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker{margin-bottom:16px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__header.sc-sd-date-range-picker .header-label.sc-sd-date-range-picker{margin:0 12px;width:40px;text-align:center;font-size:14px;line-height:24px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker{display:flex;flex-flow:row nowrap;align-items:stretch;gap:19px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker{width:266px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker{width:100%;height:24px;line-height:24px;font-size:14px;text-align:center;position:relative;padding:0 5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.sc-sd-date-range-picker{position:absolute;top:50%;transform:translateY(-50%)}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-prev.sc-sd-date-range-picker{left:5px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-header.sc-sd-date-range-picker button.header-button-next.sc-sd-date-range-picker{right:5px;left:auto}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker{padding:0 5px;margin-top:8px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr));column-gap:10px}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-days.sc-sd-date-range-picker .day.sc-sd-date-range-picker{width:28px;height:20px;font-size:12px;line-height:20px;text-align:center;color:#888888}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .calendar-container.sc-sd-date-range-picker .calendar-body.sc-sd-date-range-picker{margin-top:12px;display:grid;grid-template-columns:repeat(7, minmax(0, 1fr))}.sd-date-range-picker__menu.sc-sd-date-range-picker .sd-date-range-picker__body.sc-sd-date-range-picker .separator.sc-sd-date-range-picker{width:1px;background-color:#d8d8d8}`;
 
 class SdDateRangePicker {
     constructor(hostRef) {
@@ -4282,9 +4385,9 @@ class SdDateRangePicker {
         this.isOpen = false;
     };
     render() {
-        return (hAsync(Host, { key: 'a546e1ab7d199688377b3852b51711b283ed9735', class: "sd-date-range-picker" }, hAsync("sd-input", { key: 'f7edc5f8e03d0f781f906cf1abc9f6eddd93f3b6', 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 (hAsync(Host, { key: 'a6053b18e510d72345d3fc8622a34e2e916ae09a', class: "sd-date-range-picker" }, hAsync("sd-input", { key: '32a1c3e8c6f56a8c88ea5731d7aba8612918a412', 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() }, hAsync("sd-icon", { key: 'dbd1acab929f74afd822c9c9e2ca4bd8e6e25c02', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: '86f98f816b61f3dcb49eb284266c32dd644d1641', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: '221f126d9d4c92daf84312459b4e6aa9069b4131', class: "sd-date-range-picker__menu" }, hAsync("div", { key: 'c3b10e8544af4e52509a90650946045c33cf909c', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: '253cdb65199cff3d4344eb0a1b0920939f917a18', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: '33480e0a2f498f5481908e9e1541bb1a26f2b9d2', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: '2db9fed11f2c923a6fba475cacb72cc1865beecd', class: "header-label" }, this.prevYear), hAsync("button", { key: '36603bc40a926337d45f60b416d6dabaaa3cfc7e', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: '8d46e41a1fc5d4de945f92c5ae8842f8dd2c75cf', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: '236b93e84d17746e4f8852a9beda0d398edf096b', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (hAsync(Fragment, null, index === 1 && hAsync("div", { class: "separator" }), hAsync("div", { key: index, class: "calendar-container" }, hAsync("div", { class: "calendar-header" }, hAsync("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, hAsync("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
+            }, onClick: () => this.openMenu() }, hAsync("sd-icon", { key: 'c1e7d9c3a3becc4f8cd09a4a1034788d75b71b43', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (hAsync("sd-portal", { key: 'ac35b85f5ec3fdf6f89929e1d0ce16c61de5a24d', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, hAsync("div", { key: 'f9ede52633306262d3d1f53fe98c0ed71d2760c3', class: "sd-date-range-picker__menu" }, hAsync("div", { key: '46b75bb25b1c11b2a5c9d95998a6b8a909d271e2', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, hAsync("button", { key: 'f194f5c67019c933934526591834305cf2a33587', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, hAsync("sd-icon", { key: '43e8213a6bee3dcd9f2045f7ebb404da8a904a8a', name: "arrowLeft", size: "12", color: "#CCCCCC" })), hAsync("div", { key: '2b585ec3a4d0f2ed2e1ae4f3a49a4b511f076ba9', class: "header-label" }, this.prevYear), hAsync("button", { key: 'c97c6694b39f0a8979e90dbbca49615efcdde694', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, hAsync("sd-icon", { key: 'b64856f508e653a676a6bc3c7dfc4d1ecb87149a', name: "arrowRight", size: "12", color: "#CCCCCC" }))), hAsync("div", { key: 'd983671d652eca108580817d3c1181676985bec7', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (hAsync(Fragment, null, index === 1 && hAsync("div", { class: "separator" }), hAsync("div", { key: index, class: "calendar-container" }, hAsync("div", { class: "calendar-header" }, hAsync("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, hAsync("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')}`), hAsync("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (hAsync("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), hAsync("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (hAsync("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 ===
@@ -4292,7 +4395,7 @@ class SdDateRangePicker {
                 ? true
                 : this.isDisabledDate(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), inRange: this.isDateInRange(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), onClick: () => this.handleDateClick(index === 0 ? 'prev' : 'next', Number(day)), onMouseOver: () => this.handleDateHover(index === 0 ? 'prev' : 'next', Number(day)) }))))))))))))));
     }
-    static get style() { return sdDateRangePickerCss; }
+    static get style() { return sdDateRangePickerCss(); }
     static get cmpMeta() { return {
         "$flags$": 770,
         "$tagName$": "sd-date-range-picker",
@@ -4314,7 +4417,141 @@ class SdDateRangePicker {
     }; }
 }
 
-const sdGuideCss = "@charset \"UTF-8\";sd-button{display:inline-block;width:fit-content;height:fit-content}.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}";
+const sdFilePickerCss = () => `.sd-file-picker{display:inline-flex;align-items:center;max-width:var(--picker-width, 100%);height:28px;gap:8px;padding:4px 8px;border:1px solid #aaaaaa;border-radius:4px;background-color:#ffffff;cursor:pointer;user-select:none;position:relative;vertical-align:middle}.sd-file-picker__text{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:400;font-size:12px;line-height:20px;color:#aaaaaa}.sd-file-picker__text--active{color:#222222}.sd-file-picker__text--placeholder{color:#aaaaaa}.sd-file-picker__icon{flex-shrink:0}.sd-file-picker__clear-icon{flex-shrink:0;cursor:pointer;transition:opacity 0.2s ease}.sd-file-picker__clear-icon:hover{opacity:0.7}.sd-file-picker__input{display:none}.sd-file-picker__tooltip{position:absolute;top:calc(100% - 4px);left:50%;transform:translate(-50%);z-index:1000;white-space:nowrap;padding:8px 12px;background:rgba(0, 0, 0, 0.8);color:white;font-size:12px;line-height:18px;border-radius:4px;pointer-events:none}.sd-file-picker:hover:not(.sd-file-picker--inline):not(.sd-file-picker--disabled){background-color:#f6f6f6}.sd-file-picker--active:not(.sd-file-picker--inline):not(.sd-file-picker--disabled){background-color:#ffffff}.sd-file-picker--active:not(.sd-file-picker--inline):not(.sd-file-picker--disabled) .sd-file-picker__text{color:#222222}.sd-file-picker--disabled:not(.sd-file-picker--inline){background-color:#eeeeee;border-color:#cccccc}.sd-file-picker--disabled:not(.sd-file-picker--inline) .sd-file-picker__text{color:#888888}.sd-file-picker--inline{border:none;background-color:transparent;padding:0;height:auto}.sd-file-picker--inline .sd-file-picker__text{color:#aaaaaa}.sd-file-picker--inline:hover:not(.sd-file-picker--disabled) .sd-file-picker__text{color:#737373}.sd-file-picker--inline.sd-file-picker--active:not(.sd-file-picker--disabled) .sd-file-picker__text--active{color:#222222}.sd-file-picker--inline.sd-file-picker--disabled .sd-file-picker__text{color:#cccccc}`;
+
+class SdFilePicker {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.sdChange = createEvent(this, "sdChange");
+    }
+    get el() { return getElement(this); }
+    value = null;
+    placeholder = 'Click to upload';
+    disabled = false;
+    inline = false;
+    multiple = false;
+    accept;
+    width;
+    internalValue = null;
+    hovered = false;
+    showTooltip = false;
+    fileInputRef;
+    fileNamesRef;
+    sdChange;
+    valueChanged(newValue) {
+        this.internalValue = newValue;
+    }
+    componentDidLoad() {
+        this.checkOverflow();
+    }
+    componentDidUpdate() {
+        this.checkOverflow();
+    }
+    handleFileChange = (event) => {
+        const input = event.target;
+        const files = input.files;
+        if (!files || files.length === 0) {
+            return;
+        }
+        const fileArray = Array.from(files);
+        if (this.multiple) {
+            this.internalValue = fileArray;
+        }
+        else {
+            this.internalValue = fileArray[0];
+        }
+        this.value = this.internalValue;
+        this.sdChange?.emit(this.value);
+    };
+    handleClear = (event) => {
+        event.stopPropagation();
+        const clearedValue = this.multiple ? [] : null;
+        this.value = clearedValue;
+        this.internalValue = clearedValue;
+        this.sdChange?.emit(clearedValue);
+        if (this.fileInputRef) {
+            this.fileInputRef.value = '';
+        }
+    };
+    handleClick = () => {
+        if (this.disabled)
+            return;
+        this.fileInputRef?.click();
+    };
+    getStatusClass() {
+        if (this.disabled)
+            return 'sd-file-picker--disabled';
+        if (this.hasFiles())
+            return 'sd-file-picker--active';
+        return '';
+    }
+    hasFiles() {
+        if (!this.internalValue)
+            return false;
+        if (Array.isArray(this.internalValue)) {
+            return this.internalValue.length > 0;
+        }
+        return true;
+    }
+    getDisplayText() {
+        if (!this.hasFiles())
+            return this.placeholder;
+        if (Array.isArray(this.internalValue)) {
+            return this.internalValue.map(f => f.name).join(', ');
+        }
+        return this.internalValue?.name || this.placeholder;
+    }
+    checkOverflow() {
+        if (!this.fileNamesRef)
+            return;
+        const isOverflowing = this.fileNamesRef.scrollWidth > this.fileNamesRef.clientWidth;
+        this.showTooltip = isOverflowing;
+    }
+    getIconColor() {
+        if (this.disabled) {
+            return this.inline ? 'grey_45' : 'grey_55';
+        }
+        return 'grey_70';
+    }
+    render() {
+        const hasFiles = this.hasFiles();
+        const displayText = this.getDisplayText();
+        return (hAsync("div", { key: 'bfa4054517dcf1ef728a2354927bc40c177274ce', class: {
+                'sd-file-picker': true,
+                [this.getStatusClass()]: true,
+                'sd-file-picker--inline': this.inline,
+            }, onClick: this.handleClick, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false) }, hAsync("input", { key: 'b2f2e730b30c58641615d1216633ee20a67ee6c1', ref: el => (this.fileInputRef = el), type: "file", class: "sd-file-picker__input", disabled: this.disabled, multiple: this.multiple, accept: this.accept, onInput: this.handleFileChange }), hAsync("sd-icon", { key: '08b4bbcc3bb757a7a8e3dee3a416b202c7e86f66', name: "attachFile", size: 16, color: this.getIconColor(), class: "sd-file-picker__icon" }), hAsync("div", { key: 'cba9e6fb17a6a9c5de479e0ccdc6a3de7c23a615', ref: el => (this.fileNamesRef = el), class: {
+                'sd-file-picker__text': true,
+                'sd-file-picker__text--placeholder': !hasFiles,
+                'sd-file-picker__text--active': hasFiles,
+            } }, displayText), !this.disabled && hasFiles && (hAsync("sd-icon", { key: 'eb3c02cb001168d82eac1a3e2855e1cfcc6b960e', name: "close", size: 12, color: "#888888", class: "sd-file-picker__clear-icon", onClick: this.handleClear })), this.showTooltip && hasFiles && this.hovered && (hAsync("div", { key: '8f09fe54f7f77453eac07f60942401d83955fc0b', class: "sd-file-picker__tooltip" }, displayText))));
+    }
+    static get watchers() { return {
+        "value": ["valueChanged"]
+    }; }
+    static get style() { return sdFilePickerCss(); }
+    static get cmpMeta() { return {
+        "$flags$": 768,
+        "$tagName$": "sd-file-picker",
+        "$members$": {
+            "value": [1040],
+            "placeholder": [1],
+            "disabled": [4],
+            "inline": [4],
+            "multiple": [4],
+            "accept": [1],
+            "width": [8],
+            "internalValue": [32],
+            "hovered": [32],
+            "showTooltip": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+
+const sdGuideCss = () => `@charset "UTF-8";sd-button{display:inline-block;width:fit-content;height:fit-content}.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}`;
 
 const GUIDE_LABEL = {
     help: '활용 TIP',
@@ -4367,11 +4604,11 @@ class SdGuide {
     };
     render() {
         const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
-        return (hAsync(Host, { key: '32cff34a733ab423b4db37aaa91f4c63152566a3', style: {
+        return (hAsync(Host, { key: 'c15218a6d9dbef0147701e31f798a3e6fa8e7679', style: {
                 '--sd-guide-color': GUIDE_ICON[this.type].color,
-            } }, hAsync("sd-button", { key: '7efc84462239fcab6ac7d532d75ff418bebee957', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.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 && (hAsync("sd-portal", { key: '9868dd7fd8b5e42cfd6b2011c2a8679a8f9ece02', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: '974448ac29c162372a7a5e8ba12c493d4e8a2287', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: 'e28679c5cdeac9ca8e0b5701d4979a94a7c4f182', class: "sd-guide__popup__close", icon: "close", color: colors$1.grey_65, size: "md", variant: "ghost", noHover: true,
+            } }, hAsync("sd-button", { key: '773093b74b917d9e15a8e8c280aaa7564832abe1', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: this.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 && (hAsync("sd-portal", { key: '64cfb5c8b425b0d48a9f9954b203c9b3883fb1f3', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, hAsync("div", { key: 'f748907b385a77490ad79f8f811ad7fc4eaee8bb', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, hAsync("sd-button", { key: '8b154c2d239fc7038cb939f826417e5b68043a85', class: "sd-guide__popup__close", icon: "close", color: colors$1.grey_65, size: "md", variant: "ghost", noHover: true,
             // buttonStyle={{ padding: '0px', minHeight: '0px' }}
-            onSdClick: this.closeDropdown }), hAsync("div", { key: 'c598b70154a4b2c4a4a2790a0072eaf4f7de7099', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '6837f7934c24a7da2bf0558d7cdcd5effcdb5481', name: "helpOutline", size: 24, color: colors$1.green_65 }), hAsync("h3", { key: '6b7b8f9d6f3602f3cd036efdd308318988ce339b', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: 'fbee7a0d4ad49cd6cac2ef5bb4617937aaff5882', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
+            onSdClick: this.closeDropdown }), hAsync("div", { key: 'eaa2160d01bbe8172fc176117b8e506e469c5dde', class: "sd-guide__popup__header" }, hAsync("sd-icon", { key: '54436229beee740efc607c3c2dd7be4c390e3285', name: "helpOutline", size: 24, color: colors$1.green_65 }), hAsync("h3", { key: 'e848c736bb5d49221feb194ecd43e904d51c82f8', class: "sd-guide__popup__title" }, this.popupTitle || GUIDE_LABEL[this.type])), hAsync("ul", { key: '57536a93be487239c30d7338f48c87ab57fbb3d0', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
     }
     // 현재 2depth까지만 스타일 적용
     renderListItem(message, depth = 0) {
@@ -4389,7 +4626,7 @@ class SdGuide {
         const listContent = message.replace(/ /gi, ' ');
         return (hAsync("li", { class: `sd-guide__popup__list__item sd-guide__popup__list__item--depth-${depth}` }, hAsync("p", { innerHTML: listContent })));
     };
-    static get style() { return sdGuideCss; }
+    static get style() { return sdGuideCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-guide",
@@ -6388,7 +6625,7 @@ const Icons = {
     ...Youtube,
 };
 
-const sdIconCss = "sd-icon{line-height:0}sd-icon .sd-icon{line-height:0;vertical-align:middle}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}";
+const sdIconCss = () => `sd-icon{display:inline-block;line-height:0}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}`;
 
 class SdIcon {
     constructor(hostRef) {
@@ -6417,9 +6654,9 @@ class SdIcon {
     }
     render() {
         const IconComponent = Icons[this.name]?.[this.size];
-        return (hAsync("i", { key: 'dc540c5746fedd2fed7bdf8e179b56878abe5a3b', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: 'ff1e903198b5362d8e3521c6477ddd0b96948ad9', color: this.resolvedColor })));
+        return (hAsync("i", { key: 'f3ff9d0b1134a67b6f8897ede7b4cd449589d618', class: this.getIconClasses(), style: this.iconStyle }, hAsync(IconComponent, { key: '0acd90f22d7f2e3e875b690d41dbb4a297b42d7f', color: this.resolvedColor })));
     }
-    static get style() { return sdIconCss; }
+    static get style() { return sdIconCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-icon",
@@ -6437,7 +6674,7 @@ class SdIcon {
     }; }
 }
 
-const sdInputCss = "sd-icon{line-height:0}sd-icon .sd-icon{line-height:0;vertical-align:middle}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}.sd-input{display:flex;width:var(--input-width, 100%);align-items:center;height:28px;padding:4px 8px;border:1px solid #aaaaaa;border-radius:4px;color:#333333;font-size:12px;line-height:20px;background:white}.sd-input--hovered,.sd-input--focused{border-color:#0075ff;box-shadow:0 0 4px 0 rgba(0, 113, 255, 0.4)}.sd-input.sd-input--error{border-color:#fb4444}.sd-input.sd-input--pass{border-color:#2bce6c}.sd-input.sd-input--barcode:not(.sd-input--disabled){background-color:#fafaa1}.sd-input.sd-input--disabled{background-color:#eeeeee !important;border-color:#cccccc !important;cursor:not-allowed !important;box-shadow:none !important}.sd-input.sd-input--disabled .sd-input__native_element{color:#888888 !important}.sd-input .sd-input__native_element{display:block;width:100%;height:20px;line-height:20px;border:none;outline:none;background:transparent;font-size:inherit;color:#333333;margin-left:4px;margin-right:4px;padding-block:0;padding-inline:0}.sd-input .sd-input__native_element::placeholder{font-size:12px;height:20px;line-height:20px;color:#aaaaaa}.sd-input .sd-input__clear-icon{cursor:pointer;margin-left:8px}";
+const sdInputCss = () => `sd-icon{display:inline-block;line-height:0}sd-icon .sd-icon--rotate-90{transform:rotate(90deg)}sd-icon .sd-icon--rotate-180{transform:rotate(180deg)}sd-icon .sd-icon--rotate-270{transform:rotate(270deg)}.sd-input{display:flex;width:var(--input-width, 100%);align-items:center;height:28px;padding:4px 8px;border:1px solid #aaaaaa;border-radius:4px;color:#333333;font-size:12px;line-height:20px;background:white}.sd-input--hovered,.sd-input--focused{border-color:#0075ff;box-shadow:0 0 4px 0 rgba(0, 113, 255, 0.4)}.sd-input.sd-input--error{border-color:#fb4444}.sd-input.sd-input--pass{border-color:#2bce6c}.sd-input.sd-input--barcode:not(.sd-input--disabled){background-color:#fafaa1}.sd-input.sd-input--disabled{background-color:#eeeeee !important;border-color:#cccccc !important;cursor:not-allowed !important;box-shadow:none !important}.sd-input.sd-input--disabled .sd-input__native_element{color:#888888 !important}.sd-input .sd-input__native_element{display:block;width:100%;height:20px;line-height:20px;border:none;outline:none;background:transparent;font-size:inherit;color:#333333;margin-left:4px;margin-right:4px;padding-block:0;padding-inline:0}.sd-input .sd-input__native_element::placeholder{font-size:12px;height:20px;line-height:20px;color:#aaaaaa}.sd-input .sd-input__clear-icon{cursor:pointer;margin-left:8px}`;
 
 class SdInput {
     constructor(hostRef) {
@@ -6537,11 +6774,11 @@ class SdInput {
                 '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
             }
             : {};
-        return (hAsync(Host, { key: 'f793db1bf48fccad644292b06e725676568d2686', style: inputWidth }, this.label && hAsync("div", { key: '1f59002678f46ffdfeb47a0adb9b48ad74c24191', class: "sd-input__label" }, this.label), hAsync("label", { key: '2fa9f8744f1e6357aa864ea4b97685d35fd0e712', class: {
+        return (hAsync(Host, { key: '265fb05d7c005cd843443475d74c2e8127e4ae2d', style: inputWidth }, this.label && hAsync("div", { key: '2ce6d2611927ec3e491122b8a17b94a2b39edcd5', class: "sd-input__label" }, this.label), hAsync("label", { key: '6731592e7d55098daf4aa8b8177233897daf2900', class: {
                 'sd-input': true,
                 [this.getInputStatus()]: true,
                 'sd-input--barcode': !!this.barcode,
-            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: '6baa7f30c5057bcd96167741b7219877a0de8b81', name: "prefix" }), hAsync("input", { key: 'd3210037a23b3015a3650f2771f0205d3baa9af8', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), hAsync("slot", { key: '72cc3cf71cdcab1e540f68c54a7a7715cb73af83', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '04a65fa5e2042ffad00a2cfae10d77babdeaaf28', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
+            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, hAsync("slot", { key: 'e07590e1ee2540183c18aceb8dae0ff39d5adca4', name: "prefix" }), hAsync("input", { key: '76b8bbba1030cbef5b57e3303b6cd300858c4fee', ref: el => (this.nativeEl = el), class: `sd-input__native_element ${this.inputClass}`, type: "text", value: this.internalValue || '', placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, autofocus: this.autoFocus, onInput: this.handleInput, onChange: this.handleChange, onFocus: event => this.handleFocus('focus', event), onBlur: event => this.handleFocus('blur', event) }), hAsync("slot", { key: 'e10dc614a0283bc63bb3e44bd627f7279728dae6', name: "suffix" }), this.clearable && this.internalValue && (hAsync("sd-icon", { key: '3324d72d1353231209aa9c284425c921bbb1e17b', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
                 this.internalValue = '';
                 this.sdChange?.emit(this.internalValue);
                 this.sdInput?.emit(this.internalValue);
@@ -6551,7 +6788,7 @@ class SdInput {
         "value": ["valueChanged"],
         "internalValue": ["internalValueChanged"]
     }; }
-    static get style() { return sdInputCss; }
+    static get style() { return sdInputCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-input",
@@ -6581,16 +6818,16 @@ class SdInput {
     }; }
 }
 
-const sdLoadingSpinnerCss = "sd-loading-spinner{display:block}sd-loading-spinner .sd-loading-spinner{animation:sd-loading-spin 2s linear infinite;transform-origin:center center}sd-loading-spinner .sd-loading-spinner .path{animation:sd-loading-spin-path 1.5s ease-in-out infinite}@keyframes sd-loading-spin{0%{transform:rotate3d(0, 0, 1, 0deg)}25%{transform:rotate3d(0, 0, 1, 90deg)}50%{transform:rotate3d(0, 0, 1, 180deg)}75%{transform:rotate3d(0, 0, 1, 270deg)}100%{transform:rotate3d(0, 0, 1, 359deg)}}@keyframes sd-loading-spin-path{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}";
+const sdLoadingSpinnerCss = () => `sd-loading-spinner{display:block}sd-loading-spinner .sd-loading-spinner{animation:sd-loading-spin 2s linear infinite;transform-origin:center center}sd-loading-spinner .sd-loading-spinner .path{animation:sd-loading-spin-path 1.5s ease-in-out infinite}@keyframes sd-loading-spin{0%{transform:rotate3d(0, 0, 1, 0deg)}25%{transform:rotate3d(0, 0, 1, 90deg)}50%{transform:rotate3d(0, 0, 1, 180deg)}75%{transform:rotate3d(0, 0, 1, 270deg)}100%{transform:rotate3d(0, 0, 1, 359deg)}}@keyframes sd-loading-spin-path{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}`;
 
 class SdLoadingSpinner {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: '7538c9986c448d666ea1993324d8fd811c2ba289' }, hAsync("svg", { key: '7e254a0b15ecda3e480582c336b33b1020715125', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, hAsync("circle", { key: '8a6356ba2e8d42c9d1c789ba5676ca6f7485cda1', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
+        return (hAsync(Host, { key: 'f8c61aa1c1f500da0aa9deac8d031306427bddb4' }, hAsync("svg", { key: '66b9d93ed53b1539f4ba51cf7ca0350728ed343c', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, hAsync("circle", { key: '3e6e687a243ec457065e14ac44bb56706c89bb10', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
     }
-    static get style() { return sdLoadingSpinnerCss; }
+    static get style() { return sdLoadingSpinnerCss(); }
     static get cmpMeta() { return {
         "$flags$": 256,
         "$tagName$": "sd-loading-spinner",
@@ -6601,7 +6838,7 @@ class SdLoadingSpinner {
     }; }
 }
 
-const sdModalCardCss = "sd-modal-card{display:block}sd-modal-card .sd-modal-card{position:relative;padding:40px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.2)}sd-modal-card .sd-modal-card__close-button{position:absolute;top:16px;right:16px;cursor:pointer}sd-modal-card .sd-modal-card sd-icon.sd-modal-card__icon{display:block;width:32px;height:32px;margin:0 auto 12px auto}sd-modal-card .sd-modal-card__title{color:var(--point-color);font-size:18px;font-weight:700;line-height:30px;text-align:center;margin:0 0 20px 0}sd-modal-card .sd-modal-card__message{color:#222222;font-weight:400;font-size:12px;line-height:22px;text-align:center;margin:0}sd-modal-card .sd-modal-card__button-container{display:flex;margin:32px auto 0 auto;justify-content:center;align-items:center;gap:8px}sd-modal-card .sd-modal-card__button-container.flex-column{flex-direction:column}sd-modal-card .sd-modal-card__button-container button.sd-modal-card__button{width:89px}";
+const sdModalCardCss = () => `sd-modal-card{display:block}sd-modal-card .sd-modal-card{position:relative;padding:40px 32px;border-radius:8px;box-shadow:4px 4px 24px 4px rgba(0, 0, 0, 0.2)}sd-modal-card .sd-modal-card__close-button{position:absolute;top:16px;right:16px;cursor:pointer}sd-modal-card .sd-modal-card sd-icon.sd-modal-card__icon{display:block;width:32px;height:32px;margin:0 auto 12px auto}sd-modal-card .sd-modal-card__title{color:var(--point-color);font-size:18px;font-weight:700;line-height:30px;text-align:center;margin:0 0 20px 0}sd-modal-card .sd-modal-card__message{color:#222222;font-weight:400;font-size:12px;line-height:22px;text-align:center;margin:0}sd-modal-card .sd-modal-card__button-container{display:flex;margin:32px auto 0 auto;justify-content:center;align-items:center;gap:8px}sd-modal-card .sd-modal-card__button-container.flex-column{flex-direction:column}sd-modal-card .sd-modal-card__button-container button.sd-modal-card__button{width:89px}`;
 
 class SdModalCard {
     constructor(hostRef) {
@@ -6646,7 +6883,7 @@ class SdModalCard {
     render() {
         return (hAsync(Host, { key: 'a7b84787e02fd73d3df5af58011b92bd70bf5418', style: { '--point-color': this.pointColor } }, hAsync("div", { key: 'ee1e08e2dca1c4192bbdf21cba148a1ad72459e1', class: this.getModalClass }, this.useCloseButton && (hAsync("sd-icon", { key: 'ec9aad87db22a57f01326db6fac695eb2d4617ad', class: "sd-modal-card__close-button", name: "close", size: "20", color: "grey_65", onClick: () => this.sdClose.emit() })), this.type !== 'normal' && (hAsync("sd-icon", { key: 'ccf36cbb5ef0a793d422cee2312d338436bd6d61', class: "sd-modal-card__icon", name: this.type === 'info' ? 'notificationOutline' : 'warningOutline', size: "32", color: this.type === 'info' ? 'brilliantblue_75' : 'red_75' })), hAsync("h2", { key: '9d1e9f949bc75697960d2c44667f7cad52d976c4', class: "sd-modal-card__title" }, this.modalTitle), hAsync("slot", { key: 'f2b75146e58d78ac8431a1549068e9a219be4506' }, hAsync("div", { key: '75d035874b34f388c3c6acb60f4a90dae46ff7e6', class: `sd-modal-card__message-container` }, this.message.map(msg => (hAsync("p", { class: "sd-modal-card__message" }, msg))))), hAsync("div", { key: '39f99159776d7c107b2b3410e5681a67766b2ce8', class: `sd-modal-card__button-container flex-${this.buttonFlexDirection}` }, this.buttonProps.map(button => (hAsync("sd-button", { class: 'sd-modal-card__button', variant: button.variant ? button.variant : 'outline', label: button.label, color: button.color, size: button.size, onClick: () => !button.type || button.type === 'confirm' ? this.sdConfirm.emit() : this.sdClose.emit(), ...(button.class && { class: button.class }) })))))));
     }
-    static get style() { return sdModalCardCss; }
+    static get style() { return sdModalCardCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-modal-card",
@@ -6666,7 +6903,7 @@ class SdModalCard {
     }; }
 }
 
-const sdPaginationCss = ".sd-pagination{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;gap:8px;color:#555555;width:100%;font-size:12px}.sd-pagination .prepend-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .prepend-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .prepend-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .append-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .append-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .append-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .pagination-btn{display:flex;align-items:center;justify-content:center;border-radius:14px;outline:none;border:none;cursor:pointer;height:26px;color:#555555;width:var(--pagination-btn-width, 26px)}.sd-pagination .pagination-btn--selected{background-color:#006ac1;color:white}.sd-pagination .pagination-btn:hover{border:1px solid #006ac1}.sd-pagination--simple .pagination-info{line-height:26px;display:flex;flex-flow:row nowrap;align-items:center;gap:8px}.sd-pagination--simple .pagination-info .current-page,.sd-pagination--simple .pagination-info .last-page{padding:0 2px}";
+const sdPaginationCss = () => `.sd-pagination{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;gap:8px;color:#555555;width:100%;font-size:12px}.sd-pagination .prepend-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .prepend-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .prepend-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .append-btns{display:flex;flex-flow:row nowrap;align-items:center;gap:8px;width:60px}.sd-pagination .append-btns button{width:26px;height:26px;border:0;background:none}.sd-pagination .append-btns button:hover{border:1px solid #006ac1;border-radius:14px}.sd-pagination .pagination-btn{display:flex;align-items:center;justify-content:center;border-radius:14px;outline:none;border:none;cursor:pointer;height:26px;color:#555555;width:var(--pagination-btn-width, 26px)}.sd-pagination .pagination-btn--selected{background-color:#006ac1;color:white}.sd-pagination .pagination-btn:hover{border:1px solid #006ac1}.sd-pagination--simple .pagination-info{line-height:26px;display:flex;flex-flow:row nowrap;align-items:center;gap:8px}.sd-pagination--simple .pagination-info .current-page,.sd-pagination--simple .pagination-info .last-page{padding:0 2px}`;
 
 const BUTTON_WIDTH = {
     1: 26,
@@ -6740,14 +6977,14 @@ class SdPagination {
         }
     }
     render() {
-        return (hAsync("div", { key: 'e3abf3098a37fe058088304eefcfa9b6abbdbcaa', class: this.paginationClasses }, hAsync("div", { key: '19db1f5ed8fd2ab9b4f6793b474bf4dd3f48f21c', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
+        return (hAsync("div", { key: '6b743779100f7835b29da728d642ced495b11116', class: this.paginationClasses }, hAsync("div", { key: '34be0cf1db6cc55f761b32fa9e4f9bee236933f6', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (hAsync("div", { class: "pagination-info" }, hAsync("span", { class: "current-page" }, this.currentPage), hAsync("span", null, "/"), hAsync("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (hAsync("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
                 'pagination-btn': true,
                 'pagination-btn--selected': this.currentPage === n,
             }, disabled: this.currentPage === n, style: {
                 '--pagination-btn-width': `${this.buttonWidth}px`,
-            }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '63096633349b138d679b2a735d0e8d246dfde312', class: "append-btns" }, this.renderNextButtons())));
+            }, onClick: () => this.handlePageChange(n) }, n)))), hAsync("div", { key: '108017450555fb73c74c71cc7605ef8af5679a20', class: "append-btns" }, this.renderNextButtons())));
     }
-    static get style() { return sdPaginationCss; }
+    static get style() { return sdPaginationCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-pagination",
@@ -6764,7 +7001,7 @@ class SdPagination {
 
 const TooltipArrow = (props) => (hAsync("svg", { width: "16", height: "12", viewBox: "0 0 16 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, hAsync("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" })));
 
-const sdPopoverCss = ".sd-popover{position:relative;cursor:pointer;display:inline-block}";
+const sdPopoverCss = () => `.sd-popover{position:relative;cursor:pointer;display:inline-block}`;
 
 class SdPopover {
     constructor(hostRef) {
@@ -6799,16 +7036,16 @@ class SdPopover {
         this.showPopover = false;
     };
     render() {
-        return (hAsync(Fragment, { key: '8c7efcbf49754c518a6a9cf492b300c07ef980f5' }, this.label ? (hAsync("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: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-tooltip-portal", { key: 'c61e5138ebba94a31d621ff1b3439d3c37ceb629', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: 'c88706aa4e7aec4a105459e429a8cfa9313c7aa8', class: {
+        return (hAsync(Fragment, { key: 'fa06f3ff6641006a75c3ed0912f8f2dc6ca2da56' }, this.label ? (hAsync("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: () => (this.showPopover = !this.showPopover) })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (this.showPopover = !this.showPopover) })), this.showPopover && (hAsync("sd-tooltip-portal", { key: 'f433e3bc5e325bf9d70fae10b6777fe77e52061f', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, hAsync("div", { key: '7fa463878475d3c2ce86d006912c35b585d7bed0', class: {
                 'sd-popover-menu': true,
                 [`sd-popover-menu--${this.placement}`]: true,
                 [this.menuClass]: !!this.menuClass,
-            } }, hAsync("i", { key: 'f79cb7d4784bc70d89ed5a3d5fa63af3ffb94921', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'e5e6148d67858f972b00ec55e174685cd87c6608' })), hAsync("div", { key: '17d4f8a35d85bf48a6155bf0581f37530c5ea492', class: "sd-popover-menu__content" }, this.menuTitle && hAsync("div", { key: '26d5195b0cde90c8b9251622180021eb33027f6b', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: 'd1eca72d7d97d16a6caa6a9094c93555ea0cbd53', class: "sd-popover-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '2c8258470a30a604398f680b5d02527303d3b6c7', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: '480f0a2b1e9aa0f6d31257f1a13fe441c3685e2b', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '73d77f0e344a86c4a81c0aab4289b6fb5d3603c2', name: "close", size: "12", color: "#AAAAAA" }))))))));
+            } }, hAsync("i", { key: '90a23aea2730ec9dbc2b9ca77ef0a4ef13777006', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '9246c25e04ea2dd6716e20ac01060ff7acc23fa9' })), hAsync("div", { key: 'dd6f350fbb5f5a49302593b3c24faf6bf59bb9ec', class: "sd-popover-menu__content" }, this.menuTitle && hAsync("div", { key: 'c9aae4e0eaa0e1ab4f1447907f2dbe0e6e988bbf', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (hAsync("div", { key: '2ed497a7d543f4638756524b4062c9df57b20aa0', class: "sd-popover-menu__messages" }, this.messages.map(message => (hAsync("div", null, message))))), this.buttons.length > 0 && (hAsync("div", { key: '5ddf4ec18128bc58c77a3017fc1a621591adb67b', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (hAsync("sd-button", { ...button })))))), this.useClose && (hAsync("button", { key: 'e7bbb527601bda49a4d4e5c28a555acb5714bd5b', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '0e0ec3542195f3eb6955ef68ab82d947460271d3', name: "close", size: "12", color: "#AAAAAA" }))))))));
     }
     static get watchers() { return {
         "show": ["watchShowHandler"]
     }; }
-    static get style() { return sdPopoverCss; }
+    static get style() { return sdPopoverCss(); }
     static get cmpMeta() { return {
         "$flags$": 777,
         "$tagName$": "sd-popover",
@@ -6954,7 +7191,7 @@ class SdPortal {
         this.sdClose.emit();
     }
     render() {
-        return hAsync("slot", { key: 'a2227a90c04b58d7f8c468ebc84f0627055d4da8' });
+        return hAsync("slot", { key: '5995c7edbf0a54b6efb9afa2b5f67f078282acd8' });
     }
     static get cmpMeta() { return {
         "$flags$": 772,
@@ -6972,7 +7209,7 @@ class SdPortal {
     }; }
 }
 
-const sdProgressCss = "sd-progress{display:block}sd-progress .sd-progress__bar{position:relative;width:360px;height:20px;overflow:hidden;border-radius:4px;background-color:#eeeeee;text-align:center}sd-progress .sd-progress__bar__percent{width:var(--progress-percentage);height:100%;border-radius:4px;background-color:var(--progress-color, #0075ff);transition:all 0.5s}sd-progress .sd-progress__bar__percent.proceed{border-top-right-radius:50%}sd-progress .sd-progress__bar__indicator{position:absolute;left:0;top:0;height:20px;width:100%;background-color:#eeeeee;line-height:21px;z-index:1}sd-progress .sd-progress__bar__indicator--left{color:var(--progress-color, #0075ff);clip-path:inset(0 0 0 var(--progress-percentage))}sd-progress .sd-progress__bar__indicator--right{color:white;background-color:var(--progress-color, #0075ff);clip-path:inset(0 calc(100% - var(--progress-percentage)) 0 0)}sd-progress .sd-progress__spinner{display:flex;flex-direction:column;align-items:center;justify-content:center}sd-progress .sd-progress__spinner svg{transform:rotate(-90deg)}sd-progress .sd-progress__spinner__label{margin-top:8px;font-size:16px;color:var(--progress-color, #0075ff)}sd-progress .sd-progress__label{margin-top:4px;font-size:12px;color:#222222;text-align:center}";
+const sdProgressCss = () => `sd-progress{display:block}sd-progress .sd-progress__bar{position:relative;width:360px;height:20px;overflow:hidden;border-radius:4px;background-color:#eeeeee;text-align:center}sd-progress .sd-progress__bar__percent{width:var(--progress-percentage);height:100%;border-radius:4px;background-color:var(--progress-color, #0075ff);transition:all 0.5s}sd-progress .sd-progress__bar__percent.proceed{border-top-right-radius:50%}sd-progress .sd-progress__bar__indicator{position:absolute;left:0;top:0;height:20px;width:100%;background-color:#eeeeee;line-height:21px;z-index:1}sd-progress .sd-progress__bar__indicator--left{color:var(--progress-color, #0075ff);clip-path:inset(0 0 0 var(--progress-percentage))}sd-progress .sd-progress__bar__indicator--right{color:white;background-color:var(--progress-color, #0075ff);clip-path:inset(0 calc(100% - var(--progress-percentage)) 0 0)}sd-progress .sd-progress__spinner{display:flex;flex-direction:column;align-items:center;justify-content:center}sd-progress .sd-progress__spinner svg{transform:rotate(-90deg)}sd-progress .sd-progress__spinner__label{margin-top:8px;font-size:16px;color:var(--progress-color, #0075ff)}sd-progress .sd-progress__label{margin-top:4px;font-size:12px;color:#222222;text-align:center}`;
 
 class SdProgress {
     constructor(hostRef) {
@@ -6991,10 +7228,10 @@ class SdProgress {
         error: '#FB4444',
     };
     render() {
-        return (hAsync(Host, { key: 'd491ac2f5e734f653a991afa1c9e25ceb9947335', style: {
+        return (hAsync(Host, { key: 'ecd9801daf4fcb4a3a680286354c436b1423778a', style: {
                 '--progress-color': this.statusColor[this.status],
                 '--progress-percentage': `${this.percentage}%`,
-            } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '0741e3f5492c4f870cc9657e27d3d1a1d73bee10', class: "sd-progress__label" }, this.label)));
+            } }, this.type === 'bar' ? this.renderBarProgress() : this.renderSpinnerProgress(), this.label && hAsync("div", { key: '167d080cefe222ac28d966bbcf0aca4a122c98ea', class: "sd-progress__label" }, this.label)));
     }
     renderBarProgress() {
         return (hAsync("div", { class: `sd-progress__bar sd-progress__bar--${this.status}` }, hAsync("div", { class: ['sd-progress__bar__percent', this.percentage < 100 ? 'proceed' : ''].join(' ') }), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--left" }, this.percentage, "%"), hAsync("div", { class: "sd-progress__bar__indicator sd-progress__bar__indicator--right" }, this.percentage, "%")));
@@ -7007,7 +7244,7 @@ class SdProgress {
         const progressSize = `${this.size / 2}px`;
         return (hAsync("div", { class: `sd-progress__spinner sd-progress__spinner--${this.status}` }, hAsync("svg", { width: progressBgSize, height: progressBgSize }, hAsync("circle", { cx: progressSize, cy: progressSize, r: radius, stroke: "#EEEEEE", "stroke-width": this.strokeWidth, fill: "transparent" }), hAsync("circle", { cx: progressSize, cy: progressSize, r: radius, stroke: this.statusColor[this.status], "stroke-width": this.strokeWidth, fill: "transparent", "stroke-dasharray": circumference, "stroke-dashoffset": offset, "stroke-linecap": "round", class: "transition-all duration-500" })), hAsync("strong", { class: "sd-progress__spinner__label" }, this.percentage, " %")));
     }
-    static get style() { return sdProgressCss; }
+    static get style() { return sdProgressCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-progress",
@@ -7025,7 +7262,87 @@ class SdProgress {
     }; }
 }
 
-const sdRadioGroupCss = "sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}sd-radio-group .sd-radio-group__option{width:fit-content;display:flex;align-items:center;gap:8px;font-weight:400;font-size:12px;line-height:20px;cursor:pointer}sd-radio-group .sd-radio-group__option:has(input:disabled){cursor:default}sd-radio-group .sd-radio-group__option input{position:relative;appearance:none;margin:0;width:16px;height:16px;border:1px solid #888888;border-radius:50%;cursor:pointer;accent-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked{border-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked::before{content:\"\";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background-color:#0075ff}sd-radio-group .sd-radio-group__option input:disabled{cursor:default;border-color:#cccccc;background-color:#eeeeee}sd-radio-group .sd-radio-group__option input:disabled:checked::before{background-color:#cccccc}sd-radio-group .sd-radio-group__option input:not(:disabled):hover{border-color:#0075ff;background-color:#d9eaff}sd-radio-group .sd-radio-group__label{font-size:12px;color:#333333;line-height:20px;user-select:none}sd-radio-group .sd-radio-group__option--disabled .sd-radio-group__label{color:#888888}";
+const sdRadioButtonGroupCss = () => `sd-radio-button-group{display:inline-block}sd-radio-button-group .sd-radio-button-group{display:flex;flex-direction:row;gap:0}sd-radio-button-group .sd-radio-button-group__option{display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid #cccccc;background-color:white;color:#333333;font-weight:400;transition:all 0.2s ease;position:relative;user-select:none}sd-radio-button-group .sd-radio-button-group__option input{display:none}sd-radio-button-group .sd-radio-button-group__option:not(:first-child){margin-left:-1px}sd-radio-button-group .sd-radio-button-group__option:first-child{border-radius:4px 0 0 4px}sd-radio-button-group .sd-radio-button-group__option:last-child{border-radius:0 4px 4px 0}sd-radio-button-group .sd-radio-button-group__option:only-child{border-radius:4px}sd-radio-button-group .sd-radio-button-group__option:not(sd-radio-button-group .sd-radio-button-group__option--disabled):not(sd-radio-button-group .sd-radio-button-group__option--selected):hover{background-color:#0075ff;color:white;font-weight:500;border-color:#0075ff;z-index:2}sd-radio-button-group .sd-radio-button-group__option--selected{border-color:#0075ff;color:#0075ff;background-color:white;z-index:1}sd-radio-button-group .sd-radio-button-group__option--disabled{background-color:#e1e1e1;border-color:#cccccc;color:#888888;cursor:not-allowed}sd-radio-button-group .sd-radio-button-group__option:has(input:disabled){cursor:not-allowed}sd-radio-button-group .sd-radio-button-group__label{user-select:none}sd-radio-button-group .sd-radio-button-group--sm .sd-radio-button-group__option{padding:4px 12px;font-size:12px;line-height:20px}sd-radio-button-group .sd-radio-button-group--md .sd-radio-button-group__option{padding:4px 20px;font-size:16px;line-height:26px}`;
+
+class SdRadioButtonGroup {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.sdChange = createEvent(this, "sdChange");
+    }
+    value;
+    radioOptions = [];
+    size = 'md';
+    disabled = false;
+    name;
+    selectedValue;
+    sdChange;
+    componentWillLoad() {
+        if (this.value !== undefined && this.value !== null) {
+            this.selectedValue = this.value;
+        }
+    }
+    valueChanged(newValue) {
+        this.selectedValue = newValue;
+    }
+    handleRadioChange = (optionValue, optionDisabled) => {
+        if (this.disabled || optionDisabled)
+            return;
+        this.selectedValue = optionValue;
+        this.value = optionValue;
+        this.sdChange.emit(optionValue);
+    };
+    isOptionSelected(option) {
+        return this.selectedValue === option.value;
+    }
+    isOptionDisabled(option) {
+        return this.disabled || !!option.disabled;
+    }
+    getButtonClasses(option) {
+        const classes = [
+            'sd-radio-button-group__option',
+            this.isOptionSelected(option)
+                ? 'sd-radio-button-group__option--selected'
+                : 'sd-radio-button-group__option--unselected',
+        ];
+        if (this.isOptionDisabled(option)) {
+            classes.push('sd-radio-button-group__option--disabled');
+        }
+        return classes.join(' ');
+    }
+    getGroupClasses() {
+        const classes = ['sd-radio-button-group', `sd-radio-button-group--${this.size}`];
+        return classes.join(' ');
+    }
+    render() {
+        const groupName = this.name || `sd-radio-button-group-${Math.random().toString(36).substring(2, 11)}`;
+        return (hAsync("div", { key: '11b2fa2d7c019ea5d1c535e8f36ac488169e11e9', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map((option, index) => {
+            const isSelected = this.isOptionSelected(option);
+            const isDisabled = this.isOptionDisabled(option);
+            return (hAsync("label", { key: `radio-${index}`, class: this.getButtonClasses(option), role: "radio", "aria-checked": isSelected.toString(), "aria-disabled": isDisabled.toString(), "aria-label": option.label || 'radio option' }, hAsync("input", { type: "radio", name: groupName, value: option.value.toString(), checked: isSelected, disabled: isDisabled, onInput: () => this.handleRadioChange(option.value, option.disabled) }), option.label && hAsync("span", { class: "sd-radio-button-group__label" }, option.label)));
+        })));
+    }
+    static get watchers() { return {
+        "value": ["valueChanged"]
+    }; }
+    static get style() { return sdRadioButtonGroupCss(); }
+    static get cmpMeta() { return {
+        "$flags$": 768,
+        "$tagName$": "sd-radio-button-group",
+        "$members$": {
+            "value": [1544],
+            "radioOptions": [1040],
+            "size": [1],
+            "disabled": [4],
+            "name": [1],
+            "selectedValue": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": [["value", "value"]]
+    }; }
+}
+
+const sdRadioGroupCss = () => `sd-radio-group{display:inline-block}sd-radio-group .sd-radio-group{display:flex}sd-radio-group .sd-radio-group--vertical{flex-direction:column;gap:8px}sd-radio-group .sd-radio-group--horizontal{flex-direction:row;align-items:center;gap:20px}sd-radio-group .sd-radio-group__option{width:fit-content;display:flex;align-items:center;gap:8px;font-weight:400;font-size:12px;line-height:20px;cursor:pointer}sd-radio-group .sd-radio-group__option:has(input:disabled){cursor:default}sd-radio-group .sd-radio-group__option input{position:relative;appearance:none;margin:0;width:16px;height:16px;border:1px solid #888888;border-radius:50%;cursor:pointer;accent-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked{border-color:#0075ff;background-color:white}sd-radio-group .sd-radio-group__option input:checked::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:10px;height:10px;border-radius:50%;background-color:#0075ff}sd-radio-group .sd-radio-group__option input:disabled{cursor:default;border-color:#cccccc;background-color:#eeeeee}sd-radio-group .sd-radio-group__option input:disabled:checked::before{background-color:#cccccc}sd-radio-group .sd-radio-group__option input:not(:disabled):hover{border-color:#0075ff;background-color:#d9eaff}sd-radio-group .sd-radio-group__label{font-size:12px;color:#333333;line-height:20px;user-select:none}sd-radio-group .sd-radio-group__option--disabled .sd-radio-group__label{color:#888888}`;
 
 class SdRadioGroup {
     constructor(hostRef) {
@@ -7078,7 +7395,7 @@ class SdRadioGroup {
     }
     render() {
         const groupName = this.name || `sd-radio-group-${Math.random().toString(36).substring(2, 11)}`;
-        return (hAsync("div", { key: 'f817ced0e784c418c09c6c3e1cd6d9e045d32598', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map((option, index) => {
+        return (hAsync("div", { key: '41a5801484b12c0688d34d7225b07ce4ac8073fa', class: this.getGroupClasses(), role: "radiogroup", "aria-disabled": this.disabled.toString() }, this.radioOptions.map((option, index) => {
             const isSelected = this.isOptionSelected(option);
             const isDisabled = this.isOptionDisabled(option);
             return (hAsync("label", { key: `radio-${index}`, class: this.getRadioClasses(option), role: "radio", "aria-checked": isSelected.toString(), "aria-disabled": isDisabled.toString(), "aria-label": option.label || 'radio option' }, hAsync("input", { type: "radio", name: groupName, value: option.value.toString(), checked: isSelected, disabled: isDisabled, onInput: () => this.handleRadioChange(option.value, option.disabled) }), option.label && hAsync("span", { class: "sd-radio-group__label" }, option.label)));
@@ -7087,7 +7404,7 @@ class SdRadioGroup {
     static get watchers() { return {
         "value": ["valueChanged"]
     }; }
-    static get style() { return sdRadioGroupCss; }
+    static get style() { return sdRadioGroupCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-radio-group",
@@ -7217,7 +7534,7 @@ class SelectKeyboardNavigation {
     }
 }
 
-const sdSelectCss = ".sd-select__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select__dropdown::-webkit-scrollbar-track{background-color:transparent}.sd-select{display:flex;width:var(--select-width, 200px);height:28px;position:relative;color:#333333;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select:hover:not(.sd-select--disabled){background:#f6f6f6}.sd-select.sd-select--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select.sd-select--disabled .sd-select__label{border-right:1px solid #cccccc}.sd-select.sd-select--disabled .sd-select__trigger{color:#888888}.sd-select.sd-select--disabled .sd-select__trigger:focus,.sd-select.sd-select--disabled .sd-select__trigger:focus-visible,.sd-select.sd-select--disabled .sd-select__trigger:focus-within{outline:none !important}.sd-select__label{font-size:12px;line-height:20px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6;display:inline-block;white-space:nowrap}.sd-select__container{position:relative;width:100%;display:flex}.sd-select__container .sd-select__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select__container .sd-select__trigger .sd-select__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}.sd-select__container .sd-select__trigger .sd-select__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select__container .sd-select__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select__container .sd-select__arrow--open{transform:rotate(180deg)}.sd-select__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;display:flex;flex-direction:column}.sd-select__dropdown .sd-select__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select__dropdown .sd-select__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select__dropdown .sd-select__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}";
+const sdSelectCss = () => `.sd-select__dropdown{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-select__dropdown::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-select__dropdown::-webkit-scrollbar:horizontal{height:8px}.sd-select__dropdown::-webkit-scrollbar:vertical{width:8px}.sd-select__dropdown::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-select__dropdown::-webkit-scrollbar-track{background-color:transparent}.sd-select{display:flex;width:var(--select-width, 200px);height:28px;position:relative;color:#333333;cursor:pointer;user-select:none;border:1px solid #aaaaaa;border-radius:4px;background-color:white}.sd-select:hover:not(.sd-select--disabled){background:#f6f6f6}.sd-select.sd-select--disabled{cursor:not-allowed;background-color:#eeeeee;border-color:#cccccc}.sd-select.sd-select--disabled .sd-select__label{border-right:1px solid #cccccc}.sd-select.sd-select--disabled .sd-select__trigger{color:#888888}.sd-select.sd-select--disabled .sd-select__trigger:focus,.sd-select.sd-select--disabled .sd-select__trigger:focus-visible,.sd-select.sd-select--disabled .sd-select__trigger:focus-within{outline:none !important}.sd-select__label{font-size:12px;line-height:20px;font-weight:500;color:#333333;padding:4px 12px;border-right:1px solid #cccccc;border-radius:4px 0 0 4px;background-color:#f6f6f6;display:inline-block;white-space:nowrap}.sd-select__container{position:relative;width:100%;display:flex}.sd-select__container .sd-select__trigger{padding:4px 20px 4px 12px;display:flex;width:100%;align-items:center}.sd-select__container .sd-select__trigger .sd-select__value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:20px;font-size:12px;font-weight:400;text-align:left}.sd-select__container .sd-select__trigger .sd-select__clear{margin:0 4px;width:8px;height:8px;background-color:transparent;outline:none;border:none}.sd-select__container .sd-select__arrow{position:absolute;top:8px;right:8px;width:12px;height:12px;color:#888888;transition:transform 0.3s ease}.sd-select__container .sd-select__arrow--open{transform:rotate(180deg)}.sd-select__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;display:flex;flex-direction:column}.sd-select__dropdown .sd-select__search-container{position:sticky;top:0;display:flex;width:100%;background-color:white;align-items:center;padding:4px 8px}.sd-select__dropdown .sd-select__search-container--scrolled{box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-select__dropdown .sd-select__option-placeholder{padding:4px 12px;font-size:12px;line-height:20px;text-align:left}`;
 
 class SdSelect extends BaseDropdownEvent {
     constructor(hostRef) {
@@ -7253,6 +7570,9 @@ class SdSelect extends BaseDropdownEvent {
     searchRef;
     optionRef;
     dropdownRef;
+    async open() {
+        this.isOpen = true;
+    }
     valueChanged() {
         const selectedOption = this.getSelectedOption();
         this.sdChange?.emit({ value: selectedOption?.value || null, option: selectedOption || null });
@@ -7268,7 +7588,7 @@ class SdSelect extends BaseDropdownEvent {
         if (this.searchable) {
             const searchInput = await this.getNativeInputElement();
             if (this.itemIndex === -1) {
-                searchInput?.focus();
+                searchInput?.focus({ preventScroll: true });
                 return;
             }
             else if (searchInput?.matches(':focus')) {
@@ -7313,7 +7633,7 @@ class SdSelect extends BaseDropdownEvent {
         const currentItem = optionElements?.[this.itemIndex];
         if (this.searchable) {
             const searchInput = await this.getNativeInputElement();
-            searchInput?.focus();
+            searchInput?.focus({ preventScroll: true });
         }
         if (!currentItem)
             return;
@@ -7421,11 +7741,11 @@ class SdSelect extends BaseDropdownEvent {
             '--select-width': this.width || '200px',
             '--select-dropdown-height': this.dropdownHeight || '260px',
         };
-        return (hAsync(Host, { key: 'a99d2903e6156a30aa834dea2344829edbde67cb', style: style }, hAsync("div", { key: '39862875a121d9add2c0101d81e223d475d14abb', class: {
+        return (hAsync(Host, { key: 'ba065b311487ea934dc46736fd633d4d1a13f2e4', style: style }, hAsync("div", { key: '904d988d274e7827d5c969ba45643648ba0a61b3', class: {
                 'sd-select': true,
                 'sd-select--open': this.isOpen,
                 'sd-select--disabled': this.disabled,
-            }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: '6a7e4ffc442e4edfe508e60c8b578f8c8fb5e409', class: "sd-select__container" }, this.renderTrigger(), this.renderDropdown()))));
+            }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: '66fe35a68fa18cf97b4db110572f86faefa59207', class: "sd-select__container" }, this.renderTrigger(), this.renderDropdown()))));
     }
     renderLabel(label) {
         if (!label)
@@ -7462,7 +7782,7 @@ class SdSelect extends BaseDropdownEvent {
         "itemIndex": ["itemIndexChanged"],
         "isOpen": ["isOpenChanged"]
     }; }
-    static get style() { return sdSelectCss; }
+    static get style() { return sdSelectCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-select",
@@ -7482,7 +7802,8 @@ class SdSelect extends BaseDropdownEvent {
             "isOpen": [32],
             "searchText": [32],
             "itemIndex": [32],
-            "isScrolled": [32]
+            "isScrolled": [32],
+            "open": [64]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -7490,7 +7811,7 @@ class SdSelect extends BaseDropdownEvent {
     }; }
 }
 
-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}";
+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}`;
 
 class SdSelectMultiple extends BaseDropdownEvent {
     constructor(hostRef) {
@@ -7527,6 +7848,9 @@ class SdSelectMultiple extends BaseDropdownEvent {
     searchRef;
     optionRef;
     dropdownRef;
+    async open() {
+        this.isOpen = true;
+    }
     valueChanged() {
         this.sdChange?.emit(this.value);
     }
@@ -7702,11 +8026,11 @@ class SdSelectMultiple extends BaseDropdownEvent {
             '--select-width': this.width || '200px',
             '--select-dropdown-height': this.dropdownHeight || '260px',
         };
-        return (hAsync(Host, { key: '356e513b8d7e856ed22d5358027b163463d55c1d', style: style }, hAsync("div", { key: '3a75650badea618ed89899de57fbd25c020df6d0', class: {
+        return (hAsync(Host, { key: '24d4287067a9706099a20c46abee2d25a8271c1c', style: style }, hAsync("div", { key: '8b6f63ea974841ded9607c592d2c866a32bdccdf', 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), hAsync("div", { key: 'e42235a132e3c13e9a996206ab7f58698ab97fe1', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
+            }, ref: el => (this.selectRef = el) }, this.renderLabel(this.label), hAsync("div", { key: '2d35e79a95e5cd2ec8b055ca4d7a38e70ac13936', class: "sd-select-multiple__container" }, this.renderTrigger(), this.renderDropdown()))));
     }
     renderLabel(label) {
         if (!label)
@@ -7743,7 +8067,7 @@ class SdSelectMultiple extends BaseDropdownEvent {
         "itemIndex": ["itemIndexChanged"],
         "isOpen": ["isOpenChanged"]
     }; }
-    static get style() { return sdSelectMultipleCss; }
+    static get style() { return sdSelectMultipleCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-select-multiple",
@@ -7764,7 +8088,8 @@ class SdSelectMultiple extends BaseDropdownEvent {
             "isOpen": [32],
             "searchText": [32],
             "itemIndex": [32],
-            "isScrolled": [32]
+            "isScrolled": [32],
+            "open": [64]
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
@@ -7772,7 +8097,7 @@ class SdSelectMultiple extends BaseDropdownEvent {
     }; }
 }
 
-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}";
+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}`;
 
 class SdSelectMultipleGroup extends BaseDropdownEvent {
     constructor(hostRef) {
@@ -7832,7 +8157,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
         if (this.searchable) {
             const searchInput = await this.getNativeInputElement();
             if (this.itemIndex === -1) {
-                searchInput?.focus();
+                searchInput?.focus({ preventScroll: true });
                 return;
             }
             else if (searchInput?.matches(':focus')) {
@@ -7870,7 +8195,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
         // 드롭다운이 열릴 때 검색 입력에 포커스
         if (this.searchable) {
             const searchInput = await this.getNativeInputElement();
-            searchInput?.focus();
+            searchInput?.focus({ preventScroll: true });
         }
         if (!currentItem)
             return;
@@ -8114,11 +8439,11 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
             '--select-width': this.width || '200px',
             '--select-dropdown-height': this.dropdownHeight || '260px',
         };
-        return (hAsync(Host, { key: '2fb8b95f341cea6870702474d549b10b46a33551', style: style }, hAsync("div", { key: 'f0ffc9960ae27bc1e76e3cd59592de205ae0071d', class: {
+        return (hAsync(Host, { key: 'efc8661d6cd2e043b5e43e0872de3a9bff6d57a6', style: style }, hAsync("div", { key: 'e9f7615f75cb28974dececc8e847e868aef8210c', class: {
                 'sd-select-multiple-group': true,
                 'sd-select-multiple-group--open': this.isOpen,
                 'sd-select-multiple-group--disabled': this.disabled,
-            }, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), hAsync("div", { key: '1496b603a09001a571388baade46e4d14f19e51d', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
+            }, style: this.containerStyle, ref: el => (this.selectRef = el) }, this.renderLabel(this.label, this.labelStyle), hAsync("div", { key: '37ea4df1408eebde9e9e6d6d42579a3c40da325a', class: "sd-select-multiple-group__container" }, this.renderTrigger(), this.renderDropdown()))));
     }
     renderLabel(label, labelStyle) {
         if (!label)
@@ -8168,7 +8493,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
         "itemIndex": ["itemIndexChanged"],
         "isOpen": ["isOpenChanged"]
     }; }
-    static get style() { return sdSelectMultipleGroupCss; }
+    static get style() { return sdSelectMultipleGroupCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-select-multiple-group",
@@ -8205,7 +8530,7 @@ class SdSelectMultipleGroup extends BaseDropdownEvent {
     }; }
 }
 
-const sdSelectOptionCss = "sd-select-option{display:block;height:fit-content;line-height:0}sd-select-option .sd-select__option{display:flex;padding:4px 12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option .sd-select__option__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option .sd-select__option--focused{background-color:#e6f1ff}sd-select-option .sd-select__option--selected:not(:hover):not(.sd-select__option--use-checkbox),sd-select-option .sd-select__option--focused:not(:hover):not(.sd-select__option--use-checkbox){color:#0075ff;font-weight:700}sd-select-option .sd-select__option--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option .sd-select__option:hover:not(.sd-select__option--disabled){background-color:#0075ff;color:white}";
+const sdSelectOptionCss = () => `sd-select-option{display:block;height:fit-content;line-height:0}sd-select-option .sd-select__option{display:flex;padding:4px 12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option .sd-select__option__checkbox-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option .sd-select__option--focused{background-color:#e6f1ff}sd-select-option .sd-select__option--selected:not(:hover):not(.sd-select__option--use-checkbox),sd-select-option .sd-select__option--focused:not(:hover):not(.sd-select__option--use-checkbox){color:#0075ff;font-weight:700}sd-select-option .sd-select__option--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option .sd-select__option:hover:not(.sd-select__option--disabled){background-color:#0075ff;color:white}`;
 
 class SdSelectOption {
     constructor(hostRef) {
@@ -8236,7 +8561,7 @@ class SdSelectOption {
         }
     };
     render() {
-        return (hAsync(Host, { key: '7cf5b51057f8eb7ad7cf7143225bcd842e5fa231' }, hAsync("div", { key: 'ab9e02db38a0717b9aeb85890b150a6e59a9f7ee', class: {
+        return (hAsync(Host, { key: 'd3235f4b0314c15a8d280377d88db6bf53f7eb79' }, hAsync("div", { key: '033fe384d67211a387d609a7b462330ee86c67a2', class: {
                 'sd-select__option': true,
                 'sd-select__option--selected': this.isSelected,
                 'sd-select__option--disabled': !!this.option.disabled,
@@ -8255,7 +8580,7 @@ class SdSelectOption {
                 this.handleClick(e);
             } }), hAsync("span", { class: "sd-select__option-label" }, this.option.label))) : (this.option.label))));
     }
-    static get style() { return sdSelectOptionCss; }
+    static get style() { return sdSelectOptionCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-select-option",
@@ -8276,7 +8601,7 @@ class SdSelectOption {
     }; }
 }
 
-const sdSelectOptionGroupCss = "sd-select-option-group{display:block;height:fit-content}sd-select-option-group .sd-select__option-group{display:flex;padding:4px 12px;padding-left:12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option-group .sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default !important}sd-select-option-group .sd-select__option-group.sd-select__option-group--group{background-color:#f5faff !important;color:#333333 !important;font-weight:700}sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}sd-select-option-group .sd-select__option-group.sd-select__option-group--item{padding-left:28px}sd-select-option-group .sd-select__option-group sd-checkbox__bg{border-color:#888888}sd-select-option-group .sd-select__option-group__label-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option-group .sd-select__option-group__label-wrapper sd-checkbox{flex-shrink:0}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group-label{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group__count-indicator{width:fit-content;flex-shrink:0;font-size:12px;font-weight:500;color:#888888}sd-select-option-group .sd-select__option-group--focused{background-color:#e6f1ff}sd-select-option-group .sd-select__option-group--selected.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group--focused.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}sd-select-option-group .sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option-group .sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}sd-select-option-group .sd-select__option-group:hover.sd-select__option-group--selected:not(.sd-select__option-group--group):not(.sd-select__option-group--subgroup) sd-checkbox .sd-checkbox__bg{border-color:white !important}";
+const sdSelectOptionGroupCss = () => `sd-select-option-group{display:block;height:fit-content}sd-select-option-group .sd-select__option-group{display:flex;padding:4px 12px;padding-left:12px;font-size:12px;line-height:20px;cursor:pointer}sd-select-option-group .sd-select__option-group.sd-select__option-group--group:not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup:not(.sd-select__option-group--use-checkbox){cursor:default !important}sd-select-option-group .sd-select__option-group.sd-select__option-group--group{background-color:#f5faff !important;color:#333333 !important;font-weight:700}sd-select-option-group .sd-select__option-group.sd-select__option-group--subgroup{padding-left:20px;background-color:#f9f9f9 !important;color:#333333 !important;font-weight:500}sd-select-option-group .sd-select__option-group.sd-select__option-group--item{padding-left:28px}sd-select-option-group .sd-select__option-group sd-checkbox__bg{border-color:#888888}sd-select-option-group .sd-select__option-group__label-wrapper{display:flex;width:100%;column-gap:8px;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}sd-select-option-group .sd-select__option-group__label-wrapper sd-checkbox{flex-shrink:0}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group-label{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sd-select-option-group .sd-select__option-group__label-wrapper .sd-select__option-group__count-indicator{width:fit-content;flex-shrink:0;font-size:12px;font-weight:500;color:#888888}sd-select-option-group .sd-select__option-group--focused{background-color:#e6f1ff}sd-select-option-group .sd-select__option-group--selected.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox),sd-select-option-group .sd-select__option-group--focused.sd-select__option-group--item:not(:hover):not(.sd-select__option-group--use-checkbox){color:#0075ff;font-weight:700}sd-select-option-group .sd-select__option-group--disabled{color:#aaaaaa;cursor:not-allowed}sd-select-option-group .sd-select__option-group:hover:not(.sd-select__option-group--disabled){background-color:#0075ff;color:white}sd-select-option-group .sd-select__option-group:hover.sd-select__option-group--selected:not(.sd-select__option-group--group):not(.sd-select__option-group--subgroup) sd-checkbox .sd-checkbox__bg{border-color:white !important}`;
 
 class SdSelectOptionGroup {
     constructor(hostRef) {
@@ -8322,7 +8647,7 @@ class SdSelectOptionGroup {
         }
     };
     render() {
-        return (hAsync("div", { key: '2d1e55e35c77246a2df6856b2e7053cc21aabfc5', class: {
+        return (hAsync("div", { key: 'db08c9cdb5179cccfa040fa03e06f286231bc83f', class: {
                 'sd-select__option-group': true,
                 'sd-select__option-group--selected': !!this.isSelected,
                 'sd-select__option-group--disabled': !!this.option.disabled,
@@ -8331,12 +8656,12 @@ class SdSelectOptionGroup {
                 'sd-select__option-group--group': this.option.type === 'group',
                 'sd-select__option-group--subgroup': this.option.type === 'subgroup',
                 'sd-select__option-group--item': this.option.type === 'item',
-            }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: '33ce9985f9c94502d103d81b3678abdb732dfadb', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '262ec7ac68b981b5a69c21a5785c2c4ff5db7966', checked: this.isSelected, disabled: this.option.disabled, onClick: e => {
+            }, onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), style: this.optionStyle, "data-index": this.index, onClick: event => this.handleClick(this.option, this.isSelected, event) }, hAsync("div", { key: 'b723d71ef120c5d51f0ab859177d67814411ceaa', class: "sd-select__option-group__label-wrapper" }, this.useCheckbox && (hAsync("sd-checkbox", { key: '1630dfc22fb2ec65c186282f499ec4e6f93a228d', checked: this.isSelected, disabled: this.option.disabled, onClick: e => {
                 e.preventDefault();
                 this.handleClick(this.option, this.isSelected, e);
-            } })), hAsync("span", { key: 'f9c89b082413da5914e166d53e1fd9bc269395ce', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: 'eaec735454f0b3c102397352d7863662fa933b24', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
+            } })), hAsync("span", { key: '97802250891eca095172dae897bb957e49f9b5e3', class: "sd-select__option-group-label" }, this.option.label), this.useIndicator && this.option.type !== 'item' && (hAsync("span", { key: '96fe449b31bce677693f2ad325a6529fc4b264e3', class: "sd-select__option-group__count-indicator" }, `(${this.countInfo?.selectedCount}/${this.countInfo?.totalCount})`)))));
     }
-    static get style() { return sdSelectOptionGroupCss; }
+    static get style() { return sdSelectOptionGroupCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-select-option-group",
@@ -8359,7 +8684,7 @@ class SdSelectOptionGroup {
     }; }
 }
 
-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 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%)}`;
 
 let SdTable$1 = class SdTable {
     constructor(hostRef) {
@@ -8553,10 +8878,10 @@ let SdTable$1 = class SdTable {
             }, style: this.getStickyStyle(colIdx) }, hAsync("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, hAsync("slot", { name: `header-cell-${col.name}` }, hAsync("div", { class: "sd-th__content--label" }, col.label)), col.usePageMoveIcon && hAsync("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (hAsync("sd-tooltip", { ...col.tooltipOptions }, hAsync("div", { slot: "content" }, col.tooltip.map(text => (hAsync("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (hAsync("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(colIdx, evt) }))))))));
     }
     render() {
-        return (hAsync(Host, { key: 'a1b686469dfc58d9c57cdc975aac423cf9404012' }, hAsync("div", { key: '8707550d614eac9649b0bb7f9842e21ebe032c45', class: "sd-table__wrapper", style: {
+        return (hAsync(Host, { key: 'e87739da29d845e6125f0902d4ed6b5d026a6396' }, hAsync("div", { key: '88cdda9d8ea755451d1d4203e1c99e6299e5976f', class: "sd-table__wrapper", style: {
                 '--table-width': this.width,
                 '--table-height': this.height,
-            } }, hAsync("div", { key: 'df9ac71cdf2decd79714a66177ec65524ce35d5a', class: "sd-table__container" }, hAsync("div", { key: 'c4225356f08b883c82038426d923446f85edeb2b', class: "sd-table__middle", role: "table" }, hAsync("div", { key: '3a75336a77e732a5de56d057429f072a2c946042', part: "table", class: this.sdTableClasses }, this.renderHeader(), hAsync("sd-tbody", { key: 'c1aa8c874dfb96e411fb0b66134c5ab098629d87' }, hAsync("slot", { key: 'f2e40bf5c0fea78af06e3cc8be3568d21e9c4f8d' })))), hAsync("div", { key: 'a5e9382c17261d4f11e4ab9be2b26e6154677a03', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: 'f96b29f77f639184d674b3ea3ae7e28e620db1fb', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: 'e21505112e7b31904c1fde0985443f2e43544a2e', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => {
+            } }, hAsync("div", { key: 'd3005abd30787fc1dc9abeb696929431953b41af', class: "sd-table__container" }, hAsync("div", { key: 'df9392e80901fd65f7ac5dbf5062cc7066350801', class: "sd-table__middle", role: "table" }, hAsync("div", { key: 'a0fbd5d6dc678c9dc7a830c42081bb4bbb94ab8c', part: "table", class: this.sdTableClasses }, this.renderHeader(), hAsync("sd-tbody", { key: 'adc08dcd7f7f150437ed15de422e5d2715533171' }, hAsync("slot", { key: '2ceb6debd25a399178fb3e0357e80f568ca20e37' })))), hAsync("div", { key: '281e0bb2159e295dafde37dc7ca393a96e9e7ad4', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '834780fb066391bca88dba1e2944492c30ccbc22', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: '623576270d271eab4886e99c2f0163aaf41b2904', 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);
                 }
@@ -8564,7 +8889,7 @@ let SdTable$1 = class SdTable {
                     this.currentPage = e.detail;
                     this.sdPageChange.emit(this.currentPage);
                 }
-            } }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '32890039f67ebda027e336a31ab790141ec2c7c2', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
+            } }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '85ea699d7acb1ad4eccc6c97ca668a60c6f606e7', 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);
@@ -8592,7 +8917,7 @@ let SdTable$1 = class SdTable {
         "selected": ["handleSelectedChange"],
         "pagination": ["handlePaginationChange"]
     }; }
-    static get style() { return sdTableCss; }
+    static get style() { return sdTableCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-table",
@@ -8627,7 +8952,7 @@ let SdTable$1 = class SdTable {
     }; }
 };
 
-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:var(--table-container-height, auto);position:relative;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden;background:#ffffff}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position;min-height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--scrollable{height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle--loading__spinner{position:absolute;top:0;left:0;width:100%;height:var(--table-container-height, 100%);min-height:var(--table-container-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{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll{position:relative;height:var(--total-virtual-height, --table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr:not([aria-hidden=true]){width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]{padding:0;border:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]:not(.sd-table__virtual-row-spacer) td{display:none}.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 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__container .sd-table__bottom .sd-table__no-data{padding-top:15%;color:#888888}.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%)}.sd-table__wrapper .sd-table__virtual-spacer,.sd-table__wrapper .sd-table__virtual-row-spacer{padding:0 !important}.sd-table__wrapper .sd-table__virtual-spacer td,.sd-table__wrapper .sd-table__virtual-row-spacer td{padding:0 !important;border:none}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton{width:100%;height:100%;background-image:repeating-linear-gradient(0deg, rgba(246, 246, 246, 0.3) 0px, rgba(225, 225, 225, 0.5) calc(var(--row-height, 44px) / 2), rgba(246, 246, 246, 0.3) var(--row-height, 44px));background-size:100% 200%;animation:skeleton-loading 1.5s ease-in-out infinite;position:relative}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton::before,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row-height, 44px) - 1px), #e1e1e1 calc(var(--row-height, 44px) - 1px), #e1e1e1 var(--row-height, 44px));pointer-events:none}.sd-table__wrapper .sd-table__skeleton-cell{width:100%;height:20px;background:linear-gradient(90deg, rgba(246, 246, 246, 0.3) 0%, rgba(225, 225, 225, 0.5) 50%, rgba(246, 246, 246, 0.3) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}@keyframes skeleton-loading{0%{background-position:0% 0%}50%{background-position:100% 100%}100%{background-position:0% 0%}}";
+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:var(--table-container-height, auto);position:relative;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden;background:#ffffff}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;will-change:scroll-position;min-height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--scrollable{height:var(--table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle--loading__spinner{position:absolute;top:0;left:0;width:100%;height:var(--table-container-height, 100%);min-height:var(--table-container-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{background-color:white;display:table;width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll{position:relative;height:var(--total-virtual-height, --table-container-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr:not([aria-hidden=true]){width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]{padding:0;border:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody.sd-table-tbody--virtual-scroll tr[aria-hidden=true]:not(.sd-table__virtual-row-spacer) td{display:none}.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 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__container .sd-table__bottom .sd-table__no-data{padding-top:15%;color:#888888}.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%)}.sd-table__wrapper .sd-table__virtual-spacer,.sd-table__wrapper .sd-table__virtual-row-spacer{padding:0 !important}.sd-table__wrapper .sd-table__virtual-spacer td,.sd-table__wrapper .sd-table__virtual-row-spacer td{padding:0 !important;border:none}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton{width:100%;height:100%;background-image:repeating-linear-gradient(0deg, rgba(246, 246, 246, 0.3) 0px, rgba(225, 225, 225, 0.5) calc(var(--row-height, 44px) / 2), rgba(246, 246, 246, 0.3) var(--row-height, 44px));background-size:100% 200%;animation:skeleton-loading 1.5s ease-in-out infinite;position:relative}.sd-table__wrapper .sd-table__virtual-spacer .sd-table__skeleton::before,.sd-table__wrapper .sd-table__virtual-row-spacer .sd-table__skeleton::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row-height, 44px) - 1px), #e1e1e1 calc(var(--row-height, 44px) - 1px), #e1e1e1 var(--row-height, 44px));pointer-events:none}.sd-table__wrapper .sd-table__skeleton-cell{width:100%;height:20px;background:linear-gradient(90deg, rgba(246, 246, 246, 0.3) 0%, rgba(225, 225, 225, 0.5) 50%, rgba(246, 246, 246, 0.3) 100%);background-size:200% 100%;animation:skeleton-loading 1.5s ease-in-out infinite;border-radius:4px}@keyframes skeleton-loading{0%{background-position:0% 0%}50%{background-position:100% 100%}100%{background-position:0% 0%}}`;
 
 class SdTable {
     constructor(hostRef) {
@@ -9270,16 +9595,16 @@ class SdTable {
             }, "aria-hidden": "true" }, hAsync("div", { class: "sd-table__skeleton-cell" })));
     }
     render() {
-        return (hAsync(Host, { key: '1c762116fd35be7070aea38b052f8f619176cd32' }, hAsync("div", { key: '4201639381ebbe400ab124e1ab0e2badd3ffba9e', class: "sd-table__wrapper", style: {
+        return (hAsync(Host, { key: '5d04a8b7cf9dbc6cfb9dc4d6497f4eb6190caca1' }, hAsync("div", { key: 'da26d320dbd4542b226434e355c8ee947b4e1cf6', class: "sd-table__wrapper", style: {
                 '--table-width': this.width,
                 '--table-height': this.height,
-            } }, hAsync("div", { key: 'c17c7b76ab6f33faf605ad2c4f023f5f0411c847', class: "sd-table__container", style: {
+            } }, hAsync("div", { key: 'f3fe16bd185e08f2cbba94199bb9d55dc854b085', class: "sd-table__container", style: {
                 '--table-container-height': `calc(${this.height} - ${this.pagination && this.innerRows.length > 0 ? 48 : 0}px)`,
-            } }, hAsync("div", { key: 'd7b1e53fbbe6c8c282b6455a113aa1fb7abf0f13', class: {
+            } }, hAsync("div", { key: '5e0976df3206aca9f33e54b85bda479110397621', class: {
                 'sd-table__middle': true,
                 'sd-table__middle--scrollable': this.paginatedRows.length > 0,
                 'sd-table__middle--loading': this.isLoading,
-            } }, this.isLoading && (hAsync("div", { key: '3c8d66915131a8388d19c2d6101716d709f29c4a', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: '5bd2eb67b7f16929dc4829d3ed069ee7b976f4bf' }))), hAsync("table", { key: 'be2d1b31673397a7aebeff85827d40343970aac0', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), hAsync("div", { key: 'f6436dc02163f34d3f9efcd6bc312561e88f3d08', class: "sd-table__bottom" }, !this.paginatedRows.length && (hAsync("div", { key: 'b0f27e8d1b7343619c356bc0d9c074e4dbe91ff0', class: "sd-table__no-data" }, hAsync("slot", { key: '0ea8e9e5624ce063c88b71de32ab7c4607344af9', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: '271d506c6f9e98a6f4e69364be977e299fa4f794', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: '1bff466793f04d5c76b9682fa546a66f9546cf0a', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: '51731aabcbfd68cf606423e008fcc89995419803', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => this.changeRowsPerPage(e.detail.value) })))))));
+            } }, this.isLoading && (hAsync("div", { key: 'fa934df1cf18e69b4054b6795ac9973755823cf6', class: "sd-table__middle--loading__spinner" }, hAsync("sd-loading-spinner", { key: 'd21458340e4904ce938a86321732dfb04969ef7c' }))), hAsync("table", { key: '0bddebe63faffebdd3950f21e5a66e4f8d8d56e9', part: "table", class: this.sdTableClasses }, this.renderHead(), this.renderBody())), hAsync("div", { key: '12a66491f58bcabcfdd861a9ca2d0dc32d0968df', class: "sd-table__bottom" }, !this.paginatedRows.length && (hAsync("div", { key: '2058dace66a36697ca7018d6f83f3a00582fe9a1', class: "sd-table__no-data" }, hAsync("slot", { key: 'c99d5416ce3ccb2c1512da61b60391d5b63c85b1', name: "no-data" }, this.noDataLabel))))), this.pagination && this.innerRows.length > 0 && (hAsync("div", { key: 'bd8f8b4351a8195489bc1d585585f321e26c8c7b', class: "sd-table__pagination" }, hAsync("sd-pagination", { key: '443622f1f52136e7d4212d4073e23cd2b6c05c99', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (hAsync("sd-select", { key: 'cdcce50397d18466c3c010625e5dfe369852da73', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => this.changeRowsPerPage(e.detail.value) })))))));
     }
     static get watchers() { return {
         "columns": ["handleColumnsChange"],
@@ -9288,7 +9613,7 @@ class SdTable {
         "selected": ["handleSelectedChange"],
         "pagination": ["handlePaginationChange"]
     }; }
-    static get style() { return sdTableBackupCss; }
+    static get style() { return sdTableBackupCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-table-backup",
@@ -9334,30 +9659,106 @@ class SdTable {
     }; }
 }
 
-const sdTagCss = ":host{display:inline-block}:host([full-width]){display:block}.sd-tag{display:inline-flex;width:100%;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:1px solid transparent;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}.sd-tag__content{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-tag--custom-color{background:var(--tag-bg-color);color:var(--tag-text-color)}.sd-tag--sm{padding:0 6px;font-size:11px;line-height:18px;height:20px;border-radius:4px}.sd-tag--md{padding:0 8px;font-size:12px;font-weight:700;line-height:20px;height:24px;border-radius:4px}.sd-tag--lg{padding:0 10px;font-size:14px;font-weight:700;line-height:24px;min-height:28px;border-radius:5px}.sd-tag--rounded.sd-tag--sm{border-radius:20px}.sd-tag--rounded.sd-tag--md{border-radius:20px}.sd-tag--rounded.sd-tag--lg{border-radius:15px}";
+const sdTabsCss = () => `sd-tabs{display:inline-block}sd-tabs .sd-tabs{display:flex;flex-direction:row;gap:4px;border-bottom:1px solid #0075ff}sd-tabs .sd-tabs__tab{display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border:1px solid #cccccc;border-bottom:none;border-radius:4px 4px 0 0;background-color:#f6f6f6;color:#888888;font-weight:400;transition:all 0.2s ease;position:relative;user-select:none}sd-tabs .sd-tabs__tab::before{content:"";position:absolute;inset:0;opacity:0;transition:all 0.3s}sd-tabs .sd-tabs__tab--selected{border-color:#0075ff;color:#0075ff;background-color:white;font-weight:700}sd-tabs .sd-tabs__tab--selected:hover::before{background-color:#0075ff;opacity:0.15}sd-tabs .sd-tabs__tab--unselected:hover::before{background-color:#888888;opacity:0.15}sd-tabs .sd-tabs__label{user-select:none}sd-tabs .sd-tabs--md .sd-tabs__tab{padding:12px 32px;font-size:12px;line-height:20px}sd-tabs .sd-tabs--sm .sd-tabs__tab{padding:8px 20px;font-size:12px;line-height:16px}sd-tabs .sd-tabs--sub{gap:32px;border-bottom:none}sd-tabs .sd-tabs--sub .sd-tabs__tab{border:none;border-radius:0;background-color:transparent;color:#222222;font-weight:400;padding:0 0 2px 0}sd-tabs .sd-tabs--sub .sd-tabs__tab::before{display:none}sd-tabs .sd-tabs--sub .sd-tabs__tab--selected{color:#0075ff;font-weight:700;border-bottom:1px solid #0075ff;background-color:transparent}sd-tabs .sd-tabs--sub .sd-tabs__tab--selected:hover::before,sd-tabs .sd-tabs--sub .sd-tabs__tab--unselected:hover::before{display:none}`;
 
-const TAG_COLORS = {
-    grey: 'bg-grey_20 text-grey_70',
-    red: 'bg-red_15 text-red_70',
-    orange: 'bg-orange_10 text-orange_65',
-    yellow: 'bg-yellow_10 text-yellow_60',
-    green: 'bg-green_15 text-green_70',
-    blue: 'bg-brilliantblue_20 text-brilliantblue_75',
-    darkblue: 'bg-oceanblue_15 text-oceanblue_70',
-    indigo: 'bg-brilliantblue_10 text-brilliantblue_85',
-};
-class SdTag {
+class SdTabs {
     constructor(hostRef) {
         registerInstance(this, hostRef);
+        this.sdChange = createEvent(this, "sdChange");
     }
-    get el() { return getElement(this); }
+    value;
+    tabs = [];
     size = 'md';
-    color = 'grey';
-    rounded = false;
-    label = '';
-    bgColor;
-    textColor;
-    getTagClasses() {
+    isSub = false;
+    selectedValue;
+    sdChange;
+    componentWillLoad() {
+        if (this.value !== undefined && this.value !== null) {
+            this.selectedValue = this.value;
+        }
+    }
+    valueChanged(newValue) {
+        this.selectedValue = newValue;
+    }
+    handleTabClick = (tabValue) => {
+        this.selectedValue = tabValue;
+        this.value = tabValue;
+        this.sdChange.emit(tabValue);
+    };
+    isTabSelected(tab) {
+        return this.selectedValue === tab.value;
+    }
+    getTabClasses(tab) {
+        const classes = [
+            'sd-tabs__tab',
+            this.isTabSelected(tab) ? 'sd-tabs__tab--selected' : 'sd-tabs__tab--unselected',
+        ];
+        return classes.join(' ');
+    }
+    getContainerClasses() {
+        const classes = ['sd-tabs', `sd-tabs--${this.size}`];
+        if (this.isSub) {
+            classes.push('sd-tabs--sub');
+        }
+        return classes.join(' ');
+    }
+    getBadgeColors(tab) {
+        if (this.isTabSelected(tab)) {
+            return { bgColor: '#E6F1FF', textColor: '#0075FF' };
+        }
+        return { bgColor: '#E5E5E5', textColor: '#737373' };
+    }
+    render() {
+        return (hAsync("div", { key: '749c892c45eccc71e2faad842be4dfd311aa2eed', class: this.getContainerClasses(), role: "tablist" }, this.tabs.map((tab, index) => {
+            const isSelected = this.isTabSelected(tab);
+            const badgeColors = this.getBadgeColors(tab);
+            return (hAsync("div", { key: `tab-${index}`, class: this.getTabClasses(tab), role: "tab", "aria-selected": isSelected.toString(), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab.value) }, hAsync("span", { class: "sd-tabs__label" }, tab.label), tab.badge && (hAsync("sd-tag", { size: this.size, label: tab.badge.toString(), bgColor: badgeColors.bgColor, textColor: badgeColors.textColor, rounded: true }))));
+        })));
+    }
+    static get watchers() { return {
+        "value": ["valueChanged"]
+    }; }
+    static get style() { return sdTabsCss(); }
+    static get cmpMeta() { return {
+        "$flags$": 768,
+        "$tagName$": "sd-tabs",
+        "$members$": {
+            "value": [1537],
+            "tabs": [1040],
+            "size": [1],
+            "isSub": [4, "is-sub"],
+            "selectedValue": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": [["value", "value"]]
+    }; }
+}
+
+const sdTagCss = () => `:host{display:inline-block}:host([full-width]){display:block}.sd-tag{display:inline-flex;width:100%;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:1px solid transparent;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}.sd-tag__content{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sd-tag--custom-color{background:var(--tag-bg-color);color:var(--tag-text-color)}.sd-tag--sm{padding:0 6px;font-size:11px;line-height:18px;height:20px;border-radius:4px}.sd-tag--md{padding:0 8px;font-size:12px;font-weight:700;line-height:20px;height:24px;border-radius:4px}.sd-tag--lg{padding:0 10px;font-size:14px;font-weight:700;line-height:24px;min-height:28px;border-radius:5px}.sd-tag--rounded.sd-tag--sm{border-radius:20px}.sd-tag--rounded.sd-tag--md{border-radius:20px}.sd-tag--rounded.sd-tag--lg{border-radius:15px}`;
+
+const TAG_COLORS = {
+    grey: 'bg-grey_20 text-grey_70',
+    red: 'bg-red_15 text-red_70',
+    orange: 'bg-orange_10 text-orange_65',
+    yellow: 'bg-yellow_10 text-yellow_60',
+    green: 'bg-green_15 text-green_70',
+    blue: 'bg-brilliantblue_20 text-brilliantblue_75',
+    darkblue: 'bg-oceanblue_15 text-oceanblue_70',
+    indigo: 'bg-brilliantblue_10 text-brilliantblue_85',
+};
+class SdTag {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    get el() { return getElement(this); }
+    size = 'md';
+    color = 'grey';
+    rounded = false;
+    label = '';
+    bgColor;
+    textColor;
+    getTagClasses() {
         const classes = ['sd-tag', `sd-tag--${this.size}`];
         if (this.rounded) {
             classes.push('sd-tag--rounded');
@@ -9377,12 +9778,12 @@ class SdTag {
     }
     render() {
         const tagClasses = this.getTagClasses();
-        return (hAsync("span", { key: '3ab30b01fbf0c25426e7903ed05372399c380a01', class: tagClasses, style: {
+        return (hAsync("span", { key: '6f3353059d6a1516dd11e23f6347f52f514020e4', class: tagClasses, style: {
                 '--tag-bg-color': this.bgColor,
                 '--tag-text-color': this.textColor,
             }, "aria-label": this.label || 'tag' }, this.renderContent()));
     }
-    static get style() { return sdTagCss; }
+    static get style() { return sdTagCss(); }
     static get cmpMeta() { return {
         "$flags$": 777,
         "$tagName$": "sd-tag",
@@ -9400,16 +9801,16 @@ class SdTag {
     }; }
 }
 
-const sdTbodyCss = "sd-tbody{display:table-row-group}";
+const sdTbodyCss = () => `sd-tbody{display:table-row-group}`;
 
 class SdTbody {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: 'aa5030bb9713c355685de66e15db8b702744c0bc' }, hAsync("slot", { key: '2bfed556b78fc92f8f6b4c574f976a7f0a3c36a8' })));
+        return (hAsync(Host, { key: '96bedf612efa56d790df7070e2641f6769da81a9' }, hAsync("slot", { key: '9980c55cf76b1600034d8dcd60249b392c0c50f2' })));
     }
-    static get style() { return sdTbodyCss; }
+    static get style() { return sdTbodyCss(); }
     static get cmpMeta() { return {
         "$flags$": 260,
         "$tagName$": "sd-tbody",
@@ -9420,7 +9821,7 @@ class SdTbody {
     }; }
 }
 
-const sdTdCss = "sd-td{display:table-cell;padding:12px 16px;vertical-align:middle;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}";
+const sdTdCss = () => `sd-td{display:table-cell;padding:12px 16px;vertical-align:middle;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}`;
 
 class SdTd {
     constructor(hostRef) {
@@ -9431,13 +9832,13 @@ class SdTd {
     tdStyle;
     tdClass;
     render() {
-        return (hAsync(Host, { key: '6459518995f28a8138b3f669876c90dd24e610c2', role: "cell", class: {
+        return (hAsync(Host, { key: '182bd00cbbb22b4f3613e973d2999421a3f5f2cd', role: "cell", class: {
                 'sd-td': true,
                 [`sd-td--${this.align}`]: true,
                 [this.tdClass || '']: Boolean(this.tdClass),
-            }, style: this.tdStyle }, hAsync("slot", { key: 'bf51d35dee9adb6a88b29a6c51be9f73ae1ab3b5' })));
+            }, style: this.tdStyle }, hAsync("slot", { key: 'fff1a74106822c8092fa57ba785f6ab5be96edcd' })));
     }
-    static get style() { return sdTdCss; }
+    static get style() { return sdTdCss(); }
     static get cmpMeta() { return {
         "$flags$": 772,
         "$tagName$": "sd-td",
@@ -9453,16 +9854,16 @@ class SdTd {
     }; }
 }
 
-const sdThCss = "sd-th{display:table-cell;padding:12px;font-weight:bold;text-align:left;border-bottom:2px solid #ddd;background-color:#f1f1f1}";
+const sdThCss = () => `sd-th{display:table-cell;padding:12px;font-weight:bold;text-align:left;border-bottom:2px solid #ddd;background-color:#f1f1f1}`;
 
 class SdTh {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: 'a9adef2bdfd7dd0a52a55fffb40db6511db5747e', role: "columnheader" }, hAsync("slot", { key: 'd4af30df5d6a4a9140a9d10e0f3948de088f8c18' })));
+        return (hAsync(Host, { key: 'cbd2372809ca102893f62b3b4e2d51342cc4c52f', role: "columnheader" }, hAsync("slot", { key: 'c51c2635013c8d405bf3d95d46d2b99bc52c3326' })));
     }
-    static get style() { return sdThCss; }
+    static get style() { return sdThCss(); }
     static get cmpMeta() { return {
         "$flags$": 260,
         "$tagName$": "sd-th",
@@ -9473,7 +9874,78 @@ class SdTh {
     }; }
 }
 
-const sdToggleCss = "sd-toggle{display:inline-block;height:20px;line-height:0}sd-toggle .sd-toggle{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px}sd-toggle .sd-toggle>input{display:none}sd-toggle .sd-toggle__label{font-size:12px;color:#333333;line-height:20px}sd-toggle .sd-toggle__track{width:36px;height:20px;border-radius:12px;background:#cccccc;position:relative;transition:background-color 0.2s ease}sd-toggle .sd-toggle__thumb{width:16px;height:16px;border-radius:50%;background:white;position:absolute;top:2px;left:2px;transition:transform 0.2s ease}sd-toggle .sd-toggle--checked .sd-toggle__track{background:#0075ff}sd-toggle .sd-toggle--checked .sd-toggle__thumb{transform:translateX(16px)}sd-toggle .sd-toggle--disabled{cursor:not-allowed}sd-toggle .sd-toggle--disabled.sd-toggle--checked .sd-toggle__track{background:#bbdaff}sd-toggle .sd-toggle--disabled.sd-toggle--unchecked .sd-toggle__track{background:#eeeeee}sd-toggle .sd-toggle:hover:not(.sd-toggle--disabled).sd-toggle--checked .sd-toggle__track{background:#005cc9}sd-toggle .sd-toggle:hover:not(.sd-toggle--disabled).sd-toggle--unchecked .sd-toggle__track{background:#bbbbbb}";
+const sdToastMessageCss = () => `.sd-toast-message.sc-sd-toast-message{display:flex;width:fit-content;align-items:center;gap:16px;padding:12px 24px;border-radius:4px;background-color:var(--sd-toast-bg);color:var(--sd-toast-text);transition:opacity 0.2s ease, visibility 0.2s ease;box-shadow:2px 2px 8px 2px rgba(0, 0, 0, 0.2)}.sd-toast-message--hidden.sc-sd-toast-message{opacity:0;visibility:hidden;pointer-events:none}.sd-toast-message__icon.sc-sd-toast-message{display:flex;align-items:center;flex-shrink:0}.sd-toast-message__content.sc-sd-toast-message{display:flex;flex:1}.sd-toast-message__message.sc-sd-toast-message{font-size:14px;line-height:20px;font-weight:400}.sd-toast-message__link.sc-sd-toast-message{font-size:14px;line-height:20px;color:var(--sd-toast-text);text-decoration:underline;cursor:pointer;transition:opacity 0.2s ease;margin-left:4px}.sd-toast-message__link.sc-sd-toast-message:hover{opacity:0.8}.sd-toast-message__button.sc-sd-toast-message{flex-shrink:0}.sd-toast-message__button.sc-sd-toast-message button.sc-sd-toast-message{color:var(--button-text-color, inherit) !important}.sd-toast-message__close.sc-sd-toast-message{display:flex;align-items:center;justify-content:center;padding:4px;background-color:transparent;border:none;cursor:pointer;transition:opacity 0.2s ease;flex-shrink:0}.sd-toast-message__close.sc-sd-toast-message:hover{opacity:0.7}.sd-toast-message__close.sc-sd-toast-message:active{opacity:0.5}`;
+
+class SdToastMessage {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.sdClose = createEvent(this, "sdClose");
+        this.sdButtonClick = createEvent(this, "sdButtonClick");
+    }
+    icon;
+    message;
+    link;
+    linkLabel;
+    buttonLabel;
+    close = false;
+    type = 'basicDark';
+    sdClose;
+    sdButtonClick;
+    isVisible = true;
+    static COLOR_OF_TYPE = {
+        basicLight: { background: 'white', text: 'grey_95' },
+        basicDark: { background: 'steelblue_90', text: 'white' },
+        error: { background: 'red_70', text: 'white' },
+        caution: { background: 'yellow_45', text: 'grey_90' },
+        complete: { background: 'green_75', text: 'white' },
+        progress: { background: 'brilliantblue_80', text: 'white' },
+    };
+    handleClose = () => {
+        this.isVisible = false;
+        this.sdClose.emit();
+    };
+    handleButtonClick = () => {
+        this.sdButtonClick.emit();
+    };
+    getContainerClasses() {
+        const classes = ['sd-toast-message', `sd-toast-message--${this.type}`];
+        if (!this.isVisible) {
+            classes.push('sd-toast-message--hidden');
+        }
+        return classes.join(' ');
+    }
+    render() {
+        const colorTokens = SdToastMessage.COLOR_OF_TYPE[this.type];
+        const colors = {
+            background: resolveColor(colorTokens.background),
+            text: resolveColor(colorTokens.text),
+        };
+        return (hAsync(Host, { key: '4d342822195d44b49e5976e8d5e66fc7a58301b9', style: {
+                '--sd-toast-bg': colors.background,
+                '--sd-toast-text': colors.text,
+            } }, hAsync("div", { key: '2b33303cc0fc474d9c58a83a925a43b59f577125', class: this.getContainerClasses(), role: "status", "aria-live": "polite", "aria-atomic": "true" }, this.icon && (hAsync("div", { key: 'a7b7c49a4a15c76f0633520046128ce937e6410d', class: "sd-toast-message__icon" }, hAsync("sd-icon", { key: '7c61a7142e8e442936c9b2736cbcf8ebf8521087', name: this.icon, size: 16, color: colors.text }))), hAsync("div", { key: 'd0606186e02a44ba81ba3924baa0bdd8b34984f1', class: "sd-toast-message__content" }, hAsync("span", { key: '52e689c1e1d6a7170381a46f8c9370105386aac7', class: "sd-toast-message__message" }, this.message)), this.link && (hAsync("a", { key: '0818b9ffe71bd2cbe9fc00bfab9f8a6591f03cbd', href: this.link, class: "sd-toast-message__link", target: "_blank", rel: "noopener noreferrer" }, this.linkLabel || this.link)), this.buttonLabel && (hAsync("sd-button", { key: '4d4d7b15137574db44b64e3dc62010fe8ccdf530', class: `sd-toast-message__button ${this.type === 'basicLight' ? 'text-white' : ''}`, label: this.buttonLabel, variant: "primary", color: this.type === 'basicLight' ? 'oceanblue_75' : 'white', size: "sm", onSdClick: this.handleButtonClick, style: this.type !== 'basicLight' ? { '--button-text-color': resolveColor('grey_95') } : {} })), this.close && (hAsync("button", { key: '991ad8fe130c370f24ce23cf6d98a9ac797f7367', type: "button", class: "sd-toast-message__close", onClick: this.handleClose, "aria-label": "Close", title: "Close" }, hAsync("sd-icon", { key: 'd71dee73974143e5b6eb92f4135d40ee1df178fb', name: "close", size: 12, color: colors.text }))))));
+    }
+    static get style() { return sdToastMessageCss(); }
+    static get cmpMeta() { return {
+        "$flags$": 770,
+        "$tagName$": "sd-toast-message",
+        "$members$": {
+            "icon": [1],
+            "message": [1],
+            "link": [1],
+            "linkLabel": [1, "link-label"],
+            "buttonLabel": [1, "button-label"],
+            "close": [4],
+            "type": [1],
+            "isVisible": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
+
+const sdToggleCss = () => `sd-toggle{display:inline-block;height:20px;line-height:0}sd-toggle .sd-toggle{cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:20px}sd-toggle .sd-toggle>input{display:none}sd-toggle .sd-toggle__label{font-size:12px;color:#333333;line-height:20px}sd-toggle .sd-toggle__track{width:36px;height:20px;border-radius:12px;background:#cccccc;position:relative;transition:background-color 0.2s ease}sd-toggle .sd-toggle__thumb{width:16px;height:16px;border-radius:50%;background:white;position:absolute;top:2px;left:2px;transition:transform 0.2s ease}sd-toggle .sd-toggle--checked .sd-toggle__track{background:#0075ff}sd-toggle .sd-toggle--checked .sd-toggle__thumb{transform:translateX(16px)}sd-toggle .sd-toggle--disabled{cursor:not-allowed}sd-toggle .sd-toggle--disabled.sd-toggle--checked .sd-toggle__track{background:#bbdaff}sd-toggle .sd-toggle--disabled.sd-toggle--unchecked .sd-toggle__track{background:#eeeeee}sd-toggle .sd-toggle:hover:not(.sd-toggle--disabled).sd-toggle--checked .sd-toggle__track{background:#005cc9}sd-toggle .sd-toggle:hover:not(.sd-toggle--disabled).sd-toggle--unchecked .sd-toggle__track{background:#bbbbbb}`;
 
 class SdToggle {
     constructor(hostRef) {
@@ -9509,9 +9981,9 @@ class SdToggle {
         this.sdChange.emit(newValue);
     };
     render() {
-        return (hAsync("label", { key: '8b196fae6d8931cdd39c7eea51a7f1f843f4cb75', "aria-checked": this.isChecked.toString(), "aria-disabled": this.disabled.toString(), role: "switch", "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: '4a60ce883411cb2a598d003ff264fe6659d0df02', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: 'c0fb2edfb1a2854c31fb6eb0a4e4169e2e409db2', class: "sd-toggle__label" }, this.label), hAsync("div", { key: 'c9f78f892be478cbd1232722487471eae53bee8a', class: "sd-toggle__track" }, hAsync("div", { key: 'b6388556a0d6f4b9f74e6e2684ded4cde93d6384', class: "sd-toggle__thumb" }))));
+        return (hAsync("label", { key: 'b21fce826c30404ab3f30cc27a1866d9a7745402', "aria-checked": this.isChecked.toString(), "aria-disabled": this.disabled.toString(), role: "switch", "aria-label": this.label || 'toggle', class: this.toggleClasses }, hAsync("input", { key: '8bac810392c4aa1f0f04f13b37bc73210d70fe98', type: "checkbox", checked: this.isChecked, disabled: this.disabled, onInput: this.handleChange }), this.label && hAsync("span", { key: '2d2949701bb4bf24dbbce2e296d8cb82606f6a62', class: "sd-toggle__label" }, this.label), hAsync("div", { key: '42d39942bd284f3de320735a182bd53569782e1f', class: "sd-toggle__track" }, hAsync("div", { key: 'b2decb4e6c1a1e9459621ea409fec24cf8695f4b', class: "sd-toggle__thumb" }))));
     }
-    static get style() { return sdToggleCss; }
+    static get style() { return sdToggleCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-toggle",
@@ -9527,7 +9999,64 @@ class SdToggle {
     }; }
 }
 
-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}";
+const sdToggleButtonCss = () => `sd-toggle-button{display:inline-block;line-height:0}.sd-toggle-button{display:inline-flex;align-items:center;justify-content:center;height:28px;padding:4px 12px;gap:6px;border-radius:14px;border:1px solid #888888;background-color:#ffffff;color:#737373;font-size:12px;line-height:20px;font-weight:400;cursor:pointer;transition:border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;white-space:nowrap;user-select:none;box-sizing:border-box}.sd-toggle-button--active{border-color:#0075ff;color:#0075ff}.sd-toggle-button--disabled{background-color:#eeeeee;border-color:#cccccc;color:#888888}.sd-toggle-button--disabled.sd-toggle-button--active{background-color:#eeeeee;border-color:#cccccc;color:#888888}.sd-toggle-button:hover:not(.sd-toggle-button--disabled):not(.sd-toggle-button--active){border-color:#737373}.sd-toggle-button:hover:not(.sd-toggle-button--disabled).sd-toggle-button--active{border-color:#005cc9;color:#005cc9}`;
+
+class SdToggleButton {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.sdChange = createEvent(this, "sdChange");
+    }
+    value = false;
+    label = '';
+    disabled = false;
+    isActive = false;
+    sdChange;
+    componentWillLoad() {
+        this.updateActiveState(this.value);
+    }
+    componentWillRender() {
+        this.updateActiveState(this.value);
+    }
+    updateActiveState(value) {
+        this.isActive = value;
+    }
+    get buttonClasses() {
+        const classes = ['sd-toggle-button'];
+        if (this.isActive) {
+            classes.push('sd-toggle-button--active');
+        }
+        if (this.disabled) {
+            classes.push('sd-toggle-button--disabled');
+        }
+        return classes.join(' ');
+    }
+    handleChange = () => {
+        if (this.disabled)
+            return;
+        const newValue = !this.value;
+        this.value = newValue;
+        this.sdChange.emit(newValue);
+    };
+    render() {
+        return (hAsync("label", { key: 'ffa8699908132e9865ccd5b0dffafe6aa1265d8f', class: this.buttonClasses, role: "button", "aria-pressed": this.isActive.toString(), "aria-disabled": this.disabled.toString(), "aria-label": this.label || 'toggle button' }, this.label, hAsync("input", { key: '772f24705287a4e7efac5f736b784dd3d9c0bf4d', style: { display: 'none' }, type: "checkbox", onInput: this.handleChange })));
+    }
+    static get style() { return sdToggleButtonCss(); }
+    static get cmpMeta() { return {
+        "$flags$": 768,
+        "$tagName$": "sd-toggle-button",
+        "$members$": {
+            "value": [1540],
+            "label": [1],
+            "disabled": [4],
+            "isActive": [32]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": [["value", "value"]]
+    }; }
+}
+
+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}`;
 
 class SdTooltip {
     constructor(hostRef) {
@@ -9575,22 +10104,22 @@ class SdTooltip {
             : {
                 onClick: () => (this.showTooltip = !this.showTooltip),
             };
-        return (hAsync(Fragment, { key: '44ccb9c1a2e9113160ccb516e62fbd175e139f50' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-tooltip-portal", { key: '83f82f27164df34a1a8e0d1d8975b4f89a82691a', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, hAsync("div", { key: '544085a133cdbbe707ec0c2be35a9a42cd2372bc', class: {
+        return (hAsync(Fragment, { key: 'a4cd9f882795ef5b39a877b004e7d51fccecbfcb' }, this.label ? (hAsync("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-tooltip", ...handleTrigger })) : (hAsync("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-tooltip", ...handleTrigger })), this.showTooltip && (hAsync("sd-tooltip-portal", { key: 'b9128e35e1f28869d0d163088f54b631c9104bf9', parentRef: this.buttonEl, onSdClose: () => this.handleClose(), placement: this.placement }, hAsync("div", { key: '0a6db1e8478f25fd43735ac0cd8977ce2bce5ef6', class: {
                 'sd-tooltip-menu': true,
                 [`sd-tooltip-menu--${this.type}`]: true,
                 [`sd-tooltip-menu--${this.placement}`]: true,
                 'sd-tooltip-menu--with-close': this.useClose,
                 [`bg-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
                 [`text-${SdTooltip.COLOR_OF_TYPE[this.type].text}`]: true,
-            } }, hAsync("i", { key: '4b335754d346d6ae244e83ccdcae25edf05a306a', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: '567fc901e95b918fb0883f9c241836a10e1e58e9', class: {
+            } }, hAsync("i", { key: '176b79ce7db54479f2690aca9ae98252e1dfacd4', class: `sd-tooltip-menu__arrow sd-tooltip-menu__arrow--${this.placement}` }, hAsync(TooltipArrow, { key: 'aa1f0d7da5135713d1d51ed2852210895d707931', class: {
                 [`text-${SdTooltip.COLOR_OF_TYPE[this.type].background}`]: true,
-            } })), hAsync("div", { key: '1475d6f5d76f4e3860e2524cb571eb2704460203', class: "sd-tooltip-menu__content", ref: el => {
+            } })), hAsync("div", { key: '147d42745d18180e92a81ed60404697afd6ea1e5', class: "sd-tooltip-menu__content", ref: el => {
                 if (el && this.slotContent && !el.hasChildNodes()) {
                     el.appendChild(this.slotContent.cloneNode(true));
                 }
-            } }, !this.slotContent && hAsync("span", { key: 'f821b0aa74de05c7728b06a2bd78367e43703684' }, this.el.textContent)), this.useClose && (hAsync("div", { key: '2068c369ef957cb25b9ec74e22e2c78f9ffa6232', class: "sd-tooltip-menu__close-button" }, hAsync("button", { key: 'f61156a86ce1b3fd4f2fb97e507711f9602ac157', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: '3ba6f3f4dc5379eb2d13aecb9ec1d5d6fdf20dec', name: "close", size: "12", color: "#AAAAAA" })))))))));
+            } }, !this.slotContent && hAsync("span", { key: '6204dc0ed996aa8c70cbb12a1388ed8ebce20552' }, this.el.textContent)), this.useClose && (hAsync("div", { key: '7cb4aebb0077b2b17b78e2b2f82cfd90711cfc5f', class: "sd-tooltip-menu__close-button" }, hAsync("button", { key: 'f14b75687492169c4c24e7840c9e0907b2161ea2', type: "button", "aria-label": "Close tooltip", title: "Close tooltip", onClick: () => this.handleClose() }, hAsync("sd-icon", { key: 'fcf6ca6fa0c2a349ef0a6710399ab27e5ceffd3f', name: "close", size: "12", color: "#AAAAAA" })))))))));
     }
-    static get style() { return sdTooltipCss; }
+    static get style() { return sdTooltipCss(); }
     static get cmpMeta() { return {
         "$flags$": 768,
         "$tagName$": "sd-tooltip",
@@ -9764,7 +10293,7 @@ class SdTooltipPortal {
         this.sdClose.emit();
     }
     render() {
-        return hAsync("slot", { key: '912ff6aba4bae810c40c95325ffb1109ddcfddbb' });
+        return hAsync("slot", { key: 'e6c37c753808b41beeeefa5f04bdf543a48eaa05' });
     }
     static get cmpMeta() { return {
         "$flags$": 777,
@@ -9783,16 +10312,16 @@ class SdTooltipPortal {
     }; }
 }
 
-const sdTrCss = "sd-tr{display:table-row}";
+const sdTrCss = () => `sd-tr{display:table-row}`;
 
 class SdTr {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (hAsync(Host, { key: '18a0e95b7264b495bd15aeb7c3a704dac938e140', role: "row" }, hAsync("slot", { key: '83ac4ded200f5e7b18a01d2055859e1093e34d6c' })));
+        return (hAsync(Host, { key: '228bb6d6b5225bd035cce96cd817beb9e2734ab4', role: "row" }, hAsync("slot", { key: '8906dfdeb89afb1028a30a5b16b034f6c2ba67b9' })));
     }
-    static get style() { return sdTrCss; }
+    static get style() { return sdTrCss(); }
     static get cmpMeta() { return {
         "$flags$": 260,
         "$tagName$": "sd-tr",
@@ -9811,6 +10340,7 @@ registerComponents([
   SdDateBox,
   SdDatePicker,
   SdDateRangePicker,
+  SdFilePicker,
   SdGuide,
   SdIcon,
   SdInput,
@@ -9820,6 +10350,7 @@ registerComponents([
   SdPopover,
   SdPortal,
   SdProgress,
+  SdRadioButtonGroup,
   SdRadioGroup,
   SdSelect,
   SdSelectMultiple,
@@ -9828,11 +10359,14 @@ registerComponents([
   SdSelectOptionGroup,
   SdTable$1,
   SdTable,
+  SdTabs,
   SdTag,
   SdTbody,
   SdTd,
   SdTh,
+  SdToastMessage,
   SdToggle,
+  SdToggleButton,
   SdTooltip,
   SdTooltipPortal,
   SdTr,
@@ -9848,100 +10382,50 @@ exports.hydrateApp = hydrateApp;
   hydrateAppClosure($stencilWindow);
 }
 
-// src/app-data/index.ts
-var BUILD = {
-  allRenderFn: false,
-  element: true,
-  event: true,
-  hasRenderFn: true,
-  hostListener: true,
-  hostListenerTargetWindow: true,
-  hostListenerTargetDocument: true,
-  hostListenerTargetBody: true,
-  hostListenerTargetParent: false,
-  hostListenerTarget: true,
-  member: true,
-  method: true,
-  mode: true,
-  observeAttribute: true,
-  prop: true,
-  propMutable: true,
-  reflect: true,
-  scoped: true,
-  shadowDom: true,
-  slot: true,
-  cssAnnotations: true,
-  state: true,
-  style: true,
-  formAssociated: false,
-  svg: true,
-  updatable: true,
-  vdomAttribute: true,
-  vdomXlink: true,
-  vdomClass: true,
-  vdomFunctional: true,
-  vdomKey: true,
-  vdomListener: true,
-  vdomRef: true,
-  vdomPropOrAttr: true,
-  vdomRender: true,
-  vdomStyle: true,
-  vdomText: true,
-  propChangeCallback: true,
-  taskQueue: true,
-  hotModuleReplacement: false,
-  isDebug: false,
-  isDev: false,
-  isTesting: false,
-  hydrateServerSide: false,
-  hydrateClientSide: false,
-  lifecycleDOMEvents: false,
-  lazyLoad: false,
-  profile: false,
-  slotRelocation: true,
-  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
-  appendChildSlotFix: false,
-  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
-  cloneNodeFix: false,
-  hydratedAttribute: false,
-  hydratedClass: true,
-  // TODO(STENCIL-1305): remove this option
-  scriptDataOpts: false,
-  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
-  scopedSlotTextContentFix: false,
-  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
-  shadowDomShim: false,
-  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
-  slotChildNodesFix: false,
-  invisiblePrehydration: true,
-  propBoolean: true,
-  propNumber: true,
-  propString: true,
-  constructableCSS: true,
-  devTools: false,
-  shadowDelegatesFocus: true,
-  initializeNextTick: false,
-  asyncLoading: true,
-  asyncQueue: false,
-  transformTagName: false,
-  attachStyles: true,
-  // TODO(STENCIL-914): remove this option when `experimentalSlotFixes` is the default behavior
-  experimentalSlotFixes: false
-};
-var Env = {};
-var NAMESPACE = (
-  /* default */
-  "app"
-);
-
 /*
- Stencil Hydrate Runner v4.38.3 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.39.0 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+var Build = {
+  isDev: BUILD.isDev ? true : false,
+  isBrowser: true,
+  isServer: false,
+  isTesting: BUILD.isTesting ? true : false
+};
+
+// src/utils/constants.ts
+var PrimitiveType = /* @__PURE__ */ ((PrimitiveType2) => {
+  PrimitiveType2["Undefined"] = "undefined";
+  PrimitiveType2["Null"] = "null";
+  PrimitiveType2["String"] = "string";
+  PrimitiveType2["Number"] = "number";
+  PrimitiveType2["SpecialNumber"] = "number";
+  PrimitiveType2["Boolean"] = "boolean";
+  PrimitiveType2["BigInt"] = "bigint";
+  return PrimitiveType2;
+})(PrimitiveType || {});
+var NonPrimitiveType = /* @__PURE__ */ ((NonPrimitiveType2) => {
+  NonPrimitiveType2["Array"] = "array";
+  NonPrimitiveType2["Date"] = "date";
+  NonPrimitiveType2["Map"] = "map";
+  NonPrimitiveType2["Object"] = "object";
+  NonPrimitiveType2["RegularExpression"] = "regexp";
+  NonPrimitiveType2["Set"] = "set";
+  NonPrimitiveType2["Channel"] = "channel";
+  NonPrimitiveType2["Symbol"] = "symbol";
+  return NonPrimitiveType2;
+})(NonPrimitiveType || {});
+var TYPE_CONSTANT = "type";
+var VALUE_CONSTANT = "value";
+var SERIALIZED_PREFIX = "serialized:";
+var STENCIL_DEV_MODE = BUILD.isTesting ? ["STENCIL:"] : [
+  "%cstencil",
+  "color: white;background:#4c47ff;font-weight: bold; font-size:10px; padding:2px 6px; border-radius: 5px"
+];
 
 // src/runtime/runtime-constants.ts
 var CONTENT_REF_ID = "r";
@@ -9952,310 +10436,824 @@ var HYDRATE_ID = "s-id";
 var HYDRATED_STYLE_ID = "sty-id";
 var STENCIL_DOC_DATA = "_stencilDocData";
 var XLINK_NS = "http://www.w3.org/1999/xlink";
-
-// src/mock-doc/attribute.ts
-var attrHandler = {
-  get(obj, prop) {
-    if (prop in obj) {
-      return obj[prop];
-    }
-    if (typeof prop !== "symbol" && !isNaN(prop)) {
-      return obj.__items[prop];
-    }
-    return void 0;
-  }
+var win = typeof window !== "undefined" ? window : {};
+var H = win.HTMLElement || class {
 };
-var createAttributeProxy = (caseInsensitive) => new Proxy(new MockAttributeMap(caseInsensitive), attrHandler);
-var MockAttributeMap = class {
-  constructor(caseInsensitive = false) {
-    this.caseInsensitive = caseInsensitive;
-    this.__items = [];
-  }
-  get length() {
-    return this.__items.length;
-  }
-  item(index) {
-    return this.__items[index] || null;
-  }
-  setNamedItem(attr) {
-    attr.namespaceURI = null;
-    this.setNamedItemNS(attr);
+var supportsShadow = BUILD.shadowDom;
+var supportsConstructableStylesheets = BUILD.constructableCSS ? /* @__PURE__ */ (() => {
+  try {
+    new CSSStyleSheet();
+    return typeof new CSSStyleSheet().replaceSync === "function";
+  } catch (e) {
   }
-  setNamedItemNS(attr) {
-    if (attr != null && attr.value != null) {
-      attr.value = String(attr.value);
-    }
-    const existingAttr = this.__items.find((a) => a.name === attr.name && a.namespaceURI === attr.namespaceURI);
-    if (existingAttr != null) {
-      existingAttr.value = attr.value;
+  return false;
+})() : false;
+
+// src/utils/helpers.ts
+var isString = (v) => typeof v === "string";
+
+// src/utils/local-value.ts
+var LocalValue = class _LocalValue {
+  constructor(type, value) {
+    if (type === "undefined" /* Undefined */ || type === "null" /* Null */) {
+      this.type = type;
     } else {
-      this.__items.push(attr);
-    }
-  }
-  getNamedItem(attrName) {
-    if (this.caseInsensitive) {
-      attrName = attrName.toLowerCase();
+      this.type = type;
+      this.value = value;
     }
-    return this.getNamedItemNS(null, attrName);
   }
-  getNamedItemNS(namespaceURI, attrName) {
-    namespaceURI = getNamespaceURI(namespaceURI);
-    return this.__items.find((attr) => attr.name === attrName && getNamespaceURI(attr.namespaceURI) === namespaceURI) || null;
+  /**
+   * Creates a new LocalValue object with a string value.
+   *
+   * @param {string} value - The string value to be stored in the LocalValue object.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createStringValue(value) {
+    return new _LocalValue("string" /* String */, value);
   }
-  removeNamedItem(attr) {
-    this.removeNamedItemNS(attr);
+  /**
+   * Creates a new LocalValue object with a number value.
+   *
+   * @param {number} value - The number value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createNumberValue(value) {
+    return new _LocalValue("number" /* Number */, value);
   }
-  removeNamedItemNS(attr) {
-    for (let i = 0, ii = this.__items.length; i < ii; i++) {
-      if (this.__items[i].name === attr.name && this.__items[i].namespaceURI === attr.namespaceURI) {
-        this.__items.splice(i, 1);
-        break;
-      }
+  /**
+   * Creates a new LocalValue object with a special number value.
+   *
+   * @param {number} value - The value of the special number.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createSpecialNumberValue(value) {
+    if (Number.isNaN(value)) {
+      return new _LocalValue("number" /* SpecialNumber */, "NaN");
     }
-  }
-  [Symbol.iterator]() {
-    let i = 0;
-    return {
-      next: () => ({
-        done: i === this.length,
-        value: this.item(i++)
-      })
-    };
-  }
-  get [Symbol.toStringTag]() {
-    return "MockAttributeMap";
-  }
-};
-function getNamespaceURI(namespaceURI) {
-  return namespaceURI === XLINK_NS ? null : namespaceURI;
-}
-function cloneAttributes(srcAttrs, sortByName = false) {
-  const dstAttrs = new MockAttributeMap(srcAttrs.caseInsensitive);
-  if (srcAttrs != null) {
-    const attrLen = srcAttrs.length;
-    if (sortByName && attrLen > 1) {
-      const sortedAttrs = [];
-      for (let i = 0; i < attrLen; i++) {
-        const srcAttr = srcAttrs.item(i);
-        const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
-        sortedAttrs.push(dstAttr);
-      }
-      sortedAttrs.sort(sortAttributes).forEach((attr) => {
-        dstAttrs.setNamedItemNS(attr);
-      });
-    } else {
-      for (let i = 0; i < attrLen; i++) {
-        const srcAttr = srcAttrs.item(i);
-        const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
-        dstAttrs.setNamedItemNS(dstAttr);
-      }
+    if (Object.is(value, -0)) {
+      return new _LocalValue("number" /* SpecialNumber */, "-0");
+    }
+    if (value === Infinity) {
+      return new _LocalValue("number" /* SpecialNumber */, "Infinity");
     }
+    if (value === -Infinity) {
+      return new _LocalValue("number" /* SpecialNumber */, "-Infinity");
+    }
+    return new _LocalValue("number" /* SpecialNumber */, value);
   }
-  return dstAttrs;
-}
-function sortAttributes(a, b) {
-  if (a.name < b.name) return -1;
-  if (a.name > b.name) return 1;
-  return 0;
-}
-var MockAttr = class {
-  constructor(attrName, attrValue, namespaceURI = null) {
-    this._name = attrName;
-    this._value = String(attrValue);
-    this._namespaceURI = namespaceURI;
+  /**
+   * Creates a new LocalValue object with an undefined value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createUndefinedValue() {
+    return new _LocalValue("undefined" /* Undefined */);
   }
-  get name() {
-    return this._name;
+  /**
+   * Creates a new LocalValue object with a null value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createNullValue() {
+    return new _LocalValue("null" /* Null */);
   }
-  set name(value) {
-    this._name = value;
+  /**
+   * Creates a new LocalValue object with a boolean value.
+   *
+   * @param {boolean} value - The boolean value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createBooleanValue(value) {
+    return new _LocalValue("boolean" /* Boolean */, value);
   }
-  get value() {
-    return this._value;
+  /**
+   * Creates a new LocalValue object with a BigInt value.
+   *
+   * @param {BigInt} value - The BigInt value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createBigIntValue(value) {
+    return new _LocalValue("bigint" /* BigInt */, value.toString());
   }
-  set value(value) {
-    this._value = String(value);
+  /**
+   * Creates a new LocalValue object with an array.
+   *
+   * @param {Array} value - The array.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createArrayValue(value) {
+    return new _LocalValue("array" /* Array */, value);
   }
-  get nodeName() {
-    return this._name;
+  /**
+   * Creates a new LocalValue object with date value.
+   *
+   * @param {string} value - The date.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createDateValue(value) {
+    return new _LocalValue("date" /* Date */, value);
   }
-  set nodeName(value) {
-    this._name = value;
+  /**
+   * Creates a new LocalValue object of map value.
+   * @param {Map} map - The map.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createMapValue(map2) {
+    const value = [];
+    Array.from(map2.entries()).forEach(([key, val]) => {
+      value.push([_LocalValue.getArgument(key), _LocalValue.getArgument(val)]);
+    });
+    return new _LocalValue("map" /* Map */, value);
   }
-  get nodeValue() {
-    return this._value;
+  /**
+   * Creates a new LocalValue object from the passed object.
+   *
+   * @param object the object to create a LocalValue from
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createObjectValue(object) {
+    const value = [];
+    Object.entries(object).forEach(([key, val]) => {
+      value.push([key, _LocalValue.getArgument(val)]);
+    });
+    return new _LocalValue("object" /* Object */, value);
   }
-  set nodeValue(value) {
-    this._value = String(value);
+  /**
+   * Creates a new LocalValue object of regular expression value.
+   *
+   * @param {string} value - The value of the regular expression.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createRegularExpressionValue(value) {
+    return new _LocalValue("regexp" /* RegularExpression */, value);
   }
-  get namespaceURI() {
-    return this._namespaceURI;
+  /**
+   * Creates a new LocalValue object with the specified value.
+   * @param {Set} value - The value to be set.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createSetValue(value) {
+    return new _LocalValue("set" /* Set */, value);
   }
-  set namespaceURI(namespaceURI) {
-    this._namespaceURI = namespaceURI;
+  /**
+   * Creates a new LocalValue object with the given channel value
+   *
+   * @param {ChannelValue} value - The channel value.
+   * @returns {LocalValue} - The created LocalValue object.
+   */
+  static createChannelValue(value) {
+    return new _LocalValue("channel" /* Channel */, value);
+  }
+  /**
+   * Creates a new LocalValue object with a Symbol value.
+   *
+   * @param {Symbol} symbol - The Symbol value
+   * @returns {LocalValue} - The created LocalValue object
+   */
+  static createSymbolValue(symbol) {
+    const description = symbol.description || "Symbol()";
+    return new _LocalValue("symbol" /* Symbol */, description);
+  }
+  static getArgument(argument) {
+    const type = typeof argument;
+    switch (type) {
+      case "string" /* String */:
+        return _LocalValue.createStringValue(argument);
+      case "number" /* Number */:
+        if (Number.isNaN(argument) || Object.is(argument, -0) || !Number.isFinite(argument)) {
+          return _LocalValue.createSpecialNumberValue(argument);
+        }
+        return _LocalValue.createNumberValue(argument);
+      case "boolean" /* Boolean */:
+        return _LocalValue.createBooleanValue(argument);
+      case "bigint" /* BigInt */:
+        return _LocalValue.createBigIntValue(argument);
+      case "undefined" /* Undefined */:
+        return _LocalValue.createUndefinedValue();
+      case "symbol" /* Symbol */:
+        return _LocalValue.createSymbolValue(argument);
+      case "object" /* Object */:
+        if (argument === null) {
+          return _LocalValue.createNullValue();
+        }
+        if (argument instanceof Date) {
+          return _LocalValue.createDateValue(argument);
+        }
+        if (argument instanceof Map) {
+          const map2 = [];
+          argument.forEach((value, key) => {
+            const objectKey = typeof key === "string" ? key : _LocalValue.getArgument(key);
+            const objectValue = _LocalValue.getArgument(value);
+            map2.push([objectKey, objectValue]);
+          });
+          return _LocalValue.createMapValue(argument);
+        }
+        if (argument instanceof Set) {
+          const set = [];
+          argument.forEach((value) => {
+            set.push(_LocalValue.getArgument(value));
+          });
+          return _LocalValue.createSetValue(set);
+        }
+        if (argument instanceof Array) {
+          const arr = [];
+          argument.forEach((value) => {
+            arr.push(_LocalValue.getArgument(value));
+          });
+          return _LocalValue.createArrayValue(arr);
+        }
+        if (argument instanceof RegExp) {
+          return _LocalValue.createRegularExpressionValue({
+            pattern: argument.source,
+            flags: argument.flags
+          });
+        }
+        return _LocalValue.createObjectValue(argument);
+    }
+    throw new Error(`Unsupported type: ${type}`);
+  }
+  asMap() {
+    return {
+      [TYPE_CONSTANT]: this.type,
+      ...!(this.type === "null" /* Null */ || this.type === "undefined" /* Undefined */) ? { [VALUE_CONSTANT]: this.value } : {}
+    };
   }
 };
 
-// src/mock-doc/css-style-declaration.ts
-var MockCSSStyleDeclaration = class {
-  constructor() {
-    this._styles = /* @__PURE__ */ new Map();
-  }
-  setProperty(prop, value) {
-    prop = jsCaseToCssCase(prop);
-    if (value == null || value === "") {
-      this._styles.delete(prop);
+// src/utils/message-utils.ts
+var catchError = (diagnostics, err2, msg) => {
+  const diagnostic = {
+    level: "error",
+    type: "build",
+    header: "Build Error",
+    messageText: "build error",
+    lines: []
+  };
+  if (isString(msg)) {
+    diagnostic.messageText = msg.length ? msg : "UNKNOWN ERROR";
+  } else if (err2 != null) {
+    if (err2.stack != null) {
+      diagnostic.messageText = err2.stack.toString();
     } else {
-      this._styles.set(prop, String(value));
+      if (err2.message != null) {
+        diagnostic.messageText = err2.message.length ? err2.message : "UNKNOWN ERROR";
+      } else {
+        diagnostic.messageText = err2.toString();
+      }
     }
   }
-  getPropertyValue(prop) {
-    prop = jsCaseToCssCase(prop);
-    return String(this._styles.get(prop) || "");
+  if (diagnostics != null && !shouldIgnoreError(diagnostic.messageText)) {
+    diagnostics.push(diagnostic);
   }
-  removeProperty(prop) {
-    prop = jsCaseToCssCase(prop);
-    this._styles.delete(prop);
+  return diagnostic;
+};
+var hasError = (diagnostics) => {
+  if (diagnostics == null || diagnostics.length === 0) {
+    return false;
   }
-  get length() {
-    return this._styles.size;
+  return diagnostics.some((d) => d.level === "error" && d.type !== "runtime");
+};
+var shouldIgnoreError = (msg) => {
+  return msg === TASK_CANCELED_MSG;
+};
+var TASK_CANCELED_MSG = `task canceled`;
+
+// src/utils/regular-expression.ts
+var escapeRegExpSpecialCharacters = (text) => {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+};
+
+// src/utils/remote-value.ts
+var RemoteValue = class _RemoteValue {
+  /**
+   * Deserializes a LocalValue serialized object back to its original JavaScript representation
+   *
+   * @param serialized The serialized LocalValue object
+   * @returns The original JavaScript value/object
+   */
+  static fromLocalValue(serialized) {
+    const type = serialized[TYPE_CONSTANT];
+    const value = VALUE_CONSTANT in serialized ? serialized[VALUE_CONSTANT] : void 0;
+    switch (type) {
+      case "string" /* String */:
+        return value;
+      case "boolean" /* Boolean */:
+        return value;
+      case "bigint" /* BigInt */:
+        return BigInt(value);
+      case "undefined" /* Undefined */:
+        return void 0;
+      case "null" /* Null */:
+        return null;
+      case "number" /* Number */:
+        if (value === "NaN") return NaN;
+        if (value === "-0") return -0;
+        if (value === "Infinity") return Infinity;
+        if (value === "-Infinity") return -Infinity;
+        return value;
+      case "array" /* Array */:
+        return value.map((item) => _RemoteValue.fromLocalValue(item));
+      case "date" /* Date */:
+        return new Date(value);
+      case "map" /* Map */:
+        const map2 = /* @__PURE__ */ new Map();
+        for (const [key, val] of value) {
+          const deserializedKey = typeof key === "object" && key !== null ? _RemoteValue.fromLocalValue(key) : key;
+          const deserializedValue = _RemoteValue.fromLocalValue(val);
+          map2.set(deserializedKey, deserializedValue);
+        }
+        return map2;
+      case "object" /* Object */:
+        const obj = {};
+        for (const [key, val] of value) {
+          obj[key] = _RemoteValue.fromLocalValue(val);
+        }
+        return obj;
+      case "regexp" /* RegularExpression */:
+        const { pattern, flags } = value;
+        return new RegExp(pattern, flags);
+      case "set" /* Set */:
+        const set = /* @__PURE__ */ new Set();
+        for (const item of value) {
+          set.add(_RemoteValue.fromLocalValue(item));
+        }
+        return set;
+      case "symbol" /* Symbol */:
+        return Symbol(value);
+      default:
+        throw new Error(`Unsupported type: ${type}`);
+    }
   }
-  get cssText() {
-    const cssText = [];
-    this._styles.forEach((value, prop) => {
-      cssText.push(`${prop}: ${value};`);
-    });
-    return cssText.join(" ").trim();
+  /**
+   * Utility method to deserialize multiple LocalValues at once
+   *
+   * @param serializedValues Array of serialized LocalValue objects
+   * @returns Array of deserialized JavaScript values
+   */
+  static fromLocalValueArray(serializedValues) {
+    return serializedValues.map((value) => _RemoteValue.fromLocalValue(value));
   }
-  set cssText(cssText) {
-    if (cssText == null || cssText === "") {
-      this._styles.clear();
-      return;
+  /**
+   * Verifies if the given object matches the structure of a serialized LocalValue
+   *
+   * @param obj Object to verify
+   * @returns boolean indicating if the object has LocalValue structure
+   */
+  static isLocalValueObject(obj) {
+    if (typeof obj !== "object" || obj === null) {
+      return false;
     }
-    cssText.split(";").forEach((rule) => {
-      rule = rule.trim();
-      if (rule.length > 0) {
-        const splt = rule.split(":");
-        if (splt.length > 1) {
-          const prop = splt[0].trim();
-          const value = splt.slice(1).join(":").trim();
-          if (prop !== "" && value !== "") {
-            this._styles.set(jsCaseToCssCase(prop), value);
-          }
-        }
-      }
-    });
+    if (!obj.hasOwnProperty(TYPE_CONSTANT)) {
+      return false;
+    }
+    const type = obj[TYPE_CONSTANT];
+    const hasTypeProperty = Object.values({ ...PrimitiveType, ...NonPrimitiveType }).includes(type);
+    if (!hasTypeProperty) {
+      return false;
+    }
+    if (type !== "null" /* Null */ && type !== "undefined" /* Undefined */) {
+      return obj.hasOwnProperty(VALUE_CONSTANT);
+    }
+    return true;
   }
 };
-function createCSSStyleDeclaration() {
-  return new Proxy(new MockCSSStyleDeclaration(), cssProxyHandler);
-}
-var cssProxyHandler = {
-  get(cssStyle, prop) {
-    if (prop in cssStyle) {
-      return cssStyle[prop];
-    }
-    prop = cssCaseToJsCase(prop);
-    return cssStyle.getPropertyValue(prop);
-  },
-  set(cssStyle, prop, value) {
-    if (prop in cssStyle) {
-      cssStyle[prop] = value;
+
+// src/utils/result.ts
+var result_exports = {};
+__export(result_exports, {
+  err: () => err,
+  map: () => map,
+  ok: () => ok,
+  unwrap: () => unwrap,
+  unwrapErr: () => unwrapErr
+});
+var ok = (value) => ({
+  isOk: true,
+  isErr: false,
+  value
+});
+var err = (value) => ({
+  isOk: false,
+  isErr: true,
+  value
+});
+function map(result, fn) {
+  if (result.isOk) {
+    const val = fn(result.value);
+    if (val instanceof Promise) {
+      return val.then((newVal) => ok(newVal));
     } else {
-      cssStyle.setProperty(prop, value);
+      return ok(val);
     }
-    return true;
+  }
+  if (result.isErr) {
+    const value = result.value;
+    return err(value);
+  }
+  throw "should never get here";
+}
+var unwrap = (result) => {
+  if (result.isOk) {
+    return result.value;
+  } else {
+    throw result.value;
   }
 };
-function cssCaseToJsCase(str) {
-  if (str.length > 1 && str.includes("-") === true) {
-    str = str.toLowerCase().split("-").map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1)).join("");
-    str = str.slice(0, 1).toLowerCase() + str.slice(1);
+var unwrapErr = (result) => {
+  if (result.isErr) {
+    return result.value;
+  } else {
+    throw result.value;
   }
-  return str;
+};
+
+// src/utils/serialize.ts
+function serializeProperty(value) {
+  if (["string", "boolean", "undefined"].includes(typeof value) || typeof value === "number" && value !== Infinity && value !== -Infinity && !isNaN(value)) {
+    return value;
+  }
+  const arg = LocalValue.getArgument(value);
+  return SERIALIZED_PREFIX + btoa(JSON.stringify(arg));
 }
-function jsCaseToCssCase(str) {
-  if (str.length > 1 && str.includes("-") === false && /[A-Z]/.test(str) === true) {
-    str = str.replace(/([A-Z])/g, (g) => " " + g[0]).trim().replace(/ /g, "-").toLowerCase();
+function deserializeProperty(value) {
+  if (typeof value !== "string" || !value.startsWith(SERIALIZED_PREFIX)) {
+    return value;
   }
-  return str;
+  return RemoteValue.fromLocalValue(JSON.parse(atob(value.slice(SERIALIZED_PREFIX.length))));
 }
 
-// src/mock-doc/custom-element-registry.ts
-var MockCustomElementRegistry = class {
-  constructor(win2) {
-    this.win = win2;
+// src/utils/util.ts
+var lowerPathParam = (fn) => (p) => fn(p.toLowerCase());
+var isDtsFile = lowerPathParam((p) => p.endsWith(".d.ts") || p.endsWith(".d.mts") || p.endsWith(".d.cts"));
+var isTsFile = lowerPathParam(
+  (p) => !isDtsFile(p) && (p.endsWith(".ts") || p.endsWith(".mts") || p.endsWith(".cts"))
+);
+var isTsxFile = lowerPathParam(
+  (p) => p.endsWith(".tsx") || p.endsWith(".mtsx") || p.endsWith(".ctsx")
+);
+var isJsxFile = lowerPathParam(
+  (p) => p.endsWith(".jsx") || p.endsWith(".mjsx") || p.endsWith(".cjsx")
+);
+var isJsFile = lowerPathParam((p) => p.endsWith(".js") || p.endsWith(".mjs") || p.endsWith(".cjs"));
+
+// src/utils/shadow-css.ts
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ *
+ * This file is a port of shadowCSS from `webcomponents.js` to TypeScript.
+ * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
+ * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
+ */
+var _polyfillHost = "-shadowcsshost";
+var _polyfillSlotted = "-shadowcssslotted";
+var _polyfillHostContext = "-shadowcsscontext";
+var _parenSuffix = ")(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)";
+var _cssColonHostRe = new RegExp("(" + _polyfillHost + _parenSuffix, "gim");
+var _cssColonHostContextRe = new RegExp("(" + _polyfillHostContext + _parenSuffix, "gim");
+var _cssColonSlottedRe = new RegExp("(" + _polyfillSlotted + _parenSuffix, "gim");
+var _polyfillHostNoCombinator = _polyfillHost + "-no-combinator";
+var createSupportsRuleRe = (selector) => {
+  const safeSelector = escapeRegExpSpecialCharacters(selector);
+  return new RegExp(
+    // First capture group: match any context before the selector that's not inside @supports selector()
+    // Using negative lookahead to avoid matching inside @supports selector(...) condition
+    `(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${safeSelector}))(${safeSelector}\\b)`,
+    "g"
+  );
+};
+var _colonSlottedRe = createSupportsRuleRe("::slotted");
+var _colonHostRe = createSupportsRuleRe(":host");
+var _colonHostContextRe = createSupportsRuleRe(":host-context");
+
+// src/runtime/mode.ts
+var setMode = (handler) => modeResolutionChain.push(handler);
+var CAPTURE_EVENT_SUFFIX = "Capture";
+var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
+var baseClass = BUILD.lazyLoad ? class {
+} : globalThis.HTMLElement || class {
+};
+
+// src/runtime/tag-transform.ts
+var tagTransformer = void 0;
+function transformTag(tag) {
+  if (!tagTransformer) return tag;
+  return tagTransformer(tag);
+}
+function setTagTransformer(transformer) {
+  if (tagTransformer) {
+    console.warn(`
+      A tagTransformer has already been set. 
+      Overwriting it may lead to error and unexpected results if your components have already been defined.
+    `);
   }
-  define(tagName, cstr, options) {
-    if (tagName.toLowerCase() !== tagName) {
-      throw new Error(
-        `Failed to execute 'define' on 'CustomElementRegistry': "${tagName}" is not a valid custom element name`
-      );
+  tagTransformer = transformer;
+}
+
+// src/mock-doc/attribute.ts
+var attrHandler = {
+  get(obj, prop) {
+    if (prop in obj) {
+      return obj[prop];
     }
-    if (this.__registry == null) {
-      this.__registry = /* @__PURE__ */ new Map();
+    if (typeof prop !== "symbol" && !isNaN(prop)) {
+      return obj.__items[prop];
     }
-    this.__registry.set(tagName, { cstr, options });
-    if (this.__whenDefined != null) {
-      const whenDefinedResolveFns = this.__whenDefined.get(tagName);
-      if (whenDefinedResolveFns != null) {
-        whenDefinedResolveFns.forEach((whenDefinedResolveFn) => {
-          whenDefinedResolveFn();
-        });
-        whenDefinedResolveFns.length = 0;
-        this.__whenDefined.delete(tagName);
-      }
+    return void 0;
+  }
+};
+var createAttributeProxy = (caseInsensitive) => new Proxy(new MockAttributeMap(caseInsensitive), attrHandler);
+var MockAttributeMap = class {
+  constructor(caseInsensitive = false) {
+    this.caseInsensitive = caseInsensitive;
+    this.__items = [];
+  }
+  get length() {
+    return this.__items.length;
+  }
+  item(index) {
+    return this.__items[index] || null;
+  }
+  setNamedItem(attr) {
+    attr.namespaceURI = null;
+    this.setNamedItemNS(attr);
+  }
+  setNamedItemNS(attr) {
+    if (attr != null && attr.value != null) {
+      attr.value = String(attr.value);
     }
-    const doc = this.win.document;
-    if (doc != null) {
-      const hosts = doc.querySelectorAll(tagName);
-      hosts.forEach((host) => {
-        if (upgradedElements.has(host) === false) {
-          tempDisableCallbacks.add(doc);
-          const upgradedCmp = createCustomElement(this, doc, tagName);
-          for (let i = 0; i < host.childNodes.length; i++) {
-            const childNode = host.childNodes[i];
-            childNode.remove();
-            upgradedCmp.appendChild(childNode);
-          }
-          tempDisableCallbacks.delete(doc);
-          if (proxyElements.has(host)) {
-            proxyElements.set(host, upgradedCmp);
-          }
-        }
-        fireConnectedCallback(host);
-      });
+    const existingAttr = this.__items.find((a) => a.name === attr.name && a.namespaceURI === attr.namespaceURI);
+    if (existingAttr != null) {
+      existingAttr.value = attr.value;
+    } else {
+      this.__items.push(attr);
     }
   }
-  get(tagName) {
-    if (this.__registry != null) {
-      const def = this.__registry.get(tagName.toLowerCase());
-      if (def != null) {
-        return def.cstr;
-      }
+  getNamedItem(attrName) {
+    if (this.caseInsensitive) {
+      attrName = attrName.toLowerCase();
     }
-    return void 0;
+    return this.getNamedItemNS(null, attrName);
   }
-  getName(cstr) {
-    for (const [tagName, def] of this.__registry.entries()) {
-      if (def.cstr === cstr) {
-        return tagName;
+  getNamedItemNS(namespaceURI, attrName) {
+    namespaceURI = getNamespaceURI(namespaceURI);
+    return this.__items.find((attr) => attr.name === attrName && getNamespaceURI(attr.namespaceURI) === namespaceURI) || null;
+  }
+  removeNamedItem(attr) {
+    this.removeNamedItemNS(attr);
+  }
+  removeNamedItemNS(attr) {
+    for (let i = 0, ii = this.__items.length; i < ii; i++) {
+      if (this.__items[i].name === attr.name && this.__items[i].namespaceURI === attr.namespaceURI) {
+        this.__items.splice(i, 1);
+        break;
       }
     }
-    return void 0;
   }
-  upgrade(_rootNode) {
+  [Symbol.iterator]() {
+    let i = 0;
+    return {
+      next: () => ({
+        done: i === this.length,
+        value: this.item(i++)
+      })
+    };
   }
-  clear() {
-    if (this.__registry != null) {
-      this.__registry.clear();
-    }
-    if (this.__whenDefined != null) {
-      this.__whenDefined.clear();
-    }
+  get [Symbol.toStringTag]() {
+    return "MockAttributeMap";
   }
-  whenDefined(tagName) {
-    tagName = tagName.toLowerCase();
+};
+function getNamespaceURI(namespaceURI) {
+  return namespaceURI === XLINK_NS ? null : namespaceURI;
+}
+function cloneAttributes(srcAttrs, sortByName = false) {
+  const dstAttrs = new MockAttributeMap(srcAttrs.caseInsensitive);
+  if (srcAttrs != null) {
+    const attrLen = srcAttrs.length;
+    if (sortByName && attrLen > 1) {
+      const sortedAttrs = [];
+      for (let i = 0; i < attrLen; i++) {
+        const srcAttr = srcAttrs.item(i);
+        const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
+        sortedAttrs.push(dstAttr);
+      }
+      sortedAttrs.sort(sortAttributes).forEach((attr) => {
+        dstAttrs.setNamedItemNS(attr);
+      });
+    } else {
+      for (let i = 0; i < attrLen; i++) {
+        const srcAttr = srcAttrs.item(i);
+        const dstAttr = new MockAttr(srcAttr.name, srcAttr.value, srcAttr.namespaceURI);
+        dstAttrs.setNamedItemNS(dstAttr);
+      }
+    }
+  }
+  return dstAttrs;
+}
+function sortAttributes(a, b) {
+  if (a.name < b.name) return -1;
+  if (a.name > b.name) return 1;
+  return 0;
+}
+var MockAttr = class {
+  constructor(attrName, attrValue, namespaceURI = null) {
+    this._name = attrName;
+    this._value = String(attrValue);
+    this._namespaceURI = namespaceURI;
+  }
+  get name() {
+    return this._name;
+  }
+  set name(value) {
+    this._name = value;
+  }
+  get value() {
+    return this._value;
+  }
+  set value(value) {
+    this._value = String(value);
+  }
+  get nodeName() {
+    return this._name;
+  }
+  set nodeName(value) {
+    this._name = value;
+  }
+  get nodeValue() {
+    return this._value;
+  }
+  set nodeValue(value) {
+    this._value = String(value);
+  }
+  get namespaceURI() {
+    return this._namespaceURI;
+  }
+  set namespaceURI(namespaceURI) {
+    this._namespaceURI = namespaceURI;
+  }
+};
+
+// src/mock-doc/css-style-declaration.ts
+var MockCSSStyleDeclaration = class {
+  constructor() {
+    this._styles = /* @__PURE__ */ new Map();
+  }
+  setProperty(prop, value) {
+    prop = jsCaseToCssCase(prop);
+    if (value == null || value === "") {
+      this._styles.delete(prop);
+    } else {
+      this._styles.set(prop, String(value));
+    }
+  }
+  getPropertyValue(prop) {
+    prop = jsCaseToCssCase(prop);
+    return String(this._styles.get(prop) || "");
+  }
+  removeProperty(prop) {
+    prop = jsCaseToCssCase(prop);
+    this._styles.delete(prop);
+  }
+  get length() {
+    return this._styles.size;
+  }
+  get cssText() {
+    const cssText = [];
+    this._styles.forEach((value, prop) => {
+      cssText.push(`${prop}: ${value};`);
+    });
+    return cssText.join(" ").trim();
+  }
+  set cssText(cssText) {
+    if (cssText == null || cssText === "") {
+      this._styles.clear();
+      return;
+    }
+    cssText.split(";").forEach((rule) => {
+      rule = rule.trim();
+      if (rule.length > 0) {
+        const splt = rule.split(":");
+        if (splt.length > 1) {
+          const prop = splt[0].trim();
+          const value = splt.slice(1).join(":").trim();
+          if (prop !== "" && value !== "") {
+            this._styles.set(jsCaseToCssCase(prop), value);
+          }
+        }
+      }
+    });
+  }
+};
+function createCSSStyleDeclaration() {
+  return new Proxy(new MockCSSStyleDeclaration(), cssProxyHandler);
+}
+var cssProxyHandler = {
+  get(cssStyle, prop) {
+    if (prop in cssStyle) {
+      return cssStyle[prop];
+    }
+    prop = cssCaseToJsCase(prop);
+    return cssStyle.getPropertyValue(prop);
+  },
+  set(cssStyle, prop, value) {
+    if (prop in cssStyle) {
+      cssStyle[prop] = value;
+    } else {
+      cssStyle.setProperty(prop, value);
+    }
+    return true;
+  }
+};
+function cssCaseToJsCase(str) {
+  if (str.length > 1 && str.includes("-") === true) {
+    str = str.toLowerCase().split("-").map((segment) => segment.charAt(0).toUpperCase() + segment.slice(1)).join("");
+    str = str.slice(0, 1).toLowerCase() + str.slice(1);
+  }
+  return str;
+}
+function jsCaseToCssCase(str) {
+  if (str.length > 1 && str.includes("-") === false && /[A-Z]/.test(str) === true) {
+    str = str.replace(/([A-Z])/g, (g) => " " + g[0]).trim().replace(/ /g, "-").toLowerCase();
+  }
+  return str;
+}
+
+// src/mock-doc/custom-element-registry.ts
+var MockCustomElementRegistry = class {
+  constructor(win2) {
+    this.win = win2;
+  }
+  define(tagName, cstr, options) {
+    if (tagName.toLowerCase() !== tagName) {
+      throw new Error(
+        `Failed to execute 'define' on 'CustomElementRegistry': "${tagName}" is not a valid custom element name`
+      );
+    }
+    if (this.__registry == null) {
+      this.__registry = /* @__PURE__ */ new Map();
+    }
+    this.__registry.set(tagName, { cstr, options });
+    if (this.__whenDefined != null) {
+      const whenDefinedResolveFns = this.__whenDefined.get(tagName);
+      if (whenDefinedResolveFns != null) {
+        whenDefinedResolveFns.forEach((whenDefinedResolveFn) => {
+          whenDefinedResolveFn();
+        });
+        whenDefinedResolveFns.length = 0;
+        this.__whenDefined.delete(tagName);
+      }
+    }
+    const doc = this.win.document;
+    if (doc != null) {
+      const hosts = doc.querySelectorAll(tagName);
+      hosts.forEach((host) => {
+        if (upgradedElements.has(host) === false) {
+          tempDisableCallbacks.add(doc);
+          const upgradedCmp = createCustomElement(this, doc, tagName);
+          for (let i = 0; i < host.childNodes.length; i++) {
+            const childNode = host.childNodes[i];
+            childNode.remove();
+            upgradedCmp.appendChild(childNode);
+          }
+          tempDisableCallbacks.delete(doc);
+          if (proxyElements.has(host)) {
+            proxyElements.set(host, upgradedCmp);
+          }
+        }
+        fireConnectedCallback2(host);
+      });
+    }
+  }
+  get(tagName) {
+    if (this.__registry != null) {
+      const def = this.__registry.get(tagName.toLowerCase());
+      if (def != null) {
+        return def.cstr;
+      }
+    }
+    return void 0;
+  }
+  getName(cstr) {
+    for (const [tagName, def] of this.__registry.entries()) {
+      if (def.cstr === cstr) {
+        return tagName;
+      }
+    }
+    return void 0;
+  }
+  upgrade(_rootNode) {
+  }
+  clear() {
+    if (this.__registry != null) {
+      this.__registry.clear();
+    }
+    if (this.__whenDefined != null) {
+      this.__whenDefined.clear();
+    }
+  }
+  whenDefined(tagName) {
+    tagName = tagName.toLowerCase();
     if (this.__registry != null && this.__registry.has(tagName) === true) {
       return Promise.resolve(this.__registry.get(tagName).cstr);
     }
@@ -10323,7 +11321,7 @@ function connectNode(ownerDocument, node) {
     if (ownerDocument != null && node.nodeName.includes("-")) {
       const win2 = ownerDocument.defaultView;
       if (win2 != null && typeof node.connectedCallback === "function" && node.isConnected) {
-        fireConnectedCallback(node);
+        fireConnectedCallback2(node);
       }
       const shadowRoot = node.shadowRoot;
       if (shadowRoot != null) {
@@ -10341,7 +11339,7 @@ function connectNode(ownerDocument, node) {
     });
   }
 }
-function fireConnectedCallback(node) {
+function fireConnectedCallback2(node) {
   if (typeof node.connectedCallback === "function") {
     if (tempDisableCallbacks.has(node.ownerDocument) === false) {
       try {
@@ -10391,7 +11389,7 @@ function dataset(elm) {
     const attr = attributes.item(i);
     const nodeName = attr.nodeName;
     if (nodeName.startsWith("data-")) {
-      ds[dashToPascalCase(nodeName)] = attr.nodeValue;
+      ds[dashToPascalCase2(nodeName)] = attr.nodeValue;
     }
   }
   return new Proxy(ds, {
@@ -10408,7 +11406,7 @@ function dataset(elm) {
 function toDataAttribute(str) {
   return "data-" + String(str).replace(/([A-Z0-9])/g, (g) => " " + g[0]).trim().replace(/ /g, "-").toLowerCase();
 }
-function dashToPascalCase(str) {
+function dashToPascalCase2(str) {
   str = String(str).slice(5);
   return str.split("-").map((segment, index) => {
     if (index === 0) {
@@ -18760,14 +19758,14 @@ var jquery_default = (
   *
   * Date: 2023-12-11T17:55Z
   */
-  function(global2, factory) {
+  (function(global2, factory) {
     "use strict";
     if (true) {
       return factory(global2, true);
     } else {
       factory(global2);
     }
-  }({
+  })({
     document: {
       createElement() {
         return {};
@@ -20737,10 +21735,10 @@ var MockNode2 = class {
   insertBefore(newNode, referenceNode) {
     if (newNode.nodeType === 11 /* DOCUMENT_FRAGMENT_NODE */) {
       for (let i = 0, ii = newNode.childNodes.length; i < ii; i++) {
-        insertBefore(this, newNode.childNodes[i], referenceNode);
+        insertBefore2(this, newNode.childNodes[i], referenceNode);
       }
     } else {
-      insertBefore(this, newNode, referenceNode);
+      insertBefore2(this, newNode, referenceNode);
     }
     return newNode;
   }
@@ -21085,13 +22083,13 @@ var MockElement = class extends MockNode2 {
   }
   insertAdjacentElement(position, elm) {
     if (position === "beforebegin" && this.parentNode) {
-      insertBefore(this.parentNode, elm, this);
+      insertBefore2(this.parentNode, elm, this);
     } else if (position === "afterbegin") {
       this.prepend(elm);
     } else if (position === "beforeend") {
       this.appendChild(elm);
     } else if (position === "afterend" && this.parentNode) {
-      insertBefore(this.parentNode, elm, this.nextSibling);
+      insertBefore2(this.parentNode, elm, this.nextSibling);
     }
     return elm;
   }
@@ -21100,7 +22098,7 @@ var MockElement = class extends MockNode2 {
     if (position === "beforebegin") {
       while (frag.childNodes.length > 0) {
         if (this.parentNode) {
-          insertBefore(this.parentNode, frag.childNodes[0], this);
+          insertBefore2(this.parentNode, frag.childNodes[0], this);
         }
       }
     } else if (position === "afterbegin") {
@@ -21114,7 +22112,7 @@ var MockElement = class extends MockNode2 {
     } else if (position === "afterend") {
       while (frag.childNodes.length > 0) {
         if (this.parentNode) {
-          insertBefore(this.parentNode, frag.childNodes[frag.childNodes.length - 1], this.nextSibling);
+          insertBefore2(this.parentNode, frag.childNodes[frag.childNodes.length - 1], this.nextSibling);
         }
       }
     }
@@ -21122,13 +22120,13 @@ var MockElement = class extends MockNode2 {
   insertAdjacentText(position, text) {
     const elm = this.ownerDocument.createTextNode(text);
     if (position === "beforebegin" && this.parentNode) {
-      insertBefore(this.parentNode, elm, this);
+      insertBefore2(this.parentNode, elm, this);
     } else if (position === "afterbegin") {
       this.prepend(elm);
     } else if (position === "beforeend") {
       this.appendChild(elm);
     } else if (position === "afterend" && this.parentNode) {
-      insertBefore(this.parentNode, elm, this.nextSibling);
+      insertBefore2(this.parentNode, elm, this.nextSibling);
     }
   }
   hasAttribute(attrName) {
@@ -21543,7 +22541,7 @@ function resetElement(elm) {
   delete elm.__shadowRoot;
   delete elm.__style;
 }
-function insertBefore(parentNode, newNode, referenceNode) {
+function insertBefore2(parentNode, newNode, referenceNode) {
   if (newNode !== referenceNode) {
     newNode.remove();
     newNode.parentNode = parentNode;
@@ -23951,672 +24949,138 @@ var MockDocument = class _MockDocument extends MockHTMLElement {
   }
   createElement(tagName) {
     if (tagName === "#document" /* DOCUMENT_NODE */) {
-      const doc = new _MockDocument(false);
-      doc.nodeName = tagName;
-      doc.parentNode = null;
-      return doc;
-    }
-    return createElement(this, tagName);
-  }
-  createElementNS(namespaceURI, tagName) {
-    const elmNs = createElementNS(this, namespaceURI, tagName);
-    return elmNs;
-  }
-  createTextNode(text) {
-    return new MockTextNode(this, text);
-  }
-  createDocumentFragment() {
-    return new MockDocumentFragment(this);
-  }
-  createDocumentTypeNode() {
-    return new MockDocumentTypeNode(this);
-  }
-  getElementById(id) {
-    return getElementById(this, id);
-  }
-  getElementsByName(elmName) {
-    return getElementsByName(this, elmName.toLowerCase());
-  }
-  get title() {
-    const title = this.head.childNodes.find((elm) => elm.nodeName === "TITLE");
-    if (title != null && typeof title.textContent === "string") {
-      return title.textContent.trim();
-    }
-    return "";
-  }
-  set title(value) {
-    const head = this.head;
-    let title = head.childNodes.find((elm) => elm.nodeName === "TITLE");
-    if (title == null) {
-      title = this.createElement("title");
-      head.appendChild(title);
-    }
-    title.textContent = value;
-  }
-};
-function resetDocument(doc) {
-  if (doc != null) {
-    resetEventListeners(doc);
-    const documentElement = doc.documentElement;
-    if (documentElement != null) {
-      resetElement(documentElement);
-      for (let i = 0, ii = documentElement.childNodes.length; i < ii; i++) {
-        const childNode = documentElement.childNodes[i];
-        resetElement(childNode);
-        childNode.childNodes.length = 0;
-      }
-    }
-    for (const key in doc) {
-      if (doc.hasOwnProperty(key) && !DOC_KEY_KEEPERS.has(key)) {
-        delete doc[key];
-      }
-    }
-    try {
-      doc.nodeName = "#document" /* DOCUMENT_NODE */;
-    } catch (e) {
-    }
-    try {
-      doc.nodeType = 9 /* DOCUMENT_NODE */;
-    } catch (e) {
-    }
-    try {
-      doc.cookie = "";
-    } catch (e) {
-    }
-    try {
-      doc.referrer = "";
-    } catch (e) {
-    }
-  }
-}
-var DOC_KEY_KEEPERS = /* @__PURE__ */ new Set([
-  "nodeName",
-  "nodeType",
-  "nodeValue",
-  "ownerDocument",
-  "parentNode",
-  "childNodes",
-  "_shadowRoot"
-]);
-function getElementById(elm, id) {
-  const children = elm.children;
-  for (let i = 0, ii = children.length; i < ii; i++) {
-    const childElm = children[i];
-    if (childElm.id === id) {
-      return childElm;
-    }
-    const childElmFound = getElementById(childElm, id);
-    if (childElmFound != null) {
-      return childElmFound;
-    }
-  }
-  return null;
-}
-function getElementsByName(elm, elmName, foundElms = []) {
-  const children = elm.children;
-  for (let i = 0, ii = children.length; i < ii; i++) {
-    const childElm = children[i];
-    if (childElm.name && childElm.name.toLowerCase() === elmName) {
-      foundElms.push(childElm);
-    }
-    getElementsByName(childElm, elmName, foundElms);
-  }
-  return foundElms;
-}
-function setOwnerDocument(elm, ownerDocument) {
-  for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
-    elm.childNodes[i].ownerDocument = ownerDocument;
-    if (elm.childNodes[i].nodeType === 1 /* ELEMENT_NODE */) {
-      setOwnerDocument(elm.childNodes[i], ownerDocument);
-    }
-  }
-}
-
-// src/hydrate/runner/create-window.ts
-var templateWindows = /* @__PURE__ */ new Map();
-function createWindowFromHtml(templateHtml, uniqueId) {
-  let templateWindow = templateWindows.get(uniqueId);
-  if (templateWindow == null) {
-    templateWindow = new MockWindow(templateHtml);
-    templateWindows.set(uniqueId, templateWindow);
-  }
-  const win2 = cloneWindow(templateWindow);
-  return win2;
-}
-var Build = {
-  isDev: BUILD.isDev ? true : false,
-  isBrowser: true,
-  isServer: false,
-  isTesting: BUILD.isTesting ? true : false
-};
-
-// src/utils/constants.ts
-var PrimitiveType = /* @__PURE__ */ ((PrimitiveType2) => {
-  PrimitiveType2["Undefined"] = "undefined";
-  PrimitiveType2["Null"] = "null";
-  PrimitiveType2["String"] = "string";
-  PrimitiveType2["Number"] = "number";
-  PrimitiveType2["SpecialNumber"] = "number";
-  PrimitiveType2["Boolean"] = "boolean";
-  PrimitiveType2["BigInt"] = "bigint";
-  return PrimitiveType2;
-})(PrimitiveType || {});
-var NonPrimitiveType = /* @__PURE__ */ ((NonPrimitiveType2) => {
-  NonPrimitiveType2["Array"] = "array";
-  NonPrimitiveType2["Date"] = "date";
-  NonPrimitiveType2["Map"] = "map";
-  NonPrimitiveType2["Object"] = "object";
-  NonPrimitiveType2["RegularExpression"] = "regexp";
-  NonPrimitiveType2["Set"] = "set";
-  NonPrimitiveType2["Channel"] = "channel";
-  NonPrimitiveType2["Symbol"] = "symbol";
-  return NonPrimitiveType2;
-})(NonPrimitiveType || {});
-var TYPE_CONSTANT = "type";
-var VALUE_CONSTANT = "value";
-var SERIALIZED_PREFIX = "serialized:";
-var STENCIL_DEV_MODE = BUILD.isTesting ? ["STENCIL:"] : [
-  "%cstencil",
-  "color: white;background:#4c47ff;font-weight: bold; font-size:10px; padding:2px 6px; border-radius: 5px"
-];
-var win = typeof window !== "undefined" ? window : {};
-var H = win.HTMLElement || class {
-};
-var supportsShadow = BUILD.shadowDom;
-var supportsConstructableStylesheets = BUILD.constructableCSS ? /* @__PURE__ */ (() => {
-  try {
-    new CSSStyleSheet();
-    return typeof new CSSStyleSheet().replaceSync === "function";
-  } catch (e) {
-  }
-  return false;
-})() : false;
-
-// src/utils/helpers.ts
-var isString = (v) => typeof v === "string";
-
-// src/utils/local-value.ts
-var LocalValue = class _LocalValue {
-  constructor(type, value) {
-    if (type === "undefined" /* Undefined */ || type === "null" /* Null */) {
-      this.type = type;
-    } else {
-      this.type = type;
-      this.value = value;
-    }
-  }
-  /**
-   * Creates a new LocalValue object with a string value.
-   *
-   * @param {string} value - The string value to be stored in the LocalValue object.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createStringValue(value) {
-    return new _LocalValue("string" /* String */, value);
-  }
-  /**
-   * Creates a new LocalValue object with a number value.
-   *
-   * @param {number} value - The number value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createNumberValue(value) {
-    return new _LocalValue("number" /* Number */, value);
-  }
-  /**
-   * Creates a new LocalValue object with a special number value.
-   *
-   * @param {number} value - The value of the special number.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createSpecialNumberValue(value) {
-    if (Number.isNaN(value)) {
-      return new _LocalValue("number" /* SpecialNumber */, "NaN");
-    }
-    if (Object.is(value, -0)) {
-      return new _LocalValue("number" /* SpecialNumber */, "-0");
-    }
-    if (value === Infinity) {
-      return new _LocalValue("number" /* SpecialNumber */, "Infinity");
-    }
-    if (value === -Infinity) {
-      return new _LocalValue("number" /* SpecialNumber */, "-Infinity");
-    }
-    return new _LocalValue("number" /* SpecialNumber */, value);
-  }
-  /**
-   * Creates a new LocalValue object with an undefined value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createUndefinedValue() {
-    return new _LocalValue("undefined" /* Undefined */);
-  }
-  /**
-   * Creates a new LocalValue object with a null value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createNullValue() {
-    return new _LocalValue("null" /* Null */);
-  }
-  /**
-   * Creates a new LocalValue object with a boolean value.
-   *
-   * @param {boolean} value - The boolean value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createBooleanValue(value) {
-    return new _LocalValue("boolean" /* Boolean */, value);
-  }
-  /**
-   * Creates a new LocalValue object with a BigInt value.
-   *
-   * @param {BigInt} value - The BigInt value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createBigIntValue(value) {
-    return new _LocalValue("bigint" /* BigInt */, value.toString());
-  }
-  /**
-   * Creates a new LocalValue object with an array.
-   *
-   * @param {Array} value - The array.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createArrayValue(value) {
-    return new _LocalValue("array" /* Array */, value);
-  }
-  /**
-   * Creates a new LocalValue object with date value.
-   *
-   * @param {string} value - The date.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createDateValue(value) {
-    return new _LocalValue("date" /* Date */, value);
-  }
-  /**
-   * Creates a new LocalValue object of map value.
-   * @param {Map} map - The map.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createMapValue(map2) {
-    const value = [];
-    Array.from(map2.entries()).forEach(([key, val]) => {
-      value.push([_LocalValue.getArgument(key), _LocalValue.getArgument(val)]);
-    });
-    return new _LocalValue("map" /* Map */, value);
-  }
-  /**
-   * Creates a new LocalValue object from the passed object.
-   *
-   * @param object the object to create a LocalValue from
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createObjectValue(object) {
-    const value = [];
-    Object.entries(object).forEach(([key, val]) => {
-      value.push([key, _LocalValue.getArgument(val)]);
-    });
-    return new _LocalValue("object" /* Object */, value);
-  }
-  /**
-   * Creates a new LocalValue object of regular expression value.
-   *
-   * @param {string} value - The value of the regular expression.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createRegularExpressionValue(value) {
-    return new _LocalValue("regexp" /* RegularExpression */, value);
-  }
-  /**
-   * Creates a new LocalValue object with the specified value.
-   * @param {Set} value - The value to be set.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createSetValue(value) {
-    return new _LocalValue("set" /* Set */, value);
-  }
-  /**
-   * Creates a new LocalValue object with the given channel value
-   *
-   * @param {ChannelValue} value - The channel value.
-   * @returns {LocalValue} - The created LocalValue object.
-   */
-  static createChannelValue(value) {
-    return new _LocalValue("channel" /* Channel */, value);
-  }
-  /**
-   * Creates a new LocalValue object with a Symbol value.
-   *
-   * @param {Symbol} symbol - The Symbol value
-   * @returns {LocalValue} - The created LocalValue object
-   */
-  static createSymbolValue(symbol) {
-    const description = symbol.description || "Symbol()";
-    return new _LocalValue("symbol" /* Symbol */, description);
-  }
-  static getArgument(argument) {
-    const type = typeof argument;
-    switch (type) {
-      case "string" /* String */:
-        return _LocalValue.createStringValue(argument);
-      case "number" /* Number */:
-        if (Number.isNaN(argument) || Object.is(argument, -0) || !Number.isFinite(argument)) {
-          return _LocalValue.createSpecialNumberValue(argument);
-        }
-        return _LocalValue.createNumberValue(argument);
-      case "boolean" /* Boolean */:
-        return _LocalValue.createBooleanValue(argument);
-      case "bigint" /* BigInt */:
-        return _LocalValue.createBigIntValue(argument);
-      case "undefined" /* Undefined */:
-        return _LocalValue.createUndefinedValue();
-      case "symbol" /* Symbol */:
-        return _LocalValue.createSymbolValue(argument);
-      case "object" /* Object */:
-        if (argument === null) {
-          return _LocalValue.createNullValue();
-        }
-        if (argument instanceof Date) {
-          return _LocalValue.createDateValue(argument);
-        }
-        if (argument instanceof Map) {
-          const map2 = [];
-          argument.forEach((value, key) => {
-            const objectKey = typeof key === "string" ? key : _LocalValue.getArgument(key);
-            const objectValue = _LocalValue.getArgument(value);
-            map2.push([objectKey, objectValue]);
-          });
-          return _LocalValue.createMapValue(argument);
-        }
-        if (argument instanceof Set) {
-          const set = [];
-          argument.forEach((value) => {
-            set.push(_LocalValue.getArgument(value));
-          });
-          return _LocalValue.createSetValue(set);
-        }
-        if (argument instanceof Array) {
-          const arr = [];
-          argument.forEach((value) => {
-            arr.push(_LocalValue.getArgument(value));
-          });
-          return _LocalValue.createArrayValue(arr);
-        }
-        if (argument instanceof RegExp) {
-          return _LocalValue.createRegularExpressionValue({
-            pattern: argument.source,
-            flags: argument.flags
-          });
-        }
-        return _LocalValue.createObjectValue(argument);
-    }
-    throw new Error(`Unsupported type: ${type}`);
-  }
-  asMap() {
-    return {
-      [TYPE_CONSTANT]: this.type,
-      ...!(this.type === "null" /* Null */ || this.type === "undefined" /* Undefined */) ? { [VALUE_CONSTANT]: this.value } : {}
-    };
-  }
-};
-
-// src/utils/message-utils.ts
-var catchError = (diagnostics, err2, msg) => {
-  const diagnostic = {
-    level: "error",
-    type: "build",
-    header: "Build Error",
-    messageText: "build error",
-    lines: []
-  };
-  if (isString(msg)) {
-    diagnostic.messageText = msg.length ? msg : "UNKNOWN ERROR";
-  } else if (err2 != null) {
-    if (err2.stack != null) {
-      diagnostic.messageText = err2.stack.toString();
-    } else {
-      if (err2.message != null) {
-        diagnostic.messageText = err2.message.length ? err2.message : "UNKNOWN ERROR";
-      } else {
-        diagnostic.messageText = err2.toString();
-      }
-    }
-  }
-  if (diagnostics != null && !shouldIgnoreError(diagnostic.messageText)) {
-    diagnostics.push(diagnostic);
-  }
-  return diagnostic;
-};
-var hasError = (diagnostics) => {
-  if (diagnostics == null || diagnostics.length === 0) {
-    return false;
-  }
-  return diagnostics.some((d) => d.level === "error" && d.type !== "runtime");
-};
-var shouldIgnoreError = (msg) => {
-  return msg === TASK_CANCELED_MSG;
-};
-var TASK_CANCELED_MSG = `task canceled`;
-
-// src/utils/regular-expression.ts
-var escapeRegExpSpecialCharacters = (text) => {
-  return text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-};
-
-// src/utils/remote-value.ts
-var RemoteValue = class _RemoteValue {
-  /**
-   * Deserializes a LocalValue serialized object back to its original JavaScript representation
-   *
-   * @param serialized The serialized LocalValue object
-   * @returns The original JavaScript value/object
-   */
-  static fromLocalValue(serialized) {
-    const type = serialized[TYPE_CONSTANT];
-    const value = VALUE_CONSTANT in serialized ? serialized[VALUE_CONSTANT] : void 0;
-    switch (type) {
-      case "string" /* String */:
-        return value;
-      case "boolean" /* Boolean */:
-        return value;
-      case "bigint" /* BigInt */:
-        return BigInt(value);
-      case "undefined" /* Undefined */:
-        return void 0;
-      case "null" /* Null */:
-        return null;
-      case "number" /* Number */:
-        if (value === "NaN") return NaN;
-        if (value === "-0") return -0;
-        if (value === "Infinity") return Infinity;
-        if (value === "-Infinity") return -Infinity;
-        return value;
-      case "array" /* Array */:
-        return value.map((item) => _RemoteValue.fromLocalValue(item));
-      case "date" /* Date */:
-        return new Date(value);
-      case "map" /* Map */:
-        const map2 = /* @__PURE__ */ new Map();
-        for (const [key, val] of value) {
-          const deserializedKey = typeof key === "object" && key !== null ? _RemoteValue.fromLocalValue(key) : key;
-          const deserializedValue = _RemoteValue.fromLocalValue(val);
-          map2.set(deserializedKey, deserializedValue);
-        }
-        return map2;
-      case "object" /* Object */:
-        const obj = {};
-        for (const [key, val] of value) {
-          obj[key] = _RemoteValue.fromLocalValue(val);
-        }
-        return obj;
-      case "regexp" /* RegularExpression */:
-        const { pattern, flags } = value;
-        return new RegExp(pattern, flags);
-      case "set" /* Set */:
-        const set = /* @__PURE__ */ new Set();
-        for (const item of value) {
-          set.add(_RemoteValue.fromLocalValue(item));
-        }
-        return set;
-      case "symbol" /* Symbol */:
-        return Symbol(value);
-      default:
-        throw new Error(`Unsupported type: ${type}`);
+      const doc = new _MockDocument(false);
+      doc.nodeName = tagName;
+      doc.parentNode = null;
+      return doc;
     }
+    return createElement(this, tagName);
   }
-  /**
-   * Utility method to deserialize multiple LocalValues at once
-   *
-   * @param serializedValues Array of serialized LocalValue objects
-   * @returns Array of deserialized JavaScript values
-   */
-  static fromLocalValueArray(serializedValues) {
-    return serializedValues.map((value) => _RemoteValue.fromLocalValue(value));
+  createElementNS(namespaceURI, tagName) {
+    const elmNs = createElementNS(this, namespaceURI, tagName);
+    return elmNs;
   }
-  /**
-   * Verifies if the given object matches the structure of a serialized LocalValue
-   *
-   * @param obj Object to verify
-   * @returns boolean indicating if the object has LocalValue structure
-   */
-  static isLocalValueObject(obj) {
-    if (typeof obj !== "object" || obj === null) {
-      return false;
-    }
-    if (!obj.hasOwnProperty(TYPE_CONSTANT)) {
-      return false;
-    }
-    const type = obj[TYPE_CONSTANT];
-    const hasTypeProperty = Object.values({ ...PrimitiveType, ...NonPrimitiveType }).includes(type);
-    if (!hasTypeProperty) {
-      return false;
+  createTextNode(text) {
+    return new MockTextNode(this, text);
+  }
+  createDocumentFragment() {
+    return new MockDocumentFragment(this);
+  }
+  createDocumentTypeNode() {
+    return new MockDocumentTypeNode(this);
+  }
+  getElementById(id) {
+    return getElementById(this, id);
+  }
+  getElementsByName(elmName) {
+    return getElementsByName(this, elmName.toLowerCase());
+  }
+  get title() {
+    const title = this.head.childNodes.find((elm) => elm.nodeName === "TITLE");
+    if (title != null && typeof title.textContent === "string") {
+      return title.textContent.trim();
     }
-    if (type !== "null" /* Null */ && type !== "undefined" /* Undefined */) {
-      return obj.hasOwnProperty(VALUE_CONSTANT);
+    return "";
+  }
+  set title(value) {
+    const head = this.head;
+    let title = head.childNodes.find((elm) => elm.nodeName === "TITLE");
+    if (title == null) {
+      title = this.createElement("title");
+      head.appendChild(title);
     }
-    return true;
+    title.textContent = value;
   }
 };
-
-// src/utils/result.ts
-var result_exports = {};
-__export(result_exports, {
-  err: () => err,
-  map: () => map,
-  ok: () => ok,
-  unwrap: () => unwrap,
-  unwrapErr: () => unwrapErr
-});
-var ok = (value) => ({
-  isOk: true,
-  isErr: false,
-  value
-});
-var err = (value) => ({
-  isOk: false,
-  isErr: true,
-  value
-});
-function map(result, fn) {
-  if (result.isOk) {
-    const val = fn(result.value);
-    if (val instanceof Promise) {
-      return val.then((newVal) => ok(newVal));
-    } else {
-      return ok(val);
+function resetDocument(doc) {
+  if (doc != null) {
+    resetEventListeners(doc);
+    const documentElement = doc.documentElement;
+    if (documentElement != null) {
+      resetElement(documentElement);
+      for (let i = 0, ii = documentElement.childNodes.length; i < ii; i++) {
+        const childNode = documentElement.childNodes[i];
+        resetElement(childNode);
+        childNode.childNodes.length = 0;
+      }
+    }
+    for (const key in doc) {
+      if (doc.hasOwnProperty(key) && !DOC_KEY_KEEPERS.has(key)) {
+        delete doc[key];
+      }
+    }
+    try {
+      doc.nodeName = "#document" /* DOCUMENT_NODE */;
+    } catch (e) {
+    }
+    try {
+      doc.nodeType = 9 /* DOCUMENT_NODE */;
+    } catch (e) {
+    }
+    try {
+      doc.cookie = "";
+    } catch (e) {
+    }
+    try {
+      doc.referrer = "";
+    } catch (e) {
     }
   }
-  if (result.isErr) {
-    const value = result.value;
-    return err(value);
-  }
-  throw "should never get here";
 }
-var unwrap = (result) => {
-  if (result.isOk) {
-    return result.value;
-  } else {
-    throw result.value;
-  }
-};
-var unwrapErr = (result) => {
-  if (result.isErr) {
-    return result.value;
-  } else {
-    throw result.value;
+var DOC_KEY_KEEPERS = /* @__PURE__ */ new Set([
+  "nodeName",
+  "nodeType",
+  "nodeValue",
+  "ownerDocument",
+  "parentNode",
+  "childNodes",
+  "_shadowRoot"
+]);
+function getElementById(elm, id) {
+  const children = elm.children;
+  for (let i = 0, ii = children.length; i < ii; i++) {
+    const childElm = children[i];
+    if (childElm.id === id) {
+      return childElm;
+    }
+    const childElmFound = getElementById(childElm, id);
+    if (childElmFound != null) {
+      return childElmFound;
+    }
   }
-};
-
-// src/utils/serialize.ts
-function serializeProperty(value) {
-  if (["string", "boolean", "undefined"].includes(typeof value) || typeof value === "number" && value !== Infinity && value !== -Infinity && !isNaN(value)) {
-    return value;
+  return null;
+}
+function getElementsByName(elm, elmName, foundElms = []) {
+  const children = elm.children;
+  for (let i = 0, ii = children.length; i < ii; i++) {
+    const childElm = children[i];
+    if (childElm.name && childElm.name.toLowerCase() === elmName) {
+      foundElms.push(childElm);
+    }
+    getElementsByName(childElm, elmName, foundElms);
   }
-  const arg = LocalValue.getArgument(value);
-  return SERIALIZED_PREFIX + btoa(JSON.stringify(arg));
+  return foundElms;
 }
-function deserializeProperty(value) {
-  if (typeof value !== "string" || !value.startsWith(SERIALIZED_PREFIX)) {
-    return value;
+function setOwnerDocument(elm, ownerDocument) {
+  for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
+    elm.childNodes[i].ownerDocument = ownerDocument;
+    if (elm.childNodes[i].nodeType === 1 /* ELEMENT_NODE */) {
+      setOwnerDocument(elm.childNodes[i], ownerDocument);
+    }
   }
-  return RemoteValue.fromLocalValue(JSON.parse(atob(value.slice(SERIALIZED_PREFIX.length))));
 }
 
-// src/utils/util.ts
-var lowerPathParam = (fn) => (p) => fn(p.toLowerCase());
-var isDtsFile = lowerPathParam((p) => p.endsWith(".d.ts") || p.endsWith(".d.mts") || p.endsWith(".d.cts"));
-var isTsFile = lowerPathParam(
-  (p) => !isDtsFile(p) && (p.endsWith(".ts") || p.endsWith(".mts") || p.endsWith(".cts"))
-);
-var isTsxFile = lowerPathParam(
-  (p) => p.endsWith(".tsx") || p.endsWith(".mtsx") || p.endsWith(".ctsx")
-);
-var isJsxFile = lowerPathParam(
-  (p) => p.endsWith(".jsx") || p.endsWith(".mjsx") || p.endsWith(".cjsx")
-);
-var isJsFile = lowerPathParam((p) => p.endsWith(".js") || p.endsWith(".mjs") || p.endsWith(".cjs"));
-
-// src/utils/shadow-css.ts
-/**
- * @license
- * Copyright Google Inc. All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- *
- * This file is a port of shadowCSS from `webcomponents.js` to TypeScript.
- * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
- * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
- */
-var _polyfillHost = "-shadowcsshost";
-var _polyfillSlotted = "-shadowcssslotted";
-var _polyfillHostContext = "-shadowcsscontext";
-var _parenSuffix = ")(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)";
-var _cssColonHostRe = new RegExp("(" + _polyfillHost + _parenSuffix, "gim");
-var _cssColonHostContextRe = new RegExp("(" + _polyfillHostContext + _parenSuffix, "gim");
-var _cssColonSlottedRe = new RegExp("(" + _polyfillSlotted + _parenSuffix, "gim");
-var _polyfillHostNoCombinator = _polyfillHost + "-no-combinator";
-var createSupportsRuleRe = (selector) => {
-  const safeSelector = escapeRegExpSpecialCharacters(selector);
-  return new RegExp(
-    // First capture group: match any context before the selector that's not inside @supports selector()
-    // Using negative lookahead to avoid matching inside @supports selector(...) condition
-    `(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${safeSelector}))(${safeSelector}\\b)`,
-    "g"
-  );
-};
-var _colonSlottedRe = createSupportsRuleRe("::slotted");
-var _colonHostRe = createSupportsRuleRe(":host");
-var _colonHostContextRe = createSupportsRuleRe(":host-context");
-
-// src/runtime/mode.ts
-var setMode = (handler) => modeResolutionChain.push(handler);
-var CAPTURE_EVENT_SUFFIX = "Capture";
-var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
-var baseClass = BUILD.lazyLoad ? class {
-} : globalThis.HTMLElement || class {
-};
+// src/hydrate/runner/create-window.ts
+var templateWindows = /* @__PURE__ */ new Map();
+function createWindowFromHtml(templateHtml, uniqueId) {
+  let templateWindow = templateWindows.get(uniqueId);
+  if (templateWindow == null) {
+    templateWindow = new MockWindow(templateHtml);
+    templateWindows.set(uniqueId, templateWindow);
+  }
+  const win2 = cloneWindow(templateWindow);
+  return win2;
+}
 
 // src/compiler/html/canonical-link.ts
 var updateCanonicalLink = (doc, href) => {
@@ -25999,10 +26463,21 @@ function removeScripts(elm) {
   }
 }
 
+// src/hydrate/runner/index.ts
+var everywhere;
+try {
+  everywhere = global || globalThis;
+} catch (e) {
+  everywhere = window || globalThis;
+}
+everywhere.tagTransform = transformTag;
+
 exports.createWindowFromHtml = createWindowFromHtml;
 exports.deserializeProperty = deserializeProperty;
 exports.hydrateDocument = hydrateDocument;
 exports.renderToString = renderToString;
 exports.serializeDocumentToString = serializeDocumentToString;
 exports.serializeProperty = serializeProperty;
+exports.setTagTransformer = setTagTransformer;
 exports.streamToString = streamToString;
+exports.transformTag = transformTag;