@karmo-co/drift-kit-reference 23.18.1 → 23.19.0

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 (6) hide show
  1. package/manifest/components/sidebar.md +2 -1
  2. package/manifest/components/tag.md +1 -0
  3. package/manifest/index.json +28 -2
  4. package/manifest/setup.md +26 -26
  5. package/manifest/tokens/surface.md +5 -0
  6. package/package.json +1 -1
package/manifest/components/sidebar.md CHANGED
@@ -24,6 +24,7 @@ nav.dk-component-sidebar[data-collapsed]?
24
24
  | Attribute | Values the stylesheet styles |
25
25
  |---|---|
26
26
  | `data-bar-hidden` | (present or absent) |
27
+ | `data-bar-indicator` | (present or absent) |
27
28
  | `data-bar-shown` | (present or absent) |
28
29
  | `data-collapsed` | (present or absent) |
29
30
  | `data-current-within` | (present or absent) |
@@ -74,4 +75,4 @@ import { Sidebar } from '@karmo-co/drift-kit/react';
74
75
 
75
76
  ## Component tokens
76
77
 
77
- `--dk-component-sidebar-width`, `--dk-component-sidebar-collapsed-width`, `--dk-component-sidebar-padding-block`, `--dk-component-sidebar-padding-inline`, `--dk-component-sidebar-gap`, `--dk-component-sidebar-section-gap`, `--dk-component-sidebar-border-width`, `--dk-component-sidebar-docked-surface`, `--dk-component-sidebar-docked-border`, `--dk-component-sidebar-floating-surface`, `--dk-component-sidebar-floating-border`, `--dk-component-sidebar-floating-radius`, `--dk-component-sidebar-floating-shadow`, `--dk-component-sidebar-floating-inset`, `--dk-component-sidebar-blur`, `--dk-component-sidebar-brand-height`, `--dk-component-sidebar-head-height`, `--dk-component-sidebar-brand-mark-size`, `--dk-component-sidebar-brand-gap`, `--dk-component-sidebar-wordmark-font-family`, `--dk-component-sidebar-wordmark-font-size`, `--dk-component-sidebar-wordmark-font-weight`, `--dk-component-sidebar-wordmark-color`, `--dk-component-sidebar-divider`, `--dk-component-sidebar-item-height`, `--dk-component-sidebar-item-gap`, `--dk-component-sidebar-item-radius`, `--dk-component-sidebar-item-icon-size`, `--dk-component-sidebar-item-font-family`, `--dk-component-sidebar-item-font-size`, `--dk-component-sidebar-item-line-height`, `--dk-component-sidebar-item-font-weight`, `--dk-component-sidebar-item-text`, `--dk-component-sidebar-item-text-hover`, `--dk-component-sidebar-item-text-active`, `--dk-component-sidebar-item-surface-hover`, `--dk-component-sidebar-item-border-hover`, `--dk-component-sidebar-item-surface-active`, `--dk-component-sidebar-item-border-active`, `--dk-component-sidebar-item-text-disabled`, `--dk-component-sidebar-item-press-scale`, `--dk-component-sidebar-bar-press-scale`, `--dk-component-sidebar-focus-ring`, `--dk-component-sidebar-focus-ring-width`, `--dk-component-sidebar-current-surface`, `--dk-component-sidebar-current-surface-hover`, `--dk-component-sidebar-current-border`, `--dk-component-sidebar-current-border-hover`, `--dk-component-sidebar-current-border-active`, `--dk-component-sidebar-current-text`, `--dk-component-sidebar-menu-current-text`, `--dk-component-sidebar-menu-current-font-weight`, `--dk-component-sidebar-child-height`, `--dk-component-sidebar-child-icon-size`, `--dk-component-sidebar-child-inset`, `--dk-component-sidebar-child-gap`, `--dk-component-sidebar-child-font-weight`, `--dk-component-sidebar-guide`, `--dk-component-sidebar-guide-width`, `--dk-component-sidebar-guide-radius`, `--dk-component-sidebar-heading-font-size`, `--dk-component-sidebar-heading-line-height`, `--dk-component-sidebar-heading-font-weight`, `--dk-component-sidebar-heading-letter-spacing`, `--dk-component-sidebar-heading-color`, `--dk-component-sidebar-badge-size`, `--dk-component-sidebar-badge-font-size`, `--dk-component-sidebar-badge-font-weight`, `--dk-component-sidebar-badge-surface`, `--dk-component-sidebar-badge-text`, `--dk-component-sidebar-badge-current-surface`, `--dk-component-sidebar-badge-current-text`, `--dk-component-sidebar-dot-size`, `--dk-component-sidebar-dot-surface`, `--dk-component-sidebar-user-height`, `--dk-component-sidebar-user-avatar-size`, `--dk-component-sidebar-user-text-gap`, `--dk-component-sidebar-user-name-font-size`, `--dk-component-sidebar-user-name-font-weight`, `--dk-component-sidebar-user-name-color`, `--dk-component-sidebar-user-meta-font-size`, `--dk-component-sidebar-user-meta-color`, `--dk-component-sidebar-panel-width`, `--dk-component-sidebar-panel-padding`, `--dk-component-sidebar-panel-radius`, `--dk-component-sidebar-panel-surface`, `--dk-component-sidebar-panel-border`, `--dk-component-sidebar-panel-item-surface-hover`, `--dk-component-sidebar-panel-item-border-hover`, `--dk-component-sidebar-panel-item-border-active`, `--dk-component-sidebar-panel-title-font-size`, `--dk-component-sidebar-panel-title-font-weight`, `--dk-component-sidebar-panel-title-color`, `--dk-component-sidebar-scrollbar-size`, `--dk-component-sidebar-scrollbar-thumb`, `--dk-component-sidebar-scrollbar-thumb-hover`, `--dk-component-sidebar-duration`, `--dk-component-sidebar-easing`, `--dk-component-sidebar-rise-duration`, `--dk-component-sidebar-rise-stagger`, `--dk-component-sidebar-rise-row-stagger`, `--dk-component-sidebar-indicator-duration`, `--dk-component-sidebar-group-row-duration`, `--dk-component-sidebar-group-stagger`, `--dk-component-sidebar-group-easing`, `--dk-component-sidebar-panel-duration`, `--dk-component-sidebar-panel-easing`, `--dk-component-sidebar-panel-rows-start`, `--dk-component-sidebar-panel-row-duration`, `--dk-component-sidebar-panel-row-easing`, `--dk-component-sidebar-panel-row-beat`, `--dk-component-sidebar-panel-row-rise`, `--dk-component-sidebar-panel-row-exit-duration`, `--dk-component-sidebar-panel-row-exit-easing`, `--dk-component-sidebar-bar-height`, `--dk-component-sidebar-bar-surface`, `--dk-component-sidebar-bar-border`, `--dk-component-sidebar-bar-shadow`, `--dk-component-sidebar-bar-radius`, `--dk-component-sidebar-bar-inset`, `--dk-component-sidebar-bar-max-width`, `--dk-component-sidebar-bar-font-size`, `--dk-component-sidebar-bar-icon-size`, `--dk-component-sidebar-bar-pill-width`, `--dk-component-sidebar-bar-pill-height`, `--dk-component-sidebar-bar-current-surface`, `--dk-component-sidebar-bar-current-text`, `--dk-component-sidebar-bar-slots`, `--dk-component-sidebar-bar-z-index`, `--dk-component-sidebar-drawer-width`, `--dk-component-sidebar-drawer-shadow`, `--dk-component-sidebar-scrim`, `--dk-component-sidebar-drawer-duration`, `--dk-component-sidebar-drawer-easing`, `--dk-component-sidebar-drawer-z-index`
78
+ `--dk-component-sidebar-width`, `--dk-component-sidebar-collapsed-width`, `--dk-component-sidebar-padding-block`, `--dk-component-sidebar-padding-inline`, `--dk-component-sidebar-gap`, `--dk-component-sidebar-section-gap`, `--dk-component-sidebar-border-width`, `--dk-component-sidebar-docked-surface`, `--dk-component-sidebar-docked-border`, `--dk-component-sidebar-floating-surface`, `--dk-component-sidebar-floating-border`, `--dk-component-sidebar-floating-radius`, `--dk-component-sidebar-floating-shadow`, `--dk-component-sidebar-floating-inset`, `--dk-component-sidebar-blur`, `--dk-component-sidebar-brand-height`, `--dk-component-sidebar-head-height`, `--dk-component-sidebar-brand-mark-size`, `--dk-component-sidebar-brand-gap`, `--dk-component-sidebar-wordmark-font-family`, `--dk-component-sidebar-wordmark-font-size`, `--dk-component-sidebar-wordmark-font-weight`, `--dk-component-sidebar-wordmark-color`, `--dk-component-sidebar-divider`, `--dk-component-sidebar-item-height`, `--dk-component-sidebar-item-gap`, `--dk-component-sidebar-item-radius`, `--dk-component-sidebar-item-icon-size`, `--dk-component-sidebar-item-font-family`, `--dk-component-sidebar-item-font-size`, `--dk-component-sidebar-item-line-height`, `--dk-component-sidebar-item-font-weight`, `--dk-component-sidebar-item-text`, `--dk-component-sidebar-item-text-hover`, `--dk-component-sidebar-item-text-active`, `--dk-component-sidebar-item-surface-hover`, `--dk-component-sidebar-item-border-hover`, `--dk-component-sidebar-item-surface-active`, `--dk-component-sidebar-item-border-active`, `--dk-component-sidebar-item-text-disabled`, `--dk-component-sidebar-item-press-scale`, `--dk-component-sidebar-bar-press-scale`, `--dk-component-sidebar-focus-ring`, `--dk-component-sidebar-focus-ring-width`, `--dk-component-sidebar-current-surface`, `--dk-component-sidebar-current-surface-hover`, `--dk-component-sidebar-current-border`, `--dk-component-sidebar-current-border-hover`, `--dk-component-sidebar-current-border-active`, `--dk-component-sidebar-current-text`, `--dk-component-sidebar-menu-current-text`, `--dk-component-sidebar-menu-current-font-weight`, `--dk-component-sidebar-child-height`, `--dk-component-sidebar-child-icon-size`, `--dk-component-sidebar-child-inset`, `--dk-component-sidebar-child-gap`, `--dk-component-sidebar-child-font-weight`, `--dk-component-sidebar-guide`, `--dk-component-sidebar-guide-width`, `--dk-component-sidebar-guide-radius`, `--dk-component-sidebar-heading-font-size`, `--dk-component-sidebar-heading-line-height`, `--dk-component-sidebar-heading-font-weight`, `--dk-component-sidebar-heading-letter-spacing`, `--dk-component-sidebar-heading-color`, `--dk-component-sidebar-badge-size`, `--dk-component-sidebar-badge-font-size`, `--dk-component-sidebar-badge-font-weight`, `--dk-component-sidebar-badge-surface`, `--dk-component-sidebar-badge-text`, `--dk-component-sidebar-badge-current-surface`, `--dk-component-sidebar-badge-current-text`, `--dk-component-sidebar-dot-size`, `--dk-component-sidebar-dot-surface`, `--dk-component-sidebar-bar-dot-surface`, `--dk-component-sidebar-user-height`, `--dk-component-sidebar-user-avatar-size`, `--dk-component-sidebar-user-text-gap`, `--dk-component-sidebar-user-name-font-size`, `--dk-component-sidebar-user-name-font-weight`, `--dk-component-sidebar-user-name-color`, `--dk-component-sidebar-user-meta-font-size`, `--dk-component-sidebar-user-meta-color`, `--dk-component-sidebar-panel-width`, `--dk-component-sidebar-panel-padding`, `--dk-component-sidebar-panel-radius`, `--dk-component-sidebar-panel-surface`, `--dk-component-sidebar-panel-border`, `--dk-component-sidebar-panel-item-surface-hover`, `--dk-component-sidebar-panel-item-border-hover`, `--dk-component-sidebar-panel-item-border-active`, `--dk-component-sidebar-panel-title-font-size`, `--dk-component-sidebar-panel-title-font-weight`, `--dk-component-sidebar-panel-title-color`, `--dk-component-sidebar-scrollbar-size`, `--dk-component-sidebar-scrollbar-thumb`, `--dk-component-sidebar-scrollbar-thumb-hover`, `--dk-component-sidebar-duration`, `--dk-component-sidebar-easing`, `--dk-component-sidebar-rise-duration`, `--dk-component-sidebar-rise-stagger`, `--dk-component-sidebar-rise-row-stagger`, `--dk-component-sidebar-indicator-duration`, `--dk-component-sidebar-group-row-duration`, `--dk-component-sidebar-group-stagger`, `--dk-component-sidebar-group-easing`, `--dk-component-sidebar-panel-duration`, `--dk-component-sidebar-panel-easing`, `--dk-component-sidebar-panel-rows-start`, `--dk-component-sidebar-panel-row-duration`, `--dk-component-sidebar-panel-row-easing`, `--dk-component-sidebar-panel-row-beat`, `--dk-component-sidebar-panel-row-rise`, `--dk-component-sidebar-panel-row-exit-duration`, `--dk-component-sidebar-panel-row-exit-easing`, `--dk-component-sidebar-bar-height`, `--dk-component-sidebar-bar-surface`, `--dk-component-sidebar-bar-border`, `--dk-component-sidebar-bar-shadow`, `--dk-component-sidebar-bar-radius`, `--dk-component-sidebar-bar-inset`, `--dk-component-sidebar-bar-max-width`, `--dk-component-sidebar-bar-font-size`, `--dk-component-sidebar-bar-font-weight`, `--dk-component-sidebar-bar-line-height`, `--dk-component-sidebar-bar-icon-size`, `--dk-component-sidebar-bar-pill-width`, `--dk-component-sidebar-bar-pill-height`, `--dk-component-sidebar-bar-padding`, `--dk-component-sidebar-bar-item-gap`, `--dk-component-sidebar-bar-item-radius`, `--dk-component-sidebar-bar-item-surface-hover`, `--dk-component-sidebar-bar-item-surface-active`, `--dk-component-sidebar-bar-current-surface`, `--dk-component-sidebar-bar-current-text`, `--dk-component-sidebar-bar-slots`, `--dk-component-sidebar-bar-z-index`, `--dk-component-sidebar-drawer-width`, `--dk-component-sidebar-drawer-shadow`, `--dk-component-sidebar-scrim`, `--dk-component-sidebar-drawer-duration`, `--dk-component-sidebar-drawer-easing`, `--dk-component-sidebar-drawer-z-index`
package/manifest/components/tag.md CHANGED
@@ -19,6 +19,7 @@ span.dk-component-tag[data-status|data-hue][data-variant][data-size]
19
19
  | `data-hue` | `next1`, `next2`, `next3`, `next4`, `prev1`, `prev2`, `prev3`, `prev4`, `primary` |
