@yimingliao/cms 0.0.84 → 0.0.85

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { R as Result, S as SuccessResult, d as ErrorResult, g as AdminFull, D as DeviceInfo } from '../types-BGsFazJr.js';
1
+ import { z as Translation, R as Result, S as SuccessResult, d as ErrorResult, g as AdminFull, D as DeviceInfo } from '../types-BGsFazJr.js';
2
2
  import { Logger } from 'logry';
3
3
  import * as _tanstack_react_query from '@tanstack/react-query';
4
4
  import { QueryClient, UseMutationOptions, UseQueryOptions } from '@tanstack/react-query';
@@ -28,6 +28,17 @@ interface UIStates {
28
28
  isDisabled?: boolean;
29
29
  isError?: boolean;
30
30
  }
31
+ interface FormContext<T> {
32
+ formData?: T;
33
+ setFormData?: React$1.Dispatch<React$1.SetStateAction<T>>;
34
+ }
35
+ interface FieldContext {
36
+ fieldName?: string;
37
+ translations?: Translation[];
38
+ errors?: string[];
39
+ }
40
+ interface FormFieldController<T = Record<string, unknown>> extends UIStates, FormContext<T>, FieldContext {
41
+ }
31
42
 
32
43
  interface FetchContext {
33
44
  input: string;
@@ -342,17 +353,21 @@ declare const buttonVariants: (props?: ({
342
353
  variant?: "link" | "default" | "success" | "destructive" | "outline" | "secondary" | "ghost" | "warning" | null | undefined;
343
354
  size?: "lg" | "sm" | "default" | "icon" | "icon-sm" | "icon-lg" | "xs" | null | undefined;
344
355
  } & class_variance_authority_types.ClassProp) | undefined) => string;
345
- type ShadcnButtonProps = React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
356
+ type ButtonProps$1 = React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
346
357
  asChild?: boolean;
347
358
  };
348
359
 
