@symbo.ls/uikit 2.11.55 → 2.11.65

package/dist/index.cjs.js

@@ -11435,6 +11435,7 @@ __export(domql_exports, {
   Dialog: () => Dialog,
   DialogFooter: () => DialogFooter,
   Direction: () => Direction,
+  DragNdropUser: () => DragNdropUser,
   DropdownList: () => DropdownList,
   DropdownParent: () => DropdownParent,
   Field: () => Field,
@@ -11498,6 +11499,7 @@ __export(domql_exports, {
   TooltipParent: () => TooltipParent,
   Transform: () => Transform,
   Underline: () => Underline,
+  Upload: () => Upload,
   Video: () => Video,
   XYZ: () => XYZ,
   getSystemTheme: () => getSystemTheme,
@@ -15548,6 +15550,79 @@ var Textarea = {
   tag: "textarea"
 };
 
+// Upload/index.js
+var Upload = {
+  extend: [Focusable, Flex],
+  tag: "label",
+  props: {
+    position: "relative",
+    flow: "column",
+    align: "center center",
+    round: "A",
+    cursor: "pointer",
+    border: "1.6px, dashed, white 0.1",
+    padding: "B B2",
+    input: {
+      position: "absolute",
+      inset: "0 0 0 0",
+      opacity: "0",
+      visibility: "hidden"
+    }
+  },
+  input: { attr: { type: "file" } },
+  icon: {
+    extend: Icon,
+    props: {
+      name: "upload",
+      fontSize: `${26 / 16}em`,
+      opacity: ".2"
+    }
+  },
+  p: {
+    props: {
+      text: " or click and upload from your computer",
+      flexFlow: "column",
+      flexAlign: "center center",
+      opacity: ".22",
+      margin: "0"
+    },
+    span: {
+      text: "Drag and drop your font file",
+      style: { display: "block" }
+    }
+  }
+};
+var DragNdropUser = {
+  extend: Flex,
+  props: ({ state }) => ({
+    flow: "column",
+    align: "center center",
+    gap: "A",
+    round: "A",
+    img: { boxSize: "C C", src: state.src },
+    buttons: {
+      gap: "Y",
+      childProps: {
+        padding: "0",
+        boxSize: "B B",
+        background: "gray3",
+        round: "Y1",
+        color: "gray6",
+        style: { "> svg": { fontSize: `${14 / 16}em` } }
+      }
+    }
+  }),
+  img: { extend: Avatar },
+  buttons: {
+    extend: Flex,
+    childExtend: SquareButton,
+    ...[
+      { props: { icon: "reload" } },
+      { props: { icon: "trash" } }
+    ]
+  }
+};
+
 // Label/index.js
 var Label = {
   extend: Button,