@motor-hero/ui-kit 0.28.0 → 0.30.0

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.
@@ -6,6 +6,11 @@ declare const sizeClasses: {
6
6
  readonly lg: "sm:max-w-lg";
7
7
  readonly xl: "sm:max-w-xl";
8
8
  readonly "2xl": "sm:max-w-2xl";
9
+ readonly "3xl": "sm:max-w-3xl";
10
+ readonly "4xl": "sm:max-w-4xl";
11
+ readonly "5xl": "sm:max-w-5xl";
12
+ readonly "6xl": "sm:max-w-6xl";
13
+ readonly "7xl": "sm:max-w-7xl";
9
14
  };
10
15
  export type BaseDialogSize = keyof typeof sizeClasses;
11
16
  export interface BaseDialogProps {
@@ -1 +1 @@
1
- {"version":3,"file":"base-dialog.d.ts","sourceRoot":"","sources":["../../src/components/base-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,QAAA,MAAM,WAAW;;;;;;CAMP,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,WAAW,CAAA;AAErD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,KAAK,SAAS,CAAA;CACnD;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,IAAW,EACX,SAAS,EACT,KAAK,EACL,cAAqC,GACtC,EAAE,eAAe,qBA+DjB"}
1
+ {"version":3,"file":"base-dialog.d.ts","sourceRoot":"","sources":["../../src/components/base-dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,QAAA,MAAM,WAAW;;;;;;;;;;;CAWP,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,WAAW,CAAA;AAErD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,IAAI,CAAC,EAAE,cAAc,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,KAAK,SAAS,CAAA;CACnD;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,EACN,IAAW,EACX,SAAS,EACT,KAAK,EACL,cAAqC,GACtC,EAAE,eAAe,qBA+DjB"}
@@ -5,6 +5,11 @@ export interface ColorPickerProps {
5
5
  onChange: (value: string) => void;
6
6
  /** Trigger text shown when no color is set. */
7
7
  placeholder?: string;
8
+ /**
9
+ * Show a clear (×) affordance when a color is set — emits `onChange("")`
10
+ * so the field can fall back to its default. On by default.
11
+ */
12
+ clearable?: boolean;
8
13
  disabled?: boolean;
9
14
  id?: string;
10
15
  className?: string;
@@ -19,5 +24,5 @@ export interface ColorPickerProps {
19
24
  * `aria-invalid`/`aria-describedby` from FormField and shows a destructive
20
25
  * border when invalid, matching the other kit inputs.
21
26
  */
22
- export declare function ColorPicker({ value, onChange, placeholder, disabled, id, className, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: ColorPickerProps): React.JSX.Element;
27
+ export declare function ColorPicker({ value, onChange, placeholder, clearable, disabled, id, className, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedby, }: ColorPickerProps): React.JSX.Element;
23
28
  //# sourceMappingURL=color-picker.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"color-picker.d.ts","sourceRoot":"","sources":["../../src/components/color-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,WAAW,gBAAgB;IAC/B,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,WAA8B,EAC9B,QAAQ,EACR,EAAE,EACF,SAAS,EACT,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,GACpC,EAAE,gBAAgB,qBA+DlB"}
1
+ {"version":3,"file":"color-picker.d.ts","sourceRoot":"","sources":["../../src/components/color-picker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,WAAW,gBAAgB;IAC/B,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IAC3C,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,EACR,WAA8B,EAC9B,SAAgB,EAChB,QAAQ,EACR,EAAE,EACF,SAAS,EACT,cAAc,EAAE,WAAW,EAC3B,kBAAkB,EAAE,eAAe,GACpC,EAAE,gBAAgB,qBAyFlB"}
package/dist/index.cjs CHANGED
@@ -480,7 +480,12 @@ var sizeClasses2 = {
480
480
  md: "sm:max-w-md",
481
481
  lg: "sm:max-w-lg",
482
482
  xl: "sm:max-w-xl",
483
- "2xl": "sm:max-w-2xl"
483
+ "2xl": "sm:max-w-2xl",
484
+ "3xl": "sm:max-w-3xl",
485
+ "4xl": "sm:max-w-4xl",
486
+ "5xl": "sm:max-w-5xl",
487
+ "6xl": "sm:max-w-6xl",
488
+ "7xl": "sm:max-w-7xl"
484
489
  };
485
490
  function BaseDialog({
486
491
  open,
@@ -811,7 +816,7 @@ function Combobox({
811
816
  "aria-describedby": ariaDescribedby,
812
817
  disabled,
813
818
  className: cn(
814
- "flex h-9 w-full cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
819
+ "flex h-9 w-full cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm transition-colors hover:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
815
820
  className
816
821
  ),
817
822
  children: [
@@ -982,7 +987,7 @@ function MultiCombobox({
982
987
  }
983
988
  },
984
989
  className: cn(
985
- "flex min-h-9 w-full cursor-pointer flex-wrap items-center gap-1 rounded-md border border-input bg-transparent px-3 py-1.5 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
990
+ "flex min-h-9 w-full cursor-pointer flex-wrap items-center gap-1 rounded-md border border-input bg-transparent px-3 py-1.5 text-sm shadow-sm transition-colors hover:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
986
991
  className
987
992
  ),
988
993
  children: [
@@ -1108,6 +1113,7 @@ function ColorPicker({
1108
1113
  value,
1109
1114
  onChange,
1110
1115
  placeholder = "Selecionar cor",
1116
+ clearable = true,
1111
1117
  disabled,
1112
1118
  id,
1113
1119
  className,
@@ -1116,6 +1122,12 @@ function ColorPicker({
1116
1122
  }) {
1117
1123
  const [open, setOpen] = React8.useState(false);
1118
1124
  const color = value || "";
1125
+ const showClear = clearable && !!color && !disabled;
1126
+ const clear = (event) => {
1127
+ event.stopPropagation();
1128
+ event.preventDefault();
1129
+ onChange("");
1130
+ };
1119
1131
  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(PopoverPrimitive3.Root, { open, onOpenChange: setOpen, children: [
1120
1132
  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PopoverPrimitive3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
1121
1133
  "button",
@@ -1126,7 +1138,7 @@ function ColorPicker({
1126
1138
  "aria-describedby": ariaDescribedby,
1127
1139
  disabled,
1128
1140
  className: cn(
1129
- "flex h-9 w-full cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
1141
+ "flex h-9 w-full cursor-pointer items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm transition-colors hover:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive",
1130
1142
  className
1131
1143
  ),
1132
1144
  children: [
@@ -1146,7 +1158,25 @@ function ColorPicker({
1146
1158
  ),
1147
1159
  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: cn("truncate", !color && "text-muted-foreground"), children: color || placeholder })
1148
1160
  ] }),
1149
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react6.ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-50" })
1161
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "flex shrink-0 items-center gap-1", children: [
1162
+ showClear && // Not a <button> — nesting one inside the trigger button is
1163
+ // invalid HTML.
1164
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
1165
+ "span",
1166
+ {
1167
+ role: "button",
1168
+ tabIndex: 0,
1169
+ "aria-label": "Limpar cor",
1170
+ onClick: clear,
1171
+ onKeyDown: (event) => {
1172
+ if (event.key === "Enter" || event.key === " ") clear(event);
1173
+ },
1174
+ className: "rounded p-0.5 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
1175
+ children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react6.X, { className: "h-3.5 w-3.5" })
1176
+ }
1177
+ ),
1178
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react6.ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-50" })
1179
+ ] })
1150
1180
  ]
1151
1181
  }
1152
1182
  ) }),