@yimingliao/cms 0.0.87 → 0.0.88

package/dist/{chunk-MYQZGULX.js → chunk-OQGJBZXQ.js}

@@ -6,6 +6,7 @@ import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import { jsx } from 'react/jsx-runtime';
 import { Loader2Icon } from 'lucide-react';
+import * as LabelPrimitive from '@radix-ui/react-label';
 
 // src/client/applications/ui/utils.ts
 var cn = (...inputs) => {
@@ -340,5 +341,18 @@ function Spinner({ className, ...props }) {
     }
   );
 }
+function Label({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    LabelPrimitive.Root,
+    {
+      "data-slot": "label",
+      className: cn(
+        "flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
 
-export { Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Spinner, Textarea, cn, useDeviceInfo };
+export { Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, Spinner, Textarea, cn, useDeviceInfo };

package/dist/client/index.d.ts

@@ -6,9 +6,9 @@ import * as _tanstack_query_core from '@tanstack/query-core';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { c as createVerifyAction } from '../create-verify-action-DBwWOXPO.js';
 import * as React$1 from 'react';
-import { ComponentProps } from 'react';
+import { ComponentProps, ReactNode, HTMLAttributes } from 'react';
+import { L as LabelProps, B as ButtonProps$1 } from '../label-BF4qxS03.js';
 import { LucideIcon } from 'lucide-react';
-import { B as ButtonProps$1 } from '../button-DsjdULEG.js';
 import { ClassValue } from 'clsx';
 import '../types-J25u1G6t.js';
 import '../types-0oS1A2K5.js';
@@ -23,6 +23,7 @@ import 'keyv';
 import 'zod/v4/core';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
+import '@radix-ui/react-label';
 
 interface UIStates {
     isLoading?: boolean;
@@ -350,6 +351,22 @@ declare function createAdminInitializer({ useAdmin, useQuery, verifyAction, }: {
 
 declare function Form({ onSubmit, className, ...props }: ComponentProps<"form">): react_jsx_runtime.JSX.Element;
 
+interface FieldProps extends LabelProps {
+    label: ReactNode;
+    isRequired?: boolean;
+    hint?: ReactNode;
+    labelChildren?: ReactNode;
+    children: ReactNode;
+}
+declare function Field({ label, isRequired, hint, labelChildren, children, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
+
+interface FieldBodyProps extends HTMLAttributes<HTMLDivElement>, UIStates {
+    isEmpty?: boolean;
+    backgroundClassName?: string;
+    childrenClassName?: string;
+}
+declare function FieldBody({ isLoading, isDisabled, isEmpty, className, backgroundClassName, childrenClassName, children, ...props }: FieldBodyProps): react_jsx_runtime.JSX.Element;
+
 interface ButtonProps extends ButtonProps$1, UIStates {
     icon?: LucideIcon;
     href?: string;
@@ -361,8 +378,10 @@ interface InputProps<T = Record<string, unknown>> extends ComponentProps<"input"
 }
 declare function Input<T>({ fieldName, setFormData, isLoading, isDisabled, isError, children, ...props }: InputProps<T>): react_jsx_runtime.JSX.Element;
 
+declare function PasswordInput<T>({ ...props }: InputProps<T>): react_jsx_runtime.JSX.Element;
+
 declare const cn: (...inputs: ClassValue[]) => string;
 
 declare function useDeviceInfo(): DeviceInfo | null;
 
-export { AdminProvider, Button, type ButtonProps, Form, Input, type InputProps, type ShowToastOption, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };
+export { AdminProvider, Button, type ButtonProps, Field, FieldBody, Form, Input, type InputProps, PasswordInput, type ShowToastOption, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };

package/dist/client/index.js

@@ -1,11 +1,13 @@
-import { cn, Button, Spinner, InputGroup, InputGroupAddon, InputGroupInput } from '../chunk-MYQZGULX.js';
-export { cn, useDeviceInfo } from '../chunk-MYQZGULX.js';
+import { cn, Label, Spinner, Button, InputGroup, InputGroupAddon, InputGroupInput, InputGroupButton } from '../chunk-OQGJBZXQ.js';
+export { cn, useDeviceInfo } from '../chunk-OQGJBZXQ.js';
 import { ensureArray } from '../chunk-OAENV763.js';
 import { toast } from 'sonner';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useMutation, useQuery } from '@tanstack/react-query';
 import * as React from 'react';
 import { createContext, useState, useContext, useEffect } from 'react';
+import { Asterisk, Eye, EyeOff } from 'lucide-react';
+import { useTranslator } from 'intor/react';
 import { useRouter } from 'next/navigation';
 
 // src/client/infrastructure/fetch/smart-fetch.ts
@@ -250,6 +252,81 @@ function Form({
   };
   return /* @__PURE__ */ jsx("form", { className: cn(className), onSubmit: handleSubmit, ...props });
 }
+function Field({
+  label,
+  isRequired = false,
+  hint,
+  labelChildren,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "grid w-full items-center gap-3", children: [
+    /* @__PURE__ */ jsxs("span", { className: "flex gap-2", children: [
+      /* @__PURE__ */ jsxs(Label, { className: "flex gap-1 truncate", ...props, children: [
+        label,
+        isRequired && /* @__PURE__ */ jsx(Asterisk, { className: "text-destructive size-3" }),
+        hint && /* @__PURE__ */ jsx("span", { className: "ml-2 text-xs text-muted-foreground", children: hint })
+      ] }),
+      /* @__PURE__ */ jsx("span", { children: labelChildren })
+    ] }),
+    children
+  ] });
+}
+function FieldBody({
+  // ui states
+  isLoading = false,
+  isDisabled = false,
+  isEmpty = false,
+  // base
+  className,
+  backgroundClassName,
+  childrenClassName,
+  children,
+  ...props
+}) {
+  const { t } = useTranslator();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        className,
+        "relative",
+        "min-h-9 w-full min-w-0",
+        "flex items-center",
+        "text-sm"
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "absolute size-full",
+              "dark:bg-input/30 bg-foreground/2 rounded-md",
+              backgroundClassName
+            )
+          }
+        ),
+        isLoading && /* @__PURE__ */ jsx("div", { className: "px-3", children: /* @__PURE__ */ jsx(Spinner, {}) }),
+        !isLoading && (!children || isEmpty) && /* @__PURE__ */ jsx("div", { className: "flex-center h-9 px-3 opacity-50", children: /* @__PURE__ */ jsx("p", { className: "opacity-50", children: t("ui.no-data.text") }) }),
+        !isLoading && children && !isEmpty && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "relative size-full",
+              "flex items-center gap-3",
+              "px-3 py-2",
+              "break-all",
+              (isDisabled || isLoading) && "opacity-50",
+              childrenClassName
+            ),
+            children
+          }
+        )
+      ]
+    }
+  );
+}
 function Button2({
   icon,
   href,
@@ -312,5 +389,18 @@ function Input({
     children
   ] });
 }
