@sellmate/design-system 1.0.74 → 1.0.76

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@sellmate/design-system",
- "version": "1.0.74",
+ "version": "1.0.76",
  "description": "Sellmate Design System - Web Components Library built with Stencil",
  "keywords": [
   "web-components",

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

@@ -1,427 +0,0 @@
-'use strict';
-
-var index = require('./index-Dptupbm0.js');
-var index$1 = require('./index-BUvXpPc3.js');
-
-const pagination = {
-	height: "24",
-	paddingX: "6",
-	radius: "6",
-	gap: "12",
-	move: {
-		gap: "4"
-	},
-	icon: "12",
-	typography: {
-		"default": {
-			fontFamily: "Pretendard Variable, Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Segoe UI, Apple SD Gothic Neo, Noto Sans KR, Malgun Gothic, Apple Color Emoji, Segoe UI Emoji, sans-serif",
-			fontSize: "12",
-			fontWeight: "500",
-			lineHeight: "20"},
-		selected: {
-			fontWeight: "700"}
-	},
-	item: {
-		bg: {
-			hover: "#EEEEEE",
-			selected: "#E6F1FF"
-		},
-		content: {
-			"default": "#555555",
-			hover: "#004290",
-			selected: "#004290"
-		}
-	}
-};
-var paginationTokens = {
-	pagination: pagination
-};
-
-const PAGINATION_LAYOUT = {
-    height: `${paginationTokens.pagination.height}px`,
-    paddingX: `${paginationTokens.pagination.paddingX}px`,
-    radius: `${paginationTokens.pagination.radius}px`,
-    gap: `${paginationTokens.pagination.gap}px`,
-    moveGap: `${paginationTokens.pagination.move.gap}px`,
-    iconSize: Number(paginationTokens.pagination.icon),
-};
-const PAGINATION_TYPOGRAPHY = {
-    fontFamily: paginationTokens.pagination.typography.default.fontFamily,
-    fontSize: `${paginationTokens.pagination.typography.default.fontSize}px`,
-    lineHeight: `${paginationTokens.pagination.typography.default.lineHeight}px`,
-    fontWeightDefault: paginationTokens.pagination.typography.default.fontWeight,
-    fontWeightSelected: paginationTokens.pagination.typography.selected.fontWeight,
-};
-const PAGINATION_COLORS = {
-    contentDefault: paginationTokens.pagination.item.content.default,
-    contentHover: paginationTokens.pagination.item.content.hover,
-    contentSelected: paginationTokens.pagination.item.content.selected,
-    bgHover: paginationTokens.pagination.item.bg.hover,
-    bgSelected: paginationTokens.pagination.item.bg.selected,
-    // TODO: 토큰 반영 후 교체 — nav 화살표 색상은 현재 토큰에 없음
-    iconDefault: '#888888',
-};
-
-const sdPaginationCss = () => `sd-pagination{display:inline-flex}.sd-pagination{display:inline-flex;align-items:center;gap:var(--sd-pagination-gap);font-family:var(--sd-pagination-font-family)}.sd-pagination__group{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap);min-width:calc(var(--sd-pagination-height) * 2 + var(--sd-pagination-move-gap))}.sd-pagination__group--prev{justify-content:flex-end}.sd-pagination__group--next{justify-content:flex-start}.sd-pagination__numbers{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap)}.sd-pagination__nav{display:inline-flex;align-items:center;justify-content:center;width:var(--sd-pagination-height);height:var(--sd-pagination-height);padding:0;background:transparent;border:0;border-radius:var(--sd-pagination-radius);cursor:pointer;outline:none}.sd-pagination__nav:hover{background-color:var(--sd-pagination-bg-hover)}.sd-pagination__item{display:inline-flex;align-items:center;justify-content:center;width:var(--sd-pagination-item-width);height:var(--sd-pagination-height);padding:0 var(--sd-pagination-padding-x);background:transparent;border:0;border-radius:var(--sd-pagination-radius);color:var(--sd-pagination-content);font-size:var(--sd-pagination-font-size);font-weight:var(--sd-pagination-font-weight-default);line-height:var(--sd-pagination-line-height);cursor:pointer;outline:none;box-sizing:border-box}.sd-pagination__item:hover{background-color:var(--sd-pagination-bg-hover);color:var(--sd-pagination-content-hover)}.sd-pagination__item--selected{background-color:var(--sd-pagination-bg-selected);color:var(--sd-pagination-content-selected);font-weight:var(--sd-pagination-font-weight-selected)}.sd-pagination__item--selected:hover{background-color:var(--sd-pagination-bg-selected);color:var(--sd-pagination-content-selected)}.sd-pagination__info{display:inline-flex;align-items:center;gap:var(--sd-pagination-move-gap);height:var(--sd-pagination-height);padding:0 var(--sd-pagination-padding-x);color:var(--sd-pagination-content);font-size:var(--sd-pagination-font-size);font-weight:var(--sd-pagination-font-weight-default);line-height:var(--sd-pagination-line-height)}.sd-pagination__current{color:var(--sd-pagination-content-selected);font-weight:var(--sd-pagination-font-weight-selected)}`;
-
-const PER_PAGE = 10;
-const BUTTON_WIDTH = {
-    1: 24,
-    2: 34,
-    3: 40,
-    4: 48,
-    5: 56,
-};
-const SdPagination = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.pageChange = index.createEvent(this, "sdPageChange", 7);
-    }
-    currentPage = 1;
-    lastPage = 1;
-    simple = false;
-    pageChange;
-    get pageNumbers() {
-        const start = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;
-        const end = Math.min(start + PER_PAGE - 1, this.lastPage);
-        return Array.from({ length: end - start + 1 }, (_, i) => start + i);
-    }
-    get buttonWidth() {
-        const lastPageNum = this.pageNumbers.at(-1) ?? 1;
-        const maxPageLength = lastPageNum.toString().length;
-        return BUTTON_WIDTH[maxPageLength] || BUTTON_WIDTH[1];
-    }
-    get isFirstGroup() {
-        return this.currentPage <= PER_PAGE;
-    }
-    get isLastGroup() {
-        const startPageGroup = Math.floor((this.currentPage - 1) / PER_PAGE) * PER_PAGE + 1;
-        return startPageGroup + PER_PAGE - 1 >= this.lastPage;
-    }
-    handlePageChange = (page) => {
-        if (page < 1 || page > this.lastPage)
-            return;
-        this.currentPage = page;
-        this.pageChange.emit(page);
-    };
-    handleGroupChange = (direction) => {
-        const delta = direction === 'forward' ? PER_PAGE : -PER_PAGE;
-        const newPage = Math.min(Math.max(this.currentPage + delta, 1), this.lastPage);
-        this.handlePageChange(newPage);
-    };
-    renderNavButton(iconName, ariaLabel, onClick) {
-        return (index.h("button", { type: "button", class: "sd-pagination__nav", "aria-label": ariaLabel, onClick: onClick }, index.h("sd-icon", { name: iconName, size: PAGINATION_LAYOUT.iconSize, color: PAGINATION_COLORS.iconDefault })));
-    }
-    renderPrevButtons() {
-        if (this.simple) {
-            if (this.currentPage <= 1)
-                return null;
-            return (index.h(index.Fragment, null, this.renderNavButton('chevronLeftEnd', 'Go to first page', () => this.handlePageChange(1)), this.renderNavButton('chevronLeft', 'Go to previous page', () => this.handlePageChange(this.currentPage - 1))));
-        }
-        if (this.isFirstGroup)
-            return null;
-        return (index.h(index.Fragment, null, this.renderNavButton('chevronLeftEnd', 'Go to first page', () => this.handlePageChange(1)), this.renderNavButton('chevronLeft', 'Go to previous page group', () => this.handleGroupChange('backward'))));
-    }
-    renderNextButtons() {
-        if (this.simple) {
-            if (this.currentPage >= this.lastPage)
-                return null;
-            return (index.h(index.Fragment, null, this.renderNavButton('chevronRight', 'Go to next page', () => this.handlePageChange(this.currentPage + 1)), this.renderNavButton('chevronRightEnd', 'Go to last page', () => this.handlePageChange(this.lastPage))));
-        }
-        if (this.isLastGroup)
-            return null;
-        return (index.h(index.Fragment, null, this.renderNavButton('chevronRight', 'Go to next page group', () => this.handleGroupChange('forward')), this.renderNavButton('chevronRightEnd', 'Go to last page', () => this.handlePageChange(this.lastPage))));
-    }
-    render() {
-        const cssVars = {
-            '--sd-pagination-height': PAGINATION_LAYOUT.height,
-            '--sd-pagination-padding-x': PAGINATION_LAYOUT.paddingX,
-            '--sd-pagination-radius': PAGINATION_LAYOUT.radius,
-            '--sd-pagination-gap': PAGINATION_LAYOUT.gap,
-            '--sd-pagination-move-gap': PAGINATION_LAYOUT.moveGap,
-            '--sd-pagination-font-family': PAGINATION_TYPOGRAPHY.fontFamily,
-            '--sd-pagination-font-size': PAGINATION_TYPOGRAPHY.fontSize,
-            '--sd-pagination-line-height': PAGINATION_TYPOGRAPHY.lineHeight,
-            '--sd-pagination-font-weight-default': PAGINATION_TYPOGRAPHY.fontWeightDefault,
-            '--sd-pagination-font-weight-selected': PAGINATION_TYPOGRAPHY.fontWeightSelected,
-            '--sd-pagination-content': PAGINATION_COLORS.contentDefault,
-            '--sd-pagination-content-hover': PAGINATION_COLORS.contentHover,
-            '--sd-pagination-content-selected': PAGINATION_COLORS.contentSelected,
-            '--sd-pagination-bg-hover': PAGINATION_COLORS.bgHover,
-            '--sd-pagination-bg-selected': PAGINATION_COLORS.bgSelected,
-            '--sd-pagination-item-width': `${this.buttonWidth}px`,
-        };
-        return (index.h("div", { key: '386fdd2d1c0b5a7284c299201f19fd3384670ab1', class: {
-                'sd-pagination': true,
-                'sd-pagination--simple': this.simple,
-            }, style: cssVars }, index.h("div", { key: 'cd73997ae59f87b70c31e88fd5b4246bd6044bd0', class: "sd-pagination__group sd-pagination__group--prev" }, this.renderPrevButtons()), this.simple ? (index.h("div", { class: "sd-pagination__info" }, index.h("span", { class: "sd-pagination__current" }, this.currentPage), index.h("span", { class: "sd-pagination__divider" }, "/"), index.h("span", { class: "sd-pagination__last" }, this.lastPage))) : (index.h("div", { class: "sd-pagination__numbers" }, this.pageNumbers.map(n => (index.h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
-                'sd-pagination__item': true,
-                'sd-pagination__item--selected': this.currentPage === n,
-            }, onClick: () => this.handlePageChange(n) }, n))))), index.h("div", { key: '86389ea83d2965efdd938d2f9b2e2c3469f05fe8', class: "sd-pagination__group sd-pagination__group--next" }, this.renderNextButtons())));
-    }
-};
-SdPagination.style = sdPaginationCss();
-
-const sdSelectV2Css = () => `sd-select-v2{display:inline-flex}sd-select-v2 sd-portal{display:none}sd-select-v2 .sd-select-v2{position:relative;width:100%;height:100%}`;
-
-const SdSelectV2 = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.update = index.createEvent(this, "sdUpdate", 7);
-        this.dropDownShow = index.createEvent(this, "sdDropDownShow", 7);
-    }
-    static VIEWPORT_PADDING = 20;
-    static PORTAL_OFFSET_Y = 4;
-    static CLOSE_ANIMATION_DURATION = 150;
-    get el() { return index.getElement(this); }
-    type = 'default';
-    value = null;
-    options = [];
-    placeholder = '선택';
-    maxDropdownWidth = '640px';
-    dropdownHeight = '260px';
-    disabled = false;
-    label = '';
-    labelWidth = '';
-    addonLabel = '';
-    addonAlign = 'start';
-    error = false;
-    hint = '';
-    errorMessage = '';
-    rules = [];
-    icon = undefined;
-    labelTooltip = '';
-    labelTooltipProps = null;
-    emitValue = false;
-    width = '';
-    isOpen = false;
-    isAnimatingOut = false;
-    triggerWidth = '200px';
-    resolvedDropdownHeight = '260px';
-    resolvedMaxDropdownWidth = '640px';
-    focused = false;
-    hovered = false;
-    update;
-    dropDownShow;
-    async sdFocus() {
-        if (this.disabled)
-            return;
-        await this.triggerComponentRef?.sdFocus();
-    }
-    async sdOpen() {
-        // sdFocus 직후 호출 시 트리거 ref/레이아웃이 안정될 때까지 한 틱 대기
-        await new Promise(resolve => setTimeout(resolve, 0));
-        if (this.disabled || this.isOpen)
-            return;
-        this.prepareDropdownGeometry();
-        if (this.closeAnimationTimer)
-            clearTimeout(this.closeAnimationTimer);
-        this.isAnimatingOut = false;
-        this.isOpen = true;
-    }
-    triggerRef;
-    triggerComponentRef;
-    closeAnimationTimer;
-    name = index$1.nanoid();
-    triggerHasFocus = false;
-    watchIsOpen(newValue) {
-        this.syncFocusedState(newValue);
-        this.dropDownShow.emit({ isOpen: newValue });
-    }
-    get isMulti() {
-        return this.type === 'multi' || this.type === 'multi_depth';
-    }
-    get displayText() {
-        if (this.isMulti) {
-            if (!Array.isArray(this.value) || this.value.length === 0)
-                return '';
-            const flat = this.flattenOptions(this.options);
-            return this.value
-                .map(item => {
-                if (item != null && typeof item === 'object') {
-                    const opt = item;
-                    return opt.label ?? flat.find(o => o.value === opt.value)?.label ?? '';
-                }
-                return flat.find(o => o.value === item)?.label ?? '';
-            })
-                .filter(Boolean)
-                .join(', ');
-        }
-        if (this.value == null)
-            return '';
-        if (!this.emitValue && typeof this.value === 'object' && !Array.isArray(this.value)) {
-            return this.value.label ?? '';
-        }
-        const flat = this.flattenOptions(this.options);
-        const found = flat.find(o => o.value === this.value);
-        return found?.label ?? '';
-    }
-    flattenOptions(options) {
-        return options.flatMap(o => (o.children ? this.flattenOptions(o.children) : [o]));
-    }
-    getSelectedOptions() {
-        const val = this.value;
-        if (!val || !Array.isArray(val))
-            return [];
-        if (this.emitValue) {
-            return val
-                .map(v => this.findOriginalOption(v, this.options))
-                .filter((o) => !!o);
-        }
-        return val;
-    }
-    toMultiValue(options) {
-        return this.emitValue ? options.map(o => o.value) : options;
-    }
-    parsePixelValue(value, fallback) {
-        const parsed = Number.parseFloat(value);
-        return Number.isFinite(parsed) ? parsed : fallback;
-    }
-    updateDropdownViewportConstraints() {
-        if (!this.triggerRef)
-            return;
-        const triggerRect = this.triggerRef.getBoundingClientRect();
-        const viewportPadding = SdSelectV2.VIEWPORT_PADDING;
-        const offsetY = SdSelectV2.PORTAL_OFFSET_Y;
-        const preferredHeight = this.parsePixelValue(this.dropdownHeight, 260);
-        const preferredWidth = this.parsePixelValue(this.maxDropdownWidth, 640);
-        const availableBelow = Math.max(window.innerHeight - triggerRect.bottom - viewportPadding - offsetY, 0);
-        const availableAbove = Math.max(triggerRect.top - viewportPadding - offsetY, 0);
-        const availableHeight = Math.max(availableBelow, availableAbove);
-        const availableWidth = Math.max(window.innerWidth - viewportPadding * 2, 0);
-        this.resolvedDropdownHeight = `${Math.min(preferredHeight, availableHeight)}px`;
-        this.resolvedMaxDropdownWidth = `${Math.min(preferredWidth, availableWidth)}px`;
-    }
-    handleViewportResize = () => {
-        if (!this.isOpen)
-            return;
-        this.updateDropdownViewportConstraints();
-    };
-    findOriginalOption(value, options) {
-        for (const opt of options) {
-            if (opt.value === value)
-                return opt;
-            if (opt.children) {
-                const found = this.findOriginalOption(value, opt.children);
-                if (found)
-                    return found;
-            }
-        }
-        return undefined;
-    }
-    closeDropdown() {
-        if (!this.isOpen)
-            return;
-        this.isOpen = false;
-        this.isAnimatingOut = true;
-        if (this.closeAnimationTimer)
-            clearTimeout(this.closeAnimationTimer);
-        this.closeAnimationTimer = setTimeout(() => {
-            this.isAnimatingOut = false;
-        }, SdSelectV2.CLOSE_ANIMATION_DURATION);
-    }
-    prepareDropdownGeometry() {
-        if (this.triggerRef) {
-            this.triggerWidth = `${this.triggerRef.offsetWidth}px`;
-        }
-        this.updateDropdownViewportConstraints();
-    }
-    syncFocusedState(isOpen = this.isOpen) {
-        this.focused = isOpen || this.triggerHasFocus;
-    }
-    handleTriggerFocus = () => {
-        this.triggerHasFocus = true;
-        this.syncFocusedState();
-    };
-    handleTriggerBlur = () => {
-        this.triggerHasFocus = false;
-        this.syncFocusedState();
-    };
-    handleTriggerClick = () => {
-        if (this.isOpen) {
-            this.closeDropdown();
-            return;
-        }
-        this.prepareDropdownGeometry();
-        if (this.closeAnimationTimer)
-            clearTimeout(this.closeAnimationTimer);
-        this.isAnimatingOut = false;
-        this.isOpen = true;
-    };
-    emitUpdate(value) {
-        this.update.emit(value);
-    }
-    handleOptionSelect = (detail) => {
-        const { option, leaves } = detail;
-        if (this.isMulti) {
-            this.handleMultiSelect(option, leaves);
-        }
-        else {
-            this.closeDropdown();
-            this.value = this.emitValue ? option.value : option;
-            const nextValue = this.value;
-            requestAnimationFrame(() => {
-                this.emitUpdate(nextValue);
-            });
-        }
-    };
-    handleMultiSelect(option, leaves) {
-        const selected = this.getSelectedOptions();
-        const isGroup = !!option.children;
-        let newSelected;
-        if (isGroup) {
-            const allSelected = leaves.every(l => selected.some(s => s.value === l.value));
-            if (allSelected) {
-                const leafValues = new Set(leaves.map(l => l.value));
-                newSelected = selected.filter(s => !leafValues.has(s.value));
-            }
-            else {
-                const existing = new Set(selected.map(s => s.value));
-                const toAdd = leaves.filter(l => !existing.has(l.value));
-                newSelected = [...selected, ...toAdd];
-            }
-        }
-        else {
-            const exists = selected.some(s => s.value === option.value);
-            newSelected = exists ? selected.filter(s => s.value !== option.value) : [...selected, option];
-        }
-        this.value = this.toMultiValue(newSelected);
-        this.emitUpdate(this.value);
-    }
-    connectedCallback() {
-        window.addEventListener('resize', this.handleViewportResize);
-    }
-    disconnectedCallback() {
-        window.removeEventListener('resize', this.handleViewportResize);
-        if (this.closeAnimationTimer)
-            clearTimeout(this.closeAnimationTimer);
-    }
-    render() {
-        const portalProps = {
-            open: this.isOpen,
-            parentRef: this.triggerRef,
-            viewportPadding: SdSelectV2.VIEWPORT_PADDING,
-            onSdClose: () => {
-                this.closeDropdown();
-            },
-        };
-        return (index.h("sd-field", { key: '76b432c04fa0f9fca70e63e9c7d16ed768fc9dd1', name: this.name, label: this.label, labelWidth: this.labelWidth, addonLabel: this.addonLabel, addonAlign: this.addonAlign, hint: this.hint, errorMessage: this.errorMessage, width: this.width, rules: this.rules, error: this.error, disabled: this.disabled, focused: this.focused, hovered: this.hovered, icon: this.icon, labelTooltip: this.labelTooltip, labelTooltipProps: this.labelTooltipProps, onMouseEnter: () => {
-                this.hovered = true;
-            }, onMouseLeave: () => {
-                this.hovered = false;
-            } }, index.h("div", { key: 'dba3a313b7e0171a441540877aacdc7d5c2e7f04', class: "sd-select-v2", ref: el => {
-                this.triggerRef = el;
-            } }, index.h("sd-select-v2-trigger", { key: '7790357558f174eb70b15ed72574f738b062c479', ref: el => {
-                this.triggerComponentRef = el;
-            }, displayText: this.displayText, placeholder: this.placeholder, disabled: this.disabled, isOpen: this.isOpen, onSdTriggerClick: this.handleTriggerClick, onSdTriggerFocus: this.handleTriggerFocus, onSdTriggerBlur: this.handleTriggerBlur })), (this.isOpen || this.isAnimatingOut) && (index.h("sd-portal", { key: '672f3583b24e363b74d184d13866ee19a78b04d9', ...portalProps }, index.h("sd-select-v2-listbox", { key: 'f71d95ad06c74356e4d5ce94da7e720c002390b6', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
-    }
-    static get watchers() { return {
-        "isOpen": [{
-                "watchIsOpen": 0
-            }]
-    }; }
-};
-SdSelectV2.style = sdSelectV2Css();
-
-exports.sd_pagination = SdPagination;
-exports.sd_select_v2 = SdSelectV2;

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

@@ -1,66 +0,0 @@
-'use strict';
-
-var index = require('./index-Dptupbm0.js');
-var constants = require('./constants-DJRV1upE.js');
-
-const sdTbodyCss = () => `:host{display:contents}:host *{box-sizing:border-box}.tbody{display:table-row-group}.tbody--empty .tbody__no-data-row{display:table-row}.tbody--empty .tbody__no-data-cell{display:table-cell;padding:0;border-bottom:none}`;
-
-const SdTbody = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    get el() { return index.getElement(this); }
-    rows = [];
-    tableId = '';
-    topSpacerHeight = 0;
-    bottomSpacerHeight = 0;
-    tableEl = null;
-    handleRowsChange(newRows) {
-        const safeRows = newRows ?? [];
-        if (this.tableEl?.setRowCountSync) {
-            this.tableEl.setRowCountSync(safeRows.length);
-        }
-    }
-    componentWillLoad() {
-        this.syncTableContext();
-        this.rows = this.rows ?? [];
-        if (this.tableEl?.setRowCountSync) {
-            this.tableEl.setRowCountSync(this.rows.length);
-        }
-        this.el.setSpacersSync = (top, bottom) => {
-            this.topSpacerHeight = top;
-            this.bottomSpacerHeight = bottom;
-        };
-    }
-    componentDidLoad() {
-        this.syncTableContext();
-    }
-    syncTableContext() {
-        const table = this.el.closest('sd-table');
-        this.tableEl = table;
-        const fromMethod = table?.getTableIdSync?.();
-        const fromAttr = table?.getAttribute(constants.TABLE_ID_ATTR);
-        const resolvedTableId = (fromMethod && fromMethod !== 'undefined' ? fromMethod : null) ??
-            (fromAttr && fromAttr !== 'undefined' ? fromAttr : null) ??
-            '';
-        if (resolvedTableId && resolvedTableId !== this.tableId) {
-            this.tableId = resolvedTableId;
-        }
-    }
-    render() {
-        const hasRows = this.rows.length > 0;
-        return (index.h(index.Host, { key: 'e4c64dbf97185bbc6eaec4b883c65dc8ebd34ece', slot: `${this.tableId}-body` }, index.h("tbody", { key: 'b2fb886684a5a6055d3af659bba75dd9bc801b73', class: { 'tbody': true, 'tbody--empty': !hasRows } }, hasRows ? ([
-            this.topSpacerHeight > 0 && (index.h("tr", { key: "spacer-top", class: "tbody__spacer", style: { height: `${this.topSpacerHeight}px`, display: 'block' } })),
-            index.h("slot", null),
-            this.bottomSpacerHeight > 0 && (index.h("tr", { key: "spacer-bottom", class: "tbody__spacer", style: { height: `${this.bottomSpacerHeight}px`, display: 'block' } })),
-        ]) : (index.h("tr", { class: "tbody__no-data-row" }, index.h("td", { class: "tbody__no-data-cell", colSpan: 100 }, index.h("slot", { name: "no-data" })))))));
-    }
-    static get watchers() { return {
-        "rows": [{
-                "handleRowsChange": 0
-            }]
-    }; }
-};
-SdTbody.style = sdTbodyCss();
-
-exports.sd_tbody = SdTbody;