@uxf/ui 1.0.0-beta.127 → 1.0.0-beta.128

package/_private-utils/get-provider-config.js

@@ -10,6 +10,7 @@ const getProviderConfig = () => ({
         respectSystemSetting: false,
         respectUserSettings: false,
     },
+    domain: "https://localhost:6006",
     icon: { spriteFilePath: "/icons-generated/_icon-sprite.svg", iconsConfig: icons_1.ICONS },
     rasterImage: {
         breakpoints: tw_screens_1.twScreens,

package/context/context.d.ts

@@ -3,6 +3,7 @@ import { ColorSchemeOptions } from "../color-scheme/use-handle-color-scheme";
 import { IconName } from "../icon/types";
 export declare type UiContextType = {
     colorScheme: ColorSchemeOptions;
+    domain: string;
     icon: {
         spriteFilePath: string;
         iconsConfig: Record<IconName, {

package/css/dropzone.css

@@ -67,6 +67,10 @@
                 @apply truncate;
             }
 
+            &__file-name-link {
+                @apply truncate hover:underline hover:underline-offset-2;
+            }
+
             &__file-size {
                 @apply whitespace-nowrap shrink-0;
             }

package/dropzone/dropzone-list.js

@@ -1,12 +1,33 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DropzoneList = void 0;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
+const context_1 = require("../context");
 const icon_1 = require("../icon");
 const loader_1 = require("../loader/loader");
 function formatBytes(bytes, decimals = 2) {
@@ -31,7 +52,11 @@ function getIconName(extension) {
             return "file";
     }
 }
+function getFileUrl(domain, file) {
+    return `${domain}/upload/${file.namespace || "default"}/${file.uuid[0]}/${file.uuid[1]}/${file.uuid}.${file.extension}`;
+}
 const DropzoneList = (props) => {
+    const context = (0, react_1.useContext)(context_1.UiContext);
     const onRemove = (file, isUploading) => () => {
         var _a, _b, _c;
         // eslint-disable-next-line no-alert
@@ -55,7 +80,7 @@ const DropzoneList = (props) => {
             react_1.default.createElement("div", { className: (0, cx_1.cx)("uxf-dropzone-list__item", !!file.error && classes_1.CLASSES.IS_INVALID) },
                 react_1.default.createElement("div", { className: "uxf-dropzone-list__item__block" },
                     react_1.default.createElement(icon_1.Icon, { className: "uxf-dropzone-list__item__block__icon", name: getIconName(file.extension) }),
-                    react_1.default.createElement("span", { className: "uxf-dropzone-list__item__block__file-name" }, file.name)),
+                    (context === null || context === void 0 ? void 0 : context.domain) && file.id > 0 ? (react_1.default.createElement("a", { className: "uxf-dropzone-list__item__block__file-name-link", href: getFileUrl(context.domain, file), target: "_blank", rel: "noreferrer noopenner" }, file.name)) : (react_1.default.createElement("span", { className: "uxf-dropzone-list__item__block__file-name" }, file.name))),
                 react_1.default.createElement("div", { className: "uxf-dropzone-list__item__block" },
                     isUploading ? (react_1.default.createElement(loader_1.Loader, { size: "sm" })) : (!file.error &&
                         ((_c = file.originalFile) === null || _c === void 0 ? void 0 : _c.size) && (react_1.default.createElement("span", { className: "uxf-dropzone-list__item__block__file-size" }, formatBytes(file.originalFile.size)))),

package/dropzone/dropzone.stories.js

@@ -30,6 +30,8 @@ exports.ComponentStructure = exports.Default = void 0;
 const component_structure_analyzer_1 = __importDefault(require("@uxf/ui/utils/component-structure-analyzer"));
 const uploadFIle_mock_1 = require("@uxf/ui/utils/mocks/uploadFIle.mock");
 const react_1 = __importStar(require("react"));
+const get_provider_config_1 = require("../_private-utils/get-provider-config");
+const context_1 = require("../context");
 const index_1 = require("./index");
 exports.default = {
     title: "UI/Dropzone",
@@ -46,9 +48,10 @@ function Default() {
         react_1.default.createElement(index_1.Dropzone.List, { errorText: "Chyba p\u0159i nahr\u00E1v\u00E1n\u00ED souboru", onAbortWarning: "Opravdu chcete p\u0159eru\u0161it nahr\u00E1v\u00E1n\u00ED?", onChange: setFiles, onRemoveWarning: "Opravdu chcete soubor smazat?", value: files }),
         react_1.default.createElement(index_1.Dropzone.List, { onChange: setFiles, value: files, renderItem: (file) => (react_1.default.createElement("li", { key: file.id },
                 react_1.default.createElement("pre", null, JSON.stringify(file, null, 4)))) })));
-    return (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" },
-        react_1.default.createElement("div", { className: "light space-y-2 p-20 lg:w-1/2" }, storyDropzone),
-        react_1.default.createElement("div", { className: "dark space-y-2 bg-gray-900 p-20 lg:w-1/2" }, storyDropzone)));
+    return (react_1.default.createElement(context_1.UiContextProvider, { value: (0, get_provider_config_1.getProviderConfig)() },
+        react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" },
+            react_1.default.createElement("div", { className: "light space-y-2 p-20 lg:w-1/2" }, storyDropzone),
+            react_1.default.createElement("div", { className: "dark space-y-2 bg-gray-900 p-20 lg:w-1/2" }, storyDropzone))));
 }
 exports.Default = Default;
 function ComponentStructure() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/ui",
-  "version": "1.0.0-beta.127",
+  "version": "1.0.0-beta.128",
   "description": "",
   "publishConfig": {
     "access": "public"