349
- interface ButtonProps extends ShadcnButtonProps, UIStates {
360
+ interface ButtonProps extends ButtonProps$1, UIStates {
350
361
  icon?: LucideIcon;
351
362
  href?: string;
352
363
  openNewTab?: boolean;
353
364
  }
354
365
  declare function Button({ icon, href, openNewTab, isDisabled, isLoading, children, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
355
366
 
367
+ interface InputProps<T = Record<string, unknown>> extends ComponentProps<"input">, FormFieldController<T> {
368
+ }
369
+ declare function Input<T>({ fieldName, setFormData, isLoading, isDisabled, isError, children, ...props }: InputProps<T>): react_jsx_runtime.JSX.Element;
370
+
356
371
  declare function AuthForm({ title, children, className, ...props }: ComponentProps<"form"> & {
357
372
  title: string;
358
373
  }): react_jsx_runtime.JSX.Element;
@@ -361,4 +376,4 @@ declare const cn: (...inputs: ClassValue[]) => string;
361
376
 
362
377
  declare function useDeviceInfo(): DeviceInfo | null;
363
378
 
364
- export { AdminProvider, AuthForm, Button, type ButtonProps, Form, type ShowToastOption, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };
379
+ export { AdminProvider, AuthForm, Button, type ButtonProps, Form, Input, type InputProps, type ShowToastOption, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };
@@ -308,7 +308,7 @@ var buttonVariants = cva(
308
308
  }
309
309
  }
310
310
  );
311
- function ShadCnButton({
311
+ function Button({
312
312
  className,
313
313
  variant,
314
314
  size,
@@ -336,11 +336,11 @@ function Spinner({ className, ...props }) {
336
336
  }
337
337
  );
338
338
  }
339
- function Button({
339
+ function Button2({
340
340
  icon,
341
341
  href,
342
342
  openNewTab = false,
343
- // processing states
343
+ // ui states
344
344
  isDisabled = false,
345
345
  isLoading = false,
346
346
  // base
@@ -357,7 +357,7 @@ function Button({
357
357
  }
358
358
  };
359
359
  return /* @__PURE__ */ jsx(
360
- ShadCnButton,
360
+ Button,
361
361
  {
362
362
  type: props.type ?? "button",
363
363
  disabled: isDisabled || isLoading,
@@ -370,6 +370,144 @@ function Button({
370
370
  }
371
371
  );
372
372
  }
373
+ function Input({ className, type, ...props }) {
374
+ return /* @__PURE__ */ jsx(
375
+ "input",
376
+ {
377
+ type,
378
+ "data-slot": "input",
379
+ className: cn(
380
+ "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
381
+ "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
382
+ "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
383
+ className
384
+ ),
385
+ ...props
386
+ }
387
+ );
388
+ }
389
+ function InputGroup({ className, ...props }) {
390
+ return /* @__PURE__ */ jsx(
391
+ "div",
392
+ {
393
+ "data-slot": "input-group",
394
+ role: "group",
395
+ className: cn(
396
+ "group/input-group border-input dark:bg-input/30 relative flex w-full items-center rounded-md border shadow-xs transition-[color,box-shadow] outline-none",
397
+ "h-9 min-w-0 has-[>textarea]:h-auto",
398
+ // Variants based on alignment.
399
+ "has-[>[data-align=inline-start]]:[&>input]:pl-2",
400
+ "has-[>[data-align=inline-end]]:[&>input]:pr-2",
401
+ "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3",
402
+ "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3",
403
+ // Focus state.
404
+ "has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot=input-group-control]:focus-visible]:ring-[3px]",
405
+ // Error state.
406
+ "has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[[data-slot][aria-invalid=true]]:border-destructive dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40",
407
+ className
408
+ ),
409
+ ...props
410
+ }
411
+ );
412
+ }
413
+ var inputGroupAddonVariants = cva(
414
+ "text-muted-foreground flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium select-none [&>svg:not([class*='size-'])]:size-4 [&>kbd]:rounded-[calc(var(--radius)-5px)] group-data-[disabled=true]/input-group:opacity-50",
415
+ {
416
+ variants: {
417
+ align: {
418
+ "inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]",
419
+ "inline-end": "order-last pr-3 has-[>button]:mr-[-0.45rem] has-[>kbd]:mr-[-0.35rem]",
420
+ "block-start": "order-first w-full justify-start px-3 pt-3 [.border-b]:pb-3 group-has-[>input]/input-group:pt-2.5",
421
+ "block-end": "order-last w-full justify-start px-3 pb-3 [.border-t]:pt-3 group-has-[>input]/input-group:pb-2.5"
422
+ }
423
+ },
424
+ defaultVariants: {
425
+ align: "inline-start"
426
+ }
427
+ }
428
+ );
429
+ function InputGroupAddon({
430
+ className,
431
+ align = "inline-start",
432
+ ...props
433
+ }) {
434
+ return /* @__PURE__ */ jsx(
435
+ "div",
436
+ {
437
+ role: "group",
438
+ "data-slot": "input-group-addon",
439
+ "data-align": align,
440
+ className: cn(inputGroupAddonVariants({ align }), className),
441
+ onClick: (e) => {
442
+ if (e.target.closest("button")) {
443
+ return;
444
+ }
445
+ e.currentTarget.parentElement?.querySelector("input")?.focus();
446
+ },
447
+ ...props
448
+ }
449
+ );
450
+ }
451
+ cva(
452
+ "text-sm shadow-none flex gap-2 items-center",
453
+ {
454
+ variants: {
455
+ size: {
456
+ xs: "h-6 gap-1 px-2 rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-3.5 has-[>svg]:px-2",
457
+ sm: "h-8 px-2.5 gap-1.5 rounded-md has-[>svg]:px-2.5",
458
+ "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
459
+ "icon-sm": "size-8 p-0 has-[>svg]:p-0"
460
+ }
461
+ },
462
+ defaultVariants: {
463
+ size: "xs"
464
+ }
465
+ }
466
+ );
467
+ function InputGroupInput({
468
+ className,
469
+ ...props
470
+ }) {
471
+ return /* @__PURE__ */ jsx(
472
+ Input,
473
+ {
474
+ "data-slot": "input-group-control",
475
+ className: cn(
476
+ "flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent",
477
+ className
478
+ ),
479
+ ...props
480
+ }
481
+ );
482
+ }
483
+ function Input2({
484
+ // form context
485
+ fieldName,
486
+ setFormData,
487
+ // ui states
488
+ isLoading = false,
489
+ isDisabled = false,
490
+ isError = false,
491
+ // base
492
+ children,
493
+ ...props
494
+ }) {
495
+ return /* @__PURE__ */ jsxs(InputGroup, { "data-disabled": isDisabled || isLoading, children: [
496
+ isLoading ? /* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(Spinner, {}) }) : /* @__PURE__ */ jsx(
497
+ InputGroupInput,
498
+ {
499
+ disabled: isDisabled || isLoading,
500
+ "aria-invalid": isError,
501
+ onChange: (e) => {
502
+ if (!setFormData || !fieldName) return;
503
+ setFormData((p) => ({ ...p, [fieldName]: e.target.value }));
504
+ },
505
+ ...props
506
+ }
507
+ ),
508
+ children
509
+ ] });
510
+ }
373
511
  function Card({ className, ...props }) {
374
512
  return /* @__PURE__ */ jsx(
375
513
  "div",
@@ -422,10 +560,10 @@ function AuthForm({
422
560
  className,
423
561
  ...props
424
562
  }) {
425
- return /* @__PURE__ */ jsx(Form, { className: cn("mx-auto mt-14 w-96", className), ...props, children: /* @__PURE__ */ jsxs(Card, { children: [
563
+ return /* @__PURE__ */ jsx(Form, { className: cn("mx-auto mt-20 w-96", className), ...props, children: /* @__PURE__ */ jsxs(Card, { children: [
426
564
  /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { className: "mx-auto", children: title }) }),
427
565
  /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", { className: "relative flex flex-col gap-6", children }) })
428
566
  ] }) });
429
567
  }
430
568
 
431
- export { AdminProvider, AuthForm, Button, Form, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };
569
+ export { AdminProvider, AuthForm, Button2 as Button, Form, Input2 as Input, cn, createAdminInitializer, createRequestInterceptor, createResponseInterceptor, createSmartFetch, createUseCommand, createUseQuery, handleToast, useAdmin, useDeviceInfo };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yimingliao/cms",
3
- "version": "0.0.84",
3
+ "version": "0.0.85",
4
4
  "author": "Yiming Liao",
5
5
  "license": "MIT",
6
6
  "type": "module",