+function PasswordInput({ ...props }) {
+  const [showPassword, setShowPassword] = useState(false);
+  return /* @__PURE__ */ jsx(Input, { type: showPassword ? "text" : "password", ...props, children: /* @__PURE__ */ jsx(InputGroupAddon, { align: "inline-end", children: /* @__PURE__ */ jsx(
+    InputGroupButton,
+    {
+      "aria-label": showPassword ? "Hide password" : "Show password",
+      title: showPassword ? "Hide password" : "Show password",
+      size: "icon-xs",
+      onClick: () => setShowPassword((prev) => !prev),
+      children: showPassword ? /* @__PURE__ */ jsx(Eye, {}) : /* @__PURE__ */ jsx(EyeOff, {})
+    }
+  ) }) });
+}
 
-export { AdminProvider, Button2 as Button, Form, Input, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin };
+export { AdminProvider, Button2 as Button, Field, FieldBody, Form, Input, PasswordInput, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin };

package/dist/client/shadcn/index.d.ts

@@ -1,10 +1,11 @@
-import { a as Button } from '../../button-DsjdULEG.js';
-export { B as ButtonProps } from '../../button-DsjdULEG.js';
+import { a as Button } from '../../label-BF4qxS03.js';
+export { B as ButtonProps, b as Label, L as LabelProps } from '../../label-BF4qxS03.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import { ComponentProps } from 'react';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
+import '@radix-ui/react-label';
 
 declare function Card({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;

package/dist/client/shadcn/index.js

@@ -1 +1 @@
-export { Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Spinner, Textarea } from '../../chunk-MYQZGULX.js';
+export { Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, Spinner, Textarea } from '../../chunk-OQGJBZXQ.js';

package/dist/{button-DsjdULEG.d.ts → label-BF4qxS03.d.ts}

@@ -2,6 +2,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
 
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "success" | "destructive" | "outline" | "secondary" | "ghost" | "warning" | null | undefined;
@@ -12,4 +13,7 @@ type ButtonProps = React.ComponentProps<"button"> & VariantProps<typeof buttonVa
 };
 declare function Button({ className, variant, size, asChild, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
 
-export { type ButtonProps as B, Button as a };
+type LabelProps = React.ComponentProps<typeof LabelPrimitive.Root>;
+declare function Label({ className, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
+
+export { type ButtonProps as B, type LabelProps as L, Button as a, Label as b };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yimingliao/cms",
-  "version": "0.0.87",
+  "version": "0.0.88",
   "author": "Yiming Liao",
   "license": "MIT",
   "type": "module",
@@ -49,6 +49,7 @@
   },
   "dependencies": {
     "@keyv/redis": "^5.1.6",
+    "@radix-ui/react-label": "^2.1.8",
     "@radix-ui/react-slot": "^1.2.4",
     "argon2": "^0.44.0",
     "class-variance-authority": "^0.7.1",
@@ -85,6 +86,8 @@
     "intor": "^2.5.0",
     "knip": "^5.86.0",
     "next": "^16.1.6",
+    "prettier": "^3.8.1",
+    "prettier-plugin-tailwindcss": "^0.7.2",
     "prisma": "6.5.0",
     "react": "^19.2.4",
     "tailwind-merge": "^3.5.0",