@greatapps/common 1.1.371 → 1.1.372
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.
- package/dist/components/ui/form/ComboboxField.mjs +1 -1
- package/dist/components/ui/form/ComboboxField.mjs.map +1 -1
- package/dist/components/ui/form/SelectField.mjs +1 -1
- package/dist/components/ui/form/SelectField.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/ui/form/ComboboxField.tsx +1 -1
- package/src/components/ui/form/SelectField.tsx +1 -1
|
@@ -55,7 +55,7 @@ function ComboboxField({
|
|
|
55
55
|
"paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors",
|
|
56
56
|
"flex items-center justify-between gap-2 rounded-md border bg-transparent",
|
|
57
57
|
"border-gray-200 hover:border-gray-400 focus:border-gray-950 focus:outline-none",
|
|
58
|
-
disabled
|
|
58
|
+
disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer",
|
|
59
59
|
className
|
|
60
60
|
),
|
|
61
61
|
children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ui/form/ComboboxField.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useMemo } from 'react';\nimport { IconCheck, IconChevronDown, IconSearch } from '@tabler/icons-react';\nimport { Popover, PopoverContent, PopoverTrigger } from '../overlay/Popover';\nimport { cn } from '../../../infra/utils/clsx';\n\nexport type ComboboxOption = {\n value: string;\n label: string;\n displayValue?: string;\n};\n\ninterface ComboboxFieldProps {\n options: ComboboxOption[];\n label?: string;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyMessage?: string;\n value?: string;\n onChange?: (value: string) => void;\n disabled?: boolean;\n icon?: React.ReactNode;\n className?: string;\n containerClassName?: string;\n}\n\nexport function ComboboxField({\n options,\n label,\n placeholder = 'Selecione uma opção',\n searchPlaceholder = 'Buscar...',\n emptyMessage = 'Nenhuma opção encontrada.',\n value,\n onChange,\n disabled = false,\n icon,\n className,\n containerClassName,\n}: ComboboxFieldProps) {\n const [open, setOpen] = useState(false);\n const [search, setSearch] = useState('');\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value]\n );\n\n const filteredOptions = useMemo(() => {\n const q = search.trim().toLowerCase();\n if (!q) return options;\n return options.filter((o) => o.label.toLowerCase().includes(q));\n }, [options, search]);\n\n const handleSelect = (optionValue: string) => {\n onChange?.(optionValue);\n setOpen(false);\n setSearch('');\n };\n\n return (\n <div className={cn('flex flex-col gap-1.5', containerClassName)}>\n {label && (\n <div className=\"flex items-center gap-1 paragraph-xsmall-semibold\">\n <span className=\"text-gray-600\">{label}</span>\n </div>\n )}\n\n <Popover\n open={open}\n onOpenChange={(v) => {\n if (!disabled) {\n setOpen(v);\n if (!v) setSearch('');\n }\n }}\n >\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n disabled={disabled}\n className={cn(\n 'paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors',\n 'flex items-center justify-between gap-2 rounded-md border bg-transparent',\n 'border-gray-200 hover:border-gray-400 focus:border-gray-950 focus:outline-none',\n disabled
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ui/form/ComboboxField.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useMemo } from 'react';\nimport { IconCheck, IconChevronDown, IconSearch } from '@tabler/icons-react';\nimport { Popover, PopoverContent, PopoverTrigger } from '../overlay/Popover';\nimport { cn } from '../../../infra/utils/clsx';\n\nexport type ComboboxOption = {\n value: string;\n label: string;\n displayValue?: string;\n};\n\ninterface ComboboxFieldProps {\n options: ComboboxOption[];\n label?: string;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyMessage?: string;\n value?: string;\n onChange?: (value: string) => void;\n disabled?: boolean;\n icon?: React.ReactNode;\n className?: string;\n containerClassName?: string;\n}\n\nexport function ComboboxField({\n options,\n label,\n placeholder = 'Selecione uma opção',\n searchPlaceholder = 'Buscar...',\n emptyMessage = 'Nenhuma opção encontrada.',\n value,\n onChange,\n disabled = false,\n icon,\n className,\n containerClassName,\n}: ComboboxFieldProps) {\n const [open, setOpen] = useState(false);\n const [search, setSearch] = useState('');\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value]\n );\n\n const filteredOptions = useMemo(() => {\n const q = search.trim().toLowerCase();\n if (!q) return options;\n return options.filter((o) => o.label.toLowerCase().includes(q));\n }, [options, search]);\n\n const handleSelect = (optionValue: string) => {\n onChange?.(optionValue);\n setOpen(false);\n setSearch('');\n };\n\n return (\n <div className={cn('flex flex-col gap-1.5', containerClassName)}>\n {label && (\n <div className=\"flex items-center gap-1 paragraph-xsmall-semibold\">\n <span className=\"text-gray-600\">{label}</span>\n </div>\n )}\n\n <Popover\n open={open}\n onOpenChange={(v) => {\n if (!disabled) {\n setOpen(v);\n if (!v) setSearch('');\n }\n }}\n >\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n disabled={disabled}\n className={cn(\n 'paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors',\n 'flex items-center justify-between gap-2 rounded-md border bg-transparent',\n 'border-gray-200 hover:border-gray-400 focus:border-gray-950 focus:outline-none',\n disabled ? 'cursor-not-allowed opacity-50' : 'cursor-pointer',\n className\n )}\n >\n <span className={cn('truncate text-left', !selectedOption && 'text-gray-400')}>\n {selectedOption\n ? (selectedOption.displayValue ?? selectedOption.label)\n : placeholder}\n </span>\n {icon ?? (\n <IconChevronDown\n className={cn(\n 'size-4 opacity-50 shrink-0 transition-all duration-200',\n open && 'rotate-180 opacity-100 text-gray-950'\n )}\n />\n )}\n </button>\n </PopoverTrigger>\n\n <PopoverContent\n className=\"p-0 overflow-hidden rounded-md border shadow-md\"\n align=\"start\"\n sideOffset={4}\n style={{ width: 'var(--radix-popover-trigger-width)' }}\n onWheel={(e) => e.stopPropagation()}\n >\n <div className=\"flex items-center gap-2 border-b border-gray-100 px-3 h-9\">\n <IconSearch className=\"size-4 shrink-0 opacity-50 text-gray-500\" />\n <input\n autoFocus\n placeholder={searchPlaceholder}\n value={search}\n onChange={(e) => setSearch(e.target.value)}\n className=\"flex h-full w-full bg-transparent text-sm outline-none placeholder:text-gray-400 paragraph-small-medium text-gray-950\"\n />\n </div>\n\n <div className=\"overflow-y-auto max-h-[280px] p-1\">\n {filteredOptions.length === 0 ? (\n <p className=\"py-6 text-center paragraph-small-medium text-gray-500\">{emptyMessage}</p>\n ) : (\n filteredOptions.map((option) => {\n const isSelected = value === option.value;\n return (\n <div\n key={option.value}\n className={cn(\n 'flex items-center gap-2 rounded-sm px-2 h-9 cursor-pointer select-none',\n 'paragraph-small-medium text-gray-950',\n 'hover:bg-gray-100',\n isSelected && 'bg-gray-50'\n )}\n onClick={() => handleSelect(option.value)}\n >\n <span className=\"flex-1 truncate\">{option.label}</span>\n {isSelected && <IconCheck className=\"size-4 shrink-0 text-pages-600\" />}\n </div>\n );\n })\n )}\n </div>\n </PopoverContent>\n </Popover>\n </div>\n );\n}\n\nexport default ComboboxField;\n"],"mappings":"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","names":[]}
|
|
@@ -54,7 +54,7 @@ function SelectField({
|
|
|
54
54
|
className: cn(
|
|
55
55
|
"paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors",
|
|
56
56
|
error ? "border-red-600 hover:border-red-700 focus:border-red-600" : "border-gray-200 hover:border-gray-400 focus-within:border-gray-950 focus:border-gray-950",
|
|
57
|
-
disabled
|
|
57
|
+
disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer",
|
|
58
58
|
className
|
|
59
59
|
),
|
|
60
60
|
icon,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/ui/form/SelectField.tsx"],"sourcesContent":["'use client';\r\n\r\nimport React from 'react';\r\nimport {\r\n Select,\r\n SelectContent,\r\n SelectItem,\r\n SelectTrigger,\r\n SelectValue,\r\n} from './Select';\r\nimport { cn } from '../../../infra/utils/clsx';\r\n\r\ntype SelectOption = {\r\n value: string | number | boolean;\r\n label: React.ReactNode;\r\n displayValue?: string;\r\n};\r\n\r\ninterface SelectFieldProps {\r\n options: SelectOption[];\r\n label?: string;\r\n optional?: boolean;\r\n required?: boolean;\r\n hintMessage?: string;\r\n error?: boolean;\r\n errorMessage?: string;\r\n placeholder?: string;\r\n value?: string | number | boolean;\r\n defaultValue?: string | number | boolean;\r\n onChange?: (value: string | number | boolean) => void;\r\n disabled?: boolean;\r\n icon?: React.ReactNode;\r\n className?: string;\r\n containerClassName?: string;\r\n}\r\n\r\nexport function SelectField({\r\n label,\r\n optional = false,\r\n required = false,\r\n hintMessage,\r\n error = false,\r\n errorMessage,\r\n placeholder = 'Selecione uma opção',\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n disabled = false,\r\n icon,\r\n className,\r\n containerClassName,\r\n}: SelectFieldProps) {\r\n const handleValueChange = (selectedValue: string) => {\r\n if (!onChange) return;\r\n const selectedOption = options.find((option) => String(option.value) === selectedValue);\r\n if (selectedOption) {\r\n onChange(selectedOption.value);\r\n }\r\n };\r\n\r\n const finalMessage = error && errorMessage ? errorMessage : hintMessage;\r\n const messageColor = error ? 'text-red-600' : 'text-gray-600';\r\n\r\n return (\r\n <div className={cn('flex flex-col gap-1.5', containerClassName)}>\r\n {label && (\r\n <div className=\"flex items-center gap-1 paragraph-xsmall-semibold\">\r\n <span className=\"text-gray-600\">{label}</span>\r\n {optional && <span className=\"text-gray-500\">(Opcional)</span>}\r\n {required && <span className=\"text-red-600\">*</span>}\r\n </div>\r\n )}\r\n\r\n <Select\r\n value={value !== undefined ? String(value) : undefined}\r\n defaultValue={defaultValue !== undefined ? String(defaultValue) : undefined}\r\n onValueChange={handleValueChange}\r\n disabled={disabled}\r\n >\r\n <SelectTrigger\r\n className={cn(\r\n 'paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors',\r\n error\r\n ? 'border-red-600 hover:border-red-700 focus:border-red-600'\r\n : 'border-gray-200 hover:border-gray-400 focus-within:border-gray-950 focus:border-gray-950',\r\n disabled
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/ui/form/SelectField.tsx"],"sourcesContent":["'use client';\r\n\r\nimport React from 'react';\r\nimport {\r\n Select,\r\n SelectContent,\r\n SelectItem,\r\n SelectTrigger,\r\n SelectValue,\r\n} from './Select';\r\nimport { cn } from '../../../infra/utils/clsx';\r\n\r\ntype SelectOption = {\r\n value: string | number | boolean;\r\n label: React.ReactNode;\r\n displayValue?: string;\r\n};\r\n\r\ninterface SelectFieldProps {\r\n options: SelectOption[];\r\n label?: string;\r\n optional?: boolean;\r\n required?: boolean;\r\n hintMessage?: string;\r\n error?: boolean;\r\n errorMessage?: string;\r\n placeholder?: string;\r\n value?: string | number | boolean;\r\n defaultValue?: string | number | boolean;\r\n onChange?: (value: string | number | boolean) => void;\r\n disabled?: boolean;\r\n icon?: React.ReactNode;\r\n className?: string;\r\n containerClassName?: string;\r\n}\r\n\r\nexport function SelectField({\r\n label,\r\n optional = false,\r\n required = false,\r\n hintMessage,\r\n error = false,\r\n errorMessage,\r\n placeholder = 'Selecione uma opção',\r\n options,\r\n value,\r\n defaultValue,\r\n onChange,\r\n disabled = false,\r\n icon,\r\n className,\r\n containerClassName,\r\n}: SelectFieldProps) {\r\n const handleValueChange = (selectedValue: string) => {\r\n if (!onChange) return;\r\n const selectedOption = options.find((option) => String(option.value) === selectedValue);\r\n if (selectedOption) {\r\n onChange(selectedOption.value);\r\n }\r\n };\r\n\r\n const finalMessage = error && errorMessage ? errorMessage : hintMessage;\r\n const messageColor = error ? 'text-red-600' : 'text-gray-600';\r\n\r\n return (\r\n <div className={cn('flex flex-col gap-1.5', containerClassName)}>\r\n {label && (\r\n <div className=\"flex items-center gap-1 paragraph-xsmall-semibold\">\r\n <span className=\"text-gray-600\">{label}</span>\r\n {optional && <span className=\"text-gray-500\">(Opcional)</span>}\r\n {required && <span className=\"text-red-600\">*</span>}\r\n </div>\r\n )}\r\n\r\n <Select\r\n value={value !== undefined ? String(value) : undefined}\r\n defaultValue={defaultValue !== undefined ? String(defaultValue) : undefined}\r\n onValueChange={handleValueChange}\r\n disabled={disabled}\r\n >\r\n <SelectTrigger\r\n className={cn(\r\n 'paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors',\r\n error\r\n ? 'border-red-600 hover:border-red-700 focus:border-red-600'\r\n : 'border-gray-200 hover:border-gray-400 focus-within:border-gray-950 focus:border-gray-950',\r\n disabled ? 'cursor-not-allowed opacity-50' : 'cursor-pointer',\r\n className\r\n )}\r\n icon={icon}\r\n >\r\n <SelectValue placeholder={placeholder}>\r\n {value !== undefined &&\r\n (() => {\r\n const selectedOption = options.find((opt) => String(opt.value) === String(value));\r\n return selectedOption?.displayValue || selectedOption?.label;\r\n })()}\r\n </SelectValue>\r\n </SelectTrigger>\r\n <SelectContent sideOffset={4}>\r\n {options.map((option) => (\r\n <SelectItem key={String(option.value)} value={String(option.value)}>\r\n {option.label}\r\n </SelectItem>\r\n ))}\r\n </SelectContent>\r\n </Select>\r\n\r\n {finalMessage && (\r\n <span className={cn('paragraph-xsmall-medium', messageColor)}>{finalMessage}</span>\r\n )}\r\n </div>\r\n );\r\n}\r\n\r\nSelectField.displayName = 'SelectField';\r\n\r\nexport default SelectField;\r\n"],"mappings":";AAmEQ,SACE,KADF;AAhER;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU;AA0BZ,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,oBAAoB,CAAC,kBAA0B;AACnD,QAAI,CAAC,SAAU;AACf,UAAM,iBAAiB,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,KAAK,MAAM,aAAa;AACtF,QAAI,gBAAgB;AAClB,eAAS,eAAe,KAAK;AAAA,IAC/B;AAAA,EACF;AAEA,QAAM,eAAe,SAAS,eAAe,eAAe;AAC5D,QAAM,eAAe,QAAQ,iBAAiB;AAE9C,SACE,qBAAC,SAAI,WAAW,GAAG,yBAAyB,kBAAkB,GAC3D;AAAA,aACC,qBAAC,SAAI,WAAU,qDACb;AAAA,0BAAC,UAAK,WAAU,iBAAiB,iBAAM;AAAA,MACtC,YAAY,oBAAC,UAAK,WAAU,iBAAgB,wBAAU;AAAA,MACtD,YAAY,oBAAC,UAAK,WAAU,gBAAe,eAAC;AAAA,OAC/C;AAAA,IAGF;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,UAAU,SAAY,OAAO,KAAK,IAAI;AAAA,QAC7C,cAAc,iBAAiB,SAAY,OAAO,YAAY,IAAI;AAAA,QAClE,eAAe;AAAA,QACf;AAAA,QAEA;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,QACI,6DACA;AAAA,gBACJ,WAAW,kCAAkC;AAAA,gBAC7C;AAAA,cACF;AAAA,cACA;AAAA,cAEA,8BAAC,eAAY,aACV,oBAAU,WACR,MAAM;AACL,sBAAM,iBAAiB,QAAQ,KAAK,CAAC,QAAQ,OAAO,IAAI,KAAK,MAAM,OAAO,KAAK,CAAC;AAChF,uBAAO,gBAAgB,gBAAgB,gBAAgB;AAAA,cACzD,GAAG,GACP;AAAA;AAAA,UACF;AAAA,UACA,oBAAC,iBAAc,YAAY,GACxB,kBAAQ,IAAI,CAAC,WACZ,oBAAC,cAAsC,OAAO,OAAO,OAAO,KAAK,GAC9D,iBAAO,SADO,OAAO,OAAO,KAAK,CAEpC,CACD,GACH;AAAA;AAAA;AAAA,IACF;AAAA,IAEC,gBACC,oBAAC,UAAK,WAAW,GAAG,2BAA2B,YAAY,GAAI,wBAAa;AAAA,KAEhF;AAEJ;AAEA,YAAY,cAAc;AAE1B,IAAO,sBAAQ;","names":[]}
|
package/package.json
CHANGED
|
@@ -83,7 +83,7 @@ export function ComboboxField({
|
|
|
83
83
|
'paragraph-small-medium w-full h-10 text-gray-950 px-4 transition-colors',
|
|
84
84
|
'flex items-center justify-between gap-2 rounded-md border bg-transparent',
|
|
85
85
|
'border-gray-200 hover:border-gray-400 focus:border-gray-950 focus:outline-none',
|
|
86
|
-
disabled
|
|
86
|
+
disabled ? 'cursor-not-allowed opacity-50' : 'cursor-pointer',
|
|
87
87
|
className
|
|
88
88
|
)}
|
|
89
89
|
>
|
|
@@ -84,7 +84,7 @@ export function SelectField({
|
|
|
84
84
|
error
|
|
85
85
|
? 'border-red-600 hover:border-red-700 focus:border-red-600'
|
|
86
86
|
: 'border-gray-200 hover:border-gray-400 focus-within:border-gray-950 focus:border-gray-950',
|
|
87
|
-
disabled
|
|
87
|
+
disabled ? 'cursor-not-allowed opacity-50' : 'cursor-pointer',
|
|
88
88
|
className
|
|
89
89
|
)}
|
|
90
90
|
icon={icon}
|