@stridge/noctis-design-tokens 1.0.0-beta.4 → 1.0.0-beta.5
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/graph/components.js +79 -0
- package/dist/tokens.css +23 -0
- package/dist/tokens.json +189 -0
- package/package.json +2 -2
package/dist/graph/components.js
CHANGED
|
@@ -1365,6 +1365,84 @@ const toolbar = {
|
|
|
1365
1365
|
}, "5rem", "Default width of a toolbar input field.", "The resting width of a `Toolbar.Input` — sized for a short value like a zoom percentage; override per use.")
|
|
1366
1366
|
]
|
|
1367
1367
|
};
|
|
1368
|
+
const pagination = {
|
|
1369
|
+
component: "pagination",
|
|
1370
|
+
category: "navigation",
|
|
1371
|
+
slotPrefix: "noctis",
|
|
1372
|
+
anatomy: [
|
|
1373
|
+
"pagination",
|
|
1374
|
+
"pagination-info",
|
|
1375
|
+
"pagination-page-size",
|
|
1376
|
+
"pagination-page",
|
|
1377
|
+
"pagination-controls",
|
|
1378
|
+
"pagination-separator"
|
|
1379
|
+
],
|
|
1380
|
+
options: { size: ["sm", "md"] },
|
|
1381
|
+
states: [],
|
|
1382
|
+
consumes: [],
|
|
1383
|
+
optionSlots: { size: "pagination" },
|
|
1384
|
+
mints: [
|
|
1385
|
+
raw("0cbc4655-bb4e-4fd5-9c04-057351efe727", {
|
|
1386
|
+
kind: "component",
|
|
1387
|
+
component: "pagination",
|
|
1388
|
+
property: "gap"
|
|
1389
|
+
}, "var(--noctis-space-3)", "Gap between the pagination's clusters.", "The spacing the pagination row holds between its info line, page-size picker, separator, page field, and controls."),
|
|
1390
|
+
raw("41dfe2e5-18e2-4197-a956-8ff5b4fe0e41", {
|
|
1391
|
+
kind: "component",
|
|
1392
|
+
component: "pagination",
|
|
1393
|
+
anatomy: "info",
|
|
1394
|
+
property: "font-size"
|
|
1395
|
+
}, "var(--noctis-text-small)", "Info line font size.", "The type size of the “Showing X–Y of Z” status line."),
|
|
1396
|
+
aliased("72cd3ff8-3ebe-4c30-9fdd-6130842a3274", {
|
|
1397
|
+
kind: "component",
|
|
1398
|
+
component: "pagination",
|
|
1399
|
+
anatomy: "info",
|
|
1400
|
+
property: "color"
|
|
1401
|
+
}, { role: "muted" }, "Info line text colour.", "The colour of the status line — the quieter muted role, since it is secondary to the controls."),
|
|
1402
|
+
raw("1282b0be-d667-4311-a247-bfb08e980d7b", {
|
|
1403
|
+
kind: "component",
|
|
1404
|
+
component: "pagination",
|
|
1405
|
+
anatomy: "page-size",
|
|
1406
|
+
property: "gap"
|
|
1407
|
+
}, "var(--noctis-space-2)", "Gap inside the page-size cluster.", "The spacing between the page-size label and its select."),
|
|
1408
|
+
raw("a907344a-4e70-4b2d-a92b-ad740a165f31", {
|
|
1409
|
+
kind: "component",
|
|
1410
|
+
component: "pagination",
|
|
1411
|
+
anatomy: "page",
|
|
1412
|
+
property: "gap"
|
|
1413
|
+
}, "var(--noctis-space-2)", "Gap inside the page field cluster.", "The spacing between the “Page” label, the page input, and the “of N” total."),
|
|
1414
|
+
raw("d501c15c-b399-4366-80fb-66b43511ca19", {
|
|
1415
|
+
kind: "component",
|
|
1416
|
+
component: "pagination",
|
|
1417
|
+
anatomy: "page",
|
|
1418
|
+
property: "inline-size"
|
|
1419
|
+
}, "3.5rem", "Width of the editable page input.", "The resting width of the page-number field, sized for a few digits; override per use for larger page counts."),
|
|
1420
|
+
aliased("d8abfead-9e96-437c-9af1-dbccf3fd34b9", {
|
|
1421
|
+
kind: "component",
|
|
1422
|
+
component: "pagination",
|
|
1423
|
+
anatomy: "page",
|
|
1424
|
+
property: "block-size"
|
|
1425
|
+
}, { raw: "var(--noctis-size-control-md)" }, "Height of the welded page input.", "The control height of the page field per size, kept level with the nav buttons beside it (the `Input` shell itself floors at `md`, so the welded field's height is pinned here); `sm` drops to `control-sm`.", { size: { sm: { raw: "var(--noctis-size-control-sm)" } } }),
|
|
1426
|
+
aliased("d5bbc9bc-de84-4050-a437-d0d864c6c2ba", {
|
|
1427
|
+
kind: "component",
|
|
1428
|
+
component: "pagination",
|
|
1429
|
+
anatomy: "separator",
|
|
1430
|
+
property: "color"
|
|
1431
|
+
}, { role: "border" }, "Colour of the divider between pagination clusters.", "The hairline separator's colour — the default border role, so it reads as a quiet rule."),
|
|
1432
|
+
raw("3f5f5f70-1e70-40e7-a05c-9b6ba5892b70", {
|
|
1433
|
+
kind: "component",
|
|
1434
|
+
component: "pagination",
|
|
1435
|
+
anatomy: "separator",
|
|
1436
|
+
property: "inline-size"
|
|
1437
|
+
}, "1px", "Thickness of the divider between pagination clusters.", "The thickness of the vertical hairline separator."),
|
|
1438
|
+
raw("9fcd3857-34b8-42e4-95af-14e2c3e65744", {
|
|
1439
|
+
kind: "component",
|
|
1440
|
+
component: "pagination",
|
|
1441
|
+
anatomy: "separator",
|
|
1442
|
+
property: "block-size"
|
|
1443
|
+
}, "1.5rem", "Height of the divider between pagination clusters.", "The height of the vertical hairline separator within the centred row.")
|
|
1444
|
+
]
|
|
1445
|
+
};
|
|
1368
1446
|
const accordion = {
|
|
1369
1447
|
component: "accordion",
|
|
1370
1448
|
category: "surfaces",
|
|
@@ -4320,6 +4398,7 @@ const COMPONENT_DECLARATIONS = [
|
|
|
4320
4398
|
buttonGroup,
|
|
4321
4399
|
tabs,
|
|
4322
4400
|
toolbar,
|
|
4401
|
+
pagination,
|
|
4323
4402
|
accordion,
|
|
4324
4403
|
toggle,
|
|
4325
4404
|
numberField,
|
package/dist/tokens.css
CHANGED
|
@@ -1701,6 +1701,29 @@
|
|
|
1701
1701
|
--_toolbar-input-height: var(--noctis-toolbar-input-height, var(--noctis-size-control-xs));
|
|
1702
1702
|
--_toolbar-input-padding-inline: var(--noctis-toolbar-input-padding-inline, var(--noctis-space-1\.5));
|
|
1703
1703
|
}
|
|
1704
|
+
[data-slot="noctis-pagination"] {
|
|
1705
|
+
--_pagination-gap: var(--noctis-pagination-gap, var(--noctis-space-3));
|
|
1706
|
+
}
|
|
1707
|
+
[data-slot="noctis-pagination-info"] {
|
|
1708
|
+
--_pagination-info-font-size: var(--noctis-pagination-info-font-size, var(--noctis-text-small));
|
|
1709
|
+
--_pagination-info-color: var(--noctis-pagination-info-color, var(--noctis-color-muted));
|
|
1710
|
+
}
|
|
1711
|
+
[data-slot="noctis-pagination-page-size"] {
|
|
1712
|
+
--_pagination-page-size-gap: var(--noctis-pagination-page-size-gap, var(--noctis-space-2));
|
|
1713
|
+
}
|
|
1714
|
+
[data-slot="noctis-pagination-page"] {
|
|
1715
|
+
--_pagination-page-gap: var(--noctis-pagination-page-gap, var(--noctis-space-2));
|
|
1716
|
+
--_pagination-page-inline-size: var(--noctis-pagination-page-inline-size, 3.5rem);
|
|
1717
|
+
--_pagination-page-block-size: var(--noctis-pagination-page-block-size, var(--noctis-size-control-md));
|
|
1718
|
+
}
|
|
1719
|
+
[data-slot="noctis-pagination-separator"] {
|
|
1720
|
+
--_pagination-separator-color: var(--noctis-pagination-separator-color, var(--noctis-color-border));
|
|
1721
|
+
--_pagination-separator-inline-size: var(--noctis-pagination-separator-inline-size, 1px);
|
|
1722
|
+
--_pagination-separator-block-size: var(--noctis-pagination-separator-block-size, 1.5rem);
|
|
1723
|
+
}
|
|
1724
|
+
[data-slot="noctis-pagination"][data-size="sm"] [data-slot="noctis-pagination-page"] {
|
|
1725
|
+
--_pagination-page-block-size: var(--noctis-pagination-page-block-size, var(--noctis-size-control-sm));
|
|
1726
|
+
}
|
|
1704
1727
|
[data-slot="noctis-accordion-trigger"] {
|
|
1705
1728
|
--_accordion-trigger-padding-inline: var(--noctis-accordion-trigger-padding-inline, 0);
|
|
1706
1729
|
--_accordion-trigger-padding-block: var(--noctis-accordion-trigger-padding-block, var(--noctis-space-4));
|
package/dist/tokens.json
CHANGED
|
@@ -8528,6 +8528,195 @@
|
|
|
8528
8528
|
}
|
|
8529
8529
|
]
|
|
8530
8530
|
},
|
|
8531
|
+
{
|
|
8532
|
+
"component": "pagination",
|
|
8533
|
+
"category": "navigation",
|
|
8534
|
+
"slotPrefix": "noctis",
|
|
8535
|
+
"anatomy": [
|
|
8536
|
+
"pagination",
|
|
8537
|
+
"pagination-info",
|
|
8538
|
+
"pagination-page-size",
|
|
8539
|
+
"pagination-page",
|
|
8540
|
+
"pagination-controls",
|
|
8541
|
+
"pagination-separator"
|
|
8542
|
+
],
|
|
8543
|
+
"options": {
|
|
8544
|
+
"size": ["sm", "md"]
|
|
8545
|
+
},
|
|
8546
|
+
"states": [],
|
|
8547
|
+
"consumes": [],
|
|
8548
|
+
"optionSlots": {
|
|
8549
|
+
"size": "pagination"
|
|
8550
|
+
},
|
|
8551
|
+
"mints": [
|
|
8552
|
+
{
|
|
8553
|
+
"uuid": "0cbc4655-bb4e-4fd5-9c04-057351efe727",
|
|
8554
|
+
"tier": "component",
|
|
8555
|
+
"name": {
|
|
8556
|
+
"kind": "component",
|
|
8557
|
+
"component": "pagination",
|
|
8558
|
+
"property": "gap"
|
|
8559
|
+
},
|
|
8560
|
+
"value": {
|
|
8561
|
+
"raw": "var(--noctis-space-3)"
|
|
8562
|
+
},
|
|
8563
|
+
"description": "Gap between the pagination's clusters.",
|
|
8564
|
+
"usage": "The spacing the pagination row holds between its info line, page-size picker, separator, page field, and controls.",
|
|
8565
|
+
"introduced": "0.0.0"
|
|
8566
|
+
},
|
|
8567
|
+
{
|
|
8568
|
+
"uuid": "41dfe2e5-18e2-4197-a956-8ff5b4fe0e41",
|
|
8569
|
+
"tier": "component",
|
|
8570
|
+
"name": {
|
|
8571
|
+
"kind": "component",
|
|
8572
|
+
"component": "pagination",
|
|
8573
|
+
"anatomy": "info",
|
|
8574
|
+
"property": "font-size"
|
|
8575
|
+
},
|
|
8576
|
+
"value": {
|
|
8577
|
+
"raw": "var(--noctis-text-small)"
|
|
8578
|
+
},
|
|
8579
|
+
"description": "Info line font size.",
|
|
8580
|
+
"usage": "The type size of the “Showing X–Y of Z” status line.",
|
|
8581
|
+
"introduced": "0.0.0"
|
|
8582
|
+
},
|
|
8583
|
+
{
|
|
8584
|
+
"uuid": "72cd3ff8-3ebe-4c30-9fdd-6130842a3274",
|
|
8585
|
+
"tier": "component",
|
|
8586
|
+
"name": {
|
|
8587
|
+
"kind": "component",
|
|
8588
|
+
"component": "pagination",
|
|
8589
|
+
"anatomy": "info",
|
|
8590
|
+
"property": "color"
|
|
8591
|
+
},
|
|
8592
|
+
"value": {
|
|
8593
|
+
"role": "muted"
|
|
8594
|
+
},
|
|
8595
|
+
"description": "Info line text colour.",
|
|
8596
|
+
"usage": "The colour of the status line — the quieter muted role, since it is secondary to the controls.",
|
|
8597
|
+
"introduced": "0.0.0"
|
|
8598
|
+
},
|
|
8599
|
+
{
|
|
8600
|
+
"uuid": "1282b0be-d667-4311-a247-bfb08e980d7b",
|
|
8601
|
+
"tier": "component",
|
|
8602
|
+
"name": {
|
|
8603
|
+
"kind": "component",
|
|
8604
|
+
"component": "pagination",
|
|
8605
|
+
"anatomy": "page-size",
|
|
8606
|
+
"property": "gap"
|
|
8607
|
+
},
|
|
8608
|
+
"value": {
|
|
8609
|
+
"raw": "var(--noctis-space-2)"
|
|
8610
|
+
},
|
|
8611
|
+
"description": "Gap inside the page-size cluster.",
|
|
8612
|
+
"usage": "The spacing between the page-size label and its select.",
|
|
8613
|
+
"introduced": "0.0.0"
|
|
8614
|
+
},
|
|
8615
|
+
{
|
|
8616
|
+
"uuid": "a907344a-4e70-4b2d-a92b-ad740a165f31",
|
|
8617
|
+
"tier": "component",
|
|
8618
|
+
"name": {
|
|
8619
|
+
"kind": "component",
|
|
8620
|
+
"component": "pagination",
|
|
8621
|
+
"anatomy": "page",
|
|
8622
|
+
"property": "gap"
|
|
8623
|
+
},
|
|
8624
|
+
"value": {
|
|
8625
|
+
"raw": "var(--noctis-space-2)"
|
|
8626
|
+
},
|
|
8627
|
+
"description": "Gap inside the page field cluster.",
|
|
8628
|
+
"usage": "The spacing between the “Page” label, the page input, and the “of N” total.",
|
|
8629
|
+
"introduced": "0.0.0"
|
|
8630
|
+
},
|
|
8631
|
+
{
|
|
8632
|
+
"uuid": "d501c15c-b399-4366-80fb-66b43511ca19",
|
|
8633
|
+
"tier": "component",
|
|
8634
|
+
"name": {
|
|
8635
|
+
"kind": "component",
|
|
8636
|
+
"component": "pagination",
|
|
8637
|
+
"anatomy": "page",
|
|
8638
|
+
"property": "inline-size"
|
|
8639
|
+
},
|
|
8640
|
+
"value": {
|
|
8641
|
+
"raw": "3.5rem"
|
|
8642
|
+
},
|
|
8643
|
+
"description": "Width of the editable page input.",
|
|
8644
|
+
"usage": "The resting width of the page-number field, sized for a few digits; override per use for larger page counts.",
|
|
8645
|
+
"introduced": "0.0.0"
|
|
8646
|
+
},
|
|
8647
|
+
{
|
|
8648
|
+
"uuid": "d8abfead-9e96-437c-9af1-dbccf3fd34b9",
|
|
8649
|
+
"tier": "component",
|
|
8650
|
+
"name": {
|
|
8651
|
+
"kind": "component",
|
|
8652
|
+
"component": "pagination",
|
|
8653
|
+
"anatomy": "page",
|
|
8654
|
+
"property": "block-size"
|
|
8655
|
+
},
|
|
8656
|
+
"value": {
|
|
8657
|
+
"raw": "var(--noctis-size-control-md)"
|
|
8658
|
+
},
|
|
8659
|
+
"description": "Height of the welded page input.",
|
|
8660
|
+
"usage": "The control height of the page field per size, kept level with the nav buttons beside it (the `Input` shell itself floors at `md`, so the welded field's height is pinned here); `sm` drops to `control-sm`.",
|
|
8661
|
+
"introduced": "0.0.0",
|
|
8662
|
+
"variants": {
|
|
8663
|
+
"size": {
|
|
8664
|
+
"sm": {
|
|
8665
|
+
"raw": "var(--noctis-size-control-sm)"
|
|
8666
|
+
}
|
|
8667
|
+
}
|
|
8668
|
+
}
|
|
8669
|
+
},
|
|
8670
|
+
{
|
|
8671
|
+
"uuid": "d5bbc9bc-de84-4050-a437-d0d864c6c2ba",
|
|
8672
|
+
"tier": "component",
|
|
8673
|
+
"name": {
|
|
8674
|
+
"kind": "component",
|
|
8675
|
+
"component": "pagination",
|
|
8676
|
+
"anatomy": "separator",
|
|
8677
|
+
"property": "color"
|
|
8678
|
+
},
|
|
8679
|
+
"value": {
|
|
8680
|
+
"role": "border"
|
|
8681
|
+
},
|
|
8682
|
+
"description": "Colour of the divider between pagination clusters.",
|
|
8683
|
+
"usage": "The hairline separator's colour — the default border role, so it reads as a quiet rule.",
|
|
8684
|
+
"introduced": "0.0.0"
|
|
8685
|
+
},
|
|
8686
|
+
{
|
|
8687
|
+
"uuid": "3f5f5f70-1e70-40e7-a05c-9b6ba5892b70",
|
|
8688
|
+
"tier": "component",
|
|
8689
|
+
"name": {
|
|
8690
|
+
"kind": "component",
|
|
8691
|
+
"component": "pagination",
|
|
8692
|
+
"anatomy": "separator",
|
|
8693
|
+
"property": "inline-size"
|
|
8694
|
+
},
|
|
8695
|
+
"value": {
|
|
8696
|
+
"raw": "1px"
|
|
8697
|
+
},
|
|
8698
|
+
"description": "Thickness of the divider between pagination clusters.",
|
|
8699
|
+
"usage": "The thickness of the vertical hairline separator.",
|
|
8700
|
+
"introduced": "0.0.0"
|
|
8701
|
+
},
|
|
8702
|
+
{
|
|
8703
|
+
"uuid": "9fcd3857-34b8-42e4-95af-14e2c3e65744",
|
|
8704
|
+
"tier": "component",
|
|
8705
|
+
"name": {
|
|
8706
|
+
"kind": "component",
|
|
8707
|
+
"component": "pagination",
|
|
8708
|
+
"anatomy": "separator",
|
|
8709
|
+
"property": "block-size"
|
|
8710
|
+
},
|
|
8711
|
+
"value": {
|
|
8712
|
+
"raw": "1.5rem"
|
|
8713
|
+
},
|
|
8714
|
+
"description": "Height of the divider between pagination clusters.",
|
|
8715
|
+
"usage": "The height of the vertical hairline separator within the centred row.",
|
|
8716
|
+
"introduced": "0.0.0"
|
|
8717
|
+
}
|
|
8718
|
+
]
|
|
8719
|
+
},
|
|
8531
8720
|
{
|
|
8532
8721
|
"component": "accordion",
|
|
8533
8722
|
"category": "surfaces",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stridge/noctis-design-tokens",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
30
|
"zod": "4.4.3",
|
|
31
|
-
"@stridge/noctis-theme-engine": "1.0.0-beta.
|
|
31
|
+
"@stridge/noctis-theme-engine": "1.0.0-beta.5"
|
|
32
32
|
},
|
|
33
33
|
"peerDependencies": {
|
|
34
34
|
"react": "19.2.7"
|