20
20
  | `data-size` | `large`, `small` |
21
21
  | `data-status` | `error`, `information`, `primary`, `success`, `warning` |
22
+ | `data-theme` | `dark`, `light` |
22
23
  | `data-tone-fill` | `solid` |
23
24
  | `data-variant` | `outline`, `solid` |
24
25
 
package/manifest/index.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "schema": 1,
3
- "version": "23.18.1",
4
- "built": "2026-11-03",
3
+ "version": "23.19.0",
4
+ "built": "2026-11-04",
5
5
  "components": [
6
6
  {
7
7
  "id": "accordion",
@@ -1553,6 +1553,32 @@
1553
1553
  "components": [],
1554
1554
  "tokens": []
1555
1555
  }
1556
+ },
1557
+ "23.18.2": {
1558
+ "added": {
1559
+ "components": [],
1560
+ "tokens": [
1561
+ "--dk-surface-error-subtle-active",
1562
+ "--dk-surface-information-subtle-active",
1563
+ "--dk-surface-primary-subtle-active",
1564
+ "--dk-surface-success-subtle-active",
1565
+ "--dk-surface-warning-subtle-active"
1566
+ ]
1567
+ },
1568
+ "removed": {
1569
+ "components": [],
1570
+ "tokens": []
1571
+ }
1572
+ },
1573
+ "23.19.0": {
1574
+ "added": {
1575
+ "components": [],
1576
+ "tokens": []
1577
+ },
1578
+ "removed": {
1579
+ "components": [],
1580
+ "tokens": []
1581
+ }
1556
1582
  }
