npm - @sellmate/design-system - Versions diffs - 0.0.34 → 0.0.36 - Mend

@sellmate/design-system 0.0.34 → 0.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (193) hide show

package/dist/cjs/sd-table-backup.cjs.entry.js ADDED Viewed

@@ -0,0 +1,271 @@
+'use strict';
+var index = require('./index-DXo1Fhkn.js');
+const sdTableBackupCss = ".sd-table__wrapper .sd-table__container .sd-table__middle{overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar{opacity:0;background:#e5e5e5}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:horizontal{height:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar:vertical{width:8px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-thumb{height:80px;background-color:#cccccc;border-radius:4px}.sd-table__wrapper .sd-table__container .sd-table__middle::-webkit-scrollbar-track{background-color:transparent}.sd-table__wrapper{height:var(--table-height, auto);width:var(--table-width, 100%);color:#222222}.sd-table__wrapper .sd-table__container{width:100%;height:auto;border:1px solid #e1e1e1;border-radius:8px;font-size:12px;overflow:hidden}.sd-table__wrapper .sd-table__container .sd-table__middle{overflow:auto;position:relative;will-change:scroll-position;height:var(--table-height, auto)}.sd-table__wrapper .sd-table__container .sd-table__middle--loading{overflow:hidden !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table{background-color:white;display:table;width:100%;height:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable td.sd-td--selected,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--selectable th.sd-th--selected{width:52px !important;max-width:52px !important;min-width:52px !important;padding:0 10px 0 24px;text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-header thead{position:sticky;top:0;z-index:120}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-right{position:sticky;background-color:#f5faff;z-index:110 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-left,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-right{position:sticky;background-color:white;z-index:100 !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-left{left:var(--sticky-left-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column .sticky-right{right:var(--sticky-right-offset, 0)}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column th.sticky-cell{position:sticky;z-index:102;background-color:#f5faff}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--sticky-column td.sticky-cell{position:sticky;z-index:101;background-color:white}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left th.sticky-left-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-left td.sticky-left-edge:after{content:\"\";position:absolute;top:0;left:100%;right:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset 12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge{overflow:visible}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right th.sticky-right-edge:after,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--scrolled-right td.sticky-right-edge:after{content:\"\";position:absolute;top:0;left:-20px;width:20px;height:100%;z-index:101 !important;box-shadow:inset -12px 0 20px -25px;opacity:1;pointer-events:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead{opacity:0.4}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table--no-data thead tr th.sd-th{border-bottom:1px solid rgba(225, 225, 225, 0.4) !important}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-td,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table sd-th,.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table .sd-th__content--label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;word-break:keep-all}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead{height:36px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr{width:100%}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th{background:#f5faff;height:36px;padding:0 16px;font-weight:500;vertical-align:middle;border-bottom:1px solid #e1e1e1;-webkit-user-select:none;user-select:none;position:relative}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content{display:flex;flex-flow:row nowrap;align-items:center;gap:4px}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--left{justify-content:flex-start}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--center{justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__content--right{justify-content:flex-end}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table thead tr th.sd-th .sd-th__resizer{position:absolute;top:50%;right:0;transform:translateY(-50%);width:4px;height:16px;cursor:col-resize;z-index:3;border-left:1px solid #cccccc;border-right:1px solid #cccccc}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody{flex-grow:1}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__loading{position:absolute;top:0;left:0;width:100%;height:100%;min-height:100%;background:rgba(255, 255, 255, 0.6);z-index:200;display:flex;align-items:center;justify-content:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody .sd-table__no-data-row td{text-align:center;color:#888888}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr:last-of-type td{border-bottom:none}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td{height:44px;padding:0 16px;border-bottom:1px solid #e1e1e1;background:white;vertical-align:middle}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--left{text-align:left}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--center{text-align:center}.sd-table__wrapper .sd-table__container .sd-table__middle .sd-table tbody tr td.sd-td--right{text-align:right}.sd-table__wrapper .sd-table__container .sd-table__bottom{background:white;text-align:center}.sd-table__wrapper .sd-table__pagination{position:relative;background:#f9f9f9;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #e1e1e1;border-top:none;border-radius:8px}.sd-table__wrapper .sd-table__pagination sd-select{position:absolute;right:10px;top:50%;transform:translateY(-50%)}";
+const SdTable = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.sdSelectChange = index.createEvent(this, "sdSelectChange");
+        this.sdPageChange = index.createEvent(this, "sdPageChange");
+        this.sdRowsPerPageChange = index.createEvent(this, "sdRowsPerPageChange");
+    }
+    get el() { return index.getElement(this); }
+    columns;
+    rows;
+    selected = new Set();
+    rowKey = 'id';
+    selectable = false;
+    resizable = false;
+    width;
+    height;
+    stickyHeader = false;
+    stickyColumn = { left: 0, right: 0 };
+    noDataLabel = '데이터가 없습니다.';
+    isLoading = false;
+    pagination;
+    bodyCellRenderer;
+    useInternalPagination = false;
+    useRowsPerPageSelect = false;
+    rowsPerPageOption = [
+        { label: '10개씩 보기', value: 10 },
+        { label: '25개씩 보기', value: 25 },
+        { label: '50개씩 보기', value: 50 },
+        { label: '100개씩 보기', value: 100 },
+    ];
+    sdSelectChange;
+    sdPageChange;
+    sdRowsPerPageChange;
+    currentPage = this.pagination?.page || 1;
+    innerRows = [];
+    innerSelected = new Set();
+    columnWidths = [];
+    scrolledLeft = false;
+    scrolledRight = false;
+    handleColumnsChange(newCols) {
+        this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));
+    }
+    handleRowsChange(newRows) {
+        this.innerRows = [...newRows];
+    }
+    handleSelectedChange(newSelected) {
+        this.innerSelected = new Set(newSelected);
+    }
+    handlePaginationChange(newVal) {
+        if (newVal?.page && newVal.page !== this.currentPage)
+            this.currentPage = newVal.page;
+    }
+    componentWillLoad() {
+        this.innerRows = [...(this.rows || [])];
+        this.innerSelected = new Set(this.selected);
+        this.columnWidths = (this.columns || []).map(c => parseInt(c.width || '120', 10));
+        if (this.pagination?.page) {
+            this.currentPage = this.pagination.page;
+        }
+    }
+    componentDidLoad() {
+        // SSR 환경 체크
+        if (typeof window === 'undefined')
+            return;
+        const middle = this.el.querySelector('.sd-table__middle');
+        if (!middle)
+            return;
+        const onScroll = () => {
+            const { scrollLeft, scrollWidth, clientWidth } = middle;
+            this.scrolledLeft = scrollLeft > 0;
+            this.scrolledRight = scrollLeft + clientWidth < scrollWidth;
+        };
+        middle.addEventListener('scroll', onScroll, { passive: true });
+        onScroll();
+    }
+    // ----- Derived getters -----
+    get visibleColumns() {
+        return this.columns.filter(col => col.visible !== false);
+    }
+    get paginatedRows() {
+        if (!this.pagination || !this.useInternalPagination)
+            return this.innerRows;
+        const { rowsPerPage = this.rows.length } = this.pagination || {};
+        const result = this.innerRows.slice((this.currentPage - 1) * rowsPerPage, this.currentPage * rowsPerPage);
+        return result;
+    }
+    get lastPageNumber() {
+        const { lastPage, rowsPerPage = this.rows.length } = this.pagination || {};
+        return lastPage ?? Math.max(1, Math.ceil(this.rows.length / rowsPerPage));
+    }
+    get sdTableClasses() {
+        return [
+            'sd-table',
+            this.stickyHeader && 'sd-table--sticky-header',
+            this.selectable && 'sd-table--selectable',
+            this.resizable && 'sd-table--resizable',
+            !this.innerRows.length && 'sd-table--no-data',
+            ((this.stickyColumn?.left ?? 0) > 0 || (this.stickyColumn?.right ?? 0) > 0) &&
+                'sd-table--sticky-column',
+            this.scrolledLeft && 'sd-table--scrolled-left',
+            this.scrolledRight && 'sd-table--scrolled-right',
+        ]
+            .filter(Boolean)
+            .join(' ');
+    }
+    // ----- Selection -----
+    isRowSelected(row) {
+        return Array.from(this.innerSelected).some(r => r[this.rowKey] === row[this.rowKey]);
+    }
+    updateRowSelect(row) {
+        const selectedArray = Array.from(this.innerSelected);
+        const exists = this.isRowSelected(row);
+        const newSelected = exists
+            ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])
+            : [...selectedArray, row];
+        // 동일 상태면 set하지 않음 → 불필요 렌더 방지
+        if (newSelected.length === selectedArray.length)
+            return;
+        this.innerSelected = new Set(newSelected);
+        this.sdSelectChange.emit(Array.from(this.innerSelected));
+    }
+    toggleSelectAll(checked) {
+        if (checked) {
+            const pageRows = new Set([...this.paginatedRows]);
+            this.innerSelected = new Set([...this.innerSelected, ...pageRows]);
+        }
+        else {
+            const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);
+            this.innerSelected = new Set([...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])));
+        }
+        this.sdSelectChange.emit(Array.from(this.innerSelected));
+    }
+    get isAllChecked() {
+        const total = this.paginatedRows.length;
+        const selectedCount = this.paginatedRows.filter(row => Array.from(this.innerSelected).some(selectedRow => selectedRow[this.rowKey] === row[this.rowKey])).length;
+        if (selectedCount === 0)
+            return false; // 아무것도 안 선택됨
+        if (selectedCount === total)
+            return true; // 전부 선택됨
+        return null; // 일부만 선택됨
+    }
+    // ----- Helpers -----
+    getStickyStyle(colIdx) {
+        const leftOffset = this.columnWidths.slice(0, colIdx).reduce((a, b) => a + b, 0) + (this.selectable ? 52 : 0);
+        const rightOffset = this.columnWidths
+            .filter((_, i) => i >= this.visibleColumns.length - (this.stickyColumn.right || 0) && i > colIdx)
+            .reduce((a, b) => a + b, 0);
+        return {
+            '--sticky-left-offset': `${leftOffset}px`,
+            '--sticky-right-offset': `${rightOffset}px`,
+            'width': `${this.columnWidths[colIdx]}px`,
+            'minWidth': `${this.columnWidths[colIdx]}px`,
+            'maxWidth': `${this.columnWidths[colIdx]}px`,
+        };
+    }
+    handleResize(index, event) {
+        // SSR 환경 체크
+        if (typeof document === 'undefined')
+            return;
+        const startX = event.clientX;
+        const startWidth = this.columnWidths[index];
+        const handleMouseMove = (moveEvent) => {
+            const newWidth = Math.max(startWidth + moveEvent.clientX - startX, 50);
+            this.columnWidths = this.columnWidths.map((width, idx) => (idx === index ? newWidth : width));
+        };
+        const handleMouseUp = () => {
+            document.removeEventListener('mousemove', handleMouseMove);
+            document.removeEventListener('mouseup', handleMouseUp);
+        };
+        document.addEventListener('mousemove', handleMouseMove);
+        document.addEventListener('mouseup', handleMouseUp);
+    }
+    getCellValue(column, row) {
+        const { field, format, name } = column;
+        const value = typeof field === 'function' ? field(row) : field ? row[field] : row[name];
+        return format ? format(value, row) : value;
+    }
+    // ----- Render -----
+    renderHeader() {
+        return (index.h("thead", null, index.h("tr", null, this.selectable && (index.h("th", { class: {
+                'sd-th': true,
+                'sd-th--selected': true,
+                'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
+            }, style: {
+                '--sticky-left-offset': '0px',
+            } }, index.h("sd-checkbox", { checked: this.isAllChecked, disabled: !this.paginatedRows.length, onSdChange: (e) => this.toggleSelectAll(e.detail) }))), this.visibleColumns.map((col, colIdx) => (index.h("th", { key: col.name, class: {
+                'sd-th': true,
+                [`${col.thClass}`]: Boolean(col.thClass),
+                'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),
+                'sticky-right': Boolean(this.stickyColumn.right && colIdx >= this.visibleColumns.length - this.stickyColumn.right),
+                'sticky-left-edge': Boolean(this.stickyColumn.left && colIdx === this.stickyColumn.left - 1),
+                'sticky-right-edge': Boolean(this.stickyColumn.right &&
+                    colIdx === this.visibleColumns.length - this.stickyColumn.right),
+            }, style: this.getStickyStyle(colIdx) }, index.h("div", { class: `sd-th__content sd-th__content--${col.align || 'left'}` }, index.h("slot", { name: `header-cell-${col.name}` }, index.h("div", { class: "sd-th__content--label" }, col.label)), col.usePageMoveIcon && index.h("sd-icon", { name: "pageMove", size: "12", color: "#006AC1" }), col.tooltip && (index.h("sd-tooltip", { ...col.tooltipOptions }, index.h("div", { slot: "content" }, col.tooltip.map(text => (index.h("p", null, text))))))), this.resizable && typeof window !== 'undefined' && (index.h("div", { class: "sd-th__resizer", onMouseDown: (evt) => this.handleResize(colIdx, evt) }))))))));
+    }
+    renderBody() {
+        return (index.h("tbody", { ...(!this.paginatedRows.length && { part: 'tbody-empty' }) }, this.isLoading && (index.h("div", { class: "sd-table__loading" }, index.h("sd-loading-spinner", null))), !this.paginatedRows.length ? (index.h("tr", { class: "sd-table__no-data-row" }, index.h("td", { colSpan: this.visibleColumns.length + (this.selectable ? 1 : 0) }, index.h("slot", { name: "no-data" }, this.noDataLabel)))) : (this.paginatedRows.map((row, rowIdx) => (index.h("tr", { key: row[this.rowKey], class: "hover:bg-Grey_Lighten-6" }, this.selectable && (index.h("td", { class: {
+                'sd-td': true,
+                'sd-td--selected': true,
+                'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),
+            }, style: {
+                '--sticky-left-offset': '0px',
+            } }, index.h("sd-checkbox", { checked: this.isRowSelected(row), disabled: !this.paginatedRows.length, onSdChange: () => this.updateRowSelect(row) }))), this.visibleColumns.map((column, colIdx) => {
+            const rendered = this.bodyCellRenderer?.(column, row);
+            return (index.h("td", { key: column.name, part: `td-${column.name}`, class: {
+                    'sd-td': true,
+                    [`sd-td--${column.align || 'left'}`]: true,
+                    'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),
+                    'sticky-right': Boolean(this.stickyColumn.right &&
+                        colIdx >= this.visibleColumns.length - this.stickyColumn.right),
+                    'sticky-left-edge': Boolean(this.stickyColumn.left && colIdx === this.stickyColumn.left - 1),
+                    'sticky-right-edge': Boolean(this.stickyColumn.right &&
+                        colIdx === this.visibleColumns.length - this.stickyColumn.right),
+                    [`${column.tdClass}`]: Boolean(column.tdClass),
+                }, style: this.getStickyStyle(colIdx) }, index.h("slot", { name: `body-cell-${column.name}-${rowIdx}` }, rendered ? (typeof rendered === 'string' ? (index.h("span", { innerHTML: rendered })) : (rendered)) : (this.getCellValue(column, row)))));
+        })))))));
+    }
+    render() {
+        return (index.h(index.Host, { key: '06f553b40a89351df1054a07191d3fe9d92dd1a4' }, index.h("div", { key: 'cfd19ef986b2a839791dfc6dbe0998fa4268bcc8', class: "sd-table__wrapper", style: {
+                '--table-width': this.width,
+                '--table-height': this.height,
+            } }, index.h("div", { key: 'ee2eb7c178fd4df207c096640f12061994340058', class: "sd-table__container" }, index.h("div", { key: 'fa2ca46bba403928152d9d087b3ec990615507d4', class: {
+                'sd-table__middle': true,
+                'sd-table__middle--loading': this.isLoading,
+            } }, index.h("table", { key: 'c5248468da6f986da45233ca86dcf68a53001cd6', part: "table", class: this.sdTableClasses }, this.renderHeader(), this.renderBody())), index.h("div", { key: 'd959e9785b3eab0a9e9864761c6377d561e6987c', class: "sd-table__bottom" })), this.pagination && this.innerRows.length > 0 && (index.h("div", { key: 'b592fee0e0747a34b3970e4ff7286afe37e79621', class: "sd-table__pagination" }, index.h("sd-pagination", { key: '05e7ed73d7beba2c14a4bcf07e8686a4d2cf664e', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onPageChange: (e) => {
+                if (!this.useInternalPagination) {
+                    this.sdPageChange.emit(e.detail);
+                }
+                else {
+                    this.currentPage = e.detail;
+                    this.sdPageChange.emit(this.currentPage);
+                }
+            } }), this.useRowsPerPageSelect && (index.h("sd-select", { key: 'f0e4ad4e7ec0f857feac4fc669f5a523401120d6', value: this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", onSdChange: (e) => {
+                const changedRowsPerPage = e.detail.value ? Number(e.detail.value) : 0;
+                if (!this.useInternalPagination) {
+                    this.sdRowsPerPageChange.emit(changedRowsPerPage);
+                }
+                else {
+                    const newRowsPerPage = Number(e.detail.value || 0);
+                    let newLastPage = Math.max(1, Math.ceil(this.innerRows.length / newRowsPerPage));
+                    let newCurrentPage = this.currentPage;
+                    if (newCurrentPage > newLastPage) {
+                        newCurrentPage = newLastPage;
+                    }
+                    this.pagination = {
+                        page: newCurrentPage,
+                        rowsPerPage: newRowsPerPage,
+                        lastPage: newLastPage,
+                    };
+                    this.currentPage = newCurrentPage;
+                    this.sdRowsPerPageChange.emit(changedRowsPerPage);
+                }
+            } })))))));
+    }
+    static get watchers() { return {
+        "columns": ["handleColumnsChange"],
+        "rows": ["handleRowsChange"],
+        "selected": ["handleSelectedChange"],
+        "pagination": ["handlePaginationChange"]
+    }; }
+};
+SdTable.style = sdTableBackupCss;
+exports.sd_table_backup = SdTable;
+//# sourceMappingURL=sd-table-backup.entry.cjs.js.map

package/dist/cjs/sd-table-backup.entry.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"sd-table-backup.entry.cjs.js","sources":["src/components/sd-table-backup/sd-table-backup.scss?tag=sd-table-backup","src/components/sd-table-backup/sd-table-backup.tsx"],"sourcesContent":["@import 'variables.scss';\n@import 'extend.scss';\n\n.sd-table__wrapper {\n height: var(--table-height, auto);\n width: var(--table-width, 100%);\n color: $grey_95;\n\n .sd-table__container {\n width: 100%;\n height: auto;\n border: 1px solid $grey_30;\n border-radius: 8px;\n font-size: 12px;\n overflow: hidden;\n\n .sd-table__middle {\n overflow: auto;\n position: relative;\n will-change: scroll-position;\n height: var(--table-height, auto);\n @extend %scrollBar;\n\n &--loading {\n overflow: hidden !important;\n }\n\n .sd-table {\n background-color: white;\n display: table;\n width: 100%;\n height: 100%;\n border-collapse: separate;\n border-spacing: 0;\n table-layout: fixed;\n\n &--selectable {\n td.sd-td--selected,\n th.sd-th--selected {\n width: 52px !important;\n max-width: 52px !important;\n min-width: 52px !important;\n padding: 0 10px 0 24px;\n text-align: left;\n }\n }\n\n &--sticky-header {\n thead {\n position: sticky;\n top: 0;\n z-index: 120;\n }\n }\n\n &--sticky-column {\n th.sticky-left,\n th.sticky-right {\n position: sticky;\n background-color: $th-bg;\n z-index: 110 !important;\n }\n td.sticky-left,\n td.sticky-right {\n position: sticky;\n background-color: white;\n z-index: 100 !important;\n }\n\n .sticky-left {\n left: var(--sticky-left-offset, 0);\n }\n .sticky-right {\n right: var(--sticky-right-offset, 0);\n }\n\n th.sticky-cell {\n position: sticky;\n z-index: 102;\n background-color: $th-bg;\n }\n td.sticky-cell {\n position: sticky;\n z-index: 101;\n background-color: white;\n }\n }\n\n &--scrolled-left {\n th.sticky-left-edge,\n td.sticky-left-edge {\n overflow: visible;\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: 100%;\n right: -20px;\n width: 20px;\n height: 100%;\n z-index: 101 !important;\n box-shadow: inset 12px 0 20px -25px;\n opacity: 1;\n pointer-events: none;\n }\n }\n }\n\n &--scrolled-right {\n th.sticky-right-edge,\n td.sticky-right-edge {\n overflow: visible;\n\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: -20px;\n width: 20px;\n height: 100%;\n z-index: 101 !important;\n box-shadow: inset -12px 0 20px -25px;\n opacity: 1;\n pointer-events: none;\n }\n }\n }\n\n &--no-data {\n thead {\n opacity: 0.4;\n tr {\n th {\n &.sd-th {\n border-bottom: 1px solid rgba(225, 225, 225, 0.4) !important;\n }\n }\n }\n }\n }\n\n sd-td,\n sd-th,\n .sd-th__content--label {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n word-break: keep-all;\n }\n\n thead {\n height: 36px;\n\n tr {\n width: 100%;\n\n th {\n background: $th-bg;\n height: 36px;\n padding: 0 16px;\n font-weight: 500;\n vertical-align: middle;\n border-bottom: 1px solid $grey_30;\n -webkit-user-select: none;\n user-select: none;\n position: relative;\n\n &.sd-th {\n .sd-th__content {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n gap: 4px;\n\n &--left {\n justify-content: flex-start;\n }\n &--center {\n justify-content: center;\n }\n &--right {\n justify-content: flex-end;\n }\n }\n\n .sd-th__resizer {\n position: absolute;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n width: 4px;\n height: 16px;\n cursor: col-resize;\n z-index: 3;\n border-left: 1px solid $grey_45;\n border-right: 1px solid $grey_45;\n }\n }\n }\n }\n }\n\n tbody {\n flex-grow: 1;\n .sd-table__loading {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n min-height: 100%;\n background: rgba(255, 255, 255, 0.6);\n z-index: 200;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n .sd-table__no-data-row {\n td {\n text-align: center;\n color: $grey_65;\n }\n }\n // .sd-table__loading {\n // position: absolute;\n // top: 0;\n // left: 0;\n // width: 100%;\n // height: calc(var(--table-height, auto) - 36px);\n // min-height: calc(100% - 36px);\n // background: rgba(255, 255, 255, 0.6);\n // z-index: 200;\n // display: flex;\n // align-items: center;\n // justify-content: center;\n // }\n\n tr {\n &:last-of-type {\n td {\n border-bottom: none;\n }\n }\n td {\n height: 44px;\n padding: 0 16px;\n border-bottom: 1px solid $grey_30;\n background: white;\n vertical-align: middle;\n\n &.sd-td {\n &--left {\n text-align: left;\n }\n &--center {\n text-align: center;\n }\n &--right {\n text-align: right;\n }\n }\n }\n }\n }\n }\n }\n\n .sd-table__bottom {\n background: white;\n text-align: center;\n }\n }\n\n .sd-table__pagination {\n position: relative;\n background: $grey_05;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 1px solid $grey_30;\n border-top: none;\n border-radius: 8px;\n\n sd-select {\n position: absolute;\n right: 10px;\n top: 50%;\n transform: translateY(-50%);\n\n .sd-select {\n }\n }\n }\n}\n","import {\n Component,\n Element,\n Prop,\n State,\n Event,\n Watch,\n h,\n EventEmitter,\n Host,\n} from '@stencil/core';\nimport { CheckedType } from '../sd-checkbox/sd-checkbox';\nimport { SelectOption } from '../sd-select/sd-select';\nimport { SdSelectCustomEvent } from '../../components';\n\nexport type SdTableSortDir = 'asc' | 'desc' | 'none';\n\nexport interface SdTableColumn {\n name: string;\n label: string;\n field: string | ((row: any) => any);\n align?: 'left' | 'center' | 'right';\n width?: string;\n format?: (value: any, row: any) => string;\n visible?: boolean;\n usePageMoveIcon?: boolean;\n tooltip?: string[];\n tooltipOptions?: Record<string, any>;\n tdClass?: string;\n thClass?: string;\n}\n\nexport interface Row {\n [key: string]: any;\n}\n\n@Component({\n tag: 'sd-table-backup',\n styleUrl: 'sd-table-backup.scss',\n})\nexport class SdTable {\n @Element() el!: HTMLElement;\n\n @Prop() columns!: SdTableColumn[];\n @Prop({ mutable: true }) rows!: Row[];\n @Prop({ mutable: true }) selected: Set<Row> = new Set();\n @Prop() rowKey: string = 'id';\n @Prop() selectable: boolean = false;\n @Prop() resizable: boolean = false;\n @Prop() width?: string;\n @Prop() height?: string;\n @Prop() stickyHeader: boolean = false;\n @Prop() stickyColumn: { left?: number; right?: number } = { left: 0, right: 0 };\n @Prop() noDataLabel: string = '데이터가 없습니다.';\n @Prop() isLoading: boolean = false;\n @Prop() pagination?: {\n page: number;\n rowsPerPage: number;\n lastPage?: number;\n };\n @Prop() bodyCellRenderer?: (\n column: SdTableColumn,\n row: Row,\n ) => HTMLElement | string | null | undefined;\n @Prop() useInternalPagination: boolean = false;\n @Prop() useRowsPerPageSelect: boolean = false;\n @Prop() rowsPerPageOption: SelectOption[] = [\n { label: '10개씩 보기', value: 10 },\n { label: '25개씩 보기', value: 25 },\n { label: '50개씩 보기', value: 50 },\n { label: '100개씩 보기', value: 100 },\n ];\n\n @Event() sdSelectChange!: EventEmitter<Row[]>;\n @Event() sdPageChange!: EventEmitter<number>;\n @Event() sdRowsPerPageChange!: EventEmitter<number>;\n\n @State() currentPage: number = this.pagination?.page || 1;\n @State() innerRows: Row[] = [];\n @State() innerSelected: Set<Row> = new Set();\n @State() columnWidths: number[] = [];\n @State() scrolledLeft: boolean = false;\n @State() scrolledRight: boolean = false;\n\n @Watch('columns')\n handleColumnsChange(newCols: SdTableColumn[]) {\n this.columnWidths = newCols.map(c => parseInt(c.width || '120', 10));\n }\n\n @Watch('rows')\n handleRowsChange(newRows: Row[]) {\n this.innerRows = [...newRows];\n }\n\n @Watch('selected')\n handleSelectedChange(newSelected: Set<Row>) {\n this.innerSelected = new Set(newSelected);\n }\n\n @Watch('pagination')\n handlePaginationChange(\n newVal?: { page: number; rowsPerPage: number; lastPage?: number } | undefined,\n ) {\n if (newVal?.page && newVal.page !== this.currentPage) this.currentPage = newVal.page;\n }\n\n componentWillLoad() {\n this.innerRows = [...(this.rows || [])];\n this.innerSelected = new Set(this.selected);\n this.columnWidths = (this.columns || []).map(c => parseInt(c.width || '120', 10));\n\n if (this.pagination?.page) {\n this.currentPage = this.pagination.page;\n }\n }\n\n componentDidLoad() {\n // SSR 환경 체크\n if (typeof window === 'undefined') return;\n\n const middle = this.el.querySelector('.sd-table__middle');\n if (!middle) return;\n\n const onScroll = () => {\n const { scrollLeft, scrollWidth, clientWidth } = middle as HTMLElement;\n this.scrolledLeft = scrollLeft > 0;\n this.scrolledRight = scrollLeft + clientWidth < scrollWidth;\n };\n middle.addEventListener('scroll', onScroll, { passive: true });\n onScroll();\n }\n\n // ----- Derived getters -----\n private get visibleColumns(): SdTableColumn[] {\n return this.columns.filter(col => col.visible !== false);\n }\n\n private get paginatedRows(): Row[] {\n if (!this.pagination || !this.useInternalPagination) return this.innerRows;\n\n const { rowsPerPage = this.rows.length } = this.pagination || {};\n\n const result = this.innerRows.slice(\n (this.currentPage - 1) * rowsPerPage,\n this.currentPage * rowsPerPage,\n );\n\n return result;\n }\n\n private get lastPageNumber(): number {\n const { lastPage, rowsPerPage = this.rows.length } = this.pagination || {};\n\n return lastPage ?? Math.max(1, Math.ceil(this.rows.length / rowsPerPage));\n }\n\n private get sdTableClasses() {\n return [\n 'sd-table',\n this.stickyHeader && 'sd-table--sticky-header',\n this.selectable && 'sd-table--selectable',\n this.resizable && 'sd-table--resizable',\n !this.innerRows.length && 'sd-table--no-data',\n ((this.stickyColumn?.left ?? 0) > 0 || (this.stickyColumn?.right ?? 0) > 0) &&\n 'sd-table--sticky-column',\n this.scrolledLeft && 'sd-table--scrolled-left',\n this.scrolledRight && 'sd-table--scrolled-right',\n ]\n .filter(Boolean)\n .join(' ');\n }\n\n // ----- Selection -----\n private isRowSelected(row: Row): boolean {\n return Array.from(this.innerSelected).some(r => r[this.rowKey] === row[this.rowKey]);\n }\n\n private updateRowSelect(row: Row) {\n const selectedArray = Array.from(this.innerSelected);\n const exists = this.isRowSelected(row);\n const newSelected = exists\n ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])\n : [...selectedArray, row];\n\n // 동일 상태면 set하지 않음 → 불필요 렌더 방지\n if (newSelected.length === selectedArray.length) return;\n\n this.innerSelected = new Set(newSelected);\n this.sdSelectChange.emit(Array.from(this.innerSelected));\n }\n\n private toggleSelectAll(checked: CheckedType) {\n if (checked) {\n const pageRows = new Set([...this.paginatedRows]);\n this.innerSelected = new Set([...this.innerSelected, ...pageRows]);\n } else {\n const currentPageKeys = this.paginatedRows.map(r => r[this.rowKey]);\n this.innerSelected = new Set(\n [...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])),\n );\n }\n\n this.sdSelectChange.emit(Array.from(this.innerSelected));\n }\n\n private get isAllChecked(): boolean | null {\n const total = this.paginatedRows.length;\n const selectedCount = this.paginatedRows.filter(row =>\n Array.from(this.innerSelected).some(\n selectedRow => selectedRow[this.rowKey] === row[this.rowKey],\n ),\n ).length;\n\n if (selectedCount === 0) return false; // 아무것도 안 선택됨\n if (selectedCount === total) return true; // 전부 선택됨\n return null; // 일부만 선택됨\n }\n\n // ----- Helpers -----\n private getStickyStyle(colIdx: number) {\n const leftOffset =\n this.columnWidths.slice(0, colIdx).reduce((a, b) => a + b, 0) + (this.selectable ? 52 : 0);\n const rightOffset = this.columnWidths\n .filter((_, i) => i >= this.visibleColumns.length - (this.stickyColumn.right || 0) && i > colIdx)\n .reduce((a, b) => a + b, 0);\n return {\n '--sticky-left-offset': `${leftOffset}px`,\n '--sticky-right-offset': `${rightOffset}px`,\n 'width': `${this.columnWidths[colIdx]}px`,\n 'minWidth': `${this.columnWidths[colIdx]}px`,\n 'maxWidth': `${this.columnWidths[colIdx]}px`,\n };\n }\n\n private handleResize(index: number, event: MouseEvent) {\n // SSR 환경 체크\n if (typeof document === 'undefined') return;\n\n const startX = event.clientX;\n const startWidth = this.columnWidths[index];\n\n const handleMouseMove = (moveEvent: MouseEvent) => {\n const newWidth = Math.max(startWidth + moveEvent.clientX - startX, 50);\n\n this.columnWidths = this.columnWidths.map((width, idx) => (idx === index ? newWidth : width));\n };\n\n const handleMouseUp = () => {\n document.removeEventListener('mousemove', handleMouseMove);\n document.removeEventListener('mouseup', handleMouseUp);\n };\n\n document.addEventListener('mousemove', handleMouseMove);\n document.addEventListener('mouseup', handleMouseUp);\n }\n\n private getCellValue(column: SdTableColumn, row: Row) {\n const { field, format, name } = column;\n const value = typeof field === 'function' ? field(row) : field ? row[field] : row[name];\n return format ? format(value, row) : value;\n }\n\n // ----- Render -----\n private renderHeader() {\n return (\n <thead>\n <tr>\n {this.selectable && (\n <th\n class={{\n 'sd-th': true,\n 'sd-th--selected': true,\n 'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),\n }}\n style={{\n '--sticky-left-offset': '0px',\n }}\n >\n <sd-checkbox\n checked={this.isAllChecked}\n disabled={!this.paginatedRows.length}\n onSdChange={(e: CustomEvent<CheckedType>) => this.toggleSelectAll(e.detail)}\n ></sd-checkbox>\n </th>\n )}\n {this.visibleColumns.map((col, colIdx) => (\n <th\n key={col.name}\n class={{\n 'sd-th': true,\n [`${col.thClass}`]: Boolean(col.thClass),\n 'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),\n 'sticky-right': Boolean(\n this.stickyColumn.right && colIdx >= this.visibleColumns.length - this.stickyColumn.right!,\n ),\n 'sticky-left-edge': Boolean(\n this.stickyColumn.left && colIdx === this.stickyColumn.left - 1,\n ),\n 'sticky-right-edge': Boolean(\n this.stickyColumn.right &&\n colIdx === this.visibleColumns.length - this.stickyColumn.right!,\n ),\n }}\n style={this.getStickyStyle(colIdx)}\n >\n <div class={`sd-th__content sd-th__content--${col.align || 'left'}`}>\n <slot name={`header-cell-${col.name}`}>\n <div class=\"sd-th__content--label\">{col.label}</div>\n </slot>\n\n {col.usePageMoveIcon && <sd-icon name=\"pageMove\" size=\"12\" color=\"#006AC1\" />}\n\n {col.tooltip && (\n <sd-tooltip {...col.tooltipOptions}>\n <div slot=\"content\">\n {col.tooltip.map(text => (\n <p>{text}</p>\n ))}\n </div>\n </sd-tooltip>\n )}\n </div>\n\n {this.resizable && typeof window !== 'undefined' && (\n <div\n class=\"sd-th__resizer\"\n onMouseDown={(evt: MouseEvent) => this.handleResize(colIdx, evt)}\n ></div>\n )}\n </th>\n ))}\n </tr>\n </thead>\n );\n }\n\n private renderBody() {\n return (\n <tbody {...(!this.paginatedRows.length && { part: 'tbody-empty' })}>\n {this.isLoading && (\n <div class=\"sd-table__loading\">\n <sd-loading-spinner />\n </div>\n )}\n\n {!this.paginatedRows.length ? (\n <tr class=\"sd-table__no-data-row\">\n <td colSpan={this.visibleColumns.length + (this.selectable ? 1 : 0)}>\n <slot name=\"no-data\">{this.noDataLabel}</slot>\n </td>\n </tr>\n ) : (\n this.paginatedRows.map((row, rowIdx) => (\n <tr key={row[this.rowKey]} class=\"hover:bg-Grey_Lighten-6\">\n {this.selectable && (\n <td\n class={{\n 'sd-td': true,\n 'sd-td--selected': true,\n 'sticky-left': Boolean(this.stickyColumn.left && this.stickyColumn.left > 0),\n }}\n style={{\n '--sticky-left-offset': '0px',\n }}\n >\n <sd-checkbox\n checked={this.isRowSelected(row)}\n disabled={!this.paginatedRows.length}\n onSdChange={() => this.updateRowSelect(row)}\n ></sd-checkbox>\n </td>\n )}\n {this.visibleColumns.map((column, colIdx) => {\n const rendered = this.bodyCellRenderer?.(column, row);\n\n return (\n <td\n key={column.name}\n part={`td-${column.name}`}\n class={{\n 'sd-td': true,\n [`sd-td--${column.align || 'left'}`]: true,\n 'sticky-left': Boolean(this.stickyColumn.left && colIdx < this.stickyColumn.left),\n 'sticky-right': Boolean(\n this.stickyColumn.right &&\n colIdx >= this.visibleColumns.length - this.stickyColumn.right!,\n ),\n 'sticky-left-edge': Boolean(\n this.stickyColumn.left && colIdx === this.stickyColumn.left - 1,\n ),\n 'sticky-right-edge': Boolean(\n this.stickyColumn.right &&\n colIdx === this.visibleColumns.length - this.stickyColumn.right!,\n ),\n [`${column.tdClass}`]: Boolean(column.tdClass),\n }}\n style={this.getStickyStyle(colIdx)}\n >\n {/* slot을 사용하려는 항목 name과 행 인덱스를 키값으로 사용 */}\n <slot name={`body-cell-${column.name}-${rowIdx}`}>\n {rendered ? (\n typeof rendered === 'string' ? (\n <span innerHTML={rendered}></span>\n ) : (\n rendered\n )\n ) : (\n this.getCellValue(column, row)\n )}\n </slot>\n </td>\n );\n })}\n </tr>\n ))\n )}\n </tbody>\n );\n }\n\n render() {\n return (\n <Host>\n <div\n class=\"sd-table__wrapper\"\n style={{\n '--table-width': this.width,\n '--table-height': this.height,\n }}\n >\n <div class=\"sd-table__container\">\n <div\n class={{\n 'sd-table__middle': true,\n 'sd-table__middle--loading': this.isLoading,\n }}\n >\n <table part=\"table\" class={this.sdTableClasses}>\n {this.renderHeader()}\n\n {this.renderBody()}\n </table>\n </div>\n\n <div class=\"sd-table__bottom\"></div>\n </div>\n {this.pagination && this.innerRows.length > 0 && (\n <div class=\"sd-table__pagination\">\n <sd-pagination\n currentPage={!this.useInternalPagination ? this.pagination.page : this.currentPage}\n lastPage={!this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber}\n onPageChange={(e: CustomEvent<number>) => {\n if (!this.useInternalPagination) {\n this.sdPageChange.emit(e.detail);\n } else {\n this.currentPage = e.detail;\n this.sdPageChange.emit(this.currentPage);\n }\n }}\n ></sd-pagination>\n\n {this.useRowsPerPageSelect && (\n <sd-select\n value={this.pagination.rowsPerPage}\n options={this.rowsPerPageOption}\n width=\"128px\"\n onSdChange={(e: SdSelectCustomEvent<{ value: string | number | null }>) => {\n const changedRowsPerPage = e.detail.value ? Number(e.detail.value) : 0;\n if (!this.useInternalPagination) {\n this.sdRowsPerPageChange.emit(changedRowsPerPage);\n } else {\n const newRowsPerPage = Number(e.detail.value || 0);\n let newLastPage = Math.max(1, Math.ceil(this.innerRows.length / newRowsPerPage));\n let newCurrentPage = this.currentPage;\n\n if (newCurrentPage > newLastPage) {\n newCurrentPage = newLastPage;\n }\n\n this.pagination = {\n page: newCurrentPage,\n rowsPerPage: newRowsPerPage,\n lastPage: newLastPage,\n };\n this.currentPage = newCurrentPage;\n this.sdRowsPerPageChange.emit(changedRowsPerPage);\n }\n }}\n ></sd-select>\n )}\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/sd-tag.cjs.entry.js CHANGED Viewed

@@ -45,7 +45,7 @@ const SdTag = class {
     }
     render() {
         const tagClasses = this.getTagClasses();
-        return (index.h("span", { key: 'e1118210230f43da857503608cd97d6ab3cca656', class: tagClasses, style: {
+        return (index.h("span", { key: 'cd470741451fde311fc3d22d21205ea7bc86295c', class: tagClasses, style: {
                 '--tag-bg-color': this.bgColor,
                 '--tag-text-color': this.textColor,
             }, "aria-label": this.label || 'tag' }, this.renderContent()));

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

@@ -0,0 +1,26 @@
+'use strict';
+var index = require('./index-DXo1Fhkn.js');
+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 SdTd = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    name = '';
+    align = 'left';
+    tdStyle;
+    tdClass;
+    render() {
+        return (index.h(index.Host, { key: 'b0d6911cd0c2da2999b3cc16b5014f95c6616cd2', role: "cell", class: {
+                'sd-td': true,
+                [`sd-td--${this.align}`]: true,
+                [this.tdClass || '']: Boolean(this.tdClass),
+            }, style: this.tdStyle }, index.h("slot", { key: '93c9acb6c73c6dd4f9b6dcdfbed8bba000328e92' })));
+    }
+};
+SdTd.style = sdTdCss;
+exports.sd_td = SdTd;
+//# sourceMappingURL=sd-td.entry.cjs.js.map

package/dist/cjs/sd-td.entry.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"sd-td.entry.cjs.js","sources":["src/components/sd-table/sd-td/sd-td.scss?tag=sd-td","src/components/sd-table/sd-td/sd-td.tsx"],"sourcesContent":["sd-td {\n display: table-cell;\n padding: 12px 16px;\n vertical-align: middle;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n word-break: keep-all;\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'sd-td',\n styleUrl: 'sd-td.scss',\n})\nexport class SdTd {\n @Prop() name: string = '';\n @Prop() align: 'left' | 'center' | 'right' = 'left';\n @Prop() tdStyle?: Record<string, string>;\n @Prop() tdClass?: string;\n\n render() {\n return (\n <Host\n role=\"cell\"\n class={{\n 'sd-td': true,\n [`sd-td--${this.align}`]: true,\n [this.tdClass || '']: Boolean(this.tdClass),\n }}\n style={this.tdStyle}\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,OAAO,GAAG,iJAAiJ;;MCMpJ,IAAI,GAAA,MAAA;;;;IACR,IAAI,GAAW,EAAE;IACjB,KAAK,GAAgC,MAAM;AAC3C,IAAA,OAAO;AACP,IAAA,OAAO;IAEf,MAAM,GAAA;AACL,QAAA,QACCA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACJ,IAAI,EAAC,MAAM,EACX,KAAK,EAAE;AACN,gBAAA,OAAO,EAAE,IAAI;AACb,gBAAA,CAAC,UAAU,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG,IAAI;AAC9B,gBAAA,CAAC,IAAI,CAAC,OAAO,IAAI,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;AAC3C,aAAA,EACD,KAAK,EAAE,IAAI,CAAC,OAAO,EAAA,EAEnBD,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACP;;;;;;;"}

package/dist/collection/collection-manifest.json CHANGED Viewed

@@ -22,6 +22,11 @@
     "components/sd-select/sd-select-option/sd-select-option.js",
     "components/sd-select-multiple/sd-select-multiple.js",
     "components/sd-select-multiple-group/sd-select-option-group/sd-select-option-group.js",
+    "components/sd-table/sd-tbody/sd-tbody.js",
+    "components/sd-table/sd-td/sd-td.js",
+    "components/sd-table/sd-th/sd-th.js",
+    "components/sd-table/sd-tr/sd-tr.js",
+    "components/sd-table-backup/sd-table-backup.js",
     "components/sd-tooltip/sd-tooltip.js",
     "components/sd-tooltip-portal/sd-tooltip-portal.js"
   ],

package/dist/collection/components/sd-badge/sd-badge.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class SdBadge {
     label = '';
     render() {
         const resolvedColor = resolveColor(this.color);
-        return (h(Host, { key: 'e26d8310fa5e47198264e705cc029cc892e2bce3' }, h("div", { key: '34eaabd258c14f733a9e08be6155d046ab9c1cac', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, h("div", { key: '4a25963faec09d758f3c552823171f8eca90f6fe', class: "sd-badge__dot" }), h("div", { key: '3318cba370380bd36bd2cc140bf09152b7aa69dd', class: "sd-badge__label" }, this.label))));
+        return (h(Host, { key: '6fc1c113b707f4419fa48c8b4b78be6a7bbf6b83' }, h("div", { key: 'ab3297321ee0e6e742acd408901dce1b5894d200', class: `sd-badge sd-badge--${this.size}`, style: { '--sd-badge-color': resolvedColor } }, h("div", { key: '02f42d0ba064db273d83671e9c271c543787daf8', class: "sd-badge__dot" }), h("div", { key: 'f6a175282ab77e9a8ac2098029ac1aab5cb66190', class: "sd-badge__label" }, this.label))));
     }
     static get is() { return "sd-badge"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/sd-card/sd-card.js CHANGED Viewed

@@ -3,7 +3,7 @@ export class SdCard {
     bordered = true;
     class = '';
     render() {
-        return (h(Host, { key: '227f52f79c1a9705be09a5d19e3ac1f5fe60f926' }, h("div", { key: 'f56d202ec8c58e5770530f4a7f216b174d99ca02', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, h("slot", { key: '0d2300a9f36cbc5d8e2292e2904be92da04f55e4' }))));
+        return (h(Host, { key: 'f00cdc166da4589d81d732fb4bc84d0258efaccb' }, h("div", { key: 'c640a9db7ef09eee390ca0c0e8484a5802d17cbd', class: `sd-card ${this.bordered ? 'sd-card--bordered' : ''} ${this.class}` }, h("slot", { key: '07421b4249bf7a94aa1a574011b33f7082fa984a' }))));
     }
     static get is() { return "sd-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-date-picker/sd-date-picker.js CHANGED Viewed

@@ -74,9 +74,9 @@ export class SdDatePicker {
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: 'ca46b34c79f12400737d8ffd99edabe637c652cc', class: "sd-date-picker" }, h("sd-input", { key: '87789f6a18f0b11f93a3fd01fdc71362fb7d88ba', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: '056414534f658c5e77fedf40d94e578299b437cc', class: "sd-date-picker" }, h("sd-input", { key: 'eb65e6bb246b604287088a3857681f2a18c06464', ref: el => (this.inputEl = el), value: this.date, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'fbf2e5031f512f8c314f5ea077820ab84631199f', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: 'a4b2d3a143de94f896769bd4f22e4b1976f06847', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: 'abf0fe09873b8e8b4f335cc3aa223e6a1995f63b', class: "sd-date-picker__menu" }, h("div", { key: '4ab6d07971a765ed2e00b4e0e8c1764476044d7b', class: "sd-date-picker__header" }, h("div", { key: '27cf7310f6857c1134cadc014074e94ebeba49d8', class: "year-nav" }, h("button", { key: '25db54222284614c483895801390b668b2b1b411', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: '8632ffb58a0ee957833a8949906282839957a612', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '656254670447c3ba5d8c7a80fe9e0e10447496a8', class: "year-nav__current" }, this.currentYear), h("button", { key: 'f2a1edcb353efb0c23b3c4d8a80f777b4edb913d', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: 'f0c96a20f2851791835dea2009e8d787bffc66fd', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '14a8370e223519818dfbd31a0779c8822ed96f5e', class: "month-nav" }, h("button", { key: '571da52ef8829bf2595f520f130a5cd7f23ed10b', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: '804fe9cd68f9c659b48a684cd9c5aff839cb5d67', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '5dacf5a466cf712074c09dcafbb9f9c230257452', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: '2276839d97c42f91983d56ac53fdb7cc5adb0da1', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: '3d1b8fd1cfcb4f5acd059afde97dd14048d2a637', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: '02813e891695cf61a87c8f4e4c3060399aa10433', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: 'fbeea6b25435892cc9f2a183027669a1429e588f', class: "sd-date-picker__body" }, [
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'd71e7a84bef6b956e77fb7f718568e8d1df59562', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '0cb4ff03893ddf4a095760f326104d91bdb6265b', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '7a3bbe3f4cd379d94832005653aacc166e6b66cf', class: "sd-date-picker__menu" }, h("div", { key: '6b33cab1222e71e3004425b07afbdffef0ec0a6b', class: "sd-date-picker__header" }, h("div", { key: 'acc16c94cfea8399ce5d210de7286760238c0963', class: "year-nav" }, h("button", { key: '6f577329b27057306e163c0c92ae16eff29a15b4', type: "button", name: "prev-year", title: "Previous Year", onClick: () => this.setCurrentYear(this.currentYear - 1) }, h("sd-icon", { key: 'c8174f406a3ba95d98ae31c6f4004f4178f6ac5f', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: 'cdcb96cd0fbf6abedcaaa7b5cca8a56c90b62284', class: "year-nav__current" }, this.currentYear), h("button", { key: '9aba8e6ebde34b7a29e52525cff8fbe8a243ae6a', type: "button", name: "next-year", title: "Next Year", onClick: () => this.setCurrentYear(this.currentYear + 1) }, h("sd-icon", { key: '423d3b35b56f32006edfd0bdf6f457dd46a591b5', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: 'c5dd3a1b495e48c2c980207591f161486042c361', class: "month-nav" }, h("button", { key: '48265eec87bdb40c3189d07ef1711bf95bb55381', type: "button", name: "prev-month", title: "Previous       ", onClick: () => this.handleUpdateMonth('prev') }, h("sd-icon", { key: '7274e698f9c7a06369c8fe6064ec0acd9fce62c8', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("span", { key: '54e15aaad9ac9563f66a6bb4dc7b19f7dc01d7c0', class: "month-nav__current" }, this.currentMonth, "\uC6D4"), h("button", { key: '32da2302da74ef7bc8805138ce414b903d247878', type: "button", name: "next-month", title: "Next Month", onClick: () => this.handleUpdateMonth('next') }, h("sd-icon", { key: '041809657b4288519ca476953be773403912c858', name: "arrowRight", size: "12", color: "#CCCCCC" })))), h("div", { key: 'd32cd40e6df89c95f4b2639c6bc98f7156a09bc2', class: "sd-date-picker__days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("div", { key: day, class: "day" }, day)))), h("div", { key: 'e6fafbf9ec82a8f3abe9d67c61279598498a7396', class: "sd-date-picker__body" }, [
             ...this.calendar.prevMonthDays,
             ...this.calendar.days,
             ...this.calendar.afterMonthDays,

package/dist/collection/components/sd-date-range-picker/sd-date-range-picker.js CHANGED Viewed

@@ -137,9 +137,9 @@ export class SdDateRangePicker {
         this.isOpen = false;
     };
     render() {
-        return (h(Host, { key: '8b73cef9de34c20717ed100fb601dcb347555efb', class: "sd-date-range-picker" }, h("sd-input", { key: 'a9b89bd7668cda06c6e1a3cf859c9453bfa69add', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
+        return (h(Host, { key: '9c7457b54e433a167193eeaafa8a0e7755ca24db', class: "sd-date-range-picker" }, h("sd-input", { key: '85b4c4fca2e6157ae7f6291593a20329086fe372', ref: el => (this.inputEl = el), value: `${this.dateRange[0]} ~ ${this.dateRange[1]}`, label: this.label, "inside-label": true, readonly: true, disabled: this.disabled, inputClass: "text-center", inputStyle: {
                 margin: '0 0 0 8px',
-            }, onClick: () => this.openMenu() }, h("sd-icon", { key: '1289bbf0513966a3c1d68ecc9b6ba58b356aa107', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '1b6ac8dc70f388e4a3076792cb2148669b603955', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '2ad485eacabb8fdfb32347c0f6a9047bbb7dddc9', class: "sd-date-range-picker__menu" }, h("div", { key: '3f41048491255d7a5f70e47b6dd6cefc2ec3530d', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: '9f12f991df90779a25d54f6e686343630423a62e', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: 'f92747539f8812374fe3f280d7c42c51951935a8', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: 'efb19fc81ec2d4398a6d956208f94be526ac2970', class: "header-label" }, this.prevYear), h("button", { key: '2c2009bc5831d7bd619252f376e336c3c3b858a2', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: '6b5ec56827f067c54142be11360a847df82a5e70', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: '6ac34cd6e181f2aca989ab90836fa0bebf7f942c', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
+            }, onClick: () => this.openMenu() }, h("sd-icon", { key: 'e38b9dde8571369ff85bf10baff71437b0cf48f4', slot: "prefix", name: "date", size: "16", color: "#737373", class: "date-icon", onClick: () => this.openMenu() })), this.isOpen && (h("sd-portal", { key: '2f85011e2a47bb0717239da419fcd27c8410db81', open: this.isOpen, parentRef: this.inputEl, onSdClose: this.handleClose }, h("div", { key: '21f147563f6ab7c9a1a2b08cf1951bb11a8a0302', class: "sd-date-range-picker__menu" }, h("div", { key: '2dad8cef33d07db263a73cd3760dbf44e33dd7ab', class: "sd-date-range-picker__header mb-16pxr flex flex-nowrap items-center justify-center" }, h("button", { key: '53ccd475c6ebec5999158b2669878b0426e505d1', type: "button", name: "prev", title: "Previous", onClick: () => this.setPrevYear(this.prevYear - 1) }, h("sd-icon", { key: 'aba2465aae092388568006a7a968c27446476470', name: "arrowLeft", size: "12", color: "#CCCCCC" })), h("div", { key: 'd4384c1901a5e5221d55a18e014c0955af561660', class: "header-label" }, this.prevYear), h("button", { key: '26f2e7f9da0f4571d4ca2cf0a668ceb4784af9c6', type: "button", name: "next", title: "Next", onClick: () => this.setPrevYear(this.prevYear + 1) }, h("sd-icon", { key: 'fc670a78e443dc7de8fbb05fe3233ae5bd6544d4', name: "arrowRight", size: "12", color: "#CCCCCC" }))), h("div", { key: 'fb2157002f772dee6c4ff4b76cd3c942d4bb9965', class: "sd-date-range-picker__body" }, [this.prevCalendar, this.nextCalendar].map((calendar, index) => (h(Fragment, null, index === 1 && h("div", { class: "separator" }), h("div", { key: index, class: "calendar-container" }, h("div", { class: "calendar-header" }, h("button", { type: "button", name: "month", title: "Month", class: index === 0 ? 'header-button-prev' : 'header-button-next', onClick: () => this.updateYearMonth(index === 0 ? 'prev' : 'next') }, h("sd-icon", { name: index === 0 ? 'arrowLeft' : 'arrowRight', size: "12", color: "#CCCCCC" })), index === 0
             ? `${this.prevYear}.${String(this.prevMonth).padStart(2, '0')}`
             : `${this.nextYear}.${String(this.nextMonth).padStart(2, '0')}`), h("div", { class: "calendar-days" }, ['일', '월', '화', '수', '목', '금', '토'].map(day => (h("sd-date-box", { key: day, date: day, disabled: true, class: "day" })))), h("div", { class: "calendar-body mt-12pxr grid grid-cols-7 gap-y-8pxr" }, [...calendar.prevMonthDays, ...calendar.days, ...calendar.afterMonthDays].map((day, idx) => (h("sd-date-box", { key: `prev${day}_${idx}`, date: !day ? '' : Number(day), selected: this.dateRange.some(date => date ===
                 this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), type: this.getDateBoxType(this.dateUtil.formatDate(index === 0 ? this.prevYear : this.nextYear, index === 0 ? this.prevMonth : this.nextMonth, Number(day))), isToday: today ===

package/dist/collection/components/sd-guide/sd-guide.js CHANGED Viewed

@@ -47,11 +47,11 @@ export class SdGuide {
     };
     render() {
         const { name: iconName, size: iconSize, color: iconColor } = GUIDE_ICON[this.type];
-        return (h(Host, { key: '0347d2b653648d99f97bf235cc016738f82b641e', style: {
+        return (h(Host, { key: 'cc560b500dc857dd2fb9817d5f870e702cfe6420', style: {
                 '--sd-guide-color': GUIDE_ICON[this.type].color,
-            } }, h("sd-button", { key: '3f592030124b0033c2fc85e4ede091038c93efde', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (h("sd-portal", { key: '334dc8cef60e8354b43efa3a0d0a971ff2f82746', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: 'b0422529af3f92629024e6130393f3ff5c9df116', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, h("sd-button", { key: 'cd00540ffe1a70be9bcc9560c9b688709d1ce9be', class: "sd-guide__popup__close", icon: "close", color: colors.grey_65, size: "md", variant: "ghost", noHover: true,
+            } }, h("sd-button", { key: '4abbeb9eb5a021b790516ad6356ca61a8c81e30d', ref: el => (this.guideRef = el), class: this.guideClass, variant: this.popupShow ? 'primary' : 'outline', label: GUIDE_LABEL[this.type], size: "sm", color: this.popupShow ? GUIDE_ICON[this.type].color : 'grey_45', icon: iconName, iconColor: this.popupShow ? 'white' : iconColor, iconSize: iconSize, noHover: this.popupShow, onSdClick: this.handleClickGuide }), this.type === 'help' && this.popupShow && (h("sd-portal", { key: 'acdee17ca7be22d52bbb7309430d3ce27bab8784', open: this.popupShow, parentRef: this.guideRef, onSdClose: this.closeDropdown, offset: [0, 4] }, h("div", { key: '8e7402bcf9308e9c3890a4ad55a54efe5f440c95', class: "sd-guide__popup", style: { width: this.popupWidth ? this.popupWidth + 'px' : '426px' } }, h("sd-button", { key: '05eb16594e9a2b16974e957988149114ac2bc0f9', class: "sd-guide__popup__close", icon: "close", color: colors.grey_65, size: "md", variant: "ghost", noHover: true,
             // buttonStyle={{ padding: '0px', minHeight: '0px' }}
-            onSdClick: this.closeDropdown }), h("div", { key: '3a4393bb918273d4d66339de9d434e0a79e1cb94', class: "sd-guide__popup__header" }, h("sd-icon", { key: 'c39e82ff77c2ec9e703e197bcc35d0ad6a65c03a', name: "helpOutline", size: 24, color: colors.green_65 }), h("h3", { key: 'a4cc1d67bb52791661834e520d270808f3528d3a', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), h("ul", { key: 'f6d22130a11dd3d072d644f828d7d247aa291252', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
+            onSdClick: this.closeDropdown }), h("div", { key: 'fc36f51b032fd41e63d53024f0714fbf974b37a3', class: "sd-guide__popup__header" }, h("sd-icon", { key: 'bb6a8005b45704029d7c8fdde7908d52c7fb2bd1', name: "helpOutline", size: 24, color: colors.green_65 }), h("h3", { key: 'bafff977e7a4c36515c035fc05074d5445a111bb', class: "sd-guide__popup__title" }, this.label || GUIDE_LABEL[this.type])), h("ul", { key: '1adafdaf539257ba4b61b958ef3a21362d5e44bf', class: "sd-guide__popup__list" }, this.renderListItem(this.message)))))));
     }
     // 현재 2depth까지만 스타일 적용
     renderListItem(message, depth = 0) {

package/dist/collection/components/sd-icon/sd-icon.js CHANGED Viewed

@@ -25,7 +25,7 @@ export class SdIcon {
     }
     render() {
         const IconComponent = Icons[this.name]?.[this.size];
-        return (h("i", { key: 'cfc678c8bbef71c6019e69aa7f129f1bdc5b3e76', class: this.getIconClasses(), style: this.iconStyle }, h(IconComponent, { key: '6c82d9774389f0ac22ae3bf534e7188aa96ecc88', color: this.resolvedColor })));
+        return (h("i", { key: '1b3f72da8307068cb0723bbc66723bfcf15a4644', class: this.getIconClasses(), style: this.iconStyle }, h(IconComponent, { key: 'a2526ffca360d28daf0f265822072e294ed27155', color: this.resolvedColor })));
     }
     static get is() { return "sd-icon"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-input/sd-input.js CHANGED Viewed

@@ -89,11 +89,11 @@ export class SdInput {
                 '--input-width': typeof this.width === 'number' ? `${this.width}px` : this.width,
             }
             : {};
-        return (h(Host, { key: '928cdcf68de21bc5b6aeff4ee21b8731f4317467', style: inputWidth }, this.label && h("div", { key: 'a0c76f4ed0ee3336d14d353fc780b13e42dabfb6', class: "sd-input__label" }, this.label), h("label", { key: 'f143460e809a25a33d15e4493191b12fc3895e58', class: {
+        return (h(Host, { key: 'bb677f1411303375222c7eadf7738d97de04c4ad', style: inputWidth }, this.label && h("div", { key: '0d05e92148e90645bf8c61d94693eb74d0e37154', class: "sd-input__label" }, this.label), h("label", { key: 'a6a9a4912b4e0e9fb44d9d273f73b88db804bd97', class: {
                 'sd-input': true,
                 [this.getInputStatus()]: true,
                 'sd-input--barcode': !!this.barcode,
-            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: '6f878f76b0ecabd9d50c3403e341fea0451801b5', name: "prefix" }), h("input", { key: 'f7dd11db863b5bf96566448d9cc4f1b6a2f3520b', 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) }), h("slot", { key: 'b71e5de26f10b8b97b0afcd413e05785567d580c', name: "suffix" }), this.clearable && this.internalValue && (h("sd-icon", { key: 'dfdf3c53c0920cc5170baa50c374c4a40fbd0208', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
+            }, onMouseEnter: () => (this.hovered = true), onMouseLeave: () => (this.hovered = false), style: this.inputStyle }, h("slot", { key: 'df634eb250fc1dff27e1db4372b3c90c14f9cd79', name: "prefix" }), h("input", { key: '0d2e5619efef215cd7c9552a015422bf9c036d35', 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) }), h("slot", { key: 'c139e8cb7691263e1f4ab2e1e0eadc8284303a39', name: "suffix" }), this.clearable && this.internalValue && (h("sd-icon", { key: 'b4e2a13aabf0257ff72d982197b8eab99ad6d441', name: "close", color: "#888", class: "sd-input__clear-icon", onClick: () => {
                 this.internalValue = '';
                 this.sdChange?.emit(this.internalValue);
                 this.sdInput?.emit(this.internalValue);

package/dist/collection/components/sd-loading-spinner/sd-loading-spinner.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SdLoadingSpinner {
     render() {
-        return (h(Host, { key: '5e0bd2fb9b7398091e38c525ea940373d6fde15a' }, h("svg", { key: 'ebc330686702cac30c3b8ffe9c7fa8e9618bd74d', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, h("circle", { key: '1dc766d141fbb35d2fc2dcdd7e1ea4c0eb517fe5', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
+        return (h(Host, { key: '8ab87f8cf1e002856b6721de5ca5313ccafb3265' }, h("svg", { key: 'da44064be6ab5c19d8517eb4da37c4849997715b', class: "sd-loading-spinner text-positive", width: "72px", height: "72px", viewBox: "25 25 50 50" }, h("circle", { key: 'f446e24aabaf694e4158ec7e91ad4c39e33b4f91', class: "path", cx: "50", cy: "50", r: "20", fill: "none", stroke: "currentColor", "stroke-width": "5", "stroke-miterlimit": "10" }))));
     }
     static get is() { return "sd-loading-spinner"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-pagination/sd-pagination.js CHANGED Viewed

@@ -73,12 +73,12 @@ export class SdPagination {
         }
     }
     render() {
-        return (h("div", { key: '28280174e55e02ab101d4eda1320329dc4d94e08', class: this.paginationClasses }, h("div", { key: '87fe306c0d6996cae1a0941e2bb4e48d04d84633', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("button", { type: "button", "aria-current": this.currentPage === n ? 'page' : undefined, class: {
+        return (h("div", { key: 'ee07e420809eca9641ab325d38c48a054b9e04de', class: this.paginationClasses }, h("div", { key: 'a7b7f129832a465fd4426cf142385f37461a65b7', class: "prepend-btns" }, this.renderPrevButtons()), this.simple ? (h("div", { class: "pagination-info" }, h("span", { class: "current-page" }, this.currentPage), h("span", null, "/"), h("span", { class: "last-page" }, this.lastPage))) : (this.pageNumbers.map(n => (h("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)))), h("div", { key: '53bd162fa675a0c270a74ede5ff4717b4eea8f3c', class: "append-btns" }, this.renderNextButtons())));
+            }, onClick: () => this.handlePageChange(n) }, n)))), h("div", { key: 'c1a8fd3d61d24652a17ec30ed436c90c77a19144', class: "append-btns" }, this.renderNextButtons())));
     }
     static get is() { return "sd-pagination"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-popover/sd-popover.js CHANGED Viewed

@@ -31,11 +31,11 @@ export class SdPopover {
         this.showPopover = false;
     };
     render() {
-        return (h(Fragment, { key: 'd457e8f54d99c4f42b85d90f04cbf67cbe36635c' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '9ea275ba7986ee4c084a2f2091d9c2eb590bcea2', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: 'ffb0f048433b15bf7fcbd7969f093e6e61ccb4cd', class: {
+        return (h(Fragment, { key: 'a58d208a0a9ba1e954568512f1dbe0df88922623' }, this.label ? (h("sd-button", { ref: el => (this.buttonEl = el), label: this.label, icon: this.icon, size: this.buttonSize, color: this.color, variant: this.buttonVariant, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })) : (h("sd-icon", { ref: el => (this.buttonEl = el), name: this.icon, size: this.iconSize, color: this.color, class: "sd-popover", onClick: () => (console.log('click popover'), (this.showPopover = !this.showPopover)) })), this.showPopover && (h("sd-tooltip-portal", { key: '7ffbc49de8f33edbc05beec6cb554820bdbde2b6', parentRef: this.buttonEl, onSdClose: this.handleClose, placement: this.placement }, h("div", { key: 'fcf1b9069831494c3c2ee5e274037c211f342993', class: {
                 'sd-popover-menu': true,
                 [`sd-popover-menu--${this.placement}`]: true,
                 [this.menuClass]: !!this.menuClass,
-            } }, h("i", { key: '92476592bcfe97ccc8d72780ddcab13e914a4902', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: 'df5077063d131d8022d92f3eeef3a87d70a74542' })), h("div", { key: '693b5b70079d87747d5a02daaa9fc9739fdf158e', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: 'ac67c0c9ecc93ef9b7581ca22d5cc7ad84aa438b', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: 'f133b49960594f1828dff11c130c85ff8e658aee', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: '2c0ae6d8353528b870fd88dc205059fa7efd8166', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: '84b0862776101eb67782ca6ca0919562f79eeebc', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: '8dd2f9c6a9e36b86b1fd5b6463362a9c7773f711', name: "close", size: "12", color: "#AAAAAA" }))))))));
+            } }, h("i", { key: 'e1bd244e2c8c2e1c8a4759f96ce44e5cdda41bcc', class: `sd-popover-menu__arrow sd-popover-menu__arrow--${this.placement}` }, h(TooltipArrow, { key: '36cf86a871f7454f2916ce8157e7d9234d808666' })), h("div", { key: '8fcd872f31d3dfcad2b8b7d26c7956368289d8cf', class: "sd-popover-menu__content" }, this.menuTitle && h("div", { key: '435f956e668910900948999a2ae23a7ffbdf67cd', class: "sd-popover-menu__title" }, this.menuTitle), this.messages.length > 0 && (h("div", { key: '80eaa27446106e6380712fb00ad9df4752ebb70b', class: "sd-popover-menu__messages" }, this.messages.map(message => (h("div", null, message))))), this.buttons.length > 0 && (h("div", { key: 'b4845d8ac339559c2b612a219517a6addb47aaca', class: `sd-popover-menu__buttons sd-popover-menu__buttons--${this.buttons.length}` }, this.buttons.map(button => (h("sd-button", { ...button })))))), this.useClose && (h("button", { key: '56ab62d73d4e71d871165d28adf7ecd4efd92870', class: "sd-popover-menu__close-button", onClick: () => this.handleClose() }, h("sd-icon", { key: 'ea93c1a46baef7cb4b7a849b8744043afc11de79', name: "close", size: "12", color: "#AAAAAA" }))))))));
     }
     static get is() { return "sd-popover"; }
     static get encapsulation() { return "shadow"; }