sherick-ui 2.6.0 → 2.7.0

package/dist/types/dev.d.ts

@@ -17,13 +17,13 @@ declare const elevation: {
 };
 declare const recessedTop = "shadow-sherick-recessed-top";
 declare const shape: {
-    readonly control: "rounded-[1rem]";
+    readonly control: "rounded-[0.75rem]";
     readonly mark: "rounded-[0.375rem]";
-    readonly row: "rounded-[0.75rem]";
-    readonly prominent: "rounded-[1.25rem]";
-    readonly surface: "rounded-[1.5rem]";
-    readonly sheet: "rounded-[1rem]";
-    readonly expressive: "rounded-[1.75rem]";
+    readonly row: "rounded-[0.5rem]";
+    readonly prominent: "rounded-[1rem]";
+    readonly surface: "rounded-[1.25rem]";
+    readonly sheet: "rounded-[0.75rem]";
+    readonly expressive: "rounded-[1.5rem]";
     readonly pill: "rounded-full";
     readonly circle: "rounded-full";
 };
@@ -33,8 +33,8 @@ declare const edgeTone: {
     readonly rule: "border-sherick-edge/[0.075]";
 };
 declare const rim: {
-    readonly field: "border-[1.5px] border-sherick-rim";
-    readonly fieldError: "border-[1.5px] border-sherick-danger";
+    readonly field: "border-[1.5px] border-transparent border-b-sherick-rim";
+    readonly fieldError: "border-[1.5px] border-transparent border-b-sherick-danger";
     readonly dashed: string;
     readonly dashedHover: "hover:after:bg-sherick-ink-muted";
     readonly dashedDragging: "data-[dragging]:after:bg-sherick-primary";
@@ -56,17 +56,17 @@ declare const state: {
     readonly text: "cursor-text";
     readonly rowHover: "hover:bg-sherick-ink/[0.05]";
     readonly field: {
-        readonly hover: "hover:bg-sherick-canvas/[0.85] hover:border-sherick-ink-muted";
-        readonly focus: "focus:bg-sherick-canvas focus:border-sherick-ink-muted";
-        readonly focusWithin: "[&&]:focus-within:bg-sherick-canvas [&&]:focus-within:border-sherick-ink-muted";
-        readonly engaged: "bg-sherick-canvas border-sherick-ink-muted";
-        readonly errorHover: "hover:bg-sherick-canvas/[0.85]";
-        readonly errorFocus: "focus:bg-sherick-canvas";
-        readonly errorEngaged: "bg-sherick-canvas";
-        readonly invalid: "data-[invalid]:border-sherick-danger";
-        readonly invalidHover: "data-[invalid]:hover:border-sherick-danger";
-        readonly invalidEngaged: "data-[invalid]:border-sherick-danger";
-        readonly invalidFocusWithin: "[&&]:data-[invalid]:focus-within:border-sherick-danger";
+        readonly hover: "hover:bg-sherick-surface-high/[0.82] hover:border-b-sherick-ink-muted";
+        readonly focus: "focus:bg-sherick-surface-high focus:border-b-sherick-ink-muted";
+        readonly focusWithin: "[&&]:focus-within:bg-sherick-surface-high [&&]:focus-within:border-b-sherick-ink-muted";
+        readonly engaged: "bg-sherick-surface-high border-b-sherick-ink-muted";
+        readonly errorHover: "hover:bg-sherick-danger-soft/[0.55]";
+        readonly errorFocus: "focus:bg-sherick-danger-soft/[0.55]";
+        readonly errorEngaged: "bg-sherick-danger-soft/[0.55]";
+        readonly invalid: "data-[invalid]:bg-sherick-danger-soft/[0.55] data-[invalid]:border-b-sherick-danger";
+        readonly invalidHover: "data-[invalid]:hover:bg-sherick-danger-soft/[0.55] data-[invalid]:hover:border-b-sherick-danger";
+        readonly invalidEngaged: "data-[invalid]:bg-sherick-danger-soft/[0.55] data-[invalid]:border-b-sherick-danger";
+        readonly invalidFocusWithin: "[&&]:data-[invalid]:focus-within:bg-sherick-danger-soft/[0.55] [&&]:data-[invalid]:focus-within:border-b-sherick-danger";
     };
 };
 declare const stateLayerQuietComposite: string;
@@ -78,6 +78,7 @@ declare const stateLayer: {
     readonly track: string;
     readonly mark: string;
     readonly activeRow: "data-[highlighted]:before:opacity-[0.05]";
+    readonly fieldPart: string;
 };
 declare const hitArea = "relative after:pointer-events-auto after:absolute after:inset-[min(0px,calc((100%-2.75rem)/2))] after:content-['']";
 declare const material: {
@@ -85,8 +86,8 @@ declare const material: {
     readonly matteQuiet: "bg-sherick-surface/[0.42] text-sherick-ink";
     readonly matte: "bg-sherick-surface/[0.78] text-sherick-ink";
     readonly matteHigh: "bg-sherick-surface-high/[0.72] text-sherick-ink";
-    readonly control: "bg-sherick-canvas/[0.7] text-sherick-ink placeholder:text-sherick-ink-muted";
-    readonly controlError: "bg-sherick-canvas/[0.7] text-sherick-ink placeholder:text-sherick-danger";
+    readonly control: "bg-sherick-surface-high/[0.6] text-sherick-ink placeholder:text-sherick-ink-muted";
+    readonly controlError: "bg-sherick-danger-soft/[0.55] text-sherick-ink placeholder:text-sherick-danger";
     readonly handle: "bg-sherick-ink-muted text-sherick-canvas";
     readonly acrylic: "bg-sherick-surface-float/[var(--sui-glass-fill)] bg-[image:var(--sui-glass-gradient)] text-sherick-ink backdrop-blur-[var(--sui-glass-blur)] backdrop-saturate-[var(--sui-glass-saturation)] backdrop-brightness-[var(--sui-glass-brightness)]";
     readonly acrylicDense: "bg-sherick-surface-float/[var(--sui-glass-dense-fill)] bg-[image:var(--sui-glass-gradient-dense)] text-sherick-ink backdrop-blur-[var(--sui-glass-dense-blur)] backdrop-saturate-[var(--sui-glass-dense-saturation)] backdrop-brightness-[var(--sui-glass-dense-brightness)]";
@@ -102,7 +103,7 @@ declare const type: {
     };
     readonly supporting: "text-[0.8125rem] leading-5";
     readonly caption: "text-xs leading-4";
-    readonly title: "text-[0.9375rem] leading-[1.375rem] font-semibold";
+    readonly title: "text-[0.9375rem] leading-[1.375rem] font-semibold tracking-[-0.011em]";
     readonly heading: "text-xl leading-7 font-semibold tracking-[-0.02em]";
     readonly numeric: "tabular-nums";
 };
@@ -111,7 +112,7 @@ declare const density: {
     readonly normal: string;
     readonly prominent: string;
     readonly target: "min-h-11 min-w-11";
-    readonly part: "min-h-11 min-w-9";
+    readonly part: "min-h-11 min-w-8";
 };
 declare const iconSlot: {
     readonly caption: "inline-flex size-3.5 shrink-0 items-center justify-center [&>svg]:size-3.5";
@@ -197,7 +198,8 @@ declare const tone: {
     };
 };
 declare const currentDestination = "bg-sherick-primary-soft text-sherick-ink font-medium";
-declare const selectableRowSurface = "has-[[data-checked]]:bg-sherick-primary-selected has-[[data-checked]]:text-sherick-ink has-[[data-checked]]:shadow-sherick-control";
+declare const puck = "bg-sherick-puck";
+declare const selectableRowSurface = "has-[[data-checked]]:bg-sherick-primary-soft has-[[data-checked]]:text-sherick-ink";
 declare const selectableRowSupporting = "group-has-[[data-checked]]:text-sherick-ink";
 declare const selectable: {
     readonly surface: string;
@@ -241,6 +243,8 @@ declare const recipeAlphas: {
         readonly control: number;
         readonly hover: number;
         readonly engaged: number;
+        readonly mark: number;
+        readonly error: number;
     };
 };
 declare const fieldLayout = "flex min-w-0 w-full flex-col [overflow-wrap:anywhere]";
@@ -345,5 +349,5 @@ declare const motionPresenceToast: string;
  */
 declare const cn: (...inputs: ClassValue[]) => string;
 
-export { cn, currentDestination, density, detail, disclosure, edge, edgeTone, elevation, fieldLayout, fieldMessage, focusRing, focusRingDrag, focusRingHeld, focusRingInset, focusRingWithin, groupFocusRing, hitArea, iconSlot, list, material, matteInset, mediaCanvas, motionActivityIndeterminate, motionActivityPulse, motionActivitySpin, motionArrive, motionDirect, motionDisclose, motionFeedback, motionInkPress, motionOrient, motionPresenceAnchored, motionPresenceModal, motionPresenceScrim, motionPresenceSheet, motionPresenceToast, motionPresenceTooltip, motionRelocate, motionRelocateLong, motionRim, motionRowLayer, motionStateLayer, motionTactile, motionTactileField, motionTactileWide, overlay, parentFocusRingInset, recessedTop, recipeAlphas, rim, selectable, selectableRowSupporting, selectableRowSurface, shape, stacking, state, stateLayer, stateLayerQuietComposite, text, tone, type };
+export { cn, currentDestination, density, detail, disclosure, edge, edgeTone, elevation, fieldLayout, fieldMessage, focusRing, focusRingDrag, focusRingHeld, focusRingInset, focusRingWithin, groupFocusRing, hitArea, iconSlot, list, material, matteInset, mediaCanvas, motionActivityIndeterminate, motionActivityPulse, motionActivitySpin, motionArrive, motionDirect, motionDisclose, motionFeedback, motionInkPress, motionOrient, motionPresenceAnchored, motionPresenceModal, motionPresenceScrim, motionPresenceSheet, motionPresenceToast, motionPresenceTooltip, motionRelocate, motionRelocateLong, motionRim, motionRowLayer, motionStateLayer, motionTactile, motionTactileField, motionTactileWide, overlay, parentFocusRingInset, puck, recessedTop, recipeAlphas, rim, selectable, selectableRowSupporting, selectableRowSurface, shape, stacking, state, stateLayer, stateLayerQuietComposite, text, tone, type };
 export type { MotionIntent };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sherick-ui",
-  "version": "2.6.0",
-  "description": "A reusable React component library inspired by Material 3 Expressive.",
+  "version": "2.7.0",
+  "description": "A React component library in graphite and iris, with light and dark themes.",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Sherick16/sherick-ui.git",