brd-ui-kit 0.1.70 → 0.1.72
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/brd-ui-kit.css +1 -1
- package/dist/components/basic-table/basic-table.d.ts +3 -1
- package/dist/components/input-contact/input-contact.d.ts +2 -2
- package/dist/components/ui/calendar/calendar.d.ts +19 -0
- package/dist/components/ui/calendar/calendar.styles.d.ts +4 -0
- package/dist/components/ui/calendar/index.d.ts +2 -0
- package/dist/components/ui/calendar.d.ts +2 -0
- package/dist/components/ui/icon/icon-presets.d.ts +35 -0
- package/dist/components/ui/icon/icon.d.ts +11 -7
- package/dist/components/ui/icon/index.d.ts +3 -1
- package/dist/components/ui/radio-group/radio-group.styles.d.ts +1 -1
- package/dist/components/ui/sonner/sonner.styles.d.ts +1 -1
- package/dist/components/ui/switch/switch.styles.d.ts +1 -1
- package/dist/components/ui/table/table.d.ts +2 -1
- package/dist/components-app-pagination-app-pagination.cjs +1 -1
- package/dist/components-app-pagination-app-pagination.cjs.map +1 -1
- package/dist/components-app-pagination-app-pagination.js +35 -35
- package/dist/components-app-pagination-app-pagination.js.map +1 -1
- package/dist/components-app-sidebar-app-sidebar.cjs +1 -1
- package/dist/components-app-sidebar-app-sidebar.cjs.map +1 -1
- package/dist/components-app-sidebar-app-sidebar.js +16 -16
- package/dist/components-app-sidebar-app-sidebar.js.map +1 -1
- package/dist/components-avatar-uploader-avatar-uploader.cjs +1 -1
- package/dist/components-avatar-uploader-avatar-uploader.cjs.map +1 -1
- package/dist/components-avatar-uploader-avatar-uploader.js +3 -4
- package/dist/components-avatar-uploader-avatar-uploader.js.map +1 -1
- package/dist/components-basic-avatar-basic-avatar.cjs +2 -2
- package/dist/components-basic-avatar-basic-avatar.cjs.map +1 -1
- package/dist/components-basic-avatar-basic-avatar.js +12 -12
- package/dist/components-basic-avatar-basic-avatar.js.map +1 -1
- package/dist/components-basic-table-basic-table.cjs +2 -2
- package/dist/components-basic-table-basic-table.cjs.map +1 -1
- package/dist/components-basic-table-basic-table.js +259 -255
- package/dist/components-basic-table-basic-table.js.map +1 -1
- package/dist/components-files-uploader-files-uploader.cjs +3 -3
- package/dist/components-files-uploader-files-uploader.cjs.map +1 -1
- package/dist/components-files-uploader-files-uploader.js +29 -29
- package/dist/components-files-uploader-files-uploader.js.map +1 -1
- package/dist/components-input-contact-input-contact.cjs +4 -8
- package/dist/components-input-contact-input-contact.cjs.map +1 -1
- package/dist/components-input-contact-input-contact.js +92 -109
- package/dist/components-input-contact-input-contact.js.map +1 -1
- package/dist/components-input-password-input-password.cjs +1 -1
- package/dist/components-input-password-input-password.cjs.map +1 -1
- package/dist/components-input-password-input-password.js +2 -2
- package/dist/components-input-password-input-password.js.map +1 -1
- package/dist/components-input-phone-input-phone.cjs +1 -29
- package/dist/components-input-phone-input-phone.cjs.map +1 -1
- package/dist/components-input-phone-input-phone.js +469 -814
- package/dist/components-input-phone-input-phone.js.map +1 -1
- package/dist/components-ui-button-button.styles.cjs +4 -4
- package/dist/components-ui-button-button.styles.cjs.map +1 -1
- package/dist/components-ui-button-button.styles.js +5 -5
- package/dist/components-ui-button-button.styles.js.map +1 -1
- package/dist/components-ui-calendar-calendar.cjs +13 -0
- package/dist/components-ui-calendar-calendar.cjs.map +1 -0
- package/dist/components-ui-calendar-calendar.js +3761 -0
- package/dist/components-ui-calendar-calendar.js.map +1 -0
- package/dist/components-ui-calendar-calendar.styles.cjs +14 -0
- package/dist/components-ui-calendar-calendar.styles.cjs.map +1 -0
- package/dist/components-ui-calendar-calendar.styles.js +34 -0
- package/dist/components-ui-calendar-calendar.styles.js.map +1 -0
- package/dist/components-ui-calendar.cjs +2 -0
- package/dist/components-ui-calendar.cjs.map +1 -0
- package/dist/components-ui-calendar.js +6 -0
- package/dist/components-ui-calendar.js.map +1 -0
- package/dist/components-ui-card-card.styles.cjs +2 -2
- package/dist/components-ui-card-card.styles.cjs.map +1 -1
- package/dist/components-ui-card-card.styles.js +6 -6
- package/dist/components-ui-card-card.styles.js.map +1 -1
- package/dist/components-ui-checkbox-checkbox.cjs +1 -1
- package/dist/components-ui-checkbox-checkbox.cjs.map +1 -1
- package/dist/components-ui-checkbox-checkbox.js +12 -11
- package/dist/components-ui-checkbox-checkbox.js.map +1 -1
- package/dist/components-ui-checkbox-checkbox.styles.cjs +1 -1
- package/dist/components-ui-checkbox-checkbox.styles.cjs.map +1 -1
- package/dist/components-ui-checkbox-checkbox.styles.js +2 -2
- package/dist/components-ui-checkbox-checkbox.styles.js.map +1 -1
- package/dist/components-ui-combobox-combobox.cjs +4 -4
- package/dist/components-ui-combobox-combobox.cjs.map +1 -1
- package/dist/components-ui-combobox-combobox.js +18 -18
- package/dist/components-ui-combobox-combobox.js.map +1 -1
- package/dist/components-ui-dialog-dialog.cjs +1 -1
- package/dist/components-ui-dialog-dialog.cjs.map +1 -1
- package/dist/components-ui-dialog-dialog.js +4 -10
- package/dist/components-ui-dialog-dialog.js.map +1 -1
- package/dist/components-ui-field-field.js +13 -13
- package/dist/components-ui-icon-icon-presets.cjs +2 -0
- package/dist/components-ui-icon-icon-presets.cjs.map +1 -0
- package/dist/components-ui-icon-icon-presets.js +14 -0
- package/dist/components-ui-icon-icon-presets.js.map +1 -0
- package/dist/components-ui-icon-icon.cjs +1 -1
- package/dist/components-ui-icon-icon.cjs.map +1 -1
- package/dist/components-ui-icon-icon.js +62714 -34
- package/dist/components-ui-icon-icon.js.map +1 -1
- package/dist/components-ui-icon.cjs +1 -1
- package/dist/components-ui-icon.js +4 -2
- package/dist/components-ui-icon.js.map +1 -1
- package/dist/components-ui-pagination-pagination.cjs +1 -1
- package/dist/components-ui-pagination-pagination.cjs.map +1 -1
- package/dist/components-ui-pagination-pagination.js +50 -50
- package/dist/components-ui-pagination-pagination.js.map +1 -1
- package/dist/components-ui-popover-popover.js +4 -4
- package/dist/components-ui-radio-group-radio-group.styles.cjs +1 -1
- package/dist/components-ui-radio-group-radio-group.styles.cjs.map +1 -1
- package/dist/components-ui-radio-group-radio-group.styles.js +2 -2
- package/dist/components-ui-radio-group-radio-group.styles.js.map +1 -1
- package/dist/components-ui-select-select.cjs +1 -1
- package/dist/components-ui-select-select.cjs.map +1 -1
- package/dist/components-ui-select-select.js +10 -10
- package/dist/components-ui-select-select.js.map +1 -1
- package/dist/components-ui-sonner-sonner.cjs +1 -1
- package/dist/components-ui-sonner-sonner.cjs.map +1 -1
- package/dist/components-ui-sonner-sonner.js +14 -14
- package/dist/components-ui-sonner-sonner.js.map +1 -1
- package/dist/components-ui-sonner-sonner.styles.cjs +1 -1
- package/dist/components-ui-sonner-sonner.styles.cjs.map +1 -1
- package/dist/components-ui-sonner-sonner.styles.js +1 -1
- package/dist/components-ui-sonner-sonner.styles.js.map +1 -1
- package/dist/components-ui-switch-switch.styles.cjs +1 -1
- package/dist/components-ui-switch-switch.styles.cjs.map +1 -1
- package/dist/components-ui-switch-switch.styles.js +2 -2
- package/dist/components-ui-switch-switch.styles.js.map +1 -1
- package/dist/components-ui-table-table.cjs +4 -4
- package/dist/components-ui-table-table.cjs.map +1 -1
- package/dist/components-ui-table-table.js +89 -85
- package/dist/components-ui-table-table.js.map +1 -1
- package/dist/components-ui-tabs-tabs.styles.cjs +1 -1
- package/dist/components-ui-tabs-tabs.styles.cjs.map +1 -1
- package/dist/components-ui-tabs-tabs.styles.js +1 -1
- package/dist/components-ui-tabs-tabs.styles.js.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +23 -20
- package/dist/index.js.map +1 -1
- package/dist/types/types.d.ts +2 -2
- package/package.json +13 -1
- package/dist/components/ui/icon/icon-dictionary.d.ts +0 -60
- package/dist/components/ui/icon/overrides.d.ts +0 -21
- package/dist/components-ui-icon-icon-dictionary.cjs +0 -2
- package/dist/components-ui-icon-icon-dictionary.cjs.map +0 -1
- package/dist/components-ui-icon-icon-dictionary.js +0 -63
- package/dist/components-ui-icon-icon-dictionary.js.map +0 -1
- package/dist/components-ui-icon-overrides.cjs +0 -2
- package/dist/components-ui-icon-overrides.cjs.map +0 -1
- package/dist/components-ui-icon-overrides.js +0 -175
- package/dist/components-ui-icon-overrides.js.map +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("./lib-utils.cjs"),b=require("react"),D=require("./index-DJD-8LQA.cjs"),h=require("./components-ui-icon-icon.cjs"),L=require("./components-ui-typography-typography.cjs");require("./components-ui-typography-typography.styles.cjs");const $=["B","KB","MB","GB","TB"],u=1024,B=5*u*u,P=5,C=["all"],F=800,k={image:{"image/*":[".jpg",".jpeg",".png",".webp"]},pdf:{"application/pdf":[".pdf"]},doc:{"application/msword":[".doc"],"application/vnd.openxmlformats-officedocument.wordprocessingml.document":[".docx"]},excel:{"application/vnd.ms-excel":[".xls"],"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":[".xlsx"]},text:{"text/plain":[".txt"]},all:{}},O=r=>{if(r===0)return"0 B";const e=Math.floor(Math.log(r)/Math.log(u));return`${(r/Math.pow(u,e)).toFixed(2)} ${$[e]}`},Z=r=>r.reduce((e,l)=>({...e,...k[l]}),{}),z=r=>{const e=r.name.split(".").pop()?.toLowerCase();return e?["jpg","jpeg","png","webp"].includes(e)?"image":e==="pdf"?"pdf":["doc","docx"].includes(e)?"doc":["xls","xlsx"].includes(e)?"excel":e==="txt"?"text":"other":"other"},K=({value:r=null,onChange:e,multiple:l=!1,maxFiles:i=P,disabled:y=!1,className:d,maxSize:g=B,variant:m="grid",accepts:T=C,icon:U,title:j,text:v,showFiles:_=!0})=>{const[f,w]=b.useState(!1),[A,x]=b.useState(null),s=Array.isArray(r)?r:r?[r]:[],E=b.useCallback((o,n)=>{if(x(null),s.length+o.length>i){x(`Максимальное количество файлов: ${i}`);return}if(n.length>0){const c=n[0].errors[0]?.code==="file-too-large"?`Файл слишком большой. Максимальный размер: ${g/1024/1024}MB`:"Неподдерживаемый формат файла";x(c);return}w(!0),setTimeout(()=>{const a=o.map(c=>({url:URL.createObjectURL(c),name:c.name,size:O(c.size),addedAt:new Date().toISOString()}));l?e?.([...s,...a]):(s[0]?.url?.startsWith("blob:")&&URL.revokeObjectURL(s[0].url),e?.(a[0]??null)),w(!1)},F)},[s,i,g,l,e]),{getRootProps:I,getInputProps:M,isDragActive:N}=D.useDropzone({onDrop:E,accept:Z(T),maxSize:g,multiple:l&&i>1,disabled:y||f,maxFiles:i-s.length}),R=o=>()=>{s[o]?.url?.startsWith("blob:")&&URL.revokeObjectURL(s[o].url);const n=s.filter((a,c)=>c!==o);e?.(l?n:n[0]||null)},S=s.length>=i,q={grid:"grid-cols-2 sm:grid-cols-3 md:grid-cols-4",list:"grid-cols-1",compact:"grid-cols-2 sm:grid-cols-3"};return t.jsxs("div",{className:p.cn("w-full space-y-4",d?.container),children:[t.jsxs("div",{className:p.cn("grid h-full w-full gap-4",m==="list"?"grid-cols-1":q[m]),children:[_&&s.map((o,n)=>{const a=z(o);return t.jsxs("div",{className:`group bg-primary-bg relative aspect-square h-full w-full
|
|
2
2
|
overflow-hidden rounded-lg`,children:[a==="image"?t.jsx("img",{src:o.url,alt:`Preview ${n+1}`,className:"h-full w-full object-cover"}):t.jsx("div",{className:`flex h-full w-full items-center justify-center bg-gray-100
|
|
3
3
|
text-sm font-semibold`,children:o.name.split(".").pop()?.toUpperCase()}),t.jsx("div",{className:`text-primary-bg bg-primary-inverse-bg/50 absolute inset-0 flex
|
|
4
4
|
cursor-pointer items-center justify-center rounded-lg opacity-0
|
|
5
|
-
transition-opacity hover:opacity-100`,onClick:c=>c.stopPropagation(),children:t.jsx(h.Icon,{type:"
|
|
5
|
+
transition-opacity hover:opacity-100`,onClick:c=>c.stopPropagation(),children:t.jsx(h.Icon,{type:"x",onClick:R(n)})})]},n)}),(!S||!_)&&t.jsxs("div",{...I(),className:p.cn(`relative flex cursor-pointer flex-col items-center justify-center
|
|
6
6
|
rounded-lg border-2 border-dashed border-gray-300 bg-gray-50
|
|
7
|
-
transition-colors hover:bg-gray-100`,N&&"border-primary bg-primary/5",(y||f)&&"cursor-not-allowed opacity-50",m==="list"?"min-h-37.5":"aspect-square",
|
|
7
|
+
transition-colors hover:bg-gray-100`,N&&"border-primary bg-primary/5",(y||f)&&"cursor-not-allowed opacity-50",m==="list"?"min-h-37.5":"aspect-square",d?.blockAdd),children:[t.jsx("input",{...M()}),f?t.jsx(h.Icon,{type:"spinner-gap",className:"text-sub-label-text h-8 w-8 animate-spin"}):t.jsxs("div",{className:"flex flex-col items-center space-y-2 p-4 text-center",children:[t.jsx(h.Icon,{type:U?.type??"plus",className:p.cn("text-sub-label-text h-8 w-8",d?.icon)}),t.jsx(L.Typography,{variant:"body-md-medium",className:p.cn("text-sub-label-text",d?.title),children:l?`${j||"Добавить"} (${s.length}/${i})`:`${j||"Добавить"}`}),v&&t.jsx(L.Typography,{variant:"body-xxs-medium",className:p.cn("text-sub-label-text",d?.text),children:v})]})]})]}),A&&t.jsx("div",{className:"rounded-lg bg-red-50 p-3 text-sm text-red-600",children:A})]})};exports.FilesUploader=K;
|
|
8
8
|
//# sourceMappingURL=components-files-uploader-files-uploader.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components-files-uploader-files-uploader.cjs","sources":["../src/components/files-uploader/files-uploader.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\";\nimport { useCallback, useState } from \"react\";\nimport { type FileRejection, useDropzone } from \"react-dropzone\";\nimport { Icon, type IconProps } from \"../ui/icon\";\nimport { Typography } from \"../ui/typography\";\n\ntype Variant = \"grid\" | \"list\" | \"compact\";\ntype AcceptType = \"image\" | \"pdf\" | \"doc\" | \"excel\" | \"text\" | \"all\";\ntype UploadedFileData = {\n url: string;\n name: string;\n size: string;\n addedAt: string;\n};\ntype FilesUploaderValue = UploadedFileData | UploadedFileData[] | null;\n\ntype PropsFilesUploader = {\n value?: FilesUploaderValue;\n onChange?: (value: FilesUploaderValue) => void;\n multiple?: boolean;\n maxFiles?: number;\n disabled?: boolean;\n className?: {\n container?: string;\n blockAdd?: string;\n title?: string;\n text?: string;\n icon?: string;\n };\n displayFiles?: boolean;\n maxSize?: number;\n variant?: Variant;\n accepts?: AcceptType[];\n icon?: IconProps;\n title?: string;\n text?: string;\n showFiles?: boolean,\n \n};\nconst FILE_SIZE_UNITS = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\"];\nconst FILE_SIZE_KB = 1024;\nconst DEFAULT_MAX_SIZE = 5 * FILE_SIZE_KB * FILE_SIZE_KB;\nconst DEFAULT_MAX_FILES = 5;\nconst DEFAULT_ACCEPT: AcceptType[] = [\"all\"];\nconst DEFAULT_TIMEOUT = 800;\n\nconst ACCEPT_MAP: Record<AcceptType, Record<string, string[]>> = {\n image: { \"image/*\": [\".jpg\", \".jpeg\", \".png\", \".webp\"] },\n pdf: { \"application/pdf\": [\".pdf\"] },\n doc: {\n \"application/msword\": [\".doc\"],\n \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\": [\".docx\"],\n },\n excel: {\n \"application/vnd.ms-excel\": [\".xls\"],\n \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\": [\".xlsx\"],\n },\n text: { \"text/plain\": [\".txt\"] },\n all: {},\n};\n\nconst formatFileSize = (bytes: number) => {\n if (bytes === 0) return \"0 B\";\n const i = Math.floor(Math.log(bytes) / Math.log(FILE_SIZE_KB));\n return `${(bytes / Math.pow(FILE_SIZE_KB, i)).toFixed(2)} ${FILE_SIZE_UNITS[i]}`;\n};\n\nconst fileAcceptMap = (accepts: AcceptType[]): Record<string, string[]> =>\n accepts.reduce((acc, t) => ({ ...acc, ...ACCEPT_MAP[t] }), {});\n\nconst getFileType = (file: UploadedFileData) => {\n const ext = file.name.split(\".\").pop()?.toLowerCase();\n\n if (!ext) return \"other\";\n\n if ([\"jpg\", \"jpeg\", \"png\", \"webp\"].includes(ext)) return \"image\";\n if (ext === \"pdf\") return \"pdf\";\n if ([\"doc\", \"docx\"].includes(ext)) return \"doc\";\n if ([\"xls\", \"xlsx\"].includes(ext)) return \"excel\";\n if (ext === \"txt\") return \"text\";\n\n return \"other\";\n};\n\nexport const FilesUploader = ({\n value = null,\n onChange,\n multiple = false,\n maxFiles = DEFAULT_MAX_FILES,\n disabled = false,\n className,\n maxSize = DEFAULT_MAX_SIZE,\n variant = \"grid\",\n accepts = DEFAULT_ACCEPT,\n icon,\n title,\n text,\n showFiles = true,\n}: PropsFilesUploader) => {\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n const files = Array.isArray(value) ? value : value ? [value] : [];\n \n\n const onDrop = useCallback(\n (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n setError(null);\n\n if (files.length + acceptedFiles.length > maxFiles) {\n setError(`Максимальное количество файлов: ${maxFiles}`);\n return;\n }\n\n if (rejectedFiles.length > 0) {\n const rejection = rejectedFiles[0];\n const errorMessage =\n rejection.errors[0]?.code === \"file-too-large\"\n ? `Файл слишком большой. Максимальный размер: ${maxSize / 1024 / 1024}MB`\n : \"Неподдерживаемый формат файла\";\n setError(errorMessage);\n return;\n }\n\n setLoading(true);\n\n setTimeout(() => {\n const newFilesData: UploadedFileData[] = acceptedFiles.map((file) => ({\n url: URL.createObjectURL(file),\n name: file.name,\n size: formatFileSize(file.size),\n addedAt: new Date().toISOString(),\n }));\n\n if (multiple) {\n onChange?.([...files, ...newFilesData]);\n } else {\n if (files[0]?.url?.startsWith(\"blob:\")) URL.revokeObjectURL(files[0].url);\n onChange?.(newFilesData[0] ?? null);\n }\n\n setLoading(false);\n }, DEFAULT_TIMEOUT);\n },\n [files, maxFiles, maxSize, multiple, onChange],\n );\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n onDrop,\n accept: fileAcceptMap(accepts),\n maxSize,\n multiple: multiple && maxFiles > 1,\n disabled: disabled || loading,\n maxFiles: maxFiles - files.length,\n });\n\n const removeImage = (index: number) => {\n return () => {\n if (files[index]?.url?.startsWith(\"blob:\")) {\n URL.revokeObjectURL(files[index].url);\n }\n const newFiles = files.filter((_, i) => i !== index);\n onChange?.(multiple ? newFiles : newFiles[0] || null);\n };\n };\n\n const isMaxFilesReached = files.length >= maxFiles;\n\n // Варианты отображения\n const gridClasses = {\n grid: \"grid-cols-2 sm:grid-cols-3 md:grid-cols-4\",\n list: \"grid-cols-1\",\n compact: \"grid-cols-2 sm:grid-cols-3\",\n };\n\n return (\n <div className={cn(\"w-full space-y-4\", className?.container)}>\n {/* Предпросмотр с возможностью добавления новых */}\n <div\n className={cn(\n \"grid h-full w-full gap-4\",\n variant === \"list\" ? \"grid-cols-1\" : gridClasses[variant],\n )}\n >\n {showFiles && files.map((file, index) => {\n const type = getFileType(file);\n\n return (\n <div\n key={index}\n className=\"group bg-primary-bg relative aspect-square h-full w-full\n overflow-hidden rounded-lg\"\n >\n {type === \"image\" ? (\n <img\n src={file.url}\n alt={`Preview ${index + 1}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div\n className=\"flex h-full w-full items-center justify-center bg-gray-100\n text-sm font-semibold\"\n >\n {file.name.split(\".\").pop()?.toUpperCase()}\n </div>\n )}\n\n <div\n className=\"text-primary-bg bg-primary-inverse-bg/50 absolute inset-0 flex\n cursor-pointer items-center justify-center rounded-lg opacity-0\n transition-opacity hover:opacity-100\"\n onClick={(e) => e.stopPropagation()}\n >\n <Icon\n type=\"close\"\n onClick={removeImage(index)}\n />\n </div>\n </div>\n );\n })}\n {/* Кнопка добавления нового изображения */}\n {(!isMaxFilesReached || !showFiles) && (\n <div\n {...getRootProps()}\n className={cn(\n `relative flex cursor-pointer flex-col items-center justify-center\n rounded-lg border-2 border-dashed border-gray-300 bg-gray-50\n transition-colors hover:bg-gray-100`,\n isDragActive && \"border-primary bg-primary/5\",\n (disabled || loading) && \"cursor-not-allowed opacity-50\",\n variant === \"list\" ? \"min-h-37.5\" : \"aspect-square\",\n className?.blockAdd,\n )}\n >\n <input {...getInputProps()} />\n\n {loading ? (\n <Icon\n type=\"loader\"\n className=\"text-sub-label-text h-8 w-8 animate-spin\"\n />\n ) : (\n <div className=\"flex flex-col items-center space-y-2 p-4 text-center\">\n <Icon\n type={icon?.type ?? \"plus\"}\n className={cn(\"text-sub-label-text h-8 w-8\", className?.icon)}\n />\n <Typography\n variant=\"body-md-medium\"\n className={cn(\"text-sub-label-text\", className?.title)}\n >\n {multiple\n ? `${title || \"Добавить\"} (${files.length}/${maxFiles})`\n : `${title || \"Добавить\"}`}\n </Typography>\n {text && (\n <Typography variant=\"body-xxs-medium\" className={cn(\"text-sub-label-text\", className?.text)}>\n {text}\n </Typography>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* Информация о количестве */}\n {/* {multiple && images.length > 0 && (\n <p className=\"text-xs text-gray-500\">\n Загружено {images.length} из {maxFiles} изображений\n </p>\n )} */}\n\n {/* Ошибка */}\n {error && (\n <div className=\"rounded-lg bg-red-50 p-3 text-sm text-red-600\">{error}</div>\n )}\n </div>\n );\n};\n\nexport type { PropsFilesUploader, UploadedFileData, FilesUploaderValue };\n\n"],"names":["FILE_SIZE_UNITS","FILE_SIZE_KB","DEFAULT_MAX_SIZE","DEFAULT_MAX_FILES","DEFAULT_ACCEPT","DEFAULT_TIMEOUT","ACCEPT_MAP","formatFileSize","bytes","i","fileAcceptMap","accepts","acc","t","getFileType","file","ext","FilesUploader","value","onChange","multiple","maxFiles","disabled","className","maxSize","variant","icon","title","text","showFiles","loading","setLoading","useState","error","setError","files","onDrop","useCallback","acceptedFiles","rejectedFiles","errorMessage","newFilesData","getRootProps","getInputProps","isDragActive","useDropzone","removeImage","index","newFiles","_","isMaxFilesReached","gridClasses","cn","jsxs","type","jsx","e","Icon","Typography"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components-files-uploader-files-uploader.cjs","sources":["../src/components/files-uploader/files-uploader.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\";\nimport { useCallback, useState } from \"react\";\nimport { type FileRejection, useDropzone } from \"react-dropzone\";\nimport { Icon, type IconProps } from \"../ui/icon\";\nimport { Typography } from \"../ui/typography\";\n\ntype Variant = \"grid\" | \"list\" | \"compact\";\ntype AcceptType = \"image\" | \"pdf\" | \"doc\" | \"excel\" | \"text\" | \"all\";\ntype UploadedFileData = {\n url: string;\n name: string;\n size: string;\n addedAt: string;\n};\ntype FilesUploaderValue = UploadedFileData | UploadedFileData[] | null;\n\ntype PropsFilesUploader = {\n value?: FilesUploaderValue;\n onChange?: (value: FilesUploaderValue) => void;\n multiple?: boolean;\n maxFiles?: number;\n disabled?: boolean;\n className?: {\n container?: string;\n blockAdd?: string;\n title?: string;\n text?: string;\n icon?: string;\n };\n displayFiles?: boolean;\n maxSize?: number;\n variant?: Variant;\n accepts?: AcceptType[];\n icon?: IconProps;\n title?: string;\n text?: string;\n showFiles?: boolean,\n \n};\nconst FILE_SIZE_UNITS = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\"];\nconst FILE_SIZE_KB = 1024;\nconst DEFAULT_MAX_SIZE = 5 * FILE_SIZE_KB * FILE_SIZE_KB;\nconst DEFAULT_MAX_FILES = 5;\nconst DEFAULT_ACCEPT: AcceptType[] = [\"all\"];\nconst DEFAULT_TIMEOUT = 800;\n\nconst ACCEPT_MAP: Record<AcceptType, Record<string, string[]>> = {\n image: { \"image/*\": [\".jpg\", \".jpeg\", \".png\", \".webp\"] },\n pdf: { \"application/pdf\": [\".pdf\"] },\n doc: {\n \"application/msword\": [\".doc\"],\n \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\": [\".docx\"],\n },\n excel: {\n \"application/vnd.ms-excel\": [\".xls\"],\n \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\": [\".xlsx\"],\n },\n text: { \"text/plain\": [\".txt\"] },\n all: {},\n};\n\nconst formatFileSize = (bytes: number) => {\n if (bytes === 0) return \"0 B\";\n const i = Math.floor(Math.log(bytes) / Math.log(FILE_SIZE_KB));\n return `${(bytes / Math.pow(FILE_SIZE_KB, i)).toFixed(2)} ${FILE_SIZE_UNITS[i]}`;\n};\n\nconst fileAcceptMap = (accepts: AcceptType[]): Record<string, string[]> =>\n accepts.reduce((acc, t) => ({ ...acc, ...ACCEPT_MAP[t] }), {});\n\nconst getFileType = (file: UploadedFileData) => {\n const ext = file.name.split(\".\").pop()?.toLowerCase();\n\n if (!ext) return \"other\";\n\n if ([\"jpg\", \"jpeg\", \"png\", \"webp\"].includes(ext)) return \"image\";\n if (ext === \"pdf\") return \"pdf\";\n if ([\"doc\", \"docx\"].includes(ext)) return \"doc\";\n if ([\"xls\", \"xlsx\"].includes(ext)) return \"excel\";\n if (ext === \"txt\") return \"text\";\n\n return \"other\";\n};\n\nexport const FilesUploader = ({\n value = null,\n onChange,\n multiple = false,\n maxFiles = DEFAULT_MAX_FILES,\n disabled = false,\n className,\n maxSize = DEFAULT_MAX_SIZE,\n variant = \"grid\",\n accepts = DEFAULT_ACCEPT,\n icon,\n title,\n text,\n showFiles = true,\n}: PropsFilesUploader) => {\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n const files = Array.isArray(value) ? value : value ? [value] : [];\n \n\n const onDrop = useCallback(\n (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n setError(null);\n\n if (files.length + acceptedFiles.length > maxFiles) {\n setError(`Максимальное количество файлов: ${maxFiles}`);\n return;\n }\n\n if (rejectedFiles.length > 0) {\n const rejection = rejectedFiles[0];\n const errorMessage =\n rejection.errors[0]?.code === \"file-too-large\"\n ? `Файл слишком большой. Максимальный размер: ${maxSize / 1024 / 1024}MB`\n : \"Неподдерживаемый формат файла\";\n setError(errorMessage);\n return;\n }\n\n setLoading(true);\n\n setTimeout(() => {\n const newFilesData: UploadedFileData[] = acceptedFiles.map((file) => ({\n url: URL.createObjectURL(file),\n name: file.name,\n size: formatFileSize(file.size),\n addedAt: new Date().toISOString(),\n }));\n\n if (multiple) {\n onChange?.([...files, ...newFilesData]);\n } else {\n if (files[0]?.url?.startsWith(\"blob:\")) URL.revokeObjectURL(files[0].url);\n onChange?.(newFilesData[0] ?? null);\n }\n\n setLoading(false);\n }, DEFAULT_TIMEOUT);\n },\n [files, maxFiles, maxSize, multiple, onChange],\n );\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n onDrop,\n accept: fileAcceptMap(accepts),\n maxSize,\n multiple: multiple && maxFiles > 1,\n disabled: disabled || loading,\n maxFiles: maxFiles - files.length,\n });\n\n const removeImage = (index: number) => {\n return () => {\n if (files[index]?.url?.startsWith(\"blob:\")) {\n URL.revokeObjectURL(files[index].url);\n }\n const newFiles = files.filter((_, i) => i !== index);\n onChange?.(multiple ? newFiles : newFiles[0] || null);\n };\n };\n\n const isMaxFilesReached = files.length >= maxFiles;\n\n // Варианты отображения\n const gridClasses = {\n grid: \"grid-cols-2 sm:grid-cols-3 md:grid-cols-4\",\n list: \"grid-cols-1\",\n compact: \"grid-cols-2 sm:grid-cols-3\",\n };\n\n return (\n <div className={cn(\"w-full space-y-4\", className?.container)}>\n {/* Предпросмотр с возможностью добавления новых */}\n <div\n className={cn(\n \"grid h-full w-full gap-4\",\n variant === \"list\" ? \"grid-cols-1\" : gridClasses[variant],\n )}\n >\n {showFiles && files.map((file, index) => {\n const type = getFileType(file);\n\n return (\n <div\n key={index}\n className=\"group bg-primary-bg relative aspect-square h-full w-full\n overflow-hidden rounded-lg\"\n >\n {type === \"image\" ? (\n <img\n src={file.url}\n alt={`Preview ${index + 1}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div\n className=\"flex h-full w-full items-center justify-center bg-gray-100\n text-sm font-semibold\"\n >\n {file.name.split(\".\").pop()?.toUpperCase()}\n </div>\n )}\n\n <div\n className=\"text-primary-bg bg-primary-inverse-bg/50 absolute inset-0 flex\n cursor-pointer items-center justify-center rounded-lg opacity-0\n transition-opacity hover:opacity-100\"\n onClick={(e) => e.stopPropagation()}\n >\n <Icon\n type=\"x\"\n onClick={removeImage(index)}\n />\n </div>\n </div>\n );\n })}\n {/* Кнопка добавления нового изображения */}\n {(!isMaxFilesReached || !showFiles) && (\n <div\n {...getRootProps()}\n className={cn(\n `relative flex cursor-pointer flex-col items-center justify-center\n rounded-lg border-2 border-dashed border-gray-300 bg-gray-50\n transition-colors hover:bg-gray-100`,\n isDragActive && \"border-primary bg-primary/5\",\n (disabled || loading) && \"cursor-not-allowed opacity-50\",\n variant === \"list\" ? \"min-h-37.5\" : \"aspect-square\",\n className?.blockAdd,\n )}\n >\n <input {...getInputProps()} />\n\n {loading ? (\n <Icon\n type=\"spinner-gap\"\n className=\"text-sub-label-text h-8 w-8 animate-spin\"\n />\n ) : (\n <div className=\"flex flex-col items-center space-y-2 p-4 text-center\">\n <Icon\n type={icon?.type ?? \"plus\"}\n className={cn(\"text-sub-label-text h-8 w-8\", className?.icon)}\n />\n <Typography\n variant=\"body-md-medium\"\n className={cn(\"text-sub-label-text\", className?.title)}\n >\n {multiple\n ? `${title || \"Добавить\"} (${files.length}/${maxFiles})`\n : `${title || \"Добавить\"}`}\n </Typography>\n {text && (\n <Typography variant=\"body-xxs-medium\" className={cn(\"text-sub-label-text\", className?.text)}>\n {text}\n </Typography>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* Информация о количестве */}\n {/* {multiple && images.length > 0 && (\n <p className=\"text-xs text-gray-500\">\n Загружено {images.length} из {maxFiles} изображений\n </p>\n )} */}\n\n {/* Ошибка */}\n {error && (\n <div className=\"rounded-lg bg-red-50 p-3 text-sm text-red-600\">{error}</div>\n )}\n </div>\n );\n};\n\nexport type { PropsFilesUploader, UploadedFileData, FilesUploaderValue };\n"],"names":["FILE_SIZE_UNITS","FILE_SIZE_KB","DEFAULT_MAX_SIZE","DEFAULT_MAX_FILES","DEFAULT_ACCEPT","DEFAULT_TIMEOUT","ACCEPT_MAP","formatFileSize","bytes","i","fileAcceptMap","accepts","acc","t","getFileType","file","ext","FilesUploader","value","onChange","multiple","maxFiles","disabled","className","maxSize","variant","icon","title","text","showFiles","loading","setLoading","useState","error","setError","files","onDrop","useCallback","acceptedFiles","rejectedFiles","errorMessage","newFilesData","getRootProps","getInputProps","isDragActive","useDropzone","removeImage","index","newFiles","_","isMaxFilesReached","gridClasses","cn","jsxs","type","jsx","e","Icon","Typography"],"mappings":"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"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsxs as u, jsx as s } from "react/jsx-runtime";
|
|
2
|
-
import { cn as
|
|
2
|
+
import { cn as p } from "./lib-utils.js";
|
|
3
3
|
import { useState as E, useCallback as C } from "react";
|
|
4
4
|
import { u as P } from "./index-CVlBIwtP.js";
|
|
5
5
|
import { Icon as x } from "./components-ui-icon-icon.js";
|
|
6
6
|
import { Typography as U } from "./components-ui-typography-typography.js";
|
|
7
7
|
import "./components-ui-typography-typography.styles.js";
|
|
8
|
-
const S = ["B", "KB", "MB", "GB", "TB"],
|
|
8
|
+
const S = ["B", "KB", "MB", "GB", "TB"], g = 1024, k = 5 * g * g, F = 5, O = ["all"], Z = 800, q = {
|
|
9
9
|
image: { "image/*": [".jpg", ".jpeg", ".png", ".webp"] },
|
|
10
10
|
pdf: { "application/pdf": [".pdf"] },
|
|
11
11
|
doc: {
|
|
@@ -20,19 +20,19 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
20
20
|
all: {}
|
|
21
21
|
}, z = (t) => {
|
|
22
22
|
if (t === 0) return "0 B";
|
|
23
|
-
const e = Math.floor(Math.log(t) / Math.log(
|
|
24
|
-
return `${(t / Math.pow(
|
|
25
|
-
}, K = (t) => t.reduce((e,
|
|
23
|
+
const e = Math.floor(Math.log(t) / Math.log(g));
|
|
24
|
+
return `${(t / Math.pow(g, e)).toFixed(2)} ${S[e]}`;
|
|
25
|
+
}, K = (t) => t.reduce((e, i) => ({ ...e, ...q[i] }), {}), W = (t) => {
|
|
26
26
|
const e = t.name.split(".").pop()?.toLowerCase();
|
|
27
27
|
return e ? ["jpg", "jpeg", "png", "webp"].includes(e) ? "image" : e === "pdf" ? "pdf" : ["doc", "docx"].includes(e) ? "doc" : ["xls", "xlsx"].includes(e) ? "excel" : e === "txt" ? "text" : "other" : "other";
|
|
28
28
|
}, ee = ({
|
|
29
29
|
value: t = null,
|
|
30
30
|
onChange: e,
|
|
31
|
-
multiple:
|
|
32
|
-
maxFiles:
|
|
31
|
+
multiple: i = !1,
|
|
32
|
+
maxFiles: c = F,
|
|
33
33
|
disabled: y = !1,
|
|
34
|
-
className:
|
|
35
|
-
maxSize:
|
|
34
|
+
className: d,
|
|
35
|
+
maxSize: m = k,
|
|
36
36
|
variant: f = "grid",
|
|
37
37
|
accepts: M = O,
|
|
38
38
|
icon: T,
|
|
@@ -42,12 +42,12 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
42
42
|
}) => {
|
|
43
43
|
const [b, L] = E(!1), [j, h] = E(null), r = Array.isArray(t) ? t : t ? [t] : [], I = C(
|
|
44
44
|
(o, l) => {
|
|
45
|
-
if (h(null), r.length + o.length >
|
|
46
|
-
h(`Максимальное количество файлов: ${
|
|
45
|
+
if (h(null), r.length + o.length > c) {
|
|
46
|
+
h(`Максимальное количество файлов: ${c}`);
|
|
47
47
|
return;
|
|
48
48
|
}
|
|
49
49
|
if (l.length > 0) {
|
|
50
|
-
const n = l[0].errors[0]?.code === "file-too-large" ? `Файл слишком большой. Максимальный размер: ${
|
|
50
|
+
const n = l[0].errors[0]?.code === "file-too-large" ? `Файл слишком большой. Максимальный размер: ${m / 1024 / 1024}MB` : "Неподдерживаемый формат файла";
|
|
51
51
|
h(n);
|
|
52
52
|
return;
|
|
53
53
|
}
|
|
@@ -58,31 +58,31 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
58
58
|
size: z(n.size),
|
|
59
59
|
addedAt: (/* @__PURE__ */ new Date()).toISOString()
|
|
60
60
|
}));
|
|
61
|
-
|
|
61
|
+
i ? e?.([...r, ...a]) : (r[0]?.url?.startsWith("blob:") && URL.revokeObjectURL(r[0].url), e?.(a[0] ?? null)), L(!1);
|
|
62
62
|
}, Z);
|
|
63
63
|
},
|
|
64
|
-
[r,
|
|
64
|
+
[r, c, m, i, e]
|
|
65
65
|
), { getRootProps: _, getInputProps: N, isDragActive: D } = P({
|
|
66
66
|
onDrop: I,
|
|
67
67
|
accept: K(M),
|
|
68
|
-
maxSize:
|
|
69
|
-
multiple:
|
|
68
|
+
maxSize: m,
|
|
69
|
+
multiple: i && c > 1,
|
|
70
70
|
disabled: y || b,
|
|
71
|
-
maxFiles:
|
|
71
|
+
maxFiles: c - r.length
|
|
72
72
|
}), $ = (o) => () => {
|
|
73
73
|
r[o]?.url?.startsWith("blob:") && URL.revokeObjectURL(r[o].url);
|
|
74
74
|
const l = r.filter((a, n) => n !== o);
|
|
75
|
-
e?.(
|
|
76
|
-
}, B = r.length >=
|
|
75
|
+
e?.(i ? l : l[0] || null);
|
|
76
|
+
}, B = r.length >= c, R = {
|
|
77
77
|
grid: "grid-cols-2 sm:grid-cols-3 md:grid-cols-4",
|
|
78
78
|
list: "grid-cols-1",
|
|
79
79
|
compact: "grid-cols-2 sm:grid-cols-3"
|
|
80
80
|
};
|
|
81
|
-
return /* @__PURE__ */ u("div", { className:
|
|
81
|
+
return /* @__PURE__ */ u("div", { className: p("w-full space-y-4", d?.container), children: [
|
|
82
82
|
/* @__PURE__ */ u(
|
|
83
83
|
"div",
|
|
84
84
|
{
|
|
85
|
-
className:
|
|
85
|
+
className: p(
|
|
86
86
|
"grid h-full w-full gap-4",
|
|
87
87
|
f === "list" ? "grid-cols-1" : R[f]
|
|
88
88
|
),
|
|
@@ -120,7 +120,7 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
120
120
|
children: /* @__PURE__ */ s(
|
|
121
121
|
x,
|
|
122
122
|
{
|
|
123
|
-
type: "
|
|
123
|
+
type: "x",
|
|
124
124
|
onClick: $(l)
|
|
125
125
|
}
|
|
126
126
|
)
|
|
@@ -135,21 +135,21 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
135
135
|
"div",
|
|
136
136
|
{
|
|
137
137
|
..._(),
|
|
138
|
-
className:
|
|
138
|
+
className: p(
|
|
139
139
|
`relative flex cursor-pointer flex-col items-center justify-center
|
|
140
140
|
rounded-lg border-2 border-dashed border-gray-300 bg-gray-50
|
|
141
141
|
transition-colors hover:bg-gray-100`,
|
|
142
142
|
D && "border-primary bg-primary/5",
|
|
143
143
|
(y || b) && "cursor-not-allowed opacity-50",
|
|
144
144
|
f === "list" ? "min-h-37.5" : "aspect-square",
|
|
145
|
-
|
|
145
|
+
d?.blockAdd
|
|
146
146
|
),
|
|
147
147
|
children: [
|
|
148
148
|
/* @__PURE__ */ s("input", { ...N() }),
|
|
149
149
|
b ? /* @__PURE__ */ s(
|
|
150
150
|
x,
|
|
151
151
|
{
|
|
152
|
-
type: "
|
|
152
|
+
type: "spinner-gap",
|
|
153
153
|
className: "text-sub-label-text h-8 w-8 animate-spin"
|
|
154
154
|
}
|
|
155
155
|
) : /* @__PURE__ */ u("div", { className: "flex flex-col items-center space-y-2 p-4 text-center", children: [
|
|
@@ -157,18 +157,18 @@ const S = ["B", "KB", "MB", "GB", "TB"], m = 1024, k = 5 * m * m, F = 5, O = ["a
|
|
|
157
157
|
x,
|
|
158
158
|
{
|
|
159
159
|
type: T?.type ?? "plus",
|
|
160
|
-
className:
|
|
160
|
+
className: p("text-sub-label-text h-8 w-8", d?.icon)
|
|
161
161
|
}
|
|
162
162
|
),
|
|
163
163
|
/* @__PURE__ */ s(
|
|
164
164
|
U,
|
|
165
165
|
{
|
|
166
166
|
variant: "body-md-medium",
|
|
167
|
-
className:
|
|
168
|
-
children:
|
|
167
|
+
className: p("text-sub-label-text", d?.title),
|
|
168
|
+
children: i ? `${v || "Добавить"} (${r.length}/${c})` : `${v || "Добавить"}`
|
|
169
169
|
}
|
|
170
170
|
),
|
|
171
|
-
w && /* @__PURE__ */ s(U, { variant: "body-xxs-medium", className:
|
|
171
|
+
w && /* @__PURE__ */ s(U, { variant: "body-xxs-medium", className: p("text-sub-label-text", d?.text), children: w })
|
|
172
172
|
] })
|
|
173
173
|
]
|
|
174
174
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components-files-uploader-files-uploader.js","sources":["../src/components/files-uploader/files-uploader.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\";\nimport { useCallback, useState } from \"react\";\nimport { type FileRejection, useDropzone } from \"react-dropzone\";\nimport { Icon, type IconProps } from \"../ui/icon\";\nimport { Typography } from \"../ui/typography\";\n\ntype Variant = \"grid\" | \"list\" | \"compact\";\ntype AcceptType = \"image\" | \"pdf\" | \"doc\" | \"excel\" | \"text\" | \"all\";\ntype UploadedFileData = {\n url: string;\n name: string;\n size: string;\n addedAt: string;\n};\ntype FilesUploaderValue = UploadedFileData | UploadedFileData[] | null;\n\ntype PropsFilesUploader = {\n value?: FilesUploaderValue;\n onChange?: (value: FilesUploaderValue) => void;\n multiple?: boolean;\n maxFiles?: number;\n disabled?: boolean;\n className?: {\n container?: string;\n blockAdd?: string;\n title?: string;\n text?: string;\n icon?: string;\n };\n displayFiles?: boolean;\n maxSize?: number;\n variant?: Variant;\n accepts?: AcceptType[];\n icon?: IconProps;\n title?: string;\n text?: string;\n showFiles?: boolean,\n \n};\nconst FILE_SIZE_UNITS = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\"];\nconst FILE_SIZE_KB = 1024;\nconst DEFAULT_MAX_SIZE = 5 * FILE_SIZE_KB * FILE_SIZE_KB;\nconst DEFAULT_MAX_FILES = 5;\nconst DEFAULT_ACCEPT: AcceptType[] = [\"all\"];\nconst DEFAULT_TIMEOUT = 800;\n\nconst ACCEPT_MAP: Record<AcceptType, Record<string, string[]>> = {\n image: { \"image/*\": [\".jpg\", \".jpeg\", \".png\", \".webp\"] },\n pdf: { \"application/pdf\": [\".pdf\"] },\n doc: {\n \"application/msword\": [\".doc\"],\n \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\": [\".docx\"],\n },\n excel: {\n \"application/vnd.ms-excel\": [\".xls\"],\n \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\": [\".xlsx\"],\n },\n text: { \"text/plain\": [\".txt\"] },\n all: {},\n};\n\nconst formatFileSize = (bytes: number) => {\n if (bytes === 0) return \"0 B\";\n const i = Math.floor(Math.log(bytes) / Math.log(FILE_SIZE_KB));\n return `${(bytes / Math.pow(FILE_SIZE_KB, i)).toFixed(2)} ${FILE_SIZE_UNITS[i]}`;\n};\n\nconst fileAcceptMap = (accepts: AcceptType[]): Record<string, string[]> =>\n accepts.reduce((acc, t) => ({ ...acc, ...ACCEPT_MAP[t] }), {});\n\nconst getFileType = (file: UploadedFileData) => {\n const ext = file.name.split(\".\").pop()?.toLowerCase();\n\n if (!ext) return \"other\";\n\n if ([\"jpg\", \"jpeg\", \"png\", \"webp\"].includes(ext)) return \"image\";\n if (ext === \"pdf\") return \"pdf\";\n if ([\"doc\", \"docx\"].includes(ext)) return \"doc\";\n if ([\"xls\", \"xlsx\"].includes(ext)) return \"excel\";\n if (ext === \"txt\") return \"text\";\n\n return \"other\";\n};\n\nexport const FilesUploader = ({\n value = null,\n onChange,\n multiple = false,\n maxFiles = DEFAULT_MAX_FILES,\n disabled = false,\n className,\n maxSize = DEFAULT_MAX_SIZE,\n variant = \"grid\",\n accepts = DEFAULT_ACCEPT,\n icon,\n title,\n text,\n showFiles = true,\n}: PropsFilesUploader) => {\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n const files = Array.isArray(value) ? value : value ? [value] : [];\n \n\n const onDrop = useCallback(\n (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n setError(null);\n\n if (files.length + acceptedFiles.length > maxFiles) {\n setError(`Максимальное количество файлов: ${maxFiles}`);\n return;\n }\n\n if (rejectedFiles.length > 0) {\n const rejection = rejectedFiles[0];\n const errorMessage =\n rejection.errors[0]?.code === \"file-too-large\"\n ? `Файл слишком большой. Максимальный размер: ${maxSize / 1024 / 1024}MB`\n : \"Неподдерживаемый формат файла\";\n setError(errorMessage);\n return;\n }\n\n setLoading(true);\n\n setTimeout(() => {\n const newFilesData: UploadedFileData[] = acceptedFiles.map((file) => ({\n url: URL.createObjectURL(file),\n name: file.name,\n size: formatFileSize(file.size),\n addedAt: new Date().toISOString(),\n }));\n\n if (multiple) {\n onChange?.([...files, ...newFilesData]);\n } else {\n if (files[0]?.url?.startsWith(\"blob:\")) URL.revokeObjectURL(files[0].url);\n onChange?.(newFilesData[0] ?? null);\n }\n\n setLoading(false);\n }, DEFAULT_TIMEOUT);\n },\n [files, maxFiles, maxSize, multiple, onChange],\n );\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n onDrop,\n accept: fileAcceptMap(accepts),\n maxSize,\n multiple: multiple && maxFiles > 1,\n disabled: disabled || loading,\n maxFiles: maxFiles - files.length,\n });\n\n const removeImage = (index: number) => {\n return () => {\n if (files[index]?.url?.startsWith(\"blob:\")) {\n URL.revokeObjectURL(files[index].url);\n }\n const newFiles = files.filter((_, i) => i !== index);\n onChange?.(multiple ? newFiles : newFiles[0] || null);\n };\n };\n\n const isMaxFilesReached = files.length >= maxFiles;\n\n // Варианты отображения\n const gridClasses = {\n grid: \"grid-cols-2 sm:grid-cols-3 md:grid-cols-4\",\n list: \"grid-cols-1\",\n compact: \"grid-cols-2 sm:grid-cols-3\",\n };\n\n return (\n <div className={cn(\"w-full space-y-4\", className?.container)}>\n {/* Предпросмотр с возможностью добавления новых */}\n <div\n className={cn(\n \"grid h-full w-full gap-4\",\n variant === \"list\" ? \"grid-cols-1\" : gridClasses[variant],\n )}\n >\n {showFiles && files.map((file, index) => {\n const type = getFileType(file);\n\n return (\n <div\n key={index}\n className=\"group bg-primary-bg relative aspect-square h-full w-full\n overflow-hidden rounded-lg\"\n >\n {type === \"image\" ? (\n <img\n src={file.url}\n alt={`Preview ${index + 1}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div\n className=\"flex h-full w-full items-center justify-center bg-gray-100\n text-sm font-semibold\"\n >\n {file.name.split(\".\").pop()?.toUpperCase()}\n </div>\n )}\n\n <div\n className=\"text-primary-bg bg-primary-inverse-bg/50 absolute inset-0 flex\n cursor-pointer items-center justify-center rounded-lg opacity-0\n transition-opacity hover:opacity-100\"\n onClick={(e) => e.stopPropagation()}\n >\n <Icon\n type=\"close\"\n onClick={removeImage(index)}\n />\n </div>\n </div>\n );\n })}\n {/* Кнопка добавления нового изображения */}\n {(!isMaxFilesReached || !showFiles) && (\n <div\n {...getRootProps()}\n className={cn(\n `relative flex cursor-pointer flex-col items-center justify-center\n rounded-lg border-2 border-dashed border-gray-300 bg-gray-50\n transition-colors hover:bg-gray-100`,\n isDragActive && \"border-primary bg-primary/5\",\n (disabled || loading) && \"cursor-not-allowed opacity-50\",\n variant === \"list\" ? \"min-h-37.5\" : \"aspect-square\",\n className?.blockAdd,\n )}\n >\n <input {...getInputProps()} />\n\n {loading ? (\n <Icon\n type=\"loader\"\n className=\"text-sub-label-text h-8 w-8 animate-spin\"\n />\n ) : (\n <div className=\"flex flex-col items-center space-y-2 p-4 text-center\">\n <Icon\n type={icon?.type ?? \"plus\"}\n className={cn(\"text-sub-label-text h-8 w-8\", className?.icon)}\n />\n <Typography\n variant=\"body-md-medium\"\n className={cn(\"text-sub-label-text\", className?.title)}\n >\n {multiple\n ? `${title || \"Добавить\"} (${files.length}/${maxFiles})`\n : `${title || \"Добавить\"}`}\n </Typography>\n {text && (\n <Typography variant=\"body-xxs-medium\" className={cn(\"text-sub-label-text\", className?.text)}>\n {text}\n </Typography>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* Информация о количестве */}\n {/* {multiple && images.length > 0 && (\n <p className=\"text-xs text-gray-500\">\n Загружено {images.length} из {maxFiles} изображений\n </p>\n )} */}\n\n {/* Ошибка */}\n {error && (\n <div className=\"rounded-lg bg-red-50 p-3 text-sm text-red-600\">{error}</div>\n )}\n </div>\n );\n};\n\nexport type { PropsFilesUploader, UploadedFileData, FilesUploaderValue };\n\n"],"names":["FILE_SIZE_UNITS","FILE_SIZE_KB","DEFAULT_MAX_SIZE","DEFAULT_MAX_FILES","DEFAULT_ACCEPT","DEFAULT_TIMEOUT","ACCEPT_MAP","formatFileSize","bytes","i","fileAcceptMap","accepts","acc","t","getFileType","file","ext","FilesUploader","value","onChange","multiple","maxFiles","disabled","className","maxSize","variant","icon","title","text","showFiles","loading","setLoading","useState","error","setError","files","onDrop","useCallback","acceptedFiles","rejectedFiles","errorMessage","newFilesData","getRootProps","getInputProps","isDragActive","useDropzone","removeImage","index","newFiles","_","isMaxFilesReached","gridClasses","cn","jsxs","type","jsx","e","Icon","Typography"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components-files-uploader-files-uploader.js","sources":["../src/components/files-uploader/files-uploader.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils\";\nimport { useCallback, useState } from \"react\";\nimport { type FileRejection, useDropzone } from \"react-dropzone\";\nimport { Icon, type IconProps } from \"../ui/icon\";\nimport { Typography } from \"../ui/typography\";\n\ntype Variant = \"grid\" | \"list\" | \"compact\";\ntype AcceptType = \"image\" | \"pdf\" | \"doc\" | \"excel\" | \"text\" | \"all\";\ntype UploadedFileData = {\n url: string;\n name: string;\n size: string;\n addedAt: string;\n};\ntype FilesUploaderValue = UploadedFileData | UploadedFileData[] | null;\n\ntype PropsFilesUploader = {\n value?: FilesUploaderValue;\n onChange?: (value: FilesUploaderValue) => void;\n multiple?: boolean;\n maxFiles?: number;\n disabled?: boolean;\n className?: {\n container?: string;\n blockAdd?: string;\n title?: string;\n text?: string;\n icon?: string;\n };\n displayFiles?: boolean;\n maxSize?: number;\n variant?: Variant;\n accepts?: AcceptType[];\n icon?: IconProps;\n title?: string;\n text?: string;\n showFiles?: boolean,\n \n};\nconst FILE_SIZE_UNITS = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\"];\nconst FILE_SIZE_KB = 1024;\nconst DEFAULT_MAX_SIZE = 5 * FILE_SIZE_KB * FILE_SIZE_KB;\nconst DEFAULT_MAX_FILES = 5;\nconst DEFAULT_ACCEPT: AcceptType[] = [\"all\"];\nconst DEFAULT_TIMEOUT = 800;\n\nconst ACCEPT_MAP: Record<AcceptType, Record<string, string[]>> = {\n image: { \"image/*\": [\".jpg\", \".jpeg\", \".png\", \".webp\"] },\n pdf: { \"application/pdf\": [\".pdf\"] },\n doc: {\n \"application/msword\": [\".doc\"],\n \"application/vnd.openxmlformats-officedocument.wordprocessingml.document\": [\".docx\"],\n },\n excel: {\n \"application/vnd.ms-excel\": [\".xls\"],\n \"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet\": [\".xlsx\"],\n },\n text: { \"text/plain\": [\".txt\"] },\n all: {},\n};\n\nconst formatFileSize = (bytes: number) => {\n if (bytes === 0) return \"0 B\";\n const i = Math.floor(Math.log(bytes) / Math.log(FILE_SIZE_KB));\n return `${(bytes / Math.pow(FILE_SIZE_KB, i)).toFixed(2)} ${FILE_SIZE_UNITS[i]}`;\n};\n\nconst fileAcceptMap = (accepts: AcceptType[]): Record<string, string[]> =>\n accepts.reduce((acc, t) => ({ ...acc, ...ACCEPT_MAP[t] }), {});\n\nconst getFileType = (file: UploadedFileData) => {\n const ext = file.name.split(\".\").pop()?.toLowerCase();\n\n if (!ext) return \"other\";\n\n if ([\"jpg\", \"jpeg\", \"png\", \"webp\"].includes(ext)) return \"image\";\n if (ext === \"pdf\") return \"pdf\";\n if ([\"doc\", \"docx\"].includes(ext)) return \"doc\";\n if ([\"xls\", \"xlsx\"].includes(ext)) return \"excel\";\n if (ext === \"txt\") return \"text\";\n\n return \"other\";\n};\n\nexport const FilesUploader = ({\n value = null,\n onChange,\n multiple = false,\n maxFiles = DEFAULT_MAX_FILES,\n disabled = false,\n className,\n maxSize = DEFAULT_MAX_SIZE,\n variant = \"grid\",\n accepts = DEFAULT_ACCEPT,\n icon,\n title,\n text,\n showFiles = true,\n}: PropsFilesUploader) => {\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState<string | null>(null);\n\n const files = Array.isArray(value) ? value : value ? [value] : [];\n \n\n const onDrop = useCallback(\n (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {\n setError(null);\n\n if (files.length + acceptedFiles.length > maxFiles) {\n setError(`Максимальное количество файлов: ${maxFiles}`);\n return;\n }\n\n if (rejectedFiles.length > 0) {\n const rejection = rejectedFiles[0];\n const errorMessage =\n rejection.errors[0]?.code === \"file-too-large\"\n ? `Файл слишком большой. Максимальный размер: ${maxSize / 1024 / 1024}MB`\n : \"Неподдерживаемый формат файла\";\n setError(errorMessage);\n return;\n }\n\n setLoading(true);\n\n setTimeout(() => {\n const newFilesData: UploadedFileData[] = acceptedFiles.map((file) => ({\n url: URL.createObjectURL(file),\n name: file.name,\n size: formatFileSize(file.size),\n addedAt: new Date().toISOString(),\n }));\n\n if (multiple) {\n onChange?.([...files, ...newFilesData]);\n } else {\n if (files[0]?.url?.startsWith(\"blob:\")) URL.revokeObjectURL(files[0].url);\n onChange?.(newFilesData[0] ?? null);\n }\n\n setLoading(false);\n }, DEFAULT_TIMEOUT);\n },\n [files, maxFiles, maxSize, multiple, onChange],\n );\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n onDrop,\n accept: fileAcceptMap(accepts),\n maxSize,\n multiple: multiple && maxFiles > 1,\n disabled: disabled || loading,\n maxFiles: maxFiles - files.length,\n });\n\n const removeImage = (index: number) => {\n return () => {\n if (files[index]?.url?.startsWith(\"blob:\")) {\n URL.revokeObjectURL(files[index].url);\n }\n const newFiles = files.filter((_, i) => i !== index);\n onChange?.(multiple ? newFiles : newFiles[0] || null);\n };\n };\n\n const isMaxFilesReached = files.length >= maxFiles;\n\n // Варианты отображения\n const gridClasses = {\n grid: \"grid-cols-2 sm:grid-cols-3 md:grid-cols-4\",\n list: \"grid-cols-1\",\n compact: \"grid-cols-2 sm:grid-cols-3\",\n };\n\n return (\n <div className={cn(\"w-full space-y-4\", className?.container)}>\n {/* Предпросмотр с возможностью добавления новых */}\n <div\n className={cn(\n \"grid h-full w-full gap-4\",\n variant === \"list\" ? \"grid-cols-1\" : gridClasses[variant],\n )}\n >\n {showFiles && files.map((file, index) => {\n const type = getFileType(file);\n\n return (\n <div\n key={index}\n className=\"group bg-primary-bg relative aspect-square h-full w-full\n overflow-hidden rounded-lg\"\n >\n {type === \"image\" ? (\n <img\n src={file.url}\n alt={`Preview ${index + 1}`}\n className=\"h-full w-full object-cover\"\n />\n ) : (\n <div\n className=\"flex h-full w-full items-center justify-center bg-gray-100\n text-sm font-semibold\"\n >\n {file.name.split(\".\").pop()?.toUpperCase()}\n </div>\n )}\n\n <div\n className=\"text-primary-bg bg-primary-inverse-bg/50 absolute inset-0 flex\n cursor-pointer items-center justify-center rounded-lg opacity-0\n transition-opacity hover:opacity-100\"\n onClick={(e) => e.stopPropagation()}\n >\n <Icon\n type=\"x\"\n onClick={removeImage(index)}\n />\n </div>\n </div>\n );\n })}\n {/* Кнопка добавления нового изображения */}\n {(!isMaxFilesReached || !showFiles) && (\n <div\n {...getRootProps()}\n className={cn(\n `relative flex cursor-pointer flex-col items-center justify-center\n rounded-lg border-2 border-dashed border-gray-300 bg-gray-50\n transition-colors hover:bg-gray-100`,\n isDragActive && \"border-primary bg-primary/5\",\n (disabled || loading) && \"cursor-not-allowed opacity-50\",\n variant === \"list\" ? \"min-h-37.5\" : \"aspect-square\",\n className?.blockAdd,\n )}\n >\n <input {...getInputProps()} />\n\n {loading ? (\n <Icon\n type=\"spinner-gap\"\n className=\"text-sub-label-text h-8 w-8 animate-spin\"\n />\n ) : (\n <div className=\"flex flex-col items-center space-y-2 p-4 text-center\">\n <Icon\n type={icon?.type ?? \"plus\"}\n className={cn(\"text-sub-label-text h-8 w-8\", className?.icon)}\n />\n <Typography\n variant=\"body-md-medium\"\n className={cn(\"text-sub-label-text\", className?.title)}\n >\n {multiple\n ? `${title || \"Добавить\"} (${files.length}/${maxFiles})`\n : `${title || \"Добавить\"}`}\n </Typography>\n {text && (\n <Typography variant=\"body-xxs-medium\" className={cn(\"text-sub-label-text\", className?.text)}>\n {text}\n </Typography>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n\n {/* Информация о количестве */}\n {/* {multiple && images.length > 0 && (\n <p className=\"text-xs text-gray-500\">\n Загружено {images.length} из {maxFiles} изображений\n </p>\n )} */}\n\n {/* Ошибка */}\n {error && (\n <div className=\"rounded-lg bg-red-50 p-3 text-sm text-red-600\">{error}</div>\n )}\n </div>\n );\n};\n\nexport type { PropsFilesUploader, UploadedFileData, FilesUploaderValue };\n"],"names":["FILE_SIZE_UNITS","FILE_SIZE_KB","DEFAULT_MAX_SIZE","DEFAULT_MAX_FILES","DEFAULT_ACCEPT","DEFAULT_TIMEOUT","ACCEPT_MAP","formatFileSize","bytes","i","fileAcceptMap","accepts","acc","t","getFileType","file","ext","FilesUploader","value","onChange","multiple","maxFiles","disabled","className","maxSize","variant","icon","title","text","showFiles","loading","setLoading","useState","error","setError","files","onDrop","useCallback","acceptedFiles","rejectedFiles","errorMessage","newFilesData","getRootProps","getInputProps","isDragActive","useDropzone","removeImage","index","newFiles","_","isMaxFilesReached","gridClasses","cn","jsxs","type","jsx","e","Icon","Typography"],"mappings":"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"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./brd-ui-kit.css');const
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
${n(e).textColor??"text-primary-inverse-text"}`)},viewBox:n(e).viewBox})},{id:"1",position:"inline-end",component:t.jsx(s.Icon,{type:o?"chevron-up":"chevron",className:"cursor-pointer",onClick:x})}],placeholder:d(e)}),o&&t.jsx("div",{className:`border-inp-hover-border bg-primary-bg absolute my-2 flex w-full
|
|
6
|
-
flex-col rounded-xl border`,ref:l,children:B.map(({label:r,icon:i})=>{const{bgColor:w,textColor:C,viewBox:y}=n(i);return t.jsxs(f.Button,{variant:"ghost",className:"flex w-full justify-start",type:"button",onClick:g(i),children:[t.jsx(s.Icon,{type:i,className:"text-primary-inverse-text",classes:{wrapper:c.cn(`flex h-5.5 w-5.5 items-center justify-center rounded-sm
|
|
7
|
-
${w??"bg-primary-inverse-hover-bg"}
|
|
8
|
-
${C??"text-primary-inverse-text"}`)},viewBox:y}),r]},r)})})]})};exports.InputContact=I;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./brd-ui-kit.css');const r=require("react/jsx-runtime");;/* empty css */const g=require("./lib-utils.cjs");require("class-variance-authority");const c=require("react");require("./components-ui-badge-badge.styles.cjs");const y=require("./components-ui-button-button.cjs");require("./components-ui-button-button.styles.cjs");require("./components-ui-card-card.cjs");require("./components-ui-checkbox-checkbox.cjs");const s=require("./components-ui-icon-icon.cjs");require("./components-ui-combobox-combobox.cjs");require("./components-ui-dialog-dialog.cjs");require("./components-ui-label-label.cjs");require("./components-ui-separator-separator.cjs");require("./components-ui-field-field.styles.cjs");require("./components-ui-input-input.styles.cjs");require("./components-ui-textarea-textarea.cjs");require("./components-ui-input-group-input-group.styles.cjs");require("./components-ui-navigation-item-navigation-item.styles.cjs");require("./components-ui-navigation-menu-navigation-menu.styles.cjs");require("./components-ui-pagination-pagination.cjs");require("./components-ui-progress-progress.cjs");require("./components-ui-radio-group-radio-group.cjs");require("./components-ui-switch-switch.cjs");require("./components-ui-table-table.cjs");require("./components-ui-tabs-tabs.cjs");require("./components-ui-tooltip-tooltip.cjs");require("./components-ui-typography-typography.styles.cjs");const v=require("./hooks-usePopupControls.cjs");require("./components-app-pagination-app-pagination.styles.cjs");require("./components-app-sidebar-app-sidebar.styles.cjs");const _=require("./components-input-field-input-field.cjs");require("./components-select-field-select-field.cjs");require("./lodash-kqhtUJfz.cjs");require("./chart-CgVfpT_X.cjs");require("./index-DGxwh2Ms.cjs");require("./index-fTTv8YY8.cjs");const j=require("./components-input-phone-input-phone.cjs");require("./components-ui-calendar-calendar.styles.cjs");const w=[{label:"Мобильный",icon:"phone"},{label:"Telegram",icon:"telegram-logo"},{label:"WhatsApp",icon:"whats-app-logo-filled"},{label:"Max",icon:"max-logo"},{label:"E-mail",icon:"envelope-simple"}],q=n=>{switch(n){case"max-logo":return{bgColor:"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]"};case"telegram-logo":return{bgColor:"bg-[#289AD2]"};case"whats-app-logo-filled":return{bgColor:"bg-[#00C202]",textColor:"text-[#00C202]"};default:return{}}},a=n=>({wrapper:g.cn(`flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm
|
|
2
|
+
${q(n).bgColor??"bg-primary-inverse-hover-bg"}
|
|
3
|
+
${q(n).textColor??"text-primary-inverse-text"}`),icon:"size-5 shrink-0"}),P=n=>{const{inputProps:h,inputPhoneProps:x,onTypeChange:b,...p}=n,[o,C]=c.useState("phone"),{isOpened:t,openPopup:m,closePopup:u}=v.usePopupControls(),l=c.useRef(null);c.useEffect(()=>{const e=i=>{l.current&&!l.current.contains(i.target)&&u()};return t&&document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[t,u]);const d=e=>{switch(e){case"phone":return"+7 (999) 999-99-99";case"telegram-logo":return"@username";case"whats-app-logo-filled":return"+7 (999) 999-99-99";case"max-logo":return"ID пользователя Max";case"envelope-simple":return"example@mail.com";default:return"Введите значение"}},f=e=>()=>{C(e),b?.(e),u()};return r.jsxs("div",{className:g.cn("relative",n.classes?.container),children:[["telegram-logo","max-logo","envelope-simple"].includes(o)?r.jsx(_.InputField,{...h,...p,date:[{id:"0",position:"inline-start",component:r.jsx(s.Icon,{type:o,size:"medium",classes:a(o)})},{id:"1",position:"inline-end",component:r.jsx(s.Icon,{type:t?"caret-up":"caret-down",size:"medium",className:"cursor-pointer",onClick:m})}],placeholder:d(o)}):r.jsx(j.InputPhone,{...x,...p,date:[{id:"0",position:"inline-start",component:r.jsx(s.Icon,{type:o,size:"medium",classes:a(o)})},{id:"1",position:"inline-end",component:r.jsx(s.Icon,{type:t?"caret-up":"caret-down",size:"medium",className:"cursor-pointer",onClick:m})}],placeholder:d(o)}),t&&r.jsx("div",{className:`border-inp-hover-border bg-primary-bg absolute my-2 flex w-full
|
|
4
|
+
flex-col rounded-xl border`,ref:l,children:w.map(({label:e,icon:i})=>r.jsxs(y.Button,{variant:"ghost",className:"flex w-full justify-start",type:"button",onClick:f(i),children:[r.jsx(s.Icon,{type:i,size:"medium",className:"text-primary-inverse-text",classes:a(i)}),e]},e))})]})};exports.InputContact=P;
|
|
9
5
|
//# sourceMappingURL=components-input-contact-input-contact.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"components-input-contact-input-contact.cjs","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n {\n label: \"Мобильный\",\n icon: \"phone\",\n },\n {\n label: \"Telegram\",\n icon: \"telegram\",\n },\n {\n label: \"WhatsApp\",\n icon: \"whats-app\",\n },\n {\n label: \"Max\",\n icon: \"max\",\n },\n {\n label: \"E-mail\",\n icon: \"mail\",\n },\n];\n","import { OPTIONS } from \"@/constants/contact-input\";\nimport {\n Button,\n Icon,\n InputField,\n InputPhone,\n cn,\n usePopupControls,\n type IconTypes,\n type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n label: string;\n icon: TypesChange;\n};\n\ntype TypesChange = Extract<\n IconTypes,\n \"telegram\" | \"whats-app\" | \"max\" | \"phone\" | \"mail\"\n>;\n\ntype Props = {\n isValid?: boolean;\n label?: string;\n description?: string;\n classes?: {\n fieldset?: string;\n fieldgroup?: string;\n field?: string;\n container?: string;\n };\n value?: string;\n name?: string;\n onTypeChange?: (type: TypesChange) => void;\n inputProps: React.ComponentPropsWithRef<\"input\">;\n inputPhoneProps: InputPhoneProps;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: IconTypes) => {\n switch (icon) {\n case \"max\":\n return {\n viewBox: \"0 0 16 16\",\n bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n };\n\n case \"telegram\":\n return {\n viewBox: \"0 0 17 17\",\n bgColor: \"bg-[#289AD2]\",\n };\n\n case \"whats-app\":\n return {\n viewBox: \"0 0 18 18\",\n bgColor: \"bg-[#00C202]\",\n textColor: \"text-[#00C202]\",\n };\n\n default:\n return {\n viewBox: \"0 0 24 24\",\n };\n }\n};\n\nexport const InputContact = (props: Props) => {\n const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n const [type, setType] = useState<TypesChange>(\"phone\");\n const { isOpened, openPopup, closePopup } = usePopupControls();\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n closePopup();\n }\n };\n\n if (isOpened) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpened, closePopup]);\n\n const getPlaceholder = (type: TypesChange): string => {\n switch (type) {\n case \"phone\":\n return \"+7 (999) 999-99-99\";\n case \"telegram\":\n return \"@username\";\n case \"whats-app\":\n return \"+7 (999) 999-99-99\";\n case \"max\":\n return \"ID пользователя Max\";\n case \"mail\":\n return \"example@mail.com\";\n default:\n return \"Введите значение\";\n }\n };\n\n const handleTypeChange = (type: TypesChange) => {\n return () => {\n setType(type);\n onTypeChange?.(type);\n closePopup();\n };\n };\n\n return (\n <div className={cn(\"relative\", props.classes?.container)}>\n {[\"telegram\", \"max\", \"mail\"].includes(type) ? (\n <InputField\n {...inputProps}\n {...rest}\n date={[\n {\n id: \"0\",\n position: \"inline-start\",\n component: (\n <Icon\n type={type}\n classes={{\n wrapper: cn(\n `flex h-5.5 w-5.5 items-center justify-center rounded-sm p-[3.5px]\n ${iconStyles(type).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n ${iconStyles(type).textColor ?? \"text-primary-inverse-text\"}`,\n ),\n }}\n viewBox={iconStyles(type).viewBox}\n />\n ),\n },\n {\n id: \"1\",\n position: \"inline-end\",\n component: (\n <Icon\n type={isOpened ? \"chevron-up\" : \"chevron\"}\n className=\"cursor-pointer\"\n onClick={openPopup}\n />\n ),\n },\n ]}\n placeholder={getPlaceholder(type)}\n />\n ) : (\n <InputPhone\n {...inputPhoneProps}\n {...rest}\n date={[\n {\n id: \"0\",\n position: \"inline-start\",\n component: (\n <Icon\n type={type}\n classes={{\n wrapper: cn(\n `flex h-5.5 w-5.5 items-center justify-center rounded-sm p-[3.5px]\n ${iconStyles(type).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n ${iconStyles(type).textColor ?? \"text-primary-inverse-text\"}`,\n ),\n }}\n viewBox={iconStyles(type).viewBox}\n />\n ),\n },\n {\n id: \"1\",\n position: \"inline-end\",\n component: (\n <Icon\n type={isOpened ? \"chevron-up\" : \"chevron\"}\n className=\"cursor-pointer\"\n onClick={openPopup}\n />\n ),\n },\n ]}\n placeholder={getPlaceholder(type)}\n />\n )}\n\n {isOpened && (\n <div\n className=\"border-inp-hover-border bg-primary-bg absolute my-2 flex w-full\n flex-col rounded-xl border\"\n ref={wrapperRef}\n >\n {OPTIONS.map(({ label, icon }) => {\n const { bgColor, textColor, viewBox } = iconStyles(icon);\n\n return (\n <Button\n key={label}\n variant=\"ghost\"\n className=\"flex w-full justify-start\"\n type=\"button\"\n onClick={handleTypeChange(icon)}\n >\n <Icon\n type={icon}\n className=\"text-primary-inverse-text\"\n classes={{\n wrapper: cn(\n `flex h-5.5 w-5.5 items-center justify-center rounded-sm\n ${bgColor ?? \"bg-primary-inverse-hover-bg\"}\n ${textColor ?? \"text-primary-inverse-text\"}`,\n ),\n }}\n viewBox={viewBox}\n />\n\n {label}\n </Button>\n );\n })}\n </div>\n )}\n </div>\n );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","iconStyles","icon","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","jsxs","cn","jsx","InputField","Icon","InputPhone","label","bgColor","textColor","viewBox","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"components-input-contact-input-contact.cjs","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n {\n label: \"Мобильный\",\n icon: \"phone\",\n },\n {\n label: \"Telegram\",\n icon: \"telegram-logo\",\n },\n {\n label: \"WhatsApp\",\n icon: \"whats-app-logo-filled\",\n },\n {\n label: \"Max\",\n icon: \"max-logo\",\n },\n {\n label: \"E-mail\",\n icon: \"envelope-simple\",\n },\n];\n","import { OPTIONS } from \"@/constants/contact-input\";\nimport {\n Button,\n Icon,\n InputField,\n InputPhone,\n cn,\n usePopupControls,\n type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n label: string;\n icon: TypesChange;\n};\n\ntype TypesChange =\n | \"phone\"\n | \"telegram-logo\"\n | \"whats-app-logo-filled\"\n | \"max-logo\"\n | \"envelope-simple\";\n\ntype Props = {\n isValid?: boolean;\n label?: string;\n description?: string;\n classes?: {\n fieldset?: string;\n fieldgroup?: string;\n field?: string;\n container?: string;\n };\n value?: string;\n name?: string;\n onTypeChange?: (type: TypesChange) => void;\n inputProps: React.ComponentPropsWithRef<\"input\">;\n inputPhoneProps: InputPhoneProps;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: TypesChange) => {\n switch (icon) {\n case \"max-logo\":\n return {\n bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n };\n\n case \"telegram-logo\":\n return {\n bgColor: \"bg-[#289AD2]\",\n };\n\n case \"whats-app-logo-filled\":\n return {\n bgColor: \"bg-[#00C202]\",\n textColor: \"text-[#00C202]\",\n };\n\n default:\n return {};\n }\n};\n\nconst getContactIconClasses = (icon: TypesChange) => ({\n wrapper: cn(\n `flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm\n ${iconStyles(icon).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n ${iconStyles(icon).textColor ?? \"text-primary-inverse-text\"}`,\n ),\n icon: \"size-5 shrink-0\",\n});\n\nexport const InputContact = (props: Props) => {\n const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n const [type, setType] = useState<TypesChange>(\"phone\");\n const { isOpened, openPopup, closePopup } = usePopupControls();\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n closePopup();\n }\n };\n\n if (isOpened) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpened, closePopup]);\n\n const getPlaceholder = (type: TypesChange): string => {\n switch (type) {\n case \"phone\":\n return \"+7 (999) 999-99-99\";\n case \"telegram-logo\":\n return \"@username\";\n case \"whats-app-logo-filled\":\n return \"+7 (999) 999-99-99\";\n case \"max-logo\":\n return \"ID пользователя Max\";\n case \"envelope-simple\":\n return \"example@mail.com\";\n default:\n return \"Введите значение\";\n }\n };\n\n const handleTypeChange = (type: TypesChange) => {\n return () => {\n setType(type);\n onTypeChange?.(type);\n closePopup();\n };\n };\n\n return (\n <div className={cn(\"relative\", props.classes?.container)}>\n {[\"telegram-logo\", \"max-logo\", \"envelope-simple\"].includes(type) ? (\n <InputField\n {...inputProps}\n {...rest}\n date={[\n {\n id: \"0\",\n position: \"inline-start\",\n component: (\n <Icon\n type={type}\n size=\"medium\"\n classes={getContactIconClasses(type)}\n />\n ),\n },\n {\n id: \"1\",\n position: \"inline-end\",\n component: (\n <Icon\n type={isOpened ? \"caret-up\" : \"caret-down\"}\n size=\"medium\"\n className=\"cursor-pointer\"\n onClick={openPopup}\n />\n ),\n },\n ]}\n placeholder={getPlaceholder(type)}\n />\n ) : (\n <InputPhone\n {...inputPhoneProps}\n {...rest}\n date={[\n {\n id: \"0\",\n position: \"inline-start\",\n component: (\n <Icon\n type={type}\n size=\"medium\"\n classes={getContactIconClasses(type)}\n />\n ),\n },\n {\n id: \"1\",\n position: \"inline-end\",\n component: (\n <Icon\n type={isOpened ? \"caret-up\" : \"caret-down\"}\n size=\"medium\"\n className=\"cursor-pointer\"\n onClick={openPopup}\n />\n ),\n },\n ]}\n placeholder={getPlaceholder(type)}\n />\n )}\n\n {isOpened && (\n <div\n className=\"border-inp-hover-border bg-primary-bg absolute my-2 flex w-full\n flex-col rounded-xl border\"\n ref={wrapperRef}\n >\n {OPTIONS.map(({ label, icon }) => {\n return (\n <Button\n key={label}\n variant=\"ghost\"\n className=\"flex w-full justify-start\"\n type=\"button\"\n onClick={handleTypeChange(icon)}\n >\n <Icon\n type={icon}\n size=\"medium\"\n className=\"text-primary-inverse-text\"\n classes={getContactIconClasses(icon)}\n />\n\n {label}\n </Button>\n );\n })}\n </div>\n )}\n </div>\n );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","iconStyles","icon","getContactIconClasses","cn","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","jsxs","jsx","InputField","Icon","InputPhone","label","Button"],"mappings":"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"}
|