add Value.Upload component

dnbexperience · Nov 8, 2024 · a5e5995 · a5e5995
1 parent 63613f1
commit a5e5995
Show file tree

Hide file tree

Showing 22 changed files with 1,307 additions and 22 deletions.
diff --git a/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx b/...s/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/SummaryList/Examples.tsx
@@ -2,6 +2,16 @@ import ComponentBox from '../../../../../../shared/tags/ComponentBox'
 import { Card } from '@dnb/eufemia/src'
 import { Field, Form, Value } from '@dnb/eufemia/src/extensions/forms'
 
+function createMockFile(name: string, size: number, type: string) {
+  const file = new File([], name, { type })
+  Object.defineProperty(file, 'size', {
+    get() {
+      return size
+    },
+  })
+  return file
+}
+
 export const DefaultLayout = () => {
   return (
     <ComponentBox data-visual-test="forms-value-summary-list-default">
@@ -132,15 +142,36 @@ export function InheritVisibility() {
 
 export function InheritLabel() {
   return (
-    <ComponentBox>
+    <ComponentBox scope={{ createMockFile }}>
       <Form.Handler>
         <Card stack>
           <Field.String path="/foo" defaultValue="foo" label="foo label" />
           <Field.String path="/bar" defaultValue="bar" label="bar label" />
+          <Field.Upload
+            path="/baz"
+            defaultValue={[
+              {
+                file: createMockFile(
+                  'fileName-1.png',
+                  1000000,
+                  'image/png',
+                ),
+              },
+              {
+                file: createMockFile(
+                  'fileName-2.png',
+                  2000000,
+                  'image/png',
+                ),
+              },
+            ]}
+            label="baz label"
+          />
 
           <Value.SummaryList inheritLabel>
             <Value.String path="/foo" />
             <Value.String path="/bar" />
+            <Value.Upload path="/baz" />
           </Value.SummaryList>
         </Card>
       </Form.Handler>

diff --git a/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/Upload.mdx b/packages/dnb-design-system-portal/src/docs/uilib/extensions/forms/Value/Upload.mdx
@@ -0,0 +1,26 @@
+---
+title: 'Upload'
+description: '`Value.Upload` will render the selected country.'
+componentType: 'feature-value'
+showTabs: true
+tabs:
+  - title: Info
+    key: '/info'
+  - title: Demos
+    key: '/demos'
+  - title: Properties
+    key: '/properties'
+breadcrumb:
+  - text: Forms
+    href: /uilib/extensions/forms/
+  - text: Value
+    href: /uilib/extensions/forms/Value/
+  - text: Upload
+    href: /uilib/extensions/forms/Value/Upload/
+---
+
+import Info from 'Docs/uilib/extensions/forms/Value/Upload/info'
+import Demos from 'Docs/uilib/extensions/forms/Value/Upload/demos'
+
+<Info />
+<Demos />