{"version":3,"file":"File.cjs","sources":["../../../../src/components/file/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { type ComponentProps, type FC, useId } from \"react\";\nimport { formatBytes } from \"../../utilities/index.js\";\nimport { Button } from \"../button/index.js\";\nimport { useFileInputContext } from \"../file-input/internal/fileInputContext.js\";\nimport { Flex } from \"../flex/index.js\";\nimport { TrashCanIcon } from \"../icon/index.js\";\nimport { SupportLabel } from \"../input-group/index.js\";\nimport { Link } from \"../link/index.js\";\nimport { Text } from \"../typography/index.js\";\nimport type { FileProps } from \"./types.js\";\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n    const {\n        children: _,\n        hideThumbnail,\n        className,\n        fileName,\n        fileType,\n        fileSize,\n        path,\n        file,\n        state,\n        errorLabel = \"Feil\",\n        onRemove,\n        variant = \"list\",\n        ...rest\n    } = props;\n\n    const id = `jkl-file-preview-${useId()}`;\n    const supportId = `${id}-support`;\n\n    const context = useFileInputContext();\n\n    const imageSrc =\n        fileType.startsWith(\"image/\") &&\n        (file ? URL.createObjectURL(file) : path);\n\n    const fileComponent = (\n        <div\n            id={id}\n            className={clsx(className, \"jkl-file\", `jkl-file--${variant}`)}\n            data-state={state}\n            {...rest}\n        >\n            <Flex\n                gap=\"8\"\n                direction={variant === \"card\" ? \"column\" : \"row\"}\n                alignItems={variant === \"card\" ? \"start\" : \"center\"}\n                className={\"jkl-file__content\"}\n            >\n                {!hideThumbnail && (\n                    <div\n                        className=\"jkl-file__thumbnail\"\n                        data-filetype={fileType}\n                    >\n                        {imageSrc && <img src={imageSrc} alt=\"\" />}\n                    </div>\n                )}\n                <Flex\n                    gap=\"8\"\n                    alignItems=\"center\"\n                    justifyContent=\"space-between\"\n                    className=\"jkl-file__info\"\n                >\n                    {path ? (\n                        <Text size=\"s\" className=\"jkl-file__name\">\n                            <Link href={path}>\n                                {fileName}{\" \"}\n                                <span className=\"jkl-file__size\">\n                                    ({formatBytes(fileSize)})\n                                </span>\n                            </Link>\n                        </Text>\n                    ) : (\n                        <Text size=\"s\" className=\"jkl-file__name\">\n                            {fileName}{\" \"}\n                            <span className=\"jkl-file__size\">\n                                ({formatBytes(fileSize)})\n                            </span>\n                        </Text>\n                    )}\n                    {onRemove && (\n                        <Button\n                            variant={\"ghost\"}\n                            className=\"jkl-file__button\"\n                            onClick={onRemove}\n                            title={`Fjern ${fileName}`}\n                            icon={<TrashCanIcon />}\n                        />\n                    )}\n                </Flex>\n            </Flex>\n\n            {state === \"error\" && errorLabel && (\n                <SupportLabel\n                    className=\"jkl-file__support-label\"\n                    id={supportId}\n                    label={errorLabel}\n                    labelType={\"error\"}\n                />\n            )}\n        </div>\n    );\n\n    return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["props","children","_","hideThumbnail","className","fileName","fileType","fileSize","path","file","state","errorLabel","onRemove","variant","rest","id","useId","supportId","context","useFileInputContext","imageSrc","startsWith","URL","createObjectURL","fileComponent","jsxs","clsx","Flex","gap","direction","alignItems","jsx","src","alt","justifyContent","Text","size","Link","href","formatBytes","Button","onClick","title","icon","TrashCanIcon","SupportLabel","label","labelType"],"mappings":"oqEAY4DA,IACxD,MACIC,SAAUC,EACVC,cAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,WAAAA,EAAa,OACbC,SAAAA,EACAC,QAAAA,EAAU,UACPC,GACHd,EAEEe,EAAK,oBAAoBC,EAAAA,UACzBC,EAAY,GAAGF,YAEfG,EAAUC,EAAAA,sBAEVC,EACFd,EAASe,WAAW,YACnBZ,EAAOa,IAAIC,gBAAgBd,GAAQD,GAElCgB,EACFC,EAAAA,KAAC,MAAA,CACGV,GAAAA,EACAX,UAAWsB,EAAAA,KAAKtB,EAAW,WAAY,aAAaS,KACpD,aAAYH,KACRI,EAEJb,SAAA,CAAAwB,EAAAA,KAACE,EAAAA,KAAA,CACGC,IAAI,IACJC,UAAuB,SAAZhB,EAAqB,SAAW,MAC3CiB,WAAwB,SAAZjB,EAAqB,QAAU,SAC3CT,UAAW,oBAEVH,SAAA,EAACE,GACE4B,EAAAA,IAAC,MAAA,CACG3B,UAAU,sBACV,gBAAeE,EAEdL,YAAY8B,EAAAA,IAAC,MAAA,CAAIC,IAAKZ,EAAUa,IAAI,OAG7CR,EAAAA,KAACE,EAAAA,KAAA,CACGC,IAAI,IACJE,WAAW,SACXI,eAAe,gBACf9B,UAAU,iBAETH,SAAA,CAAAO,EACGuB,EAAAA,IAACI,EAAAA,MAAKC,KAAK,IAAIhC,UAAU,iBACrBH,SAAAwB,EAAAA,KAACY,EAAAA,KAAA,CAAKC,KAAM9B,EACPP,SAAA,CAAAI,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,iBAAiBH,SAAA,CAAA,IAC3BsC,EAAAA,YAAYhC,GAAU,YAKpCkB,EAAAA,KAACU,EAAAA,MAAKC,KAAK,IAAIhC,UAAU,iBACpBH,SAAA,CAAAI,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,iBAAiBH,SAAA,CAAA,IAC3BsC,EAAAA,YAAYhC,GAAU,UAInCK,GACGmB,EAAAA,IAACS,EAAAA,OAAA,CACG3B,QAAS,QACTT,UAAU,mBACVqC,QAAS7B,EACT8B,MAAO,SAASrC,IAChBsC,WAAOC,EAAAA,aAAA,CAAA,WAMZ,UAAVlC,GAAqBC,GAClBoB,EAAAA,IAACc,EAAAA,aAAA,CACGzC,UAAU,0BACVW,GAAIE,EACJ6B,MAAOnC,EACPoC,UAAW,aAM3B,OAAO7B,EAAUa,EAAAA,IAAC,KAAA,CAAI9B,SAAAuB,IAAsBA"}