@signal9/era-ui 9.0.0 → 10.1.0

package/dist/ui/command-bar/command-bar.svelte

@@ -290,7 +290,7 @@
 						tabindex={-1}
 						aria-selected={i === selectedIndex}
 						class={cn(
-							'flex h-(--era-h-control) cursor-default items-center gap-(--era-gap) px-(--era-inset-control) text-body era-text-trim whitespace-nowrap',
+							'flex h-(--era-h-control) cursor-default items-center gap-(--era-gap) px-(--era-inset-control) text-body leading-none whitespace-nowrap',
 							i === selectedIndex ? 'bg-3 text-bright' : 'text-fg'
 						)}
 						onclick={() => choose(item)}

package/dist/ui/copy-button/copy-button.svelte

@@ -15,7 +15,7 @@
 		resetDelay = 1500,
 		label = 'Copy',
 		copiedLabel = 'Copied',
-		size = 'sm',
+		size = 'chip',
 		idleIcon: IdleIcon = Copy,
 		successIcon: SuccessIcon = Check,
 		failureIcon: FailureIcon = X,

package/dist/ui/dialog/dialog-header.svelte

@@ -31,10 +31,15 @@
      `header` snippet, so the bar spans the panel edge to edge and the panel's
      radius follows this corner region (rd-md — the same law that sizes the
      pane's own corners). -->
-<Bar size="md" content="xxs" divider class={cn('pl-(--era-inset-control) select-none', className)}>
+<Bar
+	size="control"
+	content="pill"
+	divider
+	class={cn('pl-(--era-inset-control) select-none', className)}
+>
 	{@render children?.()}
 	{#if dismissable}
-		<Close icon size="xxs" tone="destructive" aria-label="Close" class="ml-auto">
+		<Close icon size="pill" tone="destructive" aria-label="Close" class="ml-auto">
 			<X />
 		</Close>
 	{/if}

package/dist/ui/index.js

@@ -57,7 +57,7 @@ export * as Popover from './popover/index.js';
 export * as PinInput from './pin-input/index.js';
 // `Mode` as a top-level identifier is reserved for the component (above), so
 // the density-union type can't be re-exported here under its own name — it is
-// available (under its original name) from the `@sig-nine/era-ui/provider`
+// available (under its original name) from the `@signal9/era-ui/provider`
 // subpath, or aliased as `DensityMode` below. Everything else flows through.
 export { modes, defaultMode, surfaces, defaultSurface, surfaceRegistry, corners, defaultCorners, fonts, defaultFont, motions, defaultMotion, axisRegistry, axisKeys } from './provider/index.js';
 export { Separator } from './separator/index.js';

package/dist/ui/input/input.svelte

@@ -9,7 +9,7 @@
 		ref = $bindable(null),
 		value = $bindable(''),
 		icon = null,
-		size = 'md',
+		size = 'control',
 		bare = false,
 		reveal = false,
 		class: className,
@@ -27,7 +27,7 @@
 		 * Field tier. `pill` is badge height — for compact chrome where the field
 		 * sits level with xxs buttons. See inputVariants.
 		 */
-		size?: 'md' | 'xxs';
+		size?: 'control' | 'pill';
 		/** Drop the field chrome — for an input inside a container that is already the field. */
 		bare?: boolean;
 		/** Hold the field chrome back until hover — for a title or label that IS the content. */
@@ -54,7 +54,7 @@
 	// with a default button (h-icon glyph), an xxs field with a pill-tier button
 	// (icon-xxs). One size for both would leave the two glyphs in one bar drawn at
 	// different weights.
-	const glyphClass = $derived(size === 'xxs' ? 'size-(--era-glyph-pill)' : 'size-(--era-h-icon)');
+	const glyphClass = $derived(size === 'pill' ? 'size-(--era-glyph-pill)' : 'size-(--era-h-icon)');
 </script>
 
 {#if icon}

package/dist/ui/input/input.svelte.d.ts

@@ -9,7 +9,7 @@ type $$ComponentProps = Omit<HTMLInputAttributes, 'size'> & {
      * Field tier. `pill` is badge height — for compact chrome where the field
      * sits level with xxs buttons. See inputVariants.
      */
-    size?: 'md' | 'xxs';
+    size?: 'control' | 'pill';
     /** Drop the field chrome — for an input inside a container that is already the field. */
     bare?: boolean;
     /** Hold the field chrome back until hover — for a title or label that IS the content. */

package/dist/ui/input/variants.d.ts

@@ -60,8 +60,8 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
      *   on this tier read as one family.
      */
     size: {
-        md: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
-        xxs: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
+        control: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
+        pill: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
     };
     /**
      * Height OVERRIDES, for the fields that are not their tier's height. No
@@ -128,8 +128,8 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
      *   on this tier read as one family.
      */
     size: {
-        md: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
-        xxs: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
+        control: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
+        pill: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
     };
     /**
      * Height OVERRIDES, for the fields that are not their tier's height. No
@@ -196,8 +196,8 @@ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
      *   on this tier read as one family.
      */
     size: {
-        md: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
-        xxs: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
+        control: "h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)";
+        pill: "h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)";
     };
     /**
      * Height OVERRIDES, for the fields that are not their tier's height. No

package/dist/ui/input/variants.js

@@ -63,8 +63,8 @@ export const inputVariants = tv({
          *   on this tier read as one family.
          */
         size: {
-            md: 'h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)',
-            xxs: 'h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)'
+            control: 'h-(--era-h-control) rounded-(--era-rd-control) px-(--era-field-px)',
+            pill: 'h-(--era-h-pill) rounded-(--era-rd-pill) px-(--era-pill-px)'
         },
         /**
          * Height OVERRIDES, for the fields that are not their tier's height. No
@@ -100,5 +100,5 @@ export const inputVariants = tv({
         // second, differently-padded field.
         { bare: true, class: 'h-full rounded-none px-0' }
     ],
-    defaultVariants: { bare: false, reveal: false, size: 'md' }
+    defaultVariants: { bare: false, reveal: false, size: 'control' }
 });

package/dist/ui/kv/kv.svelte

@@ -24,7 +24,7 @@
 		// shrink-0 + nowrap like Badge/Chip: the overflow-hidden here is for the
 		// key cell's squared corners, not a licence to crush — squeezed, this pill
 		// clipped its value instead of bleeding it, which is quieter but no truer.
-		'inline-flex h-(--era-h-pill) shrink-0 items-center overflow-hidden rounded-(--era-rd-pill) bg-fill font-mono text-body era-text-trim leading-none whitespace-nowrap shadow-(--era-shadow)',
+		'inline-flex h-(--era-h-pill) shrink-0 items-center overflow-hidden rounded-(--era-rd-pill) bg-fill font-mono text-body leading-none whitespace-nowrap shadow-(--era-shadow)',
 		className
 	)}
 	{...restProps}

package/dist/ui/pane/pane-close.svelte

@@ -13,7 +13,7 @@
 	} = $props();
 </script>
 
-<!-- A raw icon Button (size="xxs" = h-pill, rd-xxs), a tight SQUARE. No
+<!-- A raw icon Button (size="pill" = h-pill, rd-xxs), a tight SQUARE. No
      data-pane-control: it stays in the drag zone, so a press-and-drag moves the
      pane while a clean click still closes (neodrag starts a drag only on
      movement and suppresses the trailing click after a real drag). Its natural
@@ -45,7 +45,7 @@
 <Button
 	bind:ref
 	icon
-	size="xxs"
+	size="pill"
 	tone="destructive"
 	aria-label="Close"
 	class={cn('[&_svg]:size-[calc(var(--era-sp)+0.3125rem)]', className)}

package/dist/ui/pane/pane-handle.svelte

@@ -35,13 +35,13 @@
      control ⊃ pill, not chip ⊃ icon: a title bar is the densest chrome in the library and
      was a tier too short for it — 22px at dense against the 24 the reference
      terminal app uses, with 14px controls where it uses 18. The pairing is what
-     carries that: content="xxs" puts the walls on --era-pill-inset-control (3/5/7/11),
+     carries that: content="pill" puts the walls on --era-pill-inset-control (3/5/7/11),
      which is the 3px that app hardcodes for exactly this bar. -->
 <Bar
 	bind:ref
 	data-pane-handle
-	size="md"
-	content="xxs"
+	size="control"
+	content="pill"
 	divider
 	class={cn(
 		// The cap chrome (outset divider, rd-md bottom corners) is Bar's `divider`

package/dist/ui/select/select-trigger.svelte

@@ -14,7 +14,7 @@
 <Select.Trigger
 	bind:ref
 	class={cn(
-		'flex h-(--era-h-control) w-full items-center justify-between gap-(--era-icon-inset-chip) rounded-(--era-rd-control) bg-(--era-surface-bg-elevated) px-(--era-inset-control) text-body era-text-trim text-fg shadow-(--era-shadow) hover:bg-(--era-highlight) focus:bg-(--era-highlight) focus:outline-none disabled:opacity-50 data-[state=open]:rounded-b-none data-[state=open]:shadow-(--era-shadow-pressed)',
+		'flex h-(--era-h-control) w-full items-center justify-between gap-(--era-icon-inset-chip) rounded-(--era-rd-control) bg-(--era-surface-bg-elevated) px-(--era-inset-control) text-body leading-none text-fg shadow-(--era-shadow) hover:bg-(--era-highlight) focus:bg-(--era-highlight) focus:outline-none disabled:opacity-50 data-[state=open]:rounded-b-none data-[state=open]:shadow-(--era-shadow-pressed)',
 		className
 	)}
 	{...restProps}

package/dist/ui/select/select-value.svelte

@@ -55,7 +55,7 @@
 			>
 				{#each sel.selected as item (item.value)}
 					<Chip
-						size="xxs"
+						size="pill"
 						ondismiss={snippet.disabled
 							? undefined
 							: () =>

package/dist/ui/step/step-summary.svelte

@@ -26,7 +26,7 @@
 <Collapsible.Trigger
 	bind:ref
 	class={cn(
-		'flex h-(--era-h-control) w-full min-w-0 era-interactive cursor-pointer items-center gap-(--era-gap) rounded-(--era-rd-control) px-(--era-inset-control) text-body era-text-trim text-muted transition-colors duration-(--era-duration) ease-(--era-ease) hover:text-fg',
+		'flex h-(--era-h-control) w-full min-w-0 era-interactive cursor-pointer items-center gap-(--era-gap) rounded-(--era-rd-control) px-(--era-inset-control) text-body leading-none text-muted transition-colors duration-(--era-duration) ease-(--era-ease) hover:text-fg',
 		className
 	)}
 	{...restProps}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@signal9/era-ui",
-	"version": "9.0.0",
+	"version": "10.1.0",
 	"scripts": {
 		"dev": "vite dev --host",
 		"build": "vite build && npm run prepack",