@grampro/kit 2.4.0 → 2.4.2

package/source/components/skeleton/styles.css

@@ -57,27 +57,27 @@
 
 /* Text bars are sized from the font, so a paragraph placeholder takes the
    space the paragraph will. */
-.sk-root[data-variant="text"] {
+.sk-root:where([data-variant="text"]) {
   height: var(--sk-height);
 }
-.sk-root[data-variant="text"] .sk-line {
+.sk-root:where([data-variant="text"]) .sk-line {
   height: var(--sk-height, 0.85em);
   border-radius: 4px;
 }
 
-.sk-root[data-variant="circle"] {
+.sk-root:where([data-variant="circle"]) {
   width: var(--sk-width, 40px);
   height: var(--sk-height, var(--sk-width, 40px));
 }
-.sk-root[data-variant="circle"] .sk-line {
+.sk-root:where([data-variant="circle"]) .sk-line {
   border-radius: 50%;
 }
 
-.sk-root[data-variant="rect"] {
+.sk-root:where([data-variant="rect"]) {
   height: var(--sk-height, 80px);
 }
 
-.sk-root[data-animation="pulse"] .sk-line {
+.sk-root:where([data-animation="pulse"]) .sk-line {
   animation: sk-pulse var(--sk-duration) ease-in-out infinite;
 }
 @keyframes sk-pulse {
@@ -86,11 +86,11 @@
   }
 }
 
-.sk-root[data-animation="wave"] .sk-line {
+.sk-root:where([data-animation="wave"]) .sk-line {
   position: relative;
   overflow: hidden;
 }
-.sk-root[data-animation="wave"] .sk-line::after {
+.sk-root:where([data-animation="wave"]) .sk-line::after {
   content: "";
   position: absolute;
   inset: 0;
@@ -131,10 +131,10 @@
   text-align: center;
   text-wrap: pretty;
 }
-.em-root[data-size="sm"] {
+.em-root:where([data-size="sm"]) {
   padding: 24px 16px;
 }
-.em-root[data-size="lg"] {
+.em-root:where([data-size="lg"]) {
   padding: 64px 24px;
 }
 
@@ -143,7 +143,7 @@
   margin-bottom: 4px;
   color: var(--sk-muted);
 }
-.em-root[data-size="sm"] .em-icon {
+.em-root:where([data-size="sm"]) .em-icon {
   margin-bottom: 0;
 }
 
@@ -152,7 +152,7 @@
   font-size: 1.05em;
   font-weight: 600;
 }
-.em-root[data-size="lg"] .em-title {
+.em-root:where([data-size="lg"]) .em-title {
   font-size: 1.2em;
 }
 

package/source/components/spinner/passport.json

@@ -8,7 +8,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/index.ts",
       "core/types.ts",
@@ -19,7 +19,7 @@
       "react/props.ts",
       "react/useDelayedLoading.ts"
     ],
-    "sourceHash": "sha256:2b6b8fa25750f5a491b73f37711de1beed2b1bcf9e38e2cf1b1f419d763b6c2e"
+    "sourceHash": "sha256:42ece669a14148ab88a6dccbbf495206c489f8198793daff831c0ee1d8e9ae86"
   },
   "props": [
     {

package/source/components/spinner/styles.css

@@ -88,7 +88,7 @@
 
 /* ---------------------------------------------------------------- dots */
 
-.sp-indicator[data-variant="dots"] {
+.sp-indicator:where([data-variant="dots"]) {
   grid-auto-flow: column;
   gap: calc(var(--sp-size) * 0.1);
 }

package/source/components/switch/passport.json

@@ -8,7 +8,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/index.ts",
       "core/toggle.ts",
@@ -18,7 +18,7 @@
       "react/locale.ts",
       "react/props.ts"
     ],
-    "sourceHash": "sha256:0e4b4a46e705b32ea7bf347c63743dfadb86ee1c5eedd2ae25e4e48721ad1989"
+    "sourceHash": "sha256:0681194dbbbe6c31a4930b88e98250a66cd49e0c0f4c9b12a88f6c79ffb007ca"
   },
   "props": [
     {

package/source/components/switch/styles.css

@@ -47,20 +47,20 @@
   box-sizing: border-box;
 }
 
-.sw-root[data-size="sm"] {
+.sw-root:where([data-size="sm"]) {
   --sw-height: 16px;
   --sw-width: 28px;
   --sw-gap: 2px;
   --sw-font-size: 12px;
 }
-.sw-root[data-size="lg"] {
+.sw-root:where([data-size="lg"]) {
   --sw-height: 24px;
   --sw-width: 44px;
   --sw-font-size: 14px;
 }
 
 /* The label first, the track pushed to the far edge: a settings row. */
-.sw-root[data-label-position="start"] {
+.sw-root:where([data-label-position="start"]) {
   flex-direction: row-reverse;
   justify-content: space-between;
 }

package/source/components/tabs/passport.json

@@ -12,7 +12,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/index.ts",
       "core/navigation.ts",
@@ -21,7 +21,7 @@
       "react/Tabs.tsx",
       "react/context.ts"
     ],
-    "sourceHash": "sha256:26d83e8f7ddcdcbcf8693f48d7f2769a53fdf4f38df38b64f7070c8e9cc3f9f5"
+    "sourceHash": "sha256:994b9d82745fdbaf05031dcd27a854e7b8f900f1d9058db0b8f43d13b11dbd68"
   },
   "props": [
     {

package/source/components/tabs/styles.css

@@ -55,17 +55,17 @@
   box-sizing: border-box;
 }
 
-.tb-root[data-size="sm"] {
+.tb-root:where([data-size="sm"]) {
   --tb-height: 30px;
   --tb-px: 10px;
   --tb-font-size: 12px;
 }
-.tb-root[data-size="lg"] {
+.tb-root:where([data-size="lg"]) {
   --tb-height: 44px;
   --tb-px: 16px;
   --tb-font-size: 14px;
 }
-.tb-root[data-orientation="vertical"] {
+.tb-root:where([data-orientation="vertical"]) {
   flex-direction: row;
   gap: 20px;
 }
@@ -80,7 +80,7 @@
   overflow-x: auto;
   scrollbar-width: none;
 }
-.tb-root[data-orientation="vertical"] .tb-list {
+.tb-root:where([data-orientation="vertical"]) .tb-list {
   flex-direction: column;
   overflow: visible;
 }
@@ -105,7 +105,7 @@
   cursor: pointer;
   transition: color 120ms ease;
 }
-.tb-root[data-orientation="vertical"] .tb-tab {
+.tb-root:where([data-orientation="vertical"]) .tb-tab {
   justify-content: flex-start;
 }
 .tb-tab:hover:not([aria-disabled="true"]),
@@ -161,10 +161,10 @@
 
 /* ---------------------------------------------------------------- line */
 
-.tb-root[data-variant="line"] .tb-list {
+.tb-root:where([data-variant="line"]) .tb-list {
   border-bottom: 1px solid var(--tb-border);
 }
-.tb-root[data-variant="line"] .tb-indicator {
+.tb-root:where([data-variant="line"]) .tb-indicator {
   bottom: -1px;
   left: var(--tb-indicator-start);
   width: var(--tb-indicator-size);
@@ -172,11 +172,11 @@
   border-radius: 2px;
   background: var(--tb-accent);
 }
-.tb-root[data-variant="line"][data-orientation="vertical"] .tb-list {
+.tb-root:where([data-variant="line"]):where([data-orientation="vertical"]) .tb-list {
   border-bottom: 0;
   border-inline-end: 1px solid var(--tb-border);
 }
-.tb-root[data-variant="line"][data-orientation="vertical"] .tb-indicator {
+.tb-root:where([data-variant="line"]):where([data-orientation="vertical"]) .tb-indicator {
   top: var(--tb-indicator-start);
   bottom: auto;
   left: auto;
@@ -187,7 +187,7 @@
 
 /* --------------------------------------------------------------- pills */
 
-.tb-root[data-variant="pills"] .tb-indicator {
+.tb-root:where([data-variant="pills"]) .tb-indicator {
   top: 0;
   left: var(--tb-indicator-start);
   width: var(--tb-indicator-size);
@@ -195,10 +195,10 @@
   border-radius: calc(var(--tb-radius) - 2px);
   background: var(--tb-accent-soft);
 }
-.tb-root[data-variant="pills"] .tb-tab[aria-selected="true"] {
+.tb-root:where([data-variant="pills"]) .tb-tab[aria-selected="true"] {
   color: var(--tb-accent);
 }
-.tb-root[data-variant="pills"][data-orientation="vertical"] .tb-indicator {
+.tb-root:where([data-variant="pills"]):where([data-orientation="vertical"]) .tb-indicator {
   top: var(--tb-indicator-start);
   left: 0;
   width: 100%;
@@ -207,12 +207,12 @@
 
 /* ------------------------------------------------------------ enclosed */
 
-.tb-root[data-variant="enclosed"] .tb-list {
+.tb-root:where([data-variant="enclosed"]) .tb-list {
   padding: 3px;
   border-radius: var(--tb-radius);
   background: var(--tb-track);
 }
-.tb-root[data-variant="enclosed"] .tb-indicator {
+.tb-root:where([data-variant="enclosed"]) .tb-indicator {
   top: 3px;
   bottom: 3px;
   left: var(--tb-indicator-start);
@@ -221,10 +221,10 @@
   background: var(--tb-bg);
   box-shadow: 0 1px 3px light-dark(rgb(0 0 0 / 0.12), rgb(0 0 0 / 0.5));
 }
-.tb-root[data-variant="enclosed"] .tb-tab {
+.tb-root:where([data-variant="enclosed"]) .tb-tab {
   height: calc(var(--tb-height) - 6px);
 }
-.tb-root[data-variant="enclosed"][data-orientation="vertical"] .tb-indicator {
+.tb-root:where([data-variant="enclosed"]):where([data-orientation="vertical"]) .tb-indicator {
   top: var(--tb-indicator-start);
   bottom: auto;
   left: 3px;
@@ -234,7 +234,7 @@
 }
 
 /* Before the indicator is measured (server render), mark the selected tab statically. */
-.tb-root[data-variant="line"] .tb-list:not([style*="--tb-indicator-size"]) .tb-tab[aria-selected="true"] {
+.tb-root:where([data-variant="line"]) .tb-list:not([style*="--tb-indicator-size"]) .tb-tab[aria-selected="true"] {
   box-shadow: inset 0 -2px 0 var(--tb-accent);
 }
 

package/source/components/textarea/passport.json

@@ -8,7 +8,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/count.ts",
       "core/index.ts",
@@ -19,7 +19,7 @@
       "react/locale.ts",
       "react/props.ts"
     ],
-    "sourceHash": "sha256:99fe1b42359a0d09331c6cf00b5c8d2e01fe57d9a02769637c990906ede431cf"
+    "sourceHash": "sha256:17fa3942bc38126b91bd2eacaccffbe0cb8065f7672697abb052ff85dafea6f2"
   },
   "props": [
     {

package/source/components/textarea/styles.css

@@ -46,12 +46,12 @@
   box-sizing: border-box;
 }
 
-.ta-root[data-size="sm"] {
+.ta-root:where([data-size="sm"]) {
   --ta-font-size: 12px;
   --ta-px: 8px;
   --ta-py: 6px;
 }
-.ta-root[data-size="lg"] {
+.ta-root:where([data-size="lg"]) {
   --ta-font-size: 14px;
   --ta-px: 12px;
   --ta-py: 10px;
@@ -100,16 +100,16 @@
   cursor: not-allowed;
 }
 
-.ta-input[data-resize="none"] {
+.ta-input:where([data-resize="none"]) {
   resize: none;
 }
-.ta-input[data-resize="vertical"] {
+.ta-input:where([data-resize="vertical"]) {
   resize: vertical;
 }
-.ta-input[data-resize="horizontal"] {
+.ta-input:where([data-resize="horizontal"]) {
   resize: horizontal;
 }
-.ta-input[data-resize="both"] {
+.ta-input:where([data-resize="both"]) {
   resize: both;
 }
 
@@ -118,7 +118,7 @@
  * component; `--ta-max-rows: none` makes max-height invalid, which means no limit.
  */
 @supports (field-sizing: content) {
-  .ta-input[data-autoresize] {
+  .ta-input:where([data-autoresize]) {
     field-sizing: content;
     min-height: calc(var(--ta-min-rows, 3) * 1lh + 2 * var(--ta-py) + 2px);
     max-height: calc(var(--ta-max-rows) * 1lh + 2 * var(--ta-py) + 2px);

package/source/components/toaster/passport.json

@@ -11,7 +11,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/api.ts",
       "core/index.ts",
@@ -26,7 +26,7 @@
       "react/props.ts",
       "react/useToasts.ts"
     ],
-    "sourceHash": "sha256:29756fca7fc33de05f42257fbb145017a6c507565eecb99ce06814ba404262ef"
+    "sourceHash": "sha256:9071d3b6937872ce25e6461cf3af993e512ac26ff8fa3c05121ee7ad53289035"
   },
   "props": [
     {

package/source/components/toaster/styles.css

@@ -160,16 +160,16 @@
   width: 3px;
   background: var(--ts-type-color);
 }
-.ts-toast[data-type="success"] {
+.ts-toast:where([data-type="success"]) {
   --ts-type-color: var(--ts-success);
 }
-.ts-toast[data-type="error"] {
+.ts-toast:where([data-type="error"]) {
   --ts-type-color: var(--ts-error);
 }
-.ts-toast[data-type="warning"] {
+.ts-toast:where([data-type="warning"]) {
   --ts-type-color: var(--ts-warning);
 }
-.ts-toast[data-type="info"] {
+.ts-toast:where([data-type="info"]) {
   --ts-type-color: var(--ts-info);
 }
 
@@ -180,7 +180,7 @@
   margin-top: 1px;
   color: var(--ts-type-color);
 }
-.ts-toast:is([data-type="default"], [data-type="loading"]) .ts-icon {
+.ts-toast:is(:where([data-type="default"]), :where([data-type="loading"])) .ts-icon {
   color: var(--ts-muted);
 }
 
@@ -219,12 +219,12 @@
 .ts-button:hover {
   background: var(--ts-hover);
 }
-.ts-button[data-variant="action"] {
+.ts-button:where([data-variant="action"]) {
   border-color: var(--ts-accent);
   background: var(--ts-accent);
   color: var(--ts-accent-fg);
 }
-.ts-button[data-variant="action"]:hover {
+.ts-button:where([data-variant="action"]):hover {
   background: color-mix(in oklab, var(--ts-accent), var(--ts-fg) 12%);
 }
 .ts-button:focus-visible {

package/source/components/tooltip/passport.json

@@ -8,7 +8,7 @@
     ]
   },
   "source": {
-    "libraryVersion": "2.4.0",
+    "libraryVersion": "2.4.2",
     "files": [
       "core/index.ts",
       "core/types.ts",