@ngstarter-ui/components 21.0.28 → 21.0.29

package/ai/component-registry.json

@@ -3,7 +3,7 @@
   "generatedBy": "scripts/generate-ai-metadata.mjs",
   "package": "@ngstarter-ui/components",
   "description": "AI-readable registry for NgStarter UI Angular secondary entry points.",
-  "componentCount": 123,
+  "componentCount": 124,
   "conventions": {
     "importPattern": "@ngstarter-ui/components/<component>",
     "selectorPrefix": "ngs",
@@ -3969,6 +3969,70 @@
       ],
       "example": null
     },
+    {
+      "name": "file-type",
+      "title": "File Type",
+      "overviewName": "File Type",
+      "category": "components",
+      "package": "@ngstarter-ui/components",
+      "importPath": "@ngstarter-ui/components/file-type",
+      "publicApi": "projects/components/file-type/public-api.ts",
+      "sourceRoot": "projects/components/file-type/src",
+      "docsPath": "/components/file-type",
+      "docsOverviewSource": "projects/docs/src/app/components/file-type/overview/overview.html",
+      "purpose": "The NgStarter Angular File Type component renders built-in SVG file icons from a MIME type, extension, or file name.",
+      "useWhen": "Choose File Type when the workflow matches examples such as Basic File Type, Icon Sizes, MIME Type Detection, File Type Gallery, File type sizes.",
+      "exampleTopics": [
+        "Basic File Type",
+        "Icon Sizes",
+        "MIME Type Detection",
+        "File Type Gallery",
+        "File type sizes",
+        "File type mime"
+      ],
+      "minimalExample": "<div class=\"flex items-center gap-4\">\n  <ngs-file-type fileName=\"contract.pdf\" class=\"size-14\"/>\n  <div>\n    <div class=\"text-sm\">contract.pdf</div>\n    <div class=\"text-xs text-secondary\">Resolved from fileName</div>\n  </div>\n</div>\n<div class=\"flex items-center gap-4 mt-5\">\n  <ngs-file-type extension=\"xlsx\" class=\"size-14\"/>\n  <div>\n    <div class=\"text-sm\">Financial model</div>\n    <div class=\"text-xs text-secondary\">Resolved from extension</div>\n  </div>\n</div>",
+      "exampleFiles": [
+        {
+          "name": "basic-file-type-example",
+          "title": "Basic file type",
+          "file": "projects/docs/src/app/components/file-type/_examples/basic-file-type-example/basic-file-type-example.html",
+          "source": "<div class=\"flex items-center gap-4\">\n  <ngs-file-type fileName=\"contract.pdf\" class=\"size-14\"/>\n  <div>\n    <div class=\"text-sm\">contract.pdf</div>\n    <div class=\"text-xs text-secondary\">Resolved from fileName</div>\n  </div>\n</div>\n<div class=\"flex items-center gap-4 mt-5\">\n  <ngs-file-type extension=\"xlsx\" class=\"size-14\"/>\n  <div>\n    <div class=\"text-sm\">Financial model</div>\n    <div class=\"text-xs text-secondary\">Resolved from extension</div>\n  </div>\n</div>"
+        },
+        {
+          "name": "file-type-gallery-example",
+          "title": "File type gallery",
+          "file": "projects/docs/src/app/components/file-type/_examples/file-type-gallery-example/file-type-gallery-example.html",
+          "source": "<div class=\"grid grid-cols-3 gap-4 sm:grid-cols-4 md:grid-cols-5\">\n  @for (type of types(); track type) {\n    <div class=\"flex flex-col items-center gap-2 rounded-lg border border-subtle p-4\">\n      <ngs-file-type [extension]=\"type\" class=\"size-16\"/>\n      <div class=\"text-xs uppercase text-secondary\">{{ type }}</div>\n    </div>\n  }\n</div>"
+        },
+        {
+          "name": "file-type-mime-example",
+          "title": "File type mime",
+          "file": "projects/docs/src/app/components/file-type/_examples/file-type-mime-example/file-type-mime-example.html",
+          "source": "<div class=\"grid gap-4 sm:grid-cols-2\">\n  @for (file of files(); track file.name) {\n    <div class=\"flex items-center gap-4 rounded-lg border border-subtle p-4\">\n      <ngs-file-type [mimeType]=\"file.mimeType\" [fallback]=\"file.fallback\" class=\"size-12\"/>\n      <div class=\"min-w-0\">\n        <div class=\"truncate text-sm\">{{ file.name }}</div>\n        <div class=\"truncate text-xs text-secondary\">{{ file.mimeType }}</div>\n      </div>\n    </div>\n  }\n</div>"
+        }
+      ],
+      "previewAsset": "projects/components/file-type/preview.svg",
+      "selectors": [
+        "ngs-file-type"
+      ],
+      "exportedSymbols": [
+        "FileType",
+        "FileTypeName"
+      ],
+      "inputs": [
+        "decorative",
+        "extension",
+        "fallback",
+        "fileName",
+        "label",
+        "mimeType"
+      ],
+      "outputs": [],
+      "cssTokens": [
+        "--ngs-file-type-size"
+      ],
+      "example": null
+    },
     {
       "name": "filter-builder",
       "title": "Filter Builder",

package/fesm2022/ngstarter-ui-components-file-type.mjs

@@ -0,0 +1,170 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+
+const EXTENSION_TO_TYPE = {
+    avi: 'avi',
+    csv: 'csv',
+    doc: 'doc',
+    docx: 'doc',
+    html: 'html',
+    htm: 'html',
+    jpeg: 'jpg',
+    jpg: 'jpg',
+    json: 'json',
+    jsonld: 'json',
+    mkv: 'mkv',
+    mov: 'mov',
+    mp3: 'mp3',
+    m4a: 'mp3',
+    mp4: 'mp4',
+    pdf: 'pdf',
+    png: 'png',
+    pot: 'ppt',
+    potx: 'ppt',
+    pps: 'ppt',
+    ppsx: 'ppt',
+    ppt: 'ppt',
+    pptx: 'ppt',
+    svg: 'svg',
+    text: 'txt',
+    txt: 'txt',
+    wav: 'wav',
+    webm: 'webm',
+    xls: 'xls',
+    xlsx: 'xls',
+    xml: 'xml',
+    zip: 'zip',
+};
+const MIME_TYPE_TO_TYPE = {
+    'application/csv': 'csv',
+    'application/json': 'json',
+    'application/ld+json': 'json',
+    'application/msword': 'doc',
+    'application/pdf': 'pdf',
+    'application/rtf': 'doc',
+    'application/vnd.ms-excel': 'xls',
+    'application/vnd.ms-powerpoint': 'ppt',
+    'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'ppt',
+    'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'xls',
+    'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'doc',
+    'application/x-zip-compressed': 'zip',
+    'application/xml': 'xml',
+    'application/zip': 'zip',
+    'audio/mp3': 'mp3',
+    'audio/mpeg': 'mp3',
+    'audio/wav': 'wav',
+    'audio/wave': 'wav',
+    'audio/x-wav': 'wav',
+    'image/jpeg': 'jpg',
+    'image/jpg': 'jpg',
+    'image/png': 'png',
+    'image/svg+xml': 'svg',
+    'multipart/x-zip': 'zip',
+    'text/comma-separated-values': 'csv',
+    'text/csv': 'csv',
+    'text/html': 'html',
+    'text/json': 'json',
+    'text/plain': 'txt',
+    'text/xml': 'xml',
+    'video/mp4': 'mp4',
+    'video/quicktime': 'mov',
+    'video/webm': 'webm',
+    'video/x-matroska': 'mkv',
+    'video/x-msvideo': 'avi',
+};
+let nextIconId = 0;
+class FileType {
+    iconId = `ngs-file-type-${nextIconId++}`;
+    mimeType = input(...(ngDevMode ? [undefined, { debugName: "mimeType" }] : /* istanbul ignore next */ []));
+    extension = input(...(ngDevMode ? [undefined, { debugName: "extension" }] : /* istanbul ignore next */ []));
+    fileName = input(...(ngDevMode ? [undefined, { debugName: "fileName" }] : /* istanbul ignore next */ []));
+    fallback = input('txt', ...(ngDevMode ? [{ debugName: "fallback" }] : /* istanbul ignore next */ []));
+    label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+    decorative = input(false, { ...(ngDevMode ? { debugName: "decorative" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    type = computed(() => this.resolveType(), ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    resolvedLabel = computed(() => {
+        const label = this.label();
+        if (label) {
+            return label;
+        }
+        return `${this.type().toUpperCase()} file`;
+    }, ...(ngDevMode ? [{ debugName: "resolvedLabel" }] : /* istanbul ignore next */ []));
+    resolveType() {
+        const extensionType = this.resolveExtension(this.extension()) ?? this.resolveExtension(this.fileName());
+        if (extensionType) {
+            return extensionType;
+        }
+        const mimeType = this.normalizeMimeType(this.mimeType());
+        if (mimeType) {
+            return MIME_TYPE_TO_TYPE[mimeType] ?? this.resolveMimeFamily(mimeType) ?? this.fallback();
+        }
+        return this.fallback();
+    }
+    resolveExtension(value) {
+        const extension = this.normalizeExtension(value);
+        if (!extension) {
+            return null;
+        }
+        return EXTENSION_TO_TYPE[extension] ?? null;
+    }
+    normalizeExtension(value) {
+        if (!value) {
+            return null;
+        }
+        const normalized = value.trim().toLowerCase();
+        if (!normalized) {
+            return null;
+        }
+        const fileExtension = normalized.includes('.')
+            ? normalized.split('.').pop()
+            : normalized.replace(/^\./, '');
+        return fileExtension || null;
+    }
+    normalizeMimeType(value) {
+        if (!value) {
+            return null;
+        }
+        const mimeType = value.split(';')[0].trim().toLowerCase();
+        return mimeType || null;
+    }
+    resolveMimeFamily(mimeType) {
+        if (mimeType.startsWith('image/')) {
+            return 'png';
+        }
+        if (mimeType.startsWith('video/')) {
+            return 'mp4';
+        }
+        if (mimeType.startsWith('audio/')) {
+            return 'mp3';
+        }
+        if (mimeType.startsWith('text/')) {
+            return 'txt';
+        }
+        return null;
+    }
+    gradientId(type) {
+        return `${this.iconId}-${type}-pageGradient`;
+    }
+    gradientUrl(type) {
+        return `url(#${this.gradientId(type)})`;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FileType, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: FileType, isStandalone: true, selector: "ngs-file-type", inputs: { mimeType: { classPropertyName: "mimeType", publicName: "mimeType", isSignal: true, isRequired: false, transformFunction: null }, extension: { classPropertyName: "extension", publicName: "extension", isSignal: true, isRequired: false, transformFunction: null }, fileName: { classPropertyName: "fileName", publicName: "fileName", isSignal: true, isRequired: false, transformFunction: null }, fallback: { classPropertyName: "fallback", publicName: "fallback", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, decorative: { classPropertyName: "decorative", publicName: "decorative", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "decorative() ? null : \"img\"", "attr.aria-label": "decorative() ? null : resolvedLabel()", "attr.aria-hidden": "decorative() ? \"true\" : null", "attr.data-file-type": "type()" }, classAttribute: "ngs-file-type not-prose" }, exportAs: ["ngsFileType"], ngImport: i0, template: "<span class=\"icon\">\n  @switch (type()) {\n    @case ('avi') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('avi')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#8D7CFF\" />\n            <stop offset=\"1\" stop-color=\"#4531C9\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('avi')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#4531C9\"\n          >\n            AVI\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('csv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('csv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#42D9D2\" />\n            <stop offset=\"1\" stop-color=\"#0B8A97\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('csv')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#0B8A97\"\n          >\n            CSV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('doc') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('doc')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5EA8FF\" />\n            <stop offset=\"1\" stop-color=\"#1D5FD6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('doc')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1D5FD6\"\n          >\n            DOC\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('html') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('html')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF7A5F\" />\n            <stop offset=\"1\" stop-color=\"#D23B21\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('html')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D23B21\"\n          >\n            HTML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('jpg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('jpg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF78B6\" />\n            <stop offset=\"1\" stop-color=\"#C92678\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('jpg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C92678\"\n          >\n            JPG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('json') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('json')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#667085\" />\n            <stop offset=\"1\" stop-color=\"#202939\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('json')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M51 33C45 33 43 37 43 41V45C43 48 41 50 38 50C41 50 43 52 43 55V59C43 63 45 67 51 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M77 33C83 33 85 37 85 41V45C85 48 87 50 90 50C87 50 85 52 85 55V59C85 63 83 67 77 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M57 43H70M57 57H73\"\n            stroke=\"white\"\n            stroke-opacity=\"0.44\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#202939\"\n          >\n            JSON\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mkv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mkv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#AA74FF\" />\n            <stop offset=\"1\" stop-color=\"#5C26B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mkv')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5C26B8\"\n          >\n            MKV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mov') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mov')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#45D0FF\" />\n            <stop offset=\"1\" stop-color=\"#1268C7\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mov')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1268C7\"\n          >\n            MOV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp3') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp3')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#D36BFF\" />\n            <stop offset=\"1\" stop-color=\"#8A2BC6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp3')\" />\n        <g transform=\"translate(0 0)\">\n          <path\n            d=\"M52 56V35L82 30V49M52 56C52 59.5 49.2 62 45.5 62C41.8 62 39 59.5 39 56C39 52.5 41.8 50 45.5 50C49.2 50 52 52.5 52 56ZM82 49C82 52.5 79.2 55 75.5 55C71.8 55 69 52.5 69 49C69 45.5 71.8 43 75.5 43C79.2 43 82 45.5 82 49Z\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#8A2BC6\"\n          >\n            MP3\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp4') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp4')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5E9BFF\" />\n            <stop offset=\"1\" stop-color=\"#2745C8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp4')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#2745C8\"\n          >\n            MP4\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('pdf') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('pdf')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6A5F\" />\n            <stop offset=\"1\" stop-color=\"#D82432\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('pdf')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D82432\"\n          >\n            PDF\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('png') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('png')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4EC8FF\" />\n            <stop offset=\"1\" stop-color=\"#147AAE\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('png')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#147AAE\"\n          >\n            PNG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('ppt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('ppt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF9B4A\" />\n            <stop offset=\"1\" stop-color=\"#D84A1B\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('ppt')\" />\n        <g transform=\"translate(0 0)\">\n          <rect\n            x=\"40\"\n            y=\"31\"\n            width=\"48\"\n            height=\"30\"\n            rx=\"5\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"5\"\n          />\n          <path\n            d=\"M51 51H75M51 43H63\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"4\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D84A1B\"\n          >\n            PPT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('svg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('svg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#B389FF\" />\n            <stop offset=\"1\" stop-color=\"#6F35D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('svg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#6F35D5\"\n          >\n            SVG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('txt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('txt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#95A3B8\" />\n            <stop offset=\"1\" stop-color=\"#526071\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('txt')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#526071\"\n          >\n            TXT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('wav') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('wav')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6EDB\" />\n            <stop offset=\"1\" stop-color=\"#B8299F\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('wav')\" />\n        <g transform=\"translate(0 -3)\">\n          <path\n            d=\"M39 49H45L50 37L57 61L64 39L70 55H89\"\n            stroke=\"white\"\n            stroke-opacity=\"0.38\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#B8299F\"\n          >\n            WAV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('webm') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('webm')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#53B5FF\" />\n            <stop offset=\"1\" stop-color=\"#5034D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('webm')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5034D5\"\n          >\n            WEBM\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xls') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xls')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4AD991\" />\n            <stop offset=\"1\" stop-color=\"#168F58\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xls')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#168F58\"\n          >\n            XLS\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xml') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xml')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#7188FF\" />\n            <stop offset=\"1\" stop-color=\"#3346B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xml')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#3346B8\"\n          >\n            XML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('zip') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('zip')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FFD15C\" />\n            <stop offset=\"1\" stop-color=\"#C48612\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('zip')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M61 34Q61 32 63 32H65Q67 32 67 34V66Q67 68 65 68H63Q61 68 61 66V34ZM53 34Q51 34 51 36V37Q51 39 53 39H61V34H53ZM67 39V44H75Q77 44 77 42V41Q77 39 75 39H67ZM53 44Q51 44 51 46V47Q51 49 53 49H61V44H53ZM67 49V54H75Q77 54 77 52V51Q77 49 75 49H67ZM53 54Q51 54 51 56V57Q51 59 53 59H61V54H53ZM67 59V64H75Q77 64 77 62V61Q77 59 75 59H67Z\"\n            fill=\"white\"\n            fill-opacity=\"0.66\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C48612\"\n          >\n            ZIP\n          </text>\n        </g>\n      </svg>\n    }\n  }\n</span>\n", styles: [":host{--ngs-file-type-size: calc(var(--spacing, .25rem) * 10);display:inline-flex;flex:none;line-height:0}:host:not([class*=w-]):not([class*=size-]){width:var(--ngs-file-type-size)}:host:not([class*=h-]):not([class*=size-]){height:var(--ngs-file-type-size)}:host .icon{display:contents}:host svg{display:block;width:100%;height:100%;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: FileType, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngs-file-type', exportAs: 'ngsFileType', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'ngs-file-type not-prose',
+                        '[attr.role]': 'decorative() ? null : "img"',
+                        '[attr.aria-label]': 'decorative() ? null : resolvedLabel()',
+                        '[attr.aria-hidden]': 'decorative() ? "true" : null',
+                        '[attr.data-file-type]': 'type()',
+                    }, template: "<span class=\"icon\">\n  @switch (type()) {\n    @case ('avi') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('avi')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#8D7CFF\" />\n            <stop offset=\"1\" stop-color=\"#4531C9\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('avi')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#4531C9\"\n          >\n            AVI\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('csv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('csv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#42D9D2\" />\n            <stop offset=\"1\" stop-color=\"#0B8A97\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('csv')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#0B8A97\"\n          >\n            CSV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('doc') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('doc')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5EA8FF\" />\n            <stop offset=\"1\" stop-color=\"#1D5FD6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('doc')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1D5FD6\"\n          >\n            DOC\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('html') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('html')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF7A5F\" />\n            <stop offset=\"1\" stop-color=\"#D23B21\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('html')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D23B21\"\n          >\n            HTML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('jpg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('jpg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF78B6\" />\n            <stop offset=\"1\" stop-color=\"#C92678\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('jpg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C92678\"\n          >\n            JPG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('json') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('json')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#667085\" />\n            <stop offset=\"1\" stop-color=\"#202939\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('json')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M51 33C45 33 43 37 43 41V45C43 48 41 50 38 50C41 50 43 52 43 55V59C43 63 45 67 51 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M77 33C83 33 85 37 85 41V45C85 48 87 50 90 50C87 50 85 52 85 55V59C85 63 83 67 77 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M57 43H70M57 57H73\"\n            stroke=\"white\"\n            stroke-opacity=\"0.44\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#202939\"\n          >\n            JSON\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mkv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mkv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#AA74FF\" />\n            <stop offset=\"1\" stop-color=\"#5C26B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mkv')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5C26B8\"\n          >\n            MKV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mov') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mov')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#45D0FF\" />\n            <stop offset=\"1\" stop-color=\"#1268C7\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mov')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1268C7\"\n          >\n            MOV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp3') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp3')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#D36BFF\" />\n            <stop offset=\"1\" stop-color=\"#8A2BC6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp3')\" />\n        <g transform=\"translate(0 0)\">\n          <path\n            d=\"M52 56V35L82 30V49M52 56C52 59.5 49.2 62 45.5 62C41.8 62 39 59.5 39 56C39 52.5 41.8 50 45.5 50C49.2 50 52 52.5 52 56ZM82 49C82 52.5 79.2 55 75.5 55C71.8 55 69 52.5 69 49C69 45.5 71.8 43 75.5 43C79.2 43 82 45.5 82 49Z\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#8A2BC6\"\n          >\n            MP3\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp4') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp4')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5E9BFF\" />\n            <stop offset=\"1\" stop-color=\"#2745C8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp4')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#2745C8\"\n          >\n            MP4\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('pdf') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('pdf')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6A5F\" />\n            <stop offset=\"1\" stop-color=\"#D82432\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('pdf')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D82432\"\n          >\n            PDF\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('png') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('png')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4EC8FF\" />\n            <stop offset=\"1\" stop-color=\"#147AAE\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('png')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#147AAE\"\n          >\n            PNG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('ppt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('ppt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF9B4A\" />\n            <stop offset=\"1\" stop-color=\"#D84A1B\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('ppt')\" />\n        <g transform=\"translate(0 0)\">\n          <rect\n            x=\"40\"\n            y=\"31\"\n            width=\"48\"\n            height=\"30\"\n            rx=\"5\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"5\"\n          />\n          <path\n            d=\"M51 51H75M51 43H63\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"4\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D84A1B\"\n          >\n            PPT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('svg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('svg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#B389FF\" />\n            <stop offset=\"1\" stop-color=\"#6F35D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('svg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#6F35D5\"\n          >\n            SVG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('txt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('txt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#95A3B8\" />\n            <stop offset=\"1\" stop-color=\"#526071\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('txt')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#526071\"\n          >\n            TXT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('wav') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('wav')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6EDB\" />\n            <stop offset=\"1\" stop-color=\"#B8299F\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('wav')\" />\n        <g transform=\"translate(0 -3)\">\n          <path\n            d=\"M39 49H45L50 37L57 61L64 39L70 55H89\"\n            stroke=\"white\"\n            stroke-opacity=\"0.38\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#B8299F\"\n          >\n            WAV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('webm') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('webm')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#53B5FF\" />\n            <stop offset=\"1\" stop-color=\"#5034D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('webm')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5034D5\"\n          >\n            WEBM\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xls') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xls')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4AD991\" />\n            <stop offset=\"1\" stop-color=\"#168F58\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xls')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#168F58\"\n          >\n            XLS\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xml') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xml')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#7188FF\" />\n            <stop offset=\"1\" stop-color=\"#3346B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xml')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#3346B8\"\n          >\n            XML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('zip') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('zip')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FFD15C\" />\n            <stop offset=\"1\" stop-color=\"#C48612\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('zip')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M61 34Q61 32 63 32H65Q67 32 67 34V66Q67 68 65 68H63Q61 68 61 66V34ZM53 34Q51 34 51 36V37Q51 39 53 39H61V34H53ZM67 39V44H75Q77 44 77 42V41Q77 39 75 39H67ZM53 44Q51 44 51 46V47Q51 49 53 49H61V44H53ZM67 49V54H75Q77 54 77 52V51Q77 49 75 49H67ZM53 54Q51 54 51 56V57Q51 59 53 59H61V54H53ZM67 59V64H75Q77 64 77 62V61Q77 59 75 59H67Z\"\n            fill=\"white\"\n            fill-opacity=\"0.66\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C48612\"\n          >\n            ZIP\n          </text>\n        </g>\n      </svg>\n    }\n  }\n</span>\n", styles: [":host{--ngs-file-type-size: calc(var(--spacing, .25rem) * 10);display:inline-flex;flex:none;line-height:0}:host:not([class*=w-]):not([class*=size-]){width:var(--ngs-file-type-size)}:host:not([class*=h-]):not([class*=size-]){height:var(--ngs-file-type-size)}:host .icon{display:contents}:host svg{display:block;width:100%;height:100%;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { mimeType: [{ type: i0.Input, args: [{ isSignal: true, alias: "mimeType", required: false }] }], extension: [{ type: i0.Input, args: [{ isSignal: true, alias: "extension", required: false }] }], fileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileName", required: false }] }], fallback: [{ type: i0.Input, args: [{ isSignal: true, alias: "fallback", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], decorative: [{ type: i0.Input, args: [{ isSignal: true, alias: "decorative", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { FileType };
+//# sourceMappingURL=ngstarter-ui-components-file-type.mjs.map

package/fesm2022/ngstarter-ui-components-file-type.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngstarter-ui-components-file-type.mjs","sources":["../../../projects/components/file-type/src/file-type/file-type.ts","../../../projects/components/file-type/src/file-type/file-type.html","../../../projects/components/file-type/ngstarter-ui-components-file-type.ts"],"sourcesContent":["import {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  input,\n} from '@angular/core';\nimport { FileTypeName } from '../types';\n\nconst EXTENSION_TO_TYPE: Record<string, FileTypeName> = {\n  avi: 'avi',\n  csv: 'csv',\n  doc: 'doc',\n  docx: 'doc',\n  html: 'html',\n  htm: 'html',\n  jpeg: 'jpg',\n  jpg: 'jpg',\n  json: 'json',\n  jsonld: 'json',\n  mkv: 'mkv',\n  mov: 'mov',\n  mp3: 'mp3',\n  m4a: 'mp3',\n  mp4: 'mp4',\n  pdf: 'pdf',\n  png: 'png',\n  pot: 'ppt',\n  potx: 'ppt',\n  pps: 'ppt',\n  ppsx: 'ppt',\n  ppt: 'ppt',\n  pptx: 'ppt',\n  svg: 'svg',\n  text: 'txt',\n  txt: 'txt',\n  wav: 'wav',\n  webm: 'webm',\n  xls: 'xls',\n  xlsx: 'xls',\n  xml: 'xml',\n  zip: 'zip',\n};\n\nconst MIME_TYPE_TO_TYPE: Record<string, FileTypeName> = {\n  'application/csv': 'csv',\n  'application/json': 'json',\n  'application/ld+json': 'json',\n  'application/msword': 'doc',\n  'application/pdf': 'pdf',\n  'application/rtf': 'doc',\n  'application/vnd.ms-excel': 'xls',\n  'application/vnd.ms-powerpoint': 'ppt',\n  'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'ppt',\n  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'xls',\n  'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'doc',\n  'application/x-zip-compressed': 'zip',\n  'application/xml': 'xml',\n  'application/zip': 'zip',\n  'audio/mp3': 'mp3',\n  'audio/mpeg': 'mp3',\n  'audio/wav': 'wav',\n  'audio/wave': 'wav',\n  'audio/x-wav': 'wav',\n  'image/jpeg': 'jpg',\n  'image/jpg': 'jpg',\n  'image/png': 'png',\n  'image/svg+xml': 'svg',\n  'multipart/x-zip': 'zip',\n  'text/comma-separated-values': 'csv',\n  'text/csv': 'csv',\n  'text/html': 'html',\n  'text/json': 'json',\n  'text/plain': 'txt',\n  'text/xml': 'xml',\n  'video/mp4': 'mp4',\n  'video/quicktime': 'mov',\n  'video/webm': 'webm',\n  'video/x-matroska': 'mkv',\n  'video/x-msvideo': 'avi',\n};\n\nlet nextIconId = 0;\n\n@Component({\n  selector: 'ngs-file-type',\n  exportAs: 'ngsFileType',\n  templateUrl: './file-type.html',\n  styleUrl: './file-type.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'ngs-file-type not-prose',\n    '[attr.role]': 'decorative() ? null : \"img\"',\n    '[attr.aria-label]': 'decorative() ? null : resolvedLabel()',\n    '[attr.aria-hidden]': 'decorative() ? \"true\" : null',\n    '[attr.data-file-type]': 'type()',\n  },\n})\nexport class FileType {\n  private readonly iconId = `ngs-file-type-${nextIconId++}`;\n\n  mimeType = input<string | null | undefined>();\n  extension = input<string | null | undefined>();\n  fileName = input<string | null | undefined>();\n  fallback = input<FileTypeName>('txt');\n  label = input<string | null | undefined>();\n  decorative = input(false, { transform: booleanAttribute });\n\n  readonly type = computed<FileTypeName>(() => this.resolveType());\n\n  protected readonly resolvedLabel = computed(() => {\n    const label = this.label();\n\n    if (label) {\n      return label;\n    }\n\n    return `${this.type().toUpperCase()} file`;\n  });\n\n  private resolveType(): FileTypeName {\n    const extensionType =\n      this.resolveExtension(this.extension()) ?? this.resolveExtension(this.fileName());\n\n    if (extensionType) {\n      return extensionType;\n    }\n\n    const mimeType = this.normalizeMimeType(this.mimeType());\n\n    if (mimeType) {\n      return MIME_TYPE_TO_TYPE[mimeType] ?? this.resolveMimeFamily(mimeType) ?? this.fallback();\n    }\n\n    return this.fallback();\n  }\n\n  private resolveExtension(value: string | null | undefined): FileTypeName | null {\n    const extension = this.normalizeExtension(value);\n\n    if (!extension) {\n      return null;\n    }\n\n    return EXTENSION_TO_TYPE[extension] ?? null;\n  }\n\n  private normalizeExtension(value: string | null | undefined): string | null {\n    if (!value) {\n      return null;\n    }\n\n    const normalized = value.trim().toLowerCase();\n\n    if (!normalized) {\n      return null;\n    }\n\n    const fileExtension = normalized.includes('.')\n      ? normalized.split('.').pop()\n      : normalized.replace(/^\\./, '');\n\n    return fileExtension || null;\n  }\n\n  private normalizeMimeType(value: string | null | undefined): string | null {\n    if (!value) {\n      return null;\n    }\n\n    const mimeType = value.split(';')[0].trim().toLowerCase();\n\n    return mimeType || null;\n  }\n\n  private resolveMimeFamily(mimeType: string): FileTypeName | null {\n    if (mimeType.startsWith('image/')) {\n      return 'png';\n    }\n\n    if (mimeType.startsWith('video/')) {\n      return 'mp4';\n    }\n\n    if (mimeType.startsWith('audio/')) {\n      return 'mp3';\n    }\n\n    if (mimeType.startsWith('text/')) {\n      return 'txt';\n    }\n\n    return null;\n  }\n\n  protected gradientId(type: FileTypeName): string {\n    return `${this.iconId}-${type}-pageGradient`;\n  }\n\n  protected gradientUrl(type: FileTypeName): string {\n    return `url(#${this.gradientId(type)})`;\n  }\n}\n","<span class=\"icon\">\n  @switch (type()) {\n    @case ('avi') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('avi')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#8D7CFF\" />\n            <stop offset=\"1\" stop-color=\"#4531C9\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('avi')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#4531C9\"\n          >\n            AVI\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('csv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('csv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#42D9D2\" />\n            <stop offset=\"1\" stop-color=\"#0B8A97\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('csv')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#0B8A97\"\n          >\n            CSV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('doc') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('doc')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5EA8FF\" />\n            <stop offset=\"1\" stop-color=\"#1D5FD6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('doc')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1D5FD6\"\n          >\n            DOC\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('html') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('html')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF7A5F\" />\n            <stop offset=\"1\" stop-color=\"#D23B21\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('html')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D23B21\"\n          >\n            HTML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('jpg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('jpg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF78B6\" />\n            <stop offset=\"1\" stop-color=\"#C92678\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('jpg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C92678\"\n          >\n            JPG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('json') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('json')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#667085\" />\n            <stop offset=\"1\" stop-color=\"#202939\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('json')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M51 33C45 33 43 37 43 41V45C43 48 41 50 38 50C41 50 43 52 43 55V59C43 63 45 67 51 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M77 33C83 33 85 37 85 41V45C85 48 87 50 90 50C87 50 85 52 85 55V59C85 63 83 67 77 67\"\n            stroke=\"white\"\n            stroke-opacity=\"0.42\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <path\n            d=\"M57 43H70M57 57H73\"\n            stroke=\"white\"\n            stroke-opacity=\"0.44\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#202939\"\n          >\n            JSON\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mkv') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mkv')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#AA74FF\" />\n            <stop offset=\"1\" stop-color=\"#5C26B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mkv')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5C26B8\"\n          >\n            MKV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mov') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mov')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#45D0FF\" />\n            <stop offset=\"1\" stop-color=\"#1268C7\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mov')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#1268C7\"\n          >\n            MOV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp3') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp3')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#D36BFF\" />\n            <stop offset=\"1\" stop-color=\"#8A2BC6\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp3')\" />\n        <g transform=\"translate(0 0)\">\n          <path\n            d=\"M52 56V35L82 30V49M52 56C52 59.5 49.2 62 45.5 62C41.8 62 39 59.5 39 56C39 52.5 41.8 50 45.5 50C49.2 50 52 52.5 52 56ZM82 49C82 52.5 79.2 55 75.5 55C71.8 55 69 52.5 69 49C69 45.5 71.8 43 75.5 43C79.2 43 82 45.5 82 49Z\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#8A2BC6\"\n          >\n            MP3\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('mp4') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('mp4')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#5E9BFF\" />\n            <stop offset=\"1\" stop-color=\"#2745C8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('mp4')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#2745C8\"\n          >\n            MP4\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('pdf') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('pdf')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6A5F\" />\n            <stop offset=\"1\" stop-color=\"#D82432\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('pdf')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D82432\"\n          >\n            PDF\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('png') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('png')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4EC8FF\" />\n            <stop offset=\"1\" stop-color=\"#147AAE\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('png')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#147AAE\"\n          >\n            PNG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('ppt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('ppt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF9B4A\" />\n            <stop offset=\"1\" stop-color=\"#D84A1B\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('ppt')\" />\n        <g transform=\"translate(0 0)\">\n          <rect\n            x=\"40\"\n            y=\"31\"\n            width=\"48\"\n            height=\"30\"\n            rx=\"5\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"5\"\n          />\n          <path\n            d=\"M51 51H75M51 43H63\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"4\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#D84A1B\"\n          >\n            PPT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('svg') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('svg')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#B389FF\" />\n            <stop offset=\"1\" stop-color=\"#6F35D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('svg')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect x=\"37\" y=\"34\" width=\"54\" height=\"36\" rx=\"7\" fill=\"white\" fill-opacity=\"0.18\" />\n          <path\n            d=\"M39 62L51 50L61 59L70 49L89 66\"\n            stroke=\"white\"\n            stroke-opacity=\"0.62\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n          <circle cx=\"75\" cy=\"44\" r=\"5\" fill=\"white\" fill-opacity=\"0.62\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#6F35D5\"\n          >\n            SVG\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('txt') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('txt')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#95A3B8\" />\n            <stop offset=\"1\" stop-color=\"#526071\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('txt')\" />\n        <g transform=\"translate(0 2)\">\n          <path\n            d=\"M42 32H82M42 44H86M42 56H76\"\n            stroke=\"white\"\n            stroke-opacity=\"0.34\"\n            stroke-width=\"6\"\n            stroke-linecap=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#526071\"\n          >\n            TXT\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('wav') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('wav')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FF6EDB\" />\n            <stop offset=\"1\" stop-color=\"#B8299F\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('wav')\" />\n        <g transform=\"translate(0 -3)\">\n          <path\n            d=\"M39 49H45L50 37L57 61L64 39L70 55H89\"\n            stroke=\"white\"\n            stroke-opacity=\"0.38\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#B8299F\"\n          >\n            WAV\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('webm') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('webm')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#53B5FF\" />\n            <stop offset=\"1\" stop-color=\"#5034D5\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('webm')\" />\n        <g transform=\"translate(0 -4)\">\n          <rect\n            x=\"39\"\n            y=\"35\"\n            width=\"50\"\n            height=\"30\"\n            rx=\"6\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n          />\n          <path d=\"M58 43V57L72 50L58 43Z\" fill=\"white\" fill-opacity=\"0.44\" />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"16\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#5034D5\"\n          >\n            WEBM\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xls') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xls')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#4AD991\" />\n            <stop offset=\"1\" stop-color=\"#168F58\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xls')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M42 33C38.686 33 36 35.686 36 39V61C36 64.314 38.686 67 42 67H86C89.314 67 92 64.314 92 61V39C92 35.686 89.314 33 86 33H42ZM43 37C41.343 37 40 38.343 40 40V49H54V37H43ZM57 37H71V49H57V37ZM74 37V49H88V40C88 38.343 86.657 37 85 37H74ZM40 52V61C40 62.657 41.343 64 43 64H54V52H40ZM57 52H71V64H57V52ZM74 52V64H85C86.657 64 88 62.657 88 61V52H74Z\"\n            fill=\"white\"\n            fill-opacity=\"0.5\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#168F58\"\n          >\n            XLS\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('xml') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('xml')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#7188FF\" />\n            <stop offset=\"1\" stop-color=\"#3346B8\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('xml')\" />\n        <g transform=\"translate(0 -2)\">\n          <path\n            d=\"M53 36L41 48L53 60M75 36L87 48L75 60M68 34L60 62\"\n            stroke=\"white\"\n            stroke-opacity=\"0.36\"\n            stroke-width=\"5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#3346B8\"\n          >\n            XML\n          </text>\n        </g>\n      </svg>\n    }\n    @case ('zip') {\n      <svg\n        aria-hidden=\"true\"\n        focusable=\"false\"\n        width=\"128\"\n        height=\"128\"\n        viewBox=\"0 0 128 128\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <defs>\n          <linearGradient\n            [attr.id]=\"gradientId('zip')\"\n            x1=\"22\"\n            y1=\"10\"\n            x2=\"106\"\n            y2=\"118\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop stop-color=\"#FFD15C\" />\n            <stop offset=\"1\" stop-color=\"#C48612\" />\n          </linearGradient>\n        </defs>\n        <rect x=\"19\" y=\"10\" width=\"90\" height=\"108\" rx=\"12\" [attr.fill]=\"gradientUrl('zip')\" />\n        <g transform=\"translate(0 -4)\">\n          <path\n            d=\"M61 34Q61 32 63 32H65Q67 32 67 34V66Q67 68 65 68H63Q61 68 61 66V34ZM53 34Q51 34 51 36V37Q51 39 53 39H61V34H53ZM67 39V44H75Q77 44 77 42V41Q77 39 75 39H67ZM53 44Q51 44 51 46V47Q51 49 53 49H61V44H53ZM67 49V54H75Q77 54 77 52V51Q77 49 75 49H67ZM53 54Q51 54 51 56V57Q51 59 53 59H61V54H53ZM67 59V64H75Q77 64 77 62V61Q77 59 75 59H67Z\"\n            fill=\"white\"\n            fill-opacity=\"0.66\"\n          />\n        </g>\n        <g class=\"file-type-label\">\n          <rect x=\"27\" y=\"82\" width=\"74\" height=\"28\" rx=\"7\" fill=\"white\" fill-opacity=\"0.96\" />\n          <text\n            x=\"64\"\n            y=\"95\"\n            dy=\"0.08em\"\n            text-anchor=\"middle\"\n            dominant-baseline=\"central\"\n            font-family=\"Inter, Arial, sans-serif\"\n            font-size=\"19\"\n            font-weight=\"700\"\n            letter-spacing=\"1\"\n            fill=\"#C48612\"\n          >\n            ZIP\n          </text>\n        </g>\n      </svg>\n    }\n  }\n</span>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AASA,MAAM,iBAAiB,GAAiC;AACtD,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,GAAG,EAAE,MAAM;AACX,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,MAAM,EAAE,MAAM;AACd,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,KAAK;AACX,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,GAAG,EAAE,KAAK;CACX;AAED,MAAM,iBAAiB,GAAiC;AACtD,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,kBAAkB,EAAE,MAAM;AAC1B,IAAA,qBAAqB,EAAE,MAAM;AAC7B,IAAA,oBAAoB,EAAE,KAAK;AAC3B,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,0BAA0B,EAAE,KAAK;AACjC,IAAA,+BAA+B,EAAE,KAAK;AACtC,IAAA,2EAA2E,EAAE,KAAK;AAClF,IAAA,mEAAmE,EAAE,KAAK;AAC1E,IAAA,yEAAyE,EAAE,KAAK;AAChF,IAAA,8BAA8B,EAAE,KAAK;AACrC,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,aAAa,EAAE,KAAK;AACpB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,eAAe,EAAE,KAAK;AACtB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,6BAA6B,EAAE,KAAK;AACpC,IAAA,UAAU,EAAE,KAAK;AACjB,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,WAAW,EAAE,MAAM;AACnB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,UAAU,EAAE,KAAK;AACjB,IAAA,WAAW,EAAE,KAAK;AAClB,IAAA,iBAAiB,EAAE,KAAK;AACxB,IAAA,YAAY,EAAE,MAAM;AACpB,IAAA,kBAAkB,EAAE,KAAK;AACzB,IAAA,iBAAiB,EAAE,KAAK;CACzB;AAED,IAAI,UAAU,GAAG,CAAC;MAgBL,QAAQ,CAAA;AACF,IAAA,MAAM,GAAG,CAAA,cAAA,EAAiB,UAAU,EAAE,EAAE;IAEzD,QAAQ,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,UAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAA6B;IAC7C,SAAS,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,WAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAA6B;IAC9C,QAAQ,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,UAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAA6B;AAC7C,IAAA,QAAQ,GAAG,KAAK,CAAe,KAAK,+EAAC;IACrC,KAAK,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,OAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAA6B;IAC1C,UAAU,GAAG,KAAK,CAAC,KAAK,kFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IAEjD,IAAI,GAAG,QAAQ,CAAe,MAAM,IAAI,CAAC,WAAW,EAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAE7C,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AAC/C,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE;QAE1B,IAAI,KAAK,EAAE;AACT,YAAA,OAAO,KAAK;QACd;QAEA,OAAO,CAAA,EAAG,IAAI,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,CAAA,KAAA,CAAO;AAC5C,IAAA,CAAC,oFAAC;IAEM,WAAW,GAAA;QACjB,MAAM,aAAa,GACjB,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;QAEnF,IAAI,aAAa,EAAE;AACjB,YAAA,OAAO,aAAa;QACtB;QAEA,MAAM,QAAQ,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;QAExD,IAAI,QAAQ,EAAE;AACZ,YAAA,OAAO,iBAAiB,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE;QAC3F;AAEA,QAAA,OAAO,IAAI,CAAC,QAAQ,EAAE;IACxB;AAEQ,IAAA,gBAAgB,CAAC,KAAgC,EAAA;QACvD,MAAM,SAAS,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;QAEhD,IAAI,CAAC,SAAS,EAAE;AACd,YAAA,OAAO,IAAI;QACb;AAEA,QAAA,OAAO,iBAAiB,CAAC,SAAS,CAAC,IAAI,IAAI;IAC7C;AAEQ,IAAA,kBAAkB,CAAC,KAAgC,EAAA;QACzD,IAAI,CAAC,KAAK,EAAE;AACV,YAAA,OAAO,IAAI;QACb;QAEA,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE;QAE7C,IAAI,CAAC,UAAU,EAAE;AACf,YAAA,OAAO,IAAI;QACb;AAEA,QAAA,MAAM,aAAa,GAAG,UAAU,CAAC,QAAQ,CAAC,GAAG;cACzC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG;cACzB,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;QAEjC,OAAO,aAAa,IAAI,IAAI;IAC9B;AAEQ,IAAA,iBAAiB,CAAC,KAAgC,EAAA;QACxD,IAAI,CAAC,KAAK,EAAE;AACV,YAAA,OAAO,IAAI;QACb;AAEA,QAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE;QAEzD,OAAO,QAAQ,IAAI,IAAI;IACzB;AAEQ,IAAA,iBAAiB,CAAC,QAAgB,EAAA;AACxC,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;AACjC,YAAA,OAAO,KAAK;QACd;AAEA,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;AACjC,YAAA,OAAO,KAAK;QACd;AAEA,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;AACjC,YAAA,OAAO,KAAK;QACd;AAEA,QAAA,IAAI,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;AAChC,YAAA,OAAO,KAAK;QACd;AAEA,QAAA,OAAO,IAAI;IACb;AAEU,IAAA,UAAU,CAAC,IAAkB,EAAA;AACrC,QAAA,OAAO,GAAG,IAAI,CAAC,MAAM,CAAA,CAAA,EAAI,IAAI,eAAe;IAC9C;AAEU,IAAA,WAAW,CAAC,IAAkB,EAAA;QACtC,OAAO,CAAA,KAAA,EAAQ,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG;IACzC;uGAvGW,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,4nCClGrB,mtlCA6kCA,EAAA,MAAA,EAAA,CAAA,8ZAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FD3+Ba,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAdpB,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,eAAe,YACf,aAAa,EAAA,eAAA,EAGN,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,KAAK,EAAE,yBAAyB;AAChC,wBAAA,aAAa,EAAE,6BAA6B;AAC5C,wBAAA,mBAAmB,EAAE,uCAAuC;AAC5D,wBAAA,oBAAoB,EAAE,8BAA8B;AACpD,wBAAA,uBAAuB,EAAE,QAAQ;AAClC,qBAAA,EAAA,QAAA,EAAA,mtlCAAA,EAAA,MAAA,EAAA,CAAA,8ZAAA,CAAA,EAAA;;;AEhGH;;AAEG;;;;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ngstarter-ui/components",
   "description": "NgStarter - AI-friendly Enterprise Angular UI Components and Admin Panel",
-  "version": "21.0.28",
+  "version": "21.0.29",
   "repository": {
     "type": "git",
     "url": "https://github.com/elementarlabsdev/ngstarter.git"
@@ -238,6 +238,10 @@
       "types": "./types/ngstarter-ui-components-expansion.d.ts",
       "default": "./fesm2022/ngstarter-ui-components-expansion.mjs"
     },
+    "./file-type": {
+      "types": "./types/ngstarter-ui-components-file-type.d.ts",
+      "default": "./fesm2022/ngstarter-ui-components-file-type.mjs"
+    },
     "./filter-builder": {
       "types": "./types/ngstarter-ui-components-filter-builder.d.ts",
       "default": "./fesm2022/ngstarter-ui-components-filter-builder.mjs"

package/types/ngstarter-ui-components-file-type.d.ts

@@ -0,0 +1,27 @@
+import * as _angular_core from '@angular/core';
+
+type FileTypeName = 'avi' | 'csv' | 'doc' | 'html' | 'jpg' | 'json' | 'mkv' | 'mov' | 'mp3' | 'mp4' | 'pdf' | 'png' | 'ppt' | 'svg' | 'txt' | 'wav' | 'webm' | 'xls' | 'xml' | 'zip';
+
+declare class FileType {
+    private readonly iconId;
+    mimeType: _angular_core.InputSignal<string | null | undefined>;
+    extension: _angular_core.InputSignal<string | null | undefined>;
+    fileName: _angular_core.InputSignal<string | null | undefined>;
+    fallback: _angular_core.InputSignal<FileTypeName>;
+    label: _angular_core.InputSignal<string | null | undefined>;
+    decorative: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly type: _angular_core.Signal<FileTypeName>;
+    protected readonly resolvedLabel: _angular_core.Signal<string>;
+    private resolveType;
+    private resolveExtension;
+    private normalizeExtension;
+    private normalizeMimeType;
+    private resolveMimeFamily;
+    protected gradientId(type: FileTypeName): string;
+    protected gradientUrl(type: FileTypeName): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FileType, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FileType, "ngs-file-type", ["ngsFileType"], { "mimeType": { "alias": "mimeType"; "required": false; "isSignal": true; }; "extension": { "alias": "extension"; "required": false; "isSignal": true; }; "fileName": { "alias": "fileName"; "required": false; "isSignal": true; }; "fallback": { "alias": "fallback"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "decorative": { "alias": "decorative"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { FileType };
+export type { FileTypeName };