1557
1583
  }
1558
1584
  }
package/manifest/setup.md CHANGED
@@ -57,47 +57,47 @@ Both scripts are deferred, and an icon script goes after `components.js`, which
57
57
 
58
58
  ```html
59
59
  <!-- in the head -->
60
- <link rel="stylesheet" href="https://storage.googleapis.com/drift-kit-public/23.18.1/drift-kit.css" integrity="sha384-mjqSs0a+aPzmFWnRA1NL1PRyq4/eTjR3/9gRRZlI1iVswbxV2/eHzlYwXgngtDd4" crossorigin="anonymous" />
61
- <script src="https://storage.googleapis.com/drift-kit-public/23.18.1/components.js" integrity="sha384-/xFHheHPCCnCI+vzB3UvpkAMVGho3/veUGRM62SohYfqBqEUhcTVtA4mBIm93cF6" crossorigin="anonymous" defer></script>
62
- <script src="https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-<set>.js" integrity="<its integrity>" crossorigin="anonymous" defer></script>
60
+ <link rel="stylesheet" href="https://storage.googleapis.com/drift-kit-public/23.19.0/drift-kit.css" integrity="sha384-r7RGSdZAmziMKqsNzUcU99Jz1AE8L1SelSM924XRBguh23KyqTpfbI+TXXiQ/+37" crossorigin="anonymous" />
61
+ <script src="https://storage.googleapis.com/drift-kit-public/23.19.0/components.js" integrity="sha384-cjqgKeNZ8gcS0f2LjAQ483r0NHQzxi6vCajDuEWYuYqmGDhfCqF2pdAWB9d+paEy" crossorigin="anonymous" defer></script>
62
+ <script src="https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-<set>.js" integrity="<its integrity>" crossorigin="anonymous" defer></script>
63
63
  <!-- the attributes go on the body -->
64
64
  <body data-brand="karmo" data-theme="light">
65
65
  ```
66
66
 
67
67
  | File | Address | Integrity |
68
68
  |---|---|---|
69
- | `drift-kit.css` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-kit.css` | `sha384-mjqSs0a+aPzmFWnRA1NL1PRyq4/eTjR3/9gRRZlI1iVswbxV2/eHzlYwXgngtDd4` |
70
- | `drift-kit.min.css` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-kit.min.css` | `sha384-KSzRHj7Jb4ClcLGmFSWvFF3ctug+lMiJ+62xMCMZEjo9b/V/JN9KN/DegIL2jlo0` |
71
- | `components.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/components.js` | `sha384-/xFHheHPCCnCI+vzB3UvpkAMVGho3/veUGRM62SohYfqBqEUhcTVtA4mBIm93cF6` |
72
- | `drift-icons-card.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-card.js` | `sha384-Dl18Pw11QQ+/KtbAzbjt1DdP6fJwFNn4kCykxtFsF+uEZtUfMIseQJ7s14OmqEmg` |
73
- | `drift-icons-coolicon.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-coolicon.js` | `sha384-8WaBw9LZuhj/u7G2Jf1aiVo8HBhMj1fBsmpSWJnYi5Xdi2ANXB3BLBZxz2NLQGYl` |
74
- | `drift-icons-feather.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-feather.js` | `sha384-MFEltFi3gRSwgNdAMXGCYo+6Ri9iXLLWp4Gq3AeayzeliWAo3czd+pTTLAFHHU6s` |
75
- | `drift-icons-flag-circle.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-flag-circle.js` | `sha384-gtU89vOz98Fbn0KZWzkHVQA4+kFhOFYoT/Dr43ljTskqkyGDMw1ihH1I7Zn25dzZ` |
76
- | `drift-icons-flag.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-flag.js` | `sha384-VtM24IDkwASIVzD5hI+ijQYRXufYQbveKM0+wqaFSGZbrYZlodFlnvZOexhCpiH9` |
77
- | `drift-icons-lucide.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-lucide.js` | `sha384-wLKQdccKZKGXZJ9kcU8XCKyNI79EGI/7NrBVmOAlE0DZNThpyW1SY6z4j3teJLB0` |
78
- | `drift-icons-social.js` | `https://storage.googleapis.com/drift-kit-public/23.18.1/drift-icons-social.js` | `sha384-+hPy5fFjIqfIAmDN+WOwekTLu7NIFZvyzOwXUTAiBEQqnZ0/kXgd4frbSGOr/c8c` |
69
+ | `drift-kit.css` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-kit.css` | `sha384-r7RGSdZAmziMKqsNzUcU99Jz1AE8L1SelSM924XRBguh23KyqTpfbI+TXXiQ/+37` |
70
+ | `drift-kit.min.css` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-kit.min.css` | `sha384-Afy5EbY3V/YQehMXMAm6tHs+85JOj4dlCGaBbA0Ib2ezOJ7/2AYwNFzE7cPxiTM0` |
71
+ | `components.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/components.js` | `sha384-cjqgKeNZ8gcS0f2LjAQ483r0NHQzxi6vCajDuEWYuYqmGDhfCqF2pdAWB9d+paEy` |
72
+ | `drift-icons-card.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-card.js` | `sha384-Dl18Pw11QQ+/KtbAzbjt1DdP6fJwFNn4kCykxtFsF+uEZtUfMIseQJ7s14OmqEmg` |
73
+ | `drift-icons-coolicon.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-coolicon.js` | `sha384-8WaBw9LZuhj/u7G2Jf1aiVo8HBhMj1fBsmpSWJnYi5Xdi2ANXB3BLBZxz2NLQGYl` |
74
+ | `drift-icons-feather.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-feather.js` | `sha384-MFEltFi3gRSwgNdAMXGCYo+6Ri9iXLLWp4Gq3AeayzeliWAo3czd+pTTLAFHHU6s` |
75
+ | `drift-icons-flag-circle.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-flag-circle.js` | `sha384-gtU89vOz98Fbn0KZWzkHVQA4+kFhOFYoT/Dr43ljTskqkyGDMw1ihH1I7Zn25dzZ` |
76
+ | `drift-icons-flag.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-flag.js` | `sha384-VtM24IDkwASIVzD5hI+ijQYRXufYQbveKM0+wqaFSGZbrYZlodFlnvZOexhCpiH9` |
77
+ | `drift-icons-lucide.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-lucide.js` | `sha384-wLKQdccKZKGXZJ9kcU8XCKyNI79EGI/7NrBVmOAlE0DZNThpyW1SY6z4j3teJLB0` |
78
+ | `drift-icons-social.js` | `https://storage.googleapis.com/drift-kit-public/23.19.0/drift-icons-social.js` | `sha384-+hPy5fFjIqfIAmDN+WOwekTLu7NIFZvyzOwXUTAiBEQqnZ0/kXgd4frbSGOr/c8c` |
79
79
 
80
80
  ### In Claude chat and Cowork
81
81
 
82
82
  Their previews load nothing from the bucket. There, link the same version from jsdelivr instead, with these addresses and integrity: the stylesheet is `drift-kit.min.css`, and the attributes still go on `<body>`.
83
83
 
84
84
  ```html
85
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-kit.min.css" integrity="sha384-KSzRHj7Jb4ClcLGmFSWvFF3ctug+lMiJ+62xMCMZEjo9b/V/JN9KN/DegIL2jlo0" crossorigin="anonymous" />
86
- <script src="https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/components.js" integrity="sha384-mOzIzjZG4391OqvxsNIffuty6OdW3TM/JHnv6QGPqMwlFSQ81QkQ0kFAP5Iyap32" crossorigin="anonymous" defer></script>
85
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-kit.min.css" integrity="sha384-Afy5EbY3V/YQehMXMAm6tHs+85JOj4dlCGaBbA0Ib2ezOJ7/2AYwNFzE7cPxiTM0" crossorigin="anonymous" />
86
+ <script src="https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/components.js" integrity="sha384-lVVG2DI4TS/PTki929k9Pd0n9CIJL1QdHIrbynOE442xFZon7NAm03VczSBTfgB8" crossorigin="anonymous" defer></script>
87
87
  ```
88
88
 
89
89
  | File | Address | Integrity |
90
90
  |---|---|---|
91
- | `components.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/components.js` | `sha384-mOzIzjZG4391OqvxsNIffuty6OdW3TM/JHnv6QGPqMwlFSQ81QkQ0kFAP5Iyap32` |
92
- | `drift-data-countries.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-data-countries.js` | `sha384-GttgZnsRDPioKDxlsEyQtUqCwO0ObYYdjdjKBBt9LWThZld3OnUBnZ9EScI41qIf` |
93
- | `drift-icons-card.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-card.js` | `sha384-Dl18Pw11QQ+/KtbAzbjt1DdP6fJwFNn4kCykxtFsF+uEZtUfMIseQJ7s14OmqEmg` |
94
- | `drift-icons-coolicon.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-coolicon.js` | `sha384-8WaBw9LZuhj/u7G2Jf1aiVo8HBhMj1fBsmpSWJnYi5Xdi2ANXB3BLBZxz2NLQGYl` |
95
- | `drift-icons-feather.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-feather.js` | `sha384-MFEltFi3gRSwgNdAMXGCYo+6Ri9iXLLWp4Gq3AeayzeliWAo3czd+pTTLAFHHU6s` |
96
- | `drift-icons-flag-circle.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-flag-circle.js` | `sha384-gtU89vOz98Fbn0KZWzkHVQA4+kFhOFYoT/Dr43ljTskqkyGDMw1ihH1I7Zn25dzZ` |
97
- | `drift-icons-flag.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-flag.js` | `sha384-VtM24IDkwASIVzD5hI+ijQYRXufYQbveKM0+wqaFSGZbrYZlodFlnvZOexhCpiH9` |
98
- | `drift-icons-lucide.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-lucide.js` | `sha384-wLKQdccKZKGXZJ9kcU8XCKyNI79EGI/7NrBVmOAlE0DZNThpyW1SY6z4j3teJLB0` |
99
- | `drift-icons-social.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-icons-social.js` | `sha384-+hPy5fFjIqfIAmDN+WOwekTLu7NIFZvyzOwXUTAiBEQqnZ0/kXgd4frbSGOr/c8c` |
100
- | `drift-kit.min.css` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.18.1/drift-kit.min.css` | `sha384-KSzRHj7Jb4ClcLGmFSWvFF3ctug+lMiJ+62xMCMZEjo9b/V/JN9KN/DegIL2jlo0` |
91
+ | `components.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/components.js` | `sha384-lVVG2DI4TS/PTki929k9Pd0n9CIJL1QdHIrbynOE442xFZon7NAm03VczSBTfgB8` |
92
+ | `drift-data-countries.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-data-countries.js` | `sha384-GttgZnsRDPioKDxlsEyQtUqCwO0ObYYdjdjKBBt9LWThZld3OnUBnZ9EScI41qIf` |
93
+ | `drift-icons-card.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-card.js` | `sha384-Dl18Pw11QQ+/KtbAzbjt1DdP6fJwFNn4kCykxtFsF+uEZtUfMIseQJ7s14OmqEmg` |
94
+ | `drift-icons-coolicon.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-coolicon.js` | `sha384-8WaBw9LZuhj/u7G2Jf1aiVo8HBhMj1fBsmpSWJnYi5Xdi2ANXB3BLBZxz2NLQGYl` |
95
+ | `drift-icons-feather.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-feather.js` | `sha384-MFEltFi3gRSwgNdAMXGCYo+6Ri9iXLLWp4Gq3AeayzeliWAo3czd+pTTLAFHHU6s` |
96
+ | `drift-icons-flag-circle.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-flag-circle.js` | `sha384-gtU89vOz98Fbn0KZWzkHVQA4+kFhOFYoT/Dr43ljTskqkyGDMw1ihH1I7Zn25dzZ` |
97
+ | `drift-icons-flag.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-flag.js` | `sha384-VtM24IDkwASIVzD5hI+ijQYRXufYQbveKM0+wqaFSGZbrYZlodFlnvZOexhCpiH9` |
98
+ | `drift-icons-lucide.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-lucide.js` | `sha384-wLKQdccKZKGXZJ9kcU8XCKyNI79EGI/7NrBVmOAlE0DZNThpyW1SY6z4j3teJLB0` |
99
+ | `drift-icons-social.js` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-icons-social.js` | `sha384-+hPy5fFjIqfIAmDN+WOwekTLu7NIFZvyzOwXUTAiBEQqnZ0/kXgd4frbSGOr/c8c` |
100
+ | `drift-kit.min.css` | `https://cdn.jsdelivr.net/npm/@karmo-co/drift-kit-public@23.19.0/drift-kit.min.css` | `sha384-Afy5EbY3V/YQehMXMAm6tHs+85JOj4dlCGaBbA0Ib2ezOJ7/2AYwNFzE7cPxiTM0` |
101
101
 
102
102
  ### Integrity for 23.4.0
103
103
 
@@ -125,5 +125,5 @@ The behaviour script initialises every component on the page when it loads. Mark
125
125
  The kit class names the drift-critique capture script keys on, at this version. Pass them to it as `--kit '<this JSON>'` so its alignment and reduced-motion checks read this version's names.
126
126
 
127
127
  ```json
128
- {"version":"23.18.1","field":".dk-component-input__field","trigger":".dk-component-select__trigger","button":".dk-component-button","iconButton":".dk-component-icon-button","spinners":[".dk-component-loading-spinner",".dk-component-button__spinner"],"componentPrefix":"dk-component-","fieldRoot":"dk-component-input"}
128
+ {"version":"23.19.0","field":".dk-component-input__field","trigger":".dk-component-select__trigger","button":".dk-component-button","iconButton":".dk-component-icon-button","spinners":[".dk-component-loading-spinner",".dk-component-button__spinner"],"componentPrefix":"dk-component-","fieldRoot":"dk-component-input"}
129
129
  ```
package/manifest/tokens/surface.md CHANGED
@@ -42,6 +42,7 @@ Declared values, light and dark. Reference a token by name; never copy its value
42
42
  | `--dk-surface-error-mark` | `var(--dk-color-error-600)` | `var(--dk-color-error-600)` |
43
43
  | `--dk-surface-error-solid` | `var(--dk-color-error-700)` | `var(--dk-color-error-700)` |
44
44
  | `--dk-surface-error-subtle` | `var(--dk-color-error-50)` | `var(--dk-color-error-900)` |
45
+ | `--dk-surface-error-subtle-active` | `var(--dk-color-error-300)` | `var(--dk-color-error-600)` |
45
46
  | `--dk-surface-error-subtle-focus` | `var(--dk-color-error-200)` | `var(--dk-color-error-700)` |
46
47
  | `--dk-surface-error-subtle-hover` | `var(--dk-color-error-100)` | `var(--dk-color-error-800)` |
47
48
  | `--dk-surface-field-action-active` | `var(--dk-color-neutral-100)` | `var(--dk-color-neutral-700)` |
@@ -73,6 +74,7 @@ Declared values, light and dark. Reference a token by name; never copy its value
73
74
  | `--dk-surface-information-mark` | `var(--dk-color-information-600)` | `var(--dk-color-information-600)` |
74
75
  | `--dk-surface-information-solid` | `var(--dk-color-information-700)` | `var(--dk-color-information-700)` |
75
76
  | `--dk-surface-information-subtle` | `var(--dk-color-information-50)` | `var(--dk-color-information-900)` |
77
+ | `--dk-surface-information-subtle-active` | `var(--dk-color-information-300)` | `var(--dk-color-information-600)` |
76
78
  | `--dk-surface-information-subtle-focus` | `var(--dk-color-information-200)` | `var(--dk-color-information-700)` |
77
79
  | `--dk-surface-information-subtle-hover` | `var(--dk-color-information-100)` | `var(--dk-color-information-800)` |
78
80
  | `--dk-surface-inset-active` | `var(--dk-color-neutral-300)` | `var(--dk-color-neutral-500)` |
@@ -112,6 +114,7 @@ Declared values, light and dark. Reference a token by name; never copy its value
112
114
  | `--dk-surface-primary-oos` | `var(--dk-color-primary-400)` | `var(--dk-color-primary-700)` |
113
115
  | `--dk-surface-primary-solid` | `var(--dk-color-primary-700)` | `var(--dk-color-primary-700)` |
114
116
  | `--dk-surface-primary-subtle` | `var(--dk-color-primary-50)` | `var(--dk-color-primary-850)` |
117
+ | `--dk-surface-primary-subtle-active` | `var(--dk-color-primary-300)` | `var(--dk-color-primary-600)` |
115
118
  | `--dk-surface-primary-subtle-focus` | `var(--dk-color-primary-200)` | `var(--dk-color-primary-700)` |
116
119
  | `--dk-surface-primary-subtle-hover` | `var(--dk-color-primary-100)` | `var(--dk-color-primary-800)` |
117
120
  | `--dk-surface-raised-active` | `var(--dk-color-neutral-50)` | `var(--dk-color-neutral-800)` |
@@ -126,6 +129,7 @@ Declared values, light and dark. Reference a token by name; never copy its value
126
129
  | `--dk-surface-success-mark` | `var(--dk-color-primary-600)` | `var(--dk-color-primary-600)` |
127
130
  | `--dk-surface-success-solid` | `var(--dk-surface-primary-solid)` | `var(--dk-surface-primary-solid)` |
128
131
  | `--dk-surface-success-subtle` | `var(--dk-color-success-50)` | `var(--dk-color-success-900)` |
132
+ | `--dk-surface-success-subtle-active` | `var(--dk-color-success-300)` | `var(--dk-color-success-600)` |
129
133
  | `--dk-surface-success-subtle-focus` | `var(--dk-color-success-200)` | `var(--dk-color-success-700)` |
130
134
  | `--dk-surface-success-subtle-hover` | `var(--dk-color-success-100)` | `var(--dk-color-success-800)` |
131
135
  | `--dk-surface-warning-default` | `var(--dk-color-warning-500)` | `var(--dk-color-warning-600)` |
@@ -134,5 +138,6 @@ Declared values, light and dark. Reference a token by name; never copy its value
134
138
  | `--dk-surface-warning-mark` | `var(--dk-color-warning-600)` | `var(--dk-color-warning-600)` |
135
139
  | `--dk-surface-warning-solid` | `var(--dk-color-warning-700)` | `var(--dk-color-warning-700)` |
136
140
  | `--dk-surface-warning-subtle` | `var(--dk-color-warning-50)` | `var(--dk-color-warning-900)` |
141
+ | `--dk-surface-warning-subtle-active` | `var(--dk-color-warning-300)` | `var(--dk-color-warning-600)` |
137
142
  | `--dk-surface-warning-subtle-focus` | `var(--dk-color-warning-200)` | `var(--dk-color-warning-700)` |
138
143
  | `--dk-surface-warning-subtle-hover` | `var(--dk-color-warning-100)` | `var(--dk-color-warning-800)` |
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@karmo-co/drift-kit-reference",
3
- "version": "23.18.1",
3
+ "version": "23.19.0",
4
4
  "description": "Reference documentation of Karmo's private Drift design system, for Karmo's Claude skills. Documentation only.",
5
5
  "bin": {
6
6
  "drift-kit-ref": "bin/drift-kit-ref.js"