ionbase-ui 0.47.0 → 0.51.0

package/dist/meta/index.json

@@ -1,6 +1,6 @@
 {
   "package": "ionbase-ui",
-  "version": "0.47.0",
+  "version": "0.51.0",
   "usage": "Pick a component here, then read dist/meta/<Name>.json for its full contract.",
   "hooks": [
     "useToast"
@@ -416,6 +416,23 @@
       "detail": "dist/meta/NavItem.json",
       "hasIntent": true
     },
+    "Pagination": {
+      "summary": "Page navigation for a table or list. Renders prev/next arrows, a truncated run of page numbers, and an optional rows-per-page Select.",
+      "status": "stable",
+      "variants": {
+        "type": [
+          "numbered",
+          "simple"
+        ],
+        "size": [
+          "sm",
+          "md",
+          "lg"
+        ]
+      },
+      "detail": "dist/meta/Pagination.json",
+      "hasIntent": true
+    },
     "PhoneInput": {
       "summary": "A dial-code block butted against an Input, sharing one outline. It does not pick countries.",
       "status": "stable",
@@ -604,6 +621,27 @@
       "detail": "dist/meta/Tabs.json",
       "hasIntent": true
     },
+    "Textarea": {
+      "summary": "A multi-line text field. Every size and state is Input's; it wraps and it resizes vertically.",
+      "status": "stable",
+      "variants": {
+        "size": [
+          "sm",
+          "md",
+          "lg"
+        ],
+        "autoCapitalize": [
+          "none",
+          "off",
+          "on",
+          "sentences",
+          "words",
+          "characters"
+        ]
+      },
+      "detail": "dist/meta/Textarea.json",
+      "hasIntent": true
+    },
     "Toast": {
       "summary": "A transient notification on neutral chrome. Intent is carried by the icon, not by a tinted panel.",
       "status": "stable",

package/dist/meta/pageItems.json

@@ -0,0 +1,16 @@
+{
+  "name": "pageItems",
+  "source": "src/components/Pagination.tsx",
+  "propsType": null,
+  "description": "Which page numbers to draw, and where the runs are broken.\n\nExported for tests: truncation is the only real logic in this component, and\nthe failure mode is a pager that renders a gap marker with nothing behind it\n— an ellipsis standing in for exactly one page, which is both a lie and a\ncell the user cannot click to reach a page they can see the number of.\n\nThe rule that prevents it: a gap is only drawn where it replaces TWO or more\npages. `left > 2` rather than `left > 1`, and the mirror on the right.",
+  "import": "import { pageItems } from 'ionbase-ui';",
+  "stylesheet": null,
+  "tokens": [],
+  "props": {},
+  "propCounts": {
+    "own": 0,
+    "aria": 0,
+    "dom": 0,
+    "other": 0
+  }
+}

package/dist/meta/patterns/index.json

@@ -1,6 +1,6 @@
 {
   "package": "ionbase-ui",
-  "version": "0.47.0",
+  "version": "0.51.0",
   "usage": "A pattern is a documented composition of components, not a component. Read one here, then read the contracts of what it composes.",
   "patterns": {
     "AgentRun": {

package/dist/styles/index.css

@@ -32,6 +32,7 @@
 @import url('./alert.css');
 @import url('./badge.css');
 @import url('./input.css');
+@import url('./textarea.css');
 @import url('./phone-input.css');
 @import url('./select.css');
 @import url('./checkbox.css');
@@ -43,6 +44,7 @@
 @import url('./header.css');
 @import url('./logo.css');
 @import url('./table.css');
+@import url('./pagination.css');
 @import url('./divider.css');
 @import url('./link.css');
 @import url('./modal.css');

package/dist/styles/input.css

@@ -21,10 +21,12 @@
  *    padding box, so `padding-x: 12px` would put the text at 13px. The border
  *    width is subtracted back out — the same correction Badge and Tabs needed.
  *
- *    This also makes the focus state free: Figma's focus ring is a 2px inside
- *    stroke, which eats 1px further into the padding and leaves the text
- *    exactly where it was. Subtracting the live border width reproduces that,
- *    so nothing shifts when the field takes focus.
+ *    The subtraction is against the LIVE border width, which used to matter:
+ *    focus was a 2px inside stroke that ate a further 1px of padding, and
+ *    subtracting it kept the text from shifting. Every state is 1px as of
+ *    5 Sep 2026, so the correction is now constant — but it stays written this
+ *    way, because it is correct either way and the next state to need a
+ *    different width gets it for free.
  */
 .ion-input {
   /*
@@ -172,9 +174,10 @@
  * hover -> focus -> invalid -> read-only -> disabled.
  *
  * Invalid sits after focus and overrides the colour only, never the width. A
- * focused invalid field therefore keeps the 2px ring but shows it in the error
- * colour, which is both states being true at once rather than one masking the
- * other.
+ * focused invalid field therefore shows the error colour rather than the focus
+ * colour — both states are true at once and the more urgent one is shown. That
+ * ordering mattered more when the two differed in width as well; it is still
+ * the behaviour, and still deliberate.
  */
 
 /*
@@ -192,23 +195,39 @@
   border-color: var(--border-strong);
 }
 
+/*
+ * 1px, not the 2px this used to carry. See the note on --invalid below: both
+ * states were thinned on the same design call, and the trade is the same one.
+ */
 .ion-input:focus-within,
 .ion-input[data-focused='true'] {
-  --ion-input-border-width: var(--border-width-thick);
-
   border-color: var(--border-focus);
 }
 
 /*
- * 2px, matching Focus and matching Select. At 1px the invalid state differed
- * from default only in hue, which is the exact failure mode WCAG 1.4.1 is
- * about — error has to be perceivable without relying on colour alone.
- * Reconciled in Figma; Input was the one that was wrong.
+ * 1px. THIS COMMENT USED TO ARGUE FOR 2px AND THE ARGUMENT WAS SOUND, so read
+ * it before changing anything back:
+ *
+ *   "2px, matching Focus and matching Select. At 1px the invalid state differed
+ *    from default only in hue, which is the exact failure mode WCAG 1.4.1 is
+ *    about — error has to be perceivable without relying on colour alone.
+ *    Reconciled in Figma; Input was the one that was wrong."
+ *
+ * That defect was found once and fixed once, and thinning the border reopens
+ * it: an invalid field now differs from a default field by hue alone. It was
+ * changed on an explicit design call on 5 Sep 2026, applied to Input and
+ * Textarea and to their Figma sets, and it is recorded here rather than left to
+ * look like drift.
+ *
+ * Select, Checkbox, Radio, Tabs and Menu still carry border-width/thick, so
+ * these two are deliberately out of step with the rest of the system.
+ *
+ * IF THE ERROR STATE NEEDS A NON-COLOUR CUE AGAIN, this is the decision to
+ * revisit — and an icon or a message would satisfy 1.4.1 without the border,
+ * which is the better fix than putting the 2px back.
  */
 .ion-input--invalid,
 .ion-input[data-invalid='true'] {
-  --ion-input-border-width: var(--border-width-thick);
-
   border-color: var(--border-error-strong);
 }
 

package/dist/styles/pagination.css

@@ -0,0 +1,170 @@
+/*
+ * Pagination
+ *
+ * Geometry measured from Figma `Pagination Item` (1283:289) and `Pagination`
+ * (1291:503), designed 5 Sep 2026. Two Figma sets, one exported component: the
+ * item is an internal part, not something a caller composes, so it is not in
+ * the public API. See the `unmapped` note in figma/mapping.json.
+ *
+ * Size is a set of slots defaulting to medium — the same shape tabs.css uses.
+ * A size modifier reassigns five variables rather than restating five rules,
+ * which is why the item, the icon and the summary all resize from one class.
+ *
+ *   sm   32   type/body-sm   icon 14
+ *   md   40   type/body      icon 20
+ *   lg   48   type/body-lg   icon 24
+ *
+ * THE CELL IS NOT A FIXED SQUARE, AND FIGMA'S IS.
+ *
+ * Figma binds width AND height to the same spacing token, because a Figma
+ * variant has to pick a number and `1` is what fits in the frame. A real pager
+ * reaches three and four digits, and a fixed 40px box either clips `1024` or
+ * pads every single-digit cell to fit the widest one that might occur. So the
+ * height is the token and the width is a MINIMUM — the cell is square until the
+ * number outgrows it, then it grows. Do not "fix" this back to a square to
+ * match the Figma frame; the frame is the constraint, not the intent.
+ */
+
+.ion-pagination {
+  --ion-pagination-box: var(--spacing-40);
+  --ion-pagination-gap: var(--spacing-8);
+  --ion-pagination-font-size: var(--type-body);
+  --ion-pagination-line-height: var(--type-body-line-height);
+  --ion-pagination-icon: var(--icon-size-md);
+
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--spacing-16);
+}
+
+.ion-pagination--sm {
+  --ion-pagination-box: var(--spacing-32);
+  --ion-pagination-gap: var(--spacing-6);
+  --ion-pagination-font-size: var(--type-body-sm);
+  --ion-pagination-line-height: var(--type-body-sm-line-height);
+  --ion-pagination-icon: var(--icon-size-xs);
+}
+
+.ion-pagination--lg {
+  --ion-pagination-box: var(--spacing-48);
+  --ion-pagination-font-size: var(--type-body-lg);
+  --ion-pagination-line-height: var(--type-body-lg-line-height);
+  --ion-pagination-icon: var(--icon-size-lg);
+}
+
+/*
+ * With no page-size slot there is nothing to sit opposite, and
+ * `space-between` would pin a lone control group to the left edge of whatever
+ * contains it. Ending the row is what the component means in that case.
+ */
+.ion-pagination--no-page-size {
+  justify-content: flex-end;
+}
+
+.ion-pagination__page-size {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-8);
+}
+
+.ion-pagination__controls {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-4);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+/* The cell. A button for pages and arrows; a span for the ellipsis. */
+.ion-pagination__item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  min-width: var(--ion-pagination-box);
+  height: var(--ion-pagination-box);
+  padding: 0 var(--spacing-4);
+  border: 0;
+  border-radius: var(--radius-md);
+  background-color: transparent;
+  color: var(--text-tertiary);
+  font-family: var(--font-family-sans);
+  font-size: var(--ion-pagination-font-size);
+  line-height: var(--ion-pagination-line-height);
+  font-weight: var(--font-weight-medium);
+  cursor: pointer;
+  transition:
+    background-color var(--ion-duration-base) var(--ion-ease-out),
+    color var(--ion-duration-base) var(--ion-ease-out);
+}
+
+.ion-pagination__item[data-hovered] {
+  background-color: var(--surface-hover);
+  color: var(--text-default);
+}
+
+/*
+ * SELECTED IS `surface/selected`, NOT THE `surface/default` TABS USES.
+ *
+ * A Tabs pill sits on a `surface/muted` track, so `surface/default` reads as a
+ * raised chip against it. Pagination has no track: on a `surface/default` card
+ * the current page would be the same colour as the thing behind it, and the one
+ * cell that must be unmistakable would be the only invisible one.
+ */
+.ion-pagination__item[data-selected] {
+  background-color: var(--surface-selected);
+  color: var(--text-default);
+}
+
+.ion-pagination__item[data-selected][data-hovered] {
+  background-color: var(--surface-selected-hover);
+}
+
+.ion-pagination__item[data-disabled] {
+  color: var(--text-disabled);
+  cursor: not-allowed;
+}
+
+.ion-pagination__item[data-focused] {
+  outline: var(--border-width-thick) solid var(--border-focus);
+  outline-offset: var(--spacing-2);
+}
+
+.ion-pagination__icon {
+  width: var(--ion-pagination-icon);
+  height: var(--ion-pagination-icon);
+  flex-shrink: 0;
+}
+
+/*
+ * The truncation marker. Not a button and not focusable — it is the absence of
+ * pages, and giving it a tab stop would put a control in the sequence that does
+ * nothing when activated. `aria-hidden` in the TSX keeps it out of the
+ * announcement too; the surrounding numbers already say what was skipped.
+ */
+.ion-pagination__ellipsis {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: var(--ion-pagination-box);
+  height: var(--ion-pagination-box);
+  color: var(--text-tertiary);
+}
+
+.ion-pagination__summary {
+  padding: 0 var(--spacing-8);
+  color: var(--text-secondary);
+  font-family: var(--font-family-sans);
+  font-size: var(--ion-pagination-font-size);
+  line-height: var(--ion-pagination-line-height);
+  font-weight: var(--font-weight-regular);
+  white-space: nowrap;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ion-pagination__item {
+    transition: none;
+  }
+}

package/dist/styles/textarea.css

@@ -0,0 +1,178 @@
+/*
+ * Textarea
+ *
+ * Measured from Figma `Textarea` (1301:334). Three sizes x seven states, and
+ * every one of them is Input's — a textarea is an input that wrapped. If the
+ * two ever diverge it should be because a design said so, not because one
+ * drifted; the shared vocabulary is the point.
+ *
+ * THE HEIGHT IS DERIVED, NOT TYPED
+ *
+ * Figma's frame hugs a three-line text node, so the box height falls out of
+ * bound padding and a bound line-height rather than a number someone picked:
+ *
+ *   sm   3 x 20 + 2 x 6   =  72
+ *   md   3 x 24 + 2 x 8   =  88
+ *   lg   3 x 24 + 2 x 12  =  96
+ *
+ * `rows={3}` reproduces that in the browser for free, and it keeps working when
+ * the type ramp moves. Do not replace it with a fixed `height` — that would
+ * pin the box while the text inside it kept scaling.
+ *
+ * THE RESIZE GRIP IS THE BROWSER'S, AND THIS FILE MUST NOT DRAW ONE
+ *
+ * `resize: vertical` makes the browser paint the two-diagonal grip in the
+ * bottom-right corner. Figma draws that grip too, at border/stronger — but as
+ * documentation of a native control, not as a spec for one. The native grip
+ * cannot be styled, so a custom one here would not replace it; it would sit
+ * beside it and every field would have two.
+ *
+ * Horizontal resize is off deliberately: a field that can grow wider than its
+ * container breaks the layout around it, and no design here asks for it.
+ */
+
+.ion-textarea {
+  --ion-textarea-padding-x: var(--spacing-12);
+  --ion-textarea-padding-y: var(--spacing-8);
+  --ion-textarea-radius: var(--radius-md);
+  --ion-textarea-font-size: var(--type-body);
+  --ion-textarea-line-height: var(--type-body-line-height);
+  --ion-textarea-border-width: var(--border-width-default);
+
+  display: block;
+  width: 100%;
+  box-sizing: border-box;
+
+  /*
+   * Same correction Input makes, and for the same reason: Figma draws its
+   * stroke INSIDE the frame so padding is measured from the outer edge, while a
+   * CSS border sits outside the padding box. Subtracting the live border width
+   * puts the text where Figma puts it.
+   */
+  padding: var(--ion-textarea-padding-y)
+    calc(var(--ion-textarea-padding-x) - var(--ion-textarea-border-width));
+  background-color: var(--surface-default);
+  border-style: solid;
+  border-width: var(--ion-textarea-border-width);
+  border-color: var(--border-default);
+  border-radius: var(--ion-textarea-radius);
+  color: var(--text-secondary);
+  font-family: var(--font-family-sans);
+  font-size: var(--ion-textarea-font-size);
+  line-height: var(--ion-textarea-line-height);
+  font-weight: var(--font-weight-regular);
+  resize: vertical;
+  transition:
+    border-color var(--ion-duration-base) var(--ion-ease-out),
+    background-color var(--ion-duration-base) var(--ion-ease-out);
+}
+
+.ion-textarea--sm {
+  --ion-textarea-padding-y: var(--spacing-6);
+  --ion-textarea-radius: var(--radius-sm);
+  --ion-textarea-font-size: var(--type-body-sm);
+  --ion-textarea-line-height: var(--type-body-sm-line-height);
+}
+
+/* Large keeps Medium's radius and type ramp — only padding grows, as on Input. */
+.ion-textarea--lg {
+  --ion-textarea-padding-x: var(--spacing-16);
+  --ion-textarea-padding-y: var(--spacing-12);
+}
+
+/*
+ * Figma's Filled state differs from Default only in the value colour, which is
+ * exactly the placeholder distinction — so it needs no variant, the same
+ * resolution input.css reached.
+ *
+ * text/tertiary, and THERE IS NO LONGER A text/placeholder TO REACH FOR.
+ *
+ * The role read 2.38:1 in Light and 2.33:1 in Dark against the 4.5 SC 1.4.3
+ * asks, and the criterion does not exempt placeholder text. Writing this file
+ * against the Figma binding failed 14 contrast pairings immediately, which is
+ * how the defect surfaced at all: no stylesheet had ever used the role, so
+ * nothing measured it. It was retired from Figma and the export on 5 Sep 2026
+ * rather than exempted, and Input's six bindings moved here too.
+ *
+ * Base Web makes the same call — `inputPlaceholder` points at `contentTertiary`
+ * and there is no placeholder colour. Carbon keeps one, at 2.38:1, and has an
+ * open issue about it.
+ */
+.ion-textarea::placeholder {
+  color: var(--text-tertiary);
+  opacity: 1;
+}
+
+/*
+ * State order is deliberate and equal-specificity, so later rules win:
+ * hover -> focus -> invalid -> read-only -> disabled.
+ */
+
+/*
+ * Hover is declared twice, as on Input and Button. Native `:hover` latches on
+ * touch until you tap elsewhere; `[data-hovered]` comes from React Aria's
+ * useHover, which is pointer-aware. The media query keeps this working without
+ * React.
+ */
+@media (hover: hover) {
+  .ion-textarea:hover {
+    border-color: var(--border-strong);
+  }
+}
+
+.ion-textarea[data-hovered='true'] {
+  border-color: var(--border-strong);
+}
+
+.ion-textarea:focus,
+.ion-textarea[data-focused='true'] {
+  border-color: var(--border-focus);
+  outline: none;
+}
+
+/*
+ * 1px, matching Input as of 0.49.0. Input's stylesheet carries the full note:
+ * this width used to be 2px so the error state would not rest on hue alone,
+ * which is what WCAG 1.4.1 asks. It was thinned on an explicit design call, and
+ * an icon or a message is the better way to restore that cue.
+ */
+.ion-textarea--invalid,
+.ion-textarea[data-invalid='true'] {
+  border-color: var(--border-error-strong);
+}
+
+/*
+ * Read-only keeps the value legible but drops the field out of the editable
+ * palette — page surface, subtle border. It stays resizable, which is what the
+ * browser does and what the Figma set shows.
+ */
+.ion-textarea--readonly,
+.ion-textarea[data-readonly='true'] {
+  background-color: var(--surface-page);
+  border-color: var(--border-subtle);
+}
+
+/*
+ * Disabled turns resize off. A disabled textarea cannot be resized in any
+ * browser and none of them draw the grip on one, so `resize: none` here is
+ * matching the platform rather than making a choice.
+ */
+.ion-textarea:disabled,
+.ion-textarea[data-disabled='true'] {
+  background-color: var(--surface-disabled);
+  border-color: var(--border-disabled);
+  color: var(--text-disabled);
+  cursor: not-allowed;
+  resize: none;
+}
+
+.ion-textarea:disabled::placeholder,
+.ion-textarea[data-disabled='true']::placeholder {
+  color: var(--text-disabled);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ion-textarea {
+    transition: none;
+  }
+}

package/dist/styles/tokens/base.css

@@ -305,7 +305,6 @@
   --text-default: #131923;
   --text-secondary: #384252;
   --text-tertiary: #4b5563;
-  --text-placeholder: #9ca3b0;
   --text-disabled: #6b7280;
   --text-on-color: #ffffff;
   --text-inverse: #f6f8f9;

package/dist/styles/tokens/theme-dark.css

@@ -6,7 +6,6 @@
   --text-default: #f6f8f9;
   --text-secondary: #dde0e4;
   --text-tertiary: #9ca3b0;
-  --text-placeholder: #4b5563;
   --text-inverse: #131923;
   --text-primary: #9fd5f9;
   --text-error: #ffadad;

package/dist/tokens/index.d.ts

@@ -36,7 +36,6 @@ export declare const ui: {
     readonly 'text/default': "var(--text-default)";
     readonly 'text/secondary': "var(--text-secondary)";
     readonly 'text/tertiary': "var(--text-tertiary)";
-    readonly 'text/placeholder': "var(--text-placeholder)";
     readonly 'text/disabled': "var(--text-disabled)";
     readonly 'text/on-color': "var(--text-on-color)";
     readonly 'text/inverse': "var(--text-inverse)";
@@ -510,7 +509,6 @@ export declare const tokens: {
         readonly 'text/default': "var(--text-default)";
         readonly 'text/secondary': "var(--text-secondary)";
         readonly 'text/tertiary': "var(--text-tertiary)";
-        readonly 'text/placeholder': "var(--text-placeholder)";
         readonly 'text/disabled': "var(--text-disabled)";
         readonly 'text/on-color': "var(--text-on-color)";
         readonly 'text/inverse': "var(--text-inverse)";
@@ -1118,10 +1116,6 @@ export declare const tokenValues: {
         readonly Light: "{neutral.600}";
         readonly Dark: "{neutral.400}";
     };
-    readonly "text/placeholder": {
-        readonly Light: "{neutral.400}";
-        readonly Dark: "{neutral.600}";
-    };
     readonly "text/disabled": {
         readonly Light: "{neutral.500}";
         readonly Dark: "{neutral.500}";

package/dist/tokens/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tokens/index.ts"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgjDd,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tokens/index.ts"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4iDd,CAAC"}

package/dist/tokens/index.js

@@ -38,7 +38,6 @@ export const ui = {
     'text/default': 'var(--text-default)',
     'text/secondary': 'var(--text-secondary)',
     'text/tertiary': 'var(--text-tertiary)',
-    'text/placeholder': 'var(--text-placeholder)',
     'text/disabled': 'var(--text-disabled)',
     'text/on-color': 'var(--text-on-color)',
     'text/inverse': 'var(--text-inverse)',
@@ -640,10 +639,6 @@ export const tokenValues = {
         "Light": "{neutral.600}",
         "Dark": "{neutral.400}"
     },
-    "text/placeholder": {
-        "Light": "{neutral.400}",
-        "Dark": "{neutral.600}"
-    },
     "text/disabled": {
         "Light": "{neutral.500}",
         "Dark": "{neutral.500}"