@juspay/svelte-ui-components 2.94.0 → 2.95.1
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.
package/dist/Table/Table.svelte
CHANGED
|
@@ -10,8 +10,6 @@
|
|
|
10
10
|
import Pagination from '../Pagination/Pagination.svelte';
|
|
11
11
|
import Select from '../Select/Select.svelte';
|
|
12
12
|
import chevronDownSmSvg from '../assets/chevron-down-sm.svg?raw';
|
|
13
|
-
import chevronUpSvg from '../assets/chevron-up.svg?raw';
|
|
14
|
-
import chevronDownSvg from '../assets/chevron-down.svg?raw';
|
|
15
13
|
import sortDefaultSvg from '../assets/sort-default.svg?raw';
|
|
16
14
|
import searchSvg from '../assets/search.svg?raw';
|
|
17
15
|
import closeSvg from '../assets/close.svg?raw';
|
|
@@ -743,18 +741,18 @@
|
|
|
743
741
|
{#if typeof sortAscIcon === 'function'}
|
|
744
742
|
{@render sortAscIcon()}
|
|
745
743
|
{:else}
|
|
746
|
-
<span class="sort-icon">
|
|
744
|
+
<span class="sort-icon sort-icon-asc">
|
|
747
745
|
<!-- eslint-disable svelte/no-at-html-tags -->
|
|
748
|
-
{@html
|
|
746
|
+
{@html sortDefaultSvg}
|
|
749
747
|
</span>
|
|
750
748
|
{/if}
|
|
751
749
|
{:else if sortColumn === colIndex && sortDirection === 'desc'}
|
|
752
750
|
{#if typeof sortDescIcon === 'function'}
|
|
753
751
|
{@render sortDescIcon()}
|
|
754
752
|
{:else}
|
|
755
|
-
<span class="sort-icon">
|
|
753
|
+
<span class="sort-icon sort-icon-desc">
|
|
756
754
|
<!-- eslint-disable svelte/no-at-html-tags -->
|
|
757
|
-
{@html
|
|
755
|
+
{@html sortDefaultSvg}
|
|
758
756
|
</span>
|
|
759
757
|
{/if}
|
|
760
758
|
{:else if typeof sortDefaultIcon === 'function'}
|
|
@@ -1324,18 +1322,47 @@
|
|
|
1324
1322
|
align-items: center;
|
|
1325
1323
|
}
|
|
1326
1324
|
|
|
1325
|
+
/* The sorted-direction half paints via currentColor; without an explicit
|
|
1326
|
+
color it inherits the Button's text color (white on the default button
|
|
1327
|
+
theme), which disappears on light headers. Default to the design
|
|
1328
|
+
system's active blue. */
|
|
1329
|
+
.sort-button :global(.sort-icon:not(.sort-icon-idle)) {
|
|
1330
|
+
color: var(--table-sort-active-color, #1b85ff);
|
|
1331
|
+
}
|
|
1332
|
+
|
|
1327
1333
|
.sort-button :global(.sort-icon svg) {
|
|
1328
1334
|
width: var(--table-sort-icon-size, 14px);
|
|
1329
1335
|
height: var(--table-sort-icon-size, 14px);
|
|
1330
1336
|
display: block;
|
|
1331
1337
|
}
|
|
1332
1338
|
|
|
1339
|
+
/* Two-tone state painting. The shared sort-default.svg asset stays
|
|
1340
|
+
color-agnostic (fill="currentColor", like every other icon asset); the
|
|
1341
|
+
state colors live here. All halves default to the inactive fill, then
|
|
1342
|
+
the sorted direction's half is released back to currentColor (the
|
|
1343
|
+
active color above). Path order in the asset is up-chevron first,
|
|
1344
|
+
down-chevron second. */
|
|
1345
|
+
.sort-button :global(.sort-icon svg path) {
|
|
1346
|
+
fill: var(--table-sort-inactive-color, #c7c7c7);
|
|
1347
|
+
}
|
|
1348
|
+
|
|
1349
|
+
.sort-button :global(.sort-icon-asc svg path:first-child),
|
|
1350
|
+
.sort-button :global(.sort-icon-desc svg path:last-child) {
|
|
1351
|
+
fill: currentColor;
|
|
1352
|
+
}
|
|
1353
|
+
|
|
1354
|
+
/* The design system draws every sort state fully opaque — faintness comes
|
|
1355
|
+
from the glyph fills (inactive halves #C7C7C7, active direction
|
|
1356
|
+
currentColor), never from transparency. The opacity vars remain for
|
|
1357
|
+
consumers that prefer a fade but now default to solid; hover steps the
|
|
1358
|
+
inactive halves to the design system's hover gray. */
|
|
1333
1359
|
.sort-button :global(.sort-icon-idle) {
|
|
1334
|
-
opacity: var(--table-sort-idle-opacity,
|
|
1360
|
+
opacity: var(--table-sort-idle-opacity, 1);
|
|
1335
1361
|
}
|
|
1336
1362
|
|
|
1337
1363
|
.sort-button:hover :global(.sort-icon-idle) {
|
|
1338
|
-
opacity: var(--table-sort-idle-hover-opacity,
|
|
1364
|
+
opacity: var(--table-sort-idle-hover-opacity, 1);
|
|
1365
|
+
--table-sort-inactive-color: var(--table-sort-hover-color, #797979);
|
|
1339
1366
|
}
|
|
1340
1367
|
|
|
1341
1368
|
/* ── Empty ──────────────────────────────────────────────────────────────── */
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg width="
|
|
2
|
-
<
|
|
3
|
-
<
|
|
1
|
+
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.64645 1.64645C5.84171 1.45118 6.15829 1.45118 6.35355 1.64645L8.85355 4.14645C9.04882 4.34171 9.04882 4.65829 8.85355 4.85355C8.65829 5.04882 8.34171 5.04882 8.14645 4.85355L6 2.70711L3.85355 4.85355C3.65829 5.04882 3.34171 5.04882 3.14645 4.85355C2.95118 4.65829 2.95118 4.34171 3.14645 4.14645L5.64645 1.64645Z" fill="currentColor"/>
|
|
3
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.14645 7.14645C3.34171 6.95118 3.65829 6.95118 3.85355 7.14645L6 9.29289L8.14645 7.14645C8.34171 6.95118 8.65829 6.95118 8.85355 7.14645C9.04882 7.34171 9.04882 7.65829 8.85355 7.85355L6.35355 10.3536C6.15829 10.5488 5.84171 10.5488 5.64645 10.3536L3.14645 7.85355C2.95118 7.65829 2.95118 7.34171 3.14645 7.14645Z" fill="currentColor"/>
|
|
4
4
|
</svg>
|