@jinaan/uikit 0.1.5 → 0.1.7

package/dist/segmented.d.ts

@@ -13,7 +13,7 @@ interface SegmentedProps<T extends string> {
     "aria-label"?: string;
 }
 /**
- * Single-choice control for a small set of options, styled after the Clerk
+ * Single-choice control for a small set of options, styled after the Jinaan
  * dashboard: a recessed track with an elevated selected pill. Implemented as a
  * `radiogroup` of native radios, so arrow-key roving and forms work natively.
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jinaan/uikit",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "Reusable React and Tailwind UI components for Jinaan projects.",
   "license": "UNLICENSED",
   "type": "module",

package/src/agent-prompt.tsx

@@ -14,7 +14,7 @@ interface AgentPromptProps {
 }
 
 /**
- * The "Add Clerk auth to my app" prompt pill: a dark tag overlapping a
+ * The "Add Jinaan auth to my app" prompt pill: a dark tag overlapping a
  * rounded command field with a copy button.
  */
 export function AgentPrompt({

package/src/data-table.tsx

@@ -153,7 +153,7 @@ function initials(name: string): string {
     .join("");
 }
 
-/** Clerk-style identity cell: avatar + primary name + secondary line. */
+/** Jinaan-style identity cell: avatar + primary name + secondary line. */
 export function DataTableIdentity({
   name,
   secondary,

package/src/input.tsx

@@ -9,7 +9,7 @@ const HEIGHT: Record<InputSize, string> = {
   sm: "h-[var(--control-h-sm)] text-sm",
   md: "h-[var(--control-h-md)] text-sm",
   lg: "h-[var(--control-h-lg)] text-sm",
-  xl: "h-[var(--control-h-xl)] rounded-[var(--control-radius-xl)] text-base",
+  xl: "h-[var(--control-h-xl)] rounded-lg text-base",
 };
 
 const PAD_X: Record<InputSize, string> = {
@@ -110,7 +110,7 @@ export const Input = forwardRef<HTMLInputElement, InputProps>(
             : undefined
         }
         className={cn(
-          "flex w-full rounded-(--control-radius) border bg-(--input-bg) text-(--input-fg) transition-colors",
+          "flex w-full rounded-md border bg-(--input-bg) text-(--input-fg) transition-colors",
           HEIGHT[size],
           PAD_X[size],
           "placeholder:text-(--input-placeholder)",

package/src/label.tsx

@@ -10,7 +10,7 @@ export const Label = forwardRef<
   <LabelPrimitive.Root
     ref={ref}
     className={cn(
-      "mb-1 text-sm font-medium text-fg leading-none last:mb-0 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
+      "mb-2.5 block text-sm font-medium text-fg leading-none last:mb-0 peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
       className,
     )}
     {...props}

package/src/segmented.tsx

@@ -18,7 +18,7 @@ interface SegmentedProps<T extends string> {
 }
 
 /**
- * Single-choice control for a small set of options, styled after the Clerk
+ * Single-choice control for a small set of options, styled after the Jinaan
  * dashboard: a recessed track with an elevated selected pill. Implemented as a
  * `radiogroup` of native radios, so arrow-key roving and forms work natively.
  */

package/src/select.tsx

@@ -30,9 +30,9 @@ export const SelectTrigger = forwardRef<
       "focus:outline-none disabled:cursor-not-allowed disabled:opacity-50",
       "[&>span]:truncate",
       variant === "field" &&
-        "h-9 w-full rounded-md border border-line bg-surface px-3 focus:border-primary focus:ring-2 focus:ring-focus/30",
+        "h-(--control-h-md) w-full rounded-md border border-line bg-surface px-3 focus:border-primary focus:ring-2 focus:ring-focus/30",
       variant === "inline" &&
-        "btn-fill btn-inner-border btn-interactive h-8 w-auto rounded-(--control-radius) border-0 bg-(--button-secondary-bg) px-(--control-pad-x-sm) font-medium text-fg hover:bg-(--button-surface-hover) active:bg-(--button-surface-active) focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-line-strong",
+        "btn-fill btn-inner-border btn-interactive h-(--control-h-md) w-auto rounded-(--control-radius) border-0 bg-(--button-secondary-bg) px-(--control-pad-x-sm) font-medium text-fg hover:bg-(--button-surface-hover) active:bg-(--button-surface-active) focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-line-strong",
       className,
     )}
     {...props}

package/styles.css

@@ -8,10 +8,10 @@
 /*
  * Semantic design tokens. Components must reference these (via the Tailwind
  * utilities below) rather than raw palette values, so both themes stay correct.
- * Values mirror the Clerk "Ceramic" system captured in docs/design-reference.md.
+ * Values mirror the Jinaan "Ceramic" system captured in docs/design-reference.md.
  */
 :root {
-  /* Clerk shell: white page, gray-50 chrome/cards. */
+  /* Jinaan shell: white page, gray-50 chrome/cards. */
   --page: #ffffff;
   --canvas: #ffffff;
   --surface: #fafafb;
@@ -121,7 +121,7 @@
   /* Destructive keeps its red identity; hover/pressed are red-shifted. */
   --button-destructive-hover: color-mix(in oklab, var(--error) 88%, black);
   --button-destructive-active: color-mix(in oklab, var(--error) 78%, black);
-  /* Filled buttons: flat surface + inset gloss + soft drop (Clerk). */
+  /* Filled buttons: flat surface + inset gloss + soft drop (Jinaan). */
   --button-inner: rgb(255 255 255 / 0.45);
   /* Primary and destructive read their own, stronger top gloss. */
   --button-primary-inner: rgb(255 255 255 / 0.5);
@@ -140,7 +140,7 @@
     0 10px 28px -14px rgb(19 19 22 / 0.2);
   --dialog-noise-opacity: 0.04;
 
-  /* Settings danger-zone shell (Clerk red-tinted surface). */
+  /* Settings danger-zone shell (Jinaan red-tinted surface). */
   --settings-danger-bg: #fff5f4;
 
   /* Third-party brand marks (identity providers). */
@@ -155,7 +155,7 @@
 }
 
 .dark {
-  /* Clerk shell: page gray-1400, chrome/cards gray-1500. */
+  /* Jinaan shell: page gray-1400, chrome/cards gray-1500. */
   --page: #19191c;
   --canvas: #1b1b1f;
   --surface: #111113;
@@ -205,7 +205,7 @@
   --table-row-selected: #2b2b34;
   --table-accent: var(--primary);
 
-  /* Control system overrides (dark) — surfaces match the Clerk dashboard. */
+  /* Control system overrides (dark) — surfaces match the Jinaan dashboard. */
   --input-bg: #30303a;
   --input-fg: #f4f4f5;
   --input-placeholder: #777783;
@@ -324,7 +324,7 @@
 @layer components {
   /*
    * Filled control surface: a soft blurred drop plus a 1px inset top gloss
-   * (matches the Clerk dashboard buttons). The Tailwind focus ring replaces
+   * (matches the Jinaan dashboard buttons). The Tailwind focus ring replaces
    * this shadow while focused.
    */
   .btn-fill {