@sellmate/design-system 1.0.78 → 1.1.0

package/dist/collection/components/sd-select/sd-select-list-item-search/sd-select-list-item-search.css

@@ -16,12 +16,12 @@ sd-select-list-item-search .sd-select-list-item-search__inner {
   align-items: center;
   gap: 6px;
   padding: 4px 8px;
-  border: 1px solid #CCCCCC;
+  border: 1px solid #cccccc;
   border-radius: 4px;
   background: white;
 }
 sd-select-list-item-search .sd-select-list-item-search__inner:focus-within {
-  border-color: #0075FF;
+  border-color: #0075ff;
 }
 sd-select-list-item-search .sd-select-list-item-search__icon {
   flex-shrink: 0;
@@ -37,7 +37,7 @@ sd-select-list-item-search .sd-select-list-item-search__input {
   min-width: 0;
 }
 sd-select-list-item-search .sd-select-list-item-search__input::placeholder {
-  color: #AAAAAA;
+  color: #aaaaaa;
 }
 sd-select-list-item-search .sd-select-list-item-search__clear {
   flex-shrink: 0;
@@ -51,7 +51,7 @@ sd-select-list-item-search .sd-select-list-item-search__clear {
   border-radius: 2px;
 }
 sd-select-list-item-search .sd-select-list-item-search__clear:hover {
-  background: #F0F0F0;
+  background: #f0f0f0;
 }
 sd-select-list-item-search .sd-select-list-item-search__clear--hidden {
   visibility: hidden;

package/dist/collection/components/sd-select/sd-select-list-item-search/sd-select-list-item-search.js

@@ -41,15 +41,15 @@ export class SdSelectListItemSearch {
             clearTimeout(this.debounceTimer);
     }
     render() {
-        return (h("div", { key: '139aa74cb44baef15a5a75008dd291f11ad2965b', class: {
+        return (h("div", { key: '8714ef9e06f54fd5c2ae5241cac65a74ea45dccf', class: {
                 'sd-select-list-item-search': true,
                 'sd-select-list-item-search--scrolled': this.isScrolled,
-            } }, h("div", { key: '2df6559c3a0e769e50e72ef06828adcf595fc433', class: "sd-select-list-item-search__inner" }, h("sd-icon", { key: '20dfe4a309c7879bcdd1e5890f183a9e1eb98fae', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), h("input", { key: '825724eedf71693ce39a21f413c5a4eb6f1495e3', ref: el => {
+            } }, h("div", { key: '428aea3765711fd91ae7b587b21347dd9634636b', class: "sd-select-list-item-search__inner" }, h("sd-icon", { key: 'ed3363eea1a7d6a4f44141a74855c4e767a34999', name: "search", size: 16, color: "grey_70", class: "sd-select-list-item-search__icon" }), h("input", { key: 'c3f5539e037a81d96ce2fa41225f0c33c32add6e', ref: el => {
                 this.inputEl = el;
-            }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: '20fb0c745d423b008f482a2e33e7e711ea40b5df', type: "button", class: {
+            }, type: "text", class: "sd-select-list-item-search__input", placeholder: "\uAC80\uC0C9\uC5B4 \uC785\uB825", value: this.searchText, onInput: this.handleInput, onFocus: () => this.searchFocus.emit() }), h("button", { key: 'b081b5a6eced0397db40784ce25e0e84c574f869', type: "button", class: {
                 'sd-select-list-item-search__clear': true,
                 'sd-select-list-item-search__clear--hidden': !this.searchText,
-            }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, h("sd-icon", { key: 'ce6e4f9b5281ebb767d6542a223e425660ec01c9', name: "close", size: 12, color: "#888888" })))));
+            }, onClick: this.handleClear, tabindex: this.searchText ? 0 : -1, "aria-hidden": this.searchText ? 'false' : 'true' }, h("sd-icon", { key: '29615969a7efa118089e2c8dba741086196f8593', name: "close", size: 12, color: "#888888" })))));
     }
     static get is() { return "sd-select-list-item-search"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-select/sd-select-listbox/sd-select-listbox.js

@@ -343,14 +343,14 @@ export class SdSelectListbox {
     }
     render() {
         const cssVars = {
-            '--listbox-trigger-width': this.triggerWidth,
-            '--listbox-max-width': this.maxWidth,
-            '--listbox-max-height': this.maxHeight,
+            '--listbox-trigger-width': this.triggerWidth ?? '200px',
+            '--listbox-max-width': this.maxWidth ?? '640px',
+            '--listbox-max-height': this.maxHeight ?? '260px',
             '--listbox-radius': `${LIST_BOX_LAYOUT.radius}px`,
         };
-        return (h("div", { key: 'c1582b1bc6058b78a8581511854f0878e7f39a94', class: "sd-select-listbox", style: cssVars }, this.showSearch && (h("sd-select-list-item-search", { key: '4fd2099bf8069f258596479123053a34a41c528d', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), h("div", { key: 'ff8643a308b07dbaebf627c7082a37efa6b72a10', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
+        return (h("div", { key: 'be3a46d2a17522799374eb7e59faea8960e7b41a', class: "sd-select-listbox", style: cssVars }, this.showSearch && (h("sd-select-list-item-search", { key: '68fa6b9f958ee662ac400716ade0ae4823ad99a3', isScrolled: this.isScrolled, onSdSearchFilter: this.handleSearchFilter })), h("div", { key: 'b0a6daf94c69ccb33d31434014c93b2f414309f3', class: "sd-select-listbox__list", onScroll: this.handleScroll, ref: el => {
                 this.listEl = el;
-            } }, this.showSelectAll && (h("sd-select-list-item", { key: '30f0cfbc24304af8c704db33d0e51236971226ee', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (h("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (h("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
+            } }, this.showSelectAll && (h("sd-select-list-item", { key: '120fea009df513e3346877044ee65c132ece70cf', option: SdSelectListbox.SELECT_ALL_OPTION, depth: 1, isSelected: this.selectAllState, isFocused: this.isOptionFocused(SdSelectListbox.SELECT_ALL_OPTION), useCheckbox: true, onSdListItemClick: this.handleSelectAllClick, onMouseEnter: () => this.handleOptionHover(SdSelectListbox.SELECT_ALL_OPTION) })), this.isEmpty ? (h("div", { class: "sd-select-listbox__empty" }, EMPTY_MESSAGE)) : this.isDepth ? (this.renderOptions(this.filteredOptions)) : (this.filteredOptions.map(option => (h("sd-select-list-item", { option: option, depth: 1, isSelected: this.isOptionSelected(option), isFocused: this.isOptionFocused(option), useCheckbox: this.isMulti, onSdListItemClick: this.handleOptionClick, onMouseEnter: () => this.handleOptionHover(option) })))))));
     }
     static get is() { return "sd-select-listbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/sd-select/sd-select-trigger/sd-select-trigger.js

@@ -42,13 +42,13 @@ export class SdSelectTrigger {
                 ? SELECT_COLORS.icon.disabled
                 : SELECT_COLORS.icon.default,
         };
-        return (h("div", { key: 'dddccfd47738e104a9c715a0c93df1882d28d704', ref: el => {
+        return (h("div", { key: '69a87c509e16605feb217f12ce055e0097f09a6f', ref: el => {
                 this.triggerEl = el;
             }, tabindex: this.disabled ? -1 : 0, class: {
                 'sd-select-trigger': true,
                 'sd-select-trigger--open': this.isOpen,
                 'sd-select-trigger--disabled': this.disabled,
-            }, style: cssVars, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("div", { key: '9f8572c4ec3fa02c9f94bb94a8a10358c4d6b3ae', class: "sd-select-trigger__content" }, h("span", { key: 'a4b5b27fc3a84adbd2e24981742ca45402993afb', class: "sd-select-trigger__text" }, hasValue ? this.displayText : this.placeholder), h("sd-icon", { key: '97bbcda656bae2248ca83fb2bd56373b2dd8dd41', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
+            }, style: cssVars, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur }, h("div", { key: '0886f40b2427fc4b5825b06682531a26be4c4eec', class: "sd-select-trigger__content" }, h("span", { key: '9e2fb73a34153b0744fbf2cc7490ecdc7a125233', class: "sd-select-trigger__text" }, hasValue ? this.displayText : (this.placeholder ?? '선택')), h("sd-icon", { key: 'c8a80bf912c50bf97a5d5af4d4c5307e416aea6d', name: "chevronDown", size: 12, color: "var(--trigger-icon-color)", class: {
                 'sd-select-trigger__icon': true,
                 'sd-select-trigger__icon--open': this.isOpen,
             } }))));

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

@@ -254,15 +254,15 @@ export class SdSelect {
                 this.closeDropdown();
             },
         };
-        return (h("sd-field", { key: '76625e332090d20e2f66159bba5ee1b9a11320a6', 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: () => {
+        return (h("sd-field", { key: '18edcdfdc3a9a2bd17ae0e3852eec94151275e18', 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;
-            } }, h("div", { key: '8a0ae8a5e05459128409dbe21779f5e3d91b3a04', class: "sd-select", ref: el => {
+            } }, h("div", { key: '39efa02a58acbc53315087cceb732b488920dbe8', class: "sd-select", ref: el => {
                 this.triggerRef = el;
-            } }, h("sd-select-trigger", { key: '6b47231914655a8e197e3b38cd8e37c5214efc17', ref: el => {
+            } }, h("sd-select-trigger", { key: 'e03ce9208f4af5226461ecdfb0d15bade4f277dd', 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) && (h("sd-portal", { key: 'eaed402d276cc94a1324ede9cbf09bc436f8a1db', ...portalProps }, h("sd-select-listbox", { key: 'a96f75e06d974c8fd88ac72f083fe4b0ef424a0b', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, useSearch: this.useSearch, useSelectAll: this.useSelectAll, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
+            }, 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) && (h("sd-portal", { key: '9181fd551885e001f139cab9634a2ac3b0f89d47', ...portalProps }, h("sd-select-listbox", { key: '6ed356d2ceea79562ce448584514c23fbff20090', type: this.type, options: this.options, value: this.value, emitValue: this.emitValue, useSearch: this.useSearch, useSelectAll: this.useSelectAll, triggerWidth: this.triggerWidth, maxWidth: this.resolvedMaxDropdownWidth, maxHeight: this.resolvedDropdownHeight, onSdOptionSelect: event => this.handleOptionSelect(event.detail) })))));
     }
     static get is() { return "sd-select"; }
     static get originalStyleUrls() {
@@ -656,7 +656,7 @@ export class SdSelect {
                 "mutable": false,
                 "complexType": {
                     "original": "SdTooltipProps | null",
-                    "resolved": "SdTooltipProps | null",
+                    "resolved": "SdTooltip | null",
                     "references": {
                         "SdTooltipProps": {
                             "location": "import",

package/dist/collection/components/sd-switch/sd-switch.js

@@ -40,7 +40,7 @@ export class SdSwitch {
             '--sd-switch-line-height': `${SWITCH_TYPOGRAPHY.lineHeight}px`,
             '--sd-switch-text-decoration': SWITCH_TYPOGRAPHY.textDecoration,
         };
-        return (h("label", { key: '54ebe92b29a80537e2e4380ffe096a252f883d10', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, h("input", { key: 'd18abbbf293434f07ae7dfa18b983b47cac1b774', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), h("div", { key: '76fef910e632b541c0b33c508e6001529df5614f', class: "sd-switch__track" }, h("div", { key: 'a66f4ecca5787f00febe19216a93ec62916e0541', class: "sd-switch__knob" })), this.label && h("span", { key: '948d2b7afc6e171ee329752cb85f8e361f6bbed8', class: "sd-switch__label" }, this.label)));
+        return (h("label", { key: 'a37c1387905456007de46a6050616b025ad06b37', "aria-label": this.label || 'switch', class: this.switchClasses, style: cssVars }, h("input", { key: '5fcc9f72e177956e015e4cb009936edc60c4c3ec', type: "checkbox", checked: this.value, disabled: this.disabled, onInput: this.handleChange }), h("div", { key: 'bf1fa22a94b2b245a2ddf805df4cd1c204524710', class: "sd-switch__track" }, h("div", { key: '11dafcd812c560acb7a63f7267f40f8ed67da95b', class: "sd-switch__knob" })), this.label && h("span", { key: '6609d2e33e82e843ffd5bbb2d2010de3e299f081', class: "sd-switch__label" }, this.label)));
     }
     static get is() { return "sd-switch"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-table/sd-table.config.js

@@ -42,8 +42,8 @@ export const TABLE_BODY_TYPOGRAPHY = {
 };
 // ── Frame / Border Tokens ──
 export const TABLE_BORDER = {
-    color: tableTokens.table.border.default,
-    width: tableTokens.table.border.width.width,
+    color: tableTokens.table.border.color,
+    width: tableTokens.table.border.width,
 };
 export const TABLE_RADIUS = tableTokens.table.radius;
 // ── Content Tokens ──

package/dist/collection/components/sd-table/sd-table.css

@@ -20,7 +20,7 @@ sd-table *,
   flex-direction: column;
 }
 
-.sd-table__clip {
+.sd-table__wrapper {
   width: 100%;
   min-width: 0;
   height: var(--table-container-height, 400px);
@@ -28,11 +28,11 @@ sd-table *,
   border-radius: var(--table-radius, 8px);
   overflow: hidden;
 }
-.sd-table__clip--has-pagination {
-  border-radius: var(--table-radius, 8px) var(--table-radius, 8px) 0 0;
+.sd-table__wrapper--radius-use-top {
+  border-radius: 0 0 var(--table-radius, 8px) var(--table-radius, 8px);
 }
 
-.sd-table__wrapper {
+.sd-table__scroll-container {
   width: 100%;
   height: 100%;
   display: flex;
@@ -46,11 +46,11 @@ sd-table *,
   overflow: auto;
   background: #FFFFFF;
 }
-.sd-table__wrapper--loading {
+.sd-table__scroll-container--loading {
   overflow: hidden !important;
   pointer-events: none;
 }
-.sd-table__wrapper--no-data {
+.sd-table__scroll-container--no-data {
   overflow: hidden;
   pointer-events: none;
 }
@@ -130,8 +130,8 @@ sd-table *,
   align-items: center;
   justify-content: center;
   border: var(--table-border-width, 1px) solid var(--table-border-color, #E1E1E1);
-  border-top: none;
-  border-radius: 0 0 var(--table-radius, 8px) var(--table-radius, 8px);
+  margin-top: -1px;
+  border-radius: var(--table-radius, 8px);
 }
 .sd-table__pagination sd-select {
   position: absolute;

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

@@ -17,6 +17,7 @@ export class SdTable {
     height;
     stickyHeader = false;
     stickyColumn = { left: 0, right: 0 };
+    radius = 'default';
     noDataLabel = SdTable.DEFAULT_NO_DATA_LABEL;
     resolvedNoDataLabel = SdTable.DEFAULT_NO_DATA_LABEL;
     isLoading = false;
@@ -208,6 +209,7 @@ export class SdTable {
         el.unregisterSpanSync = this.unregisterSpanSync.bind(this);
         el.getSpanSync = this.getSpanSync.bind(this);
         el.isCoveredSync = this.isCoveredSync.bind(this);
+        el.isVisualLastRowSync = this.isVisualLastRowSync.bind(this);
         el.hasRowspanSync = this.hasRowspanSync.bind(this);
         el.registerCellClassSync = this.registerCellClassSync.bind(this);
         el.unregisterCellClassSync = this.unregisterCellClassSync.bind(this);
@@ -222,7 +224,7 @@ export class SdTable {
             this.pushRowsToChildren(this.rows);
         }
         readTask(() => {
-            const wrapper = this.el.shadowRoot?.querySelector('.sd-table__wrapper');
+            const wrapper = this.el.shadowRoot?.querySelector('.sd-table__scroll-container');
             if (!wrapper)
                 return;
             let rafPending = false;
@@ -358,7 +360,7 @@ export class SdTable {
         };
     }
     isRowSelectedSync(row) {
-        return Array.from(this.innerSelected).some(r => r[this.rowKey] === row[this.rowKey]);
+        return Array.from(this.innerSelected).some(r => r[(this.rowKey ?? 'id')] === row[(this.rowKey ?? 'id')]);
     }
     async isRowSelected(row) {
         return this.isRowSelectedSync(row);
@@ -367,7 +369,7 @@ export class SdTable {
         const selectedArray = Array.from(this.innerSelected);
         const exists = this.isRowSelectedSync(row);
         const newSelected = exists
-            ? selectedArray.filter(r => r[this.rowKey] !== row[this.rowKey])
+            ? selectedArray.filter(r => r[(this.rowKey ?? 'id')] !== row[(this.rowKey ?? 'id')])
             : [...selectedArray, row];
         if (newSelected.length === selectedArray.length)
             return;
@@ -385,8 +387,8 @@ export class SdTable {
             this.innerSelected = new Set([...this.innerSelected, ...pageRows]);
         }
         else {
-            const currentPageKeys = rows.map(r => r[this.rowKey]);
-            this.innerSelected = new Set([...this.innerSelected].filter(r => !currentPageKeys.includes(r[this.rowKey])));
+            const currentPageKeys = rows.map(r => r[(this.rowKey ?? 'id')]);
+            this.innerSelected = new Set([...this.innerSelected].filter(r => !currentPageKeys.includes(r[(this.rowKey ?? 'id')])));
         }
         this.selected = Array.from(this.innerSelected);
         this.sdSelectChange.emit(Array.from(this.innerSelected));
@@ -397,7 +399,7 @@ export class SdTable {
     }
     getIsAllCheckedSync(rows) {
         const total = rows.length;
-        const selectedCount = rows.filter(row => Array.from(this.innerSelected).some(selectedRow => selectedRow[this.rowKey] === row[this.rowKey])).length;
+        const selectedCount = rows.filter(row => Array.from(this.innerSelected).some(selectedRow => selectedRow[(this.rowKey ?? 'id')] === row[(this.rowKey ?? 'id')])).length;
         if (selectedCount === 0)
             return false;
         if (selectedCount === total)
@@ -623,6 +625,23 @@ export class SdTable {
         }
         return false;
     }
+    // 셀이 시각적으로 마지막 행(또는 페이지 마지막 행)에 닿는지 판정.
+    // 마지막 행에 border-bottom: none을 적용하기 위함
+    isVisualLastRowSync(rowKey, field) {
+        if (this.rowCount <= 0)
+            return false;
+        const myRowIdx = this.resolveRowIndex(rowKey);
+        if (myRowIdx == null)
+            return false;
+        const span = this.spanRegistry.get(this.spanKey(rowKey, field));
+        const rs = Math.max(1, span?.rowspan ?? 1);
+        const visualBottom = myRowIdx + rs - 1;
+        const pageInfo = this.getPaginationInfoSync();
+        const lastVisibleIdx = pageInfo
+            ? Math.min(pageInfo.endIndex - 1, this.rowCount - 1)
+            : this.rowCount - 1;
+        return visualBottom === lastVisibleIdx;
+    }
     setRowCountSync(count) {
         const safeCount = Math.max(0, Math.floor(this.toFiniteNumber(count, 0)));
         if (safeCount !== this.rowCount) {
@@ -713,24 +732,21 @@ export class SdTable {
             '--table-body-line-height': `${TABLE_BODY_TYPOGRAPHY.lineHeight}px`,
             '--table-body-text-decoration': TABLE_BODY_TYPOGRAPHY.textDecoration,
         };
-        return (h(Host, { key: 'c20a7cc6d5917c9d09c699f2c40ac2b6d07747e1', style: hostStyle }, h("div", { key: '94f76e75da5c6ff9d0ef93b6c2aa3def4ec1766e', class: "sd-table__container", style: {
+        return (h(Host, { key: 'd868318e2aeb7b3062a702a743f90bb55dbb00b8', style: hostStyle }, h("div", { key: '5b2113ecd1fa52a6170ffcfac5f906fae7ef7548', class: "sd-table__container", style: {
                 '--table-width': this.width,
                 '--table-height': this.height,
                 '--table-container-height': `calc(${this.height || '100%'} - ${this.pagination && this.rowCount > 0 && !this.useVirtualScroll ? 48 : 0}px)`,
-            } }, h("div", { key: '3b98c828c7dc42de3d4f9bb645279b20d9079ac4', class: {
-                'sd-table__clip': true,
-                'sd-table__clip--has-pagination': !!(this.pagination &&
-                    this.pagination.rowsPerPage > 0 &&
-                    this.rowCount > 0 &&
-                    !this.useVirtualScroll),
-            } }, h("div", { key: 'b6d04ec953d7b75fb8ad8bc32e2662550d38c5c7', class: {
+            } }, h("div", { key: '389d7f3508727fb76d9d9f98a73963c5556ff993', class: {
                 'sd-table__wrapper': true,
-                'sd-table__wrapper--loading': this.isLoading,
-                'sd-table__wrapper--no-data': this.rowCount === 0 && !this.isLoading,
-            } }, this.isLoading && (h("div", { key: '3050275c7ecde0aeda3ec881257be4334ebd06fc', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: '7a26c4365e4e28a5ebce1c35bb52a302440542f7', indeterminate: true }))), this.rowCount === 0 && !this.isLoading && (h("div", { key: '31442f92321eb4aaf5c36c5995a1c25d8069b6ea', class: "sd-table__no-data" }, h("slot", { key: '42f3208fb1c86d118f50e8b1974bff3ede253032', name: "no-data" }, h("span", { key: 'ce7368c64b3502eee2fae7a28e0508d4d1622c25' }, this.resolvedNoDataLabel)))), h("table", { key: '170203f34b4bb11fce0a064622265d093ccbab2a', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
+                'sd-table__wrapper--radius-use-top': this.radius === 'useTop',
+            } }, h("div", { key: 'e9cdeecb5f318cb1af4e0d2e938e0098e1cc44d0', class: {
+                'sd-table__scroll-container': true,
+                'sd-table__scroll-container--loading': this.isLoading,
+                'sd-table__scroll-container--no-data': this.rowCount === 0 && !this.isLoading,
+            } }, this.isLoading && (h("div", { key: '40caec779763f90e1f48818e3f56e8daabc105a6', class: "sd-table__loading", style: { top: `${this.loadingScrollTop}px` } }, h("sd-circle-progress", { key: 'bf7a3cabb0023f0a1663dd0337f3399ace0e75e7', indeterminate: true }))), this.rowCount === 0 && !this.isLoading && (h("div", { key: 'aac583c7876171a276645146e00afbc43d405607', class: "sd-table__no-data" }, h("slot", { key: '31e18789beeed03bcfd7013c9386eefd6f51b2cd', name: "no-data" }, h("span", { key: '07da091864e588f2ee60e8ea5ffd5ae34c968f68' }, this.resolvedNoDataLabel)))), h("table", { key: '69284f7f819477072450d1b6acbfe081abe4f1ef', class: this.tableClasses }, this.autoThead ? (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange }, h("sd-thead", { rows: this.rows ?? [] }))) : (h("slot", { name: `${resolvedTableId}-head`, onSlotchange: this.handleStructureSlotChange })), this.autoTbody ? (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }, h("sd-tbody", { rows: this.rows ?? [] }, this.renderAutoRows()))) : (h("slot", { name: `${resolvedTableId}-body`, onSlotchange: this.handleStructureSlotChange }))))), this.pagination &&
             this.pagination.rowsPerPage > 0 &&
             this.rowCount > 0 &&
-            !this.useVirtualScroll && (h("div", { key: 'cfbd5ee8e706c9ef7a2b6a4be8901b7aae47249e', class: "sd-table__pagination" }, h("sd-pagination", { key: '57dad16199d9145fcec0c5ed46beeeac1f08af02', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: '1314e296ba913600436045b4af54eb0bc1d95d0d', value: this.useInternalPagination
+            !this.useVirtualScroll && (h("div", { key: 'ff30e864526aa8c3fac2cc37499cea7aa6be1420', class: "sd-table__pagination" }, h("sd-pagination", { key: 'ad5badf1d5f518b0bf281e973c46b1381e82ae3c', currentPage: !this.useInternalPagination ? this.pagination.page : this.currentPage, lastPage: !this.useInternalPagination ? this.pagination.lastPage : this.lastPageNumber, onSdPageChange: (e) => this.changePage(e.detail) }), this.useRowsPerPageSelect && (h("sd-select", { key: 'd249e79cfda4c80cb4df9c353dc4f678a5ccb861', value: this.useInternalPagination
                 ? this.innerRowsPerPage
                 : this.pagination.rowsPerPage, options: this.rowsPerPageOption, width: "128px", emitValue: true, onSdUpdate: e => {
                 if (!this.isRowsPerPageValue(e.detail))
@@ -989,6 +1005,26 @@ export class SdTable {
                 "setter": false,
                 "defaultValue": "{ left: 0, right: 0 }"
             },
+            "radius": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'useTop'",
+                    "resolved": "\"default\" | \"useTop\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "radius",
+                "defaultValue": "'default'"
+            },
             "noDataLabel": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/sd-table/sd-tbody/sd-tbody.js

@@ -45,9 +45,9 @@ export class SdTbody {
         }
     }
     render() {
-        return (h(Host, { key: 'e474bc09fdec9d48d978ec87620b161220b5236c', slot: `${this.tableId}-body` }, h("tbody", { key: 'c74261b3f30c43e8ac8c3bdea1180f17bfc7dbc8', class: { tbody: true } }, [
+        return (h(Host, { key: 'f0dacb28bae712e8f4d65bad00846da9db593307', slot: `${this.tableId}-body` }, h("tbody", { key: 'aec7d2277e617f1c186163d214e94559793b764c', class: { tbody: true } }, [
             this.topSpacerHeight > 0 && (h("tr", { key: "spacer-top", class: "tbody__spacer", style: { height: `${this.topSpacerHeight}px`, display: 'block' } })),
-            h("slot", { key: 'f686e7e8fa81e725a32592a58267d0b5cd7551e6' }),
+            h("slot", { key: '2c428e3624ac949ee201edfd02b5e8f0bcea2e48' }),
             this.bottomSpacerHeight > 0 && (h("tr", { key: "spacer-bottom", class: "tbody__spacer", style: { height: `${this.bottomSpacerHeight}px`, display: 'block' } })),
         ])));
     }

package/dist/collection/components/sd-table/sd-td/sd-td.js

@@ -108,7 +108,7 @@ export class SdTd {
         }
     }
     render() {
-        return (h(Host, { key: '84ce2fe2ea8ccb3eaf09e4d2559fc917bdb1077a', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: '9b8164a2eac53b927bf59638cb53c35998a75cfe' })));
+        return (h(Host, { key: 'a8b4cb79a6b40119087fcba358a5c8daadb70fe8', class: { [`align-${this.align}`]: Boolean(this.align) } }, h("slot", { key: '959b53537662f22e6bb5fe8d775530c11cbdff3b' })));
     }
     static get is() { return "sd-td"; }
     static get originalStyleUrls() {

package/dist/collection/components/sd-table/sd-thead/sd-thead.js

@@ -152,16 +152,16 @@ export class SdThead {
             '--table-border-color': TABLE_BORDER.color,
             '--table-border-width': `${TABLE_BORDER.width}px`,
         };
-        return (h(Host, { key: 'c4468056cc20a78516e61bccaf4d11c098e83ec6', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: 'a9befd1728baf2104bfb9132557d5c5c0eb49748', class: {
+        return (h(Host, { key: '99d8d19dcc65b811d323e21041421b2d57da9f91', slot: `${this.tableId}-head`, style: headStyle }, h("thead", { key: '7614b6726ec13e857b6b8654925b0ba3c89fba64', class: {
                 'thead': true,
                 'thead--sticky': this._stickyHeader,
-            } }, h("tr", { key: 'da786d82d4896b6124becf42f634bcc5b0a6ffb7', class: "tr" }, this._selectable && (h("th", { key: 'b257c5475b7e528fbfc52ea85031a4c49bed7b36', class: {
+            } }, h("tr", { key: '68a615e7779947c1ee8cc26027c5bcded545e4d3', class: "tr" }, this._selectable && (h("th", { key: 'd3bc4512a24652ee156104a0fd9891504ce314dd', class: {
                 'th': true,
                 'th--selected': true,
                 'sticky-left': true,
                 'sticky-left-edge': stickyLeftCount === 0,
                 'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
-            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '6624026c1811c809eeb5131518ddb8c11f66b541', value: this.getIsAllChecked(), disabled: !safeRows.length, onSdUpdate: (e) => this.handleSelectAll(e.detail) }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
+            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: 'de8f9b201aca60acbbb28a3233e964100109a92b', value: this.getIsAllChecked(), disabled: !safeRows.length, onSdUpdate: (e) => this.handleSelectAll(e.detail) }))), stickyLeftCols.map((col, idx) => (h("th", { key: col.name, class: {
                 'th': true,
                 [`${col.thClass}`]: Boolean(col.thClass),
                 'sticky-left': true,

package/dist/collection/components/sd-table/sd-tr/sd-tr.css

@@ -116,4 +116,8 @@ sd-tr * {
 .tr--no-hover:hover .td.sticky-left,
 .tr--no-hover:hover .td.sticky-right {
   background-color: white;
+}
+
+.td.td--last-row {
+  border-bottom: none;
 }

package/dist/collection/components/sd-table/sd-tr/sd-tr.js

@@ -144,6 +144,20 @@ export class SdTr {
         const fieldName = typeof col.field === 'string' ? col.field : col.name;
         return this.tableEl.getCellClassSync(this.rowKey, fieldName);
     }
+    isVisualLastRow(col) {
+        if (!this.tableEl?.isVisualLastRowSync)
+            return false;
+        const fieldName = typeof col.field === 'string' ? col.field : col.name;
+        return this.tableEl.isVisualLastRowSync(this.rowKey, fieldName);
+    }
+    // selectable td는 column 정보가 없으므로 빈 field로 평가한다.
+    // 해당 위치는 rowspan을 등록할 수 없으므로 spanRegistry에 매칭이 없고,
+    // 결과적으로 "내 row 자체가 시각적 마지막인지"가 판정된다.
+    isVisualLastRowForSelfRow() {
+        if (!this.tableEl?.isVisualLastRowSync)
+            return false;
+        return this.tableEl.isVisualLastRowSync(this.rowKey, '');
+    }
     render() {
         const stickyLeftCount = this._stickyColumn.left || 0;
         const stickyRightCount = this._stickyColumn.right || 0;
@@ -163,13 +177,14 @@ export class SdTr {
             '--table-border-color': TABLE_BORDER.color,
             '--table-border-width': `${TABLE_BORDER.width}px`,
         };
-        return (h(Host, { key: '5ed784dad3eb187430efe30ed0bc0f153bf57f23', style: rowStyle }, h("tr", { key: 'bcdc07139fce88788a598ced264f3aad503882fe', class: { 'tr': true, 'tr--no-hover': hasRowspan } }, this._selectable && (h("td", { key: '0b2b516a0d2b57beb7bb37ea3ab2c34836cc772c', class: {
+        return (h(Host, { key: '30e4127b281770d12fab9e9cfd2cdf667eff8790', style: rowStyle }, h("tr", { key: '1072ce3f1b296e2278b7fc92a44d32da223ef119', class: { 'tr': true, 'tr--no-hover': hasRowspan } }, this._selectable && (h("td", { key: '4e3a37a320df97378a1ed311c0a7b8f744bd26bc', class: {
                 'td': true,
                 'td--selected': true,
+                'td--last-row': this.isVisualLastRowForSelfRow(),
                 'sticky-left': true,
                 'sticky-left-edge': stickyLeftCount === 0,
                 'is-scrolled-left': stickyLeftCount === 0 && this._scrolledLeft,
-            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: '3fb6dc05e2b0e75bd70ff5b9631330ce2348bd22', value: this.isSelected(), onSdUpdate: () => this.handleSelect() }))), stickyLeftCols.map((col, idx) => {
+            }, style: { '--sticky-left-offset': '0px' } }, h("sd-checkbox", { key: 'b1a775462c4869f75480908bccd428714c63c257', value: this.isSelected(), onSdUpdate: () => this.handleSelect() }))), stickyLeftCols.map((col, idx) => {
             if (this.isCovered(idx))
                 return null;
             const span = this.getSpanFor(col);
@@ -177,6 +192,7 @@ export class SdTr {
             return (h("td", { key: col.name, rowSpan: span?.rowspan, colSpan: span?.colspan, class: {
                     'td': true,
                     [`td--${col.align || 'left'}`]: true,
+                    'td--last-row': this.isVisualLastRow(col),
                     'sticky-left': true,
                     'sticky-left-edge': idx === stickyLeftCount - 1,
                     'is-scrolled-left': idx === stickyLeftCount - 1 && this._scrolledLeft,
@@ -191,8 +207,9 @@ export class SdTr {
             const span = this.getSpanFor(col);
             const sdCellClass = this.getCellClassFor(col);
             return (h("td", { key: col.name, rowSpan: span?.rowspan, colSpan: span?.colspan, class: {
-                    td: true,
+                    'td': true,
                     [`td--${col.align || 'left'}`]: true,
+                    'td--last-row': this.isVisualLastRow(col),
                     [`${col.tdClass}`]: Boolean(col.tdClass),
                     [`${sdCellClass}`]: Boolean(sdCellClass),
                 }, style: this.getStickyStyle(actualColIdx) }, h("slot", { name: `${this.tableId}-${fieldName}-${this.rowKey}` }, h("span", null, this.getCellValue(col)))));
@@ -206,6 +223,7 @@ export class SdTr {
             return (h("td", { key: col.name, rowSpan: span?.rowspan, colSpan: span?.colspan, class: {
                     'td': true,
                     [`td--${col.align || 'left'}`]: true,
+                    'td--last-row': this.isVisualLastRow(col),
                     'sticky-right': true,
                     'sticky-right-edge': relativeIdx === 0,
                     'is-scrolled-right': relativeIdx === 0 && this._scrolledRight,

package/dist/collection/components/sd-tabs/sd-tabs.js

@@ -67,7 +67,7 @@ export class SdTabs {
         };
     }
     render() {
-        return (h("div", { key: 'ff758fbab0a594c28968074a26ad92a28cd4850b', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
+        return (h("div", { key: '9578cc6d422a304312f9ebc78622264d20d1fb45', class: this.getContainerClasses(), style: this.buildCssVars() }, this.tabs.map((tab, index) => {
             const badgeName = this.getBadgeName(tab);
             return (h("div", { key: `tab-${index}`, class: this.getTabClasses(tab), "aria-label": tab.label || 'tab', onClick: () => this.handleTabClick(tab) }, h("span", { "data-label": tab.label, class: "sd-tabs__label" }, tab.label), tab.badge !== undefined && tab.badge !== null && tab.badge !== '' && (h("sd-tag", { name: badgeName, label: tab.badge.toString() }))));
         })));

package/dist/collection/components/sd-tag/sd-tag.config.js

@@ -12,14 +12,46 @@ export const TAG_COLORS = [
     'indigo',
 ];
 const TAG_COLOR_CONFIG = {
-    grey: { background: tagTokens.tag.grey.bg, content: tagTokens.tag.grey.content, icon: tagTokens.tag.grey.content },
-    red: { background: tagTokens.tag.red.bg, content: tagTokens.tag.red.content, icon: tagTokens.tag.red.content },
-    orange: { background: tagTokens.tag.orange.bg, content: tagTokens.tag.orange.content, icon: tagTokens.tag.orange.content },
-    yellow: { background: tagTokens.tag.yellow.bg, content: tagTokens.tag.yellow.content, icon: tagTokens.tag.yellow.content },
-    green: { background: tagTokens.tag.green.bg, content: tagTokens.tag.green.content, icon: tagTokens.tag.green.content },
-    blue: { background: tagTokens.tag.blue.bg, content: tagTokens.tag.blue.content, icon: tagTokens.tag.blue.content },
-    darkblue: { background: tagTokens.tag.darkblue.bg, content: tagTokens.tag.darkblue.content, icon: tagTokens.tag.darkblue.content },
-    indigo: { background: tagTokens.tag.indigo.bg, content: tagTokens.tag.indigo.content, icon: tagTokens.tag.indigo.content },
+    grey: {
+        background: tagTokens.tag.grey.bg,
+        content: tagTokens.tag.grey.content,
+        icon: tagTokens.tag.grey.content,
+    },
+    red: {
+        background: tagTokens.tag.red.bg,
+        content: tagTokens.tag.red.content,
+        icon: tagTokens.tag.red.content,
+    },
+    orange: {
+        background: tagTokens.tag.orange.bg,
+        content: tagTokens.tag.orange.content,
+        icon: tagTokens.tag.orange.content,
+    },
+    yellow: {
+        background: tagTokens.tag.yellow.bg,
+        content: tagTokens.tag.yellow.content,
+        icon: tagTokens.tag.yellow.content,
+    },
+    green: {
+        background: tagTokens.tag.green.bg,
+        content: tagTokens.tag.green.content,
+        icon: tagTokens.tag.green.content,
+    },
+    blue: {
+        background: tagTokens.tag.blue.bg,
+        content: tagTokens.tag.blue.content,
+        icon: tagTokens.tag.blue.content,
+    },
+    darkblue: {
+        background: tagTokens.tag.darkblue.bg,
+        content: tagTokens.tag.darkblue.content,
+        icon: tagTokens.tag.darkblue.content,
+    },
+    indigo: {
+        background: tagTokens.tag.indigo.bg,
+        content: tagTokens.tag.indigo.content,
+        icon: tagTokens.tag.indigo.content,
+    },
 };
 const SQUARE_SIZE_CONFIG = {
     xs: {

package/dist/collection/components/sd-tag/sd-tag.js

@@ -5,11 +5,14 @@ export class SdTag {
     label = '';
     icon;
     isLeft = true;
-    get resolvedConfig() {
+    get resolvedName() {
         if (!isTagName(this.name)) {
-            throw new Error(`Invalid sd-tag name: ${this.name}`);
+            throw new Error(`Invalid sd-tag name: "${this.name}"`);
         }
-        return TAG_CONFIG[this.name];
+        return this.name;
+    }
+    get resolvedConfig() {
+        return TAG_CONFIG[this.resolvedName];
     }
     renderIcon(color, size) {
         if (!this.icon)
@@ -19,7 +22,7 @@ export class SdTag {
     render() {
         const config = this.resolvedConfig;
         const iconNode = this.renderIcon(config.icon, config.iconSize);
-        return (h("span", { key: '3e7a6602ee73f56e5709711ac735460230de7e58', class: "sd-tag", style: {
+        return (h("span", { key: 'a52a06f79f448427ff3fe2a40c43d23a64e8ed62', class: "sd-tag", style: {
                 '--sd-tag-background': config.background,
                 '--sd-tag-content': config.content,
                 '--sd-tag-height': config.height,
@@ -29,7 +32,7 @@ export class SdTag {
                 '--sd-tag-font-weight': config.fontWeight,
                 '--sd-tag-line-height': config.lineHeight,
                 '--sd-tag-radius': config.radius,
-            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '8da56711cb12127f96195404799581480280507f', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
+            }, "aria-label": this.label || 'tag' }, this.icon && this.isLeft && iconNode, h("span", { key: '8e737f385a32109ab58fe4da036dbf594079f217', class: "sd-tag__label" }, this.label), this.icon && !this.isLeft && iconNode));
     }
     static get is() { return "sd-tag"; }
     static get originalStyleUrls() {
@@ -96,7 +99,7 @@ export class SdTag {
                 "mutable": false,
                 "complexType": {
                     "original": "IconName",
-                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\" | undefined",
+                    "resolved": "\"add\" | \"alert\" | \"alignKorean\" | \"archive\" | \"arrowDown\" | \"arrowLeft\" | \"arrowRight\" | \"arrowUp\" | \"attachFile\" | \"barcode\" | \"bell\" | \"board\" | \"box\" | \"camera\" | \"cancelFill\" | \"cancelOutline\" | \"caretDown\" | \"caretLeft\" | \"caretRight\" | \"caretUp\" | \"check\" | \"checkFill\" | \"checkOutline\" | \"checkboxCheck\" | \"checkboxIndeterminate\" | \"chevronDown\" | \"chevronLeft\" | \"chevronLeftEnd\" | \"chevronRight\" | \"chevronRightEnd\" | \"chevronUp\" | \"clockFill\" | \"clockOutline\" | \"close\" | \"copy\" | \"dashboard\" | \"date\" | \"download\" | \"drag\" | \"edit\" | \"etc\" | \"event\" | \"global\" | \"helpFill\" | \"helpOutline\" | \"history\" | \"imageFill\" | \"imageOutline\" | \"inline\" | \"line\" | \"location\" | \"logout\" | \"minus\" | \"new\" | \"notificationFill\" | \"notificationOutline\" | \"notion\" | \"outline\" | \"pageEdit\" | \"pageMove\" | \"pdf\" | \"print\" | \"remove\" | \"reset\" | \"robot\" | \"row\" | \"save\" | \"search\" | \"setting\" | \"star\" | \"synchronize\" | \"updown\" | \"user\" | \"visibilityOff\" | \"visibilityOn\" | \"warehouseFill\" | \"warehouseOutline\" | \"warningFill\" | \"warningOutline\" | \"youtube\" | undefined",
                     "references": {
                         "IconName": {
                             "location": "global",

package/dist/collection/components/sd-text-link/sd-text-link.css

@@ -9,6 +9,7 @@ sd-text-link .sd-text-link {
   user-select: none;
 }
 sd-text-link .sd-text-link__label {
+  font-size: var(--sd-text-link-font-size, 12px);
   text-decoration: var(--sd-text-link-text-decoration);
   color: var(--sd-text-link-color, inherit);
 }