diff --git a/packages/stencil-library/src/components/dnn-dropzone/readme.md b/packages/stencil-library/src/components/dnn-dropzone/readme.md
index 9877434c0..3b3b36845 100644
--- a/packages/stencil-library/src/components/dnn-dropzone/readme.md
+++ b/packages/stencil-library/src/components/dnn-dropzone/readme.md
@@ -7,14 +7,15 @@
## Properties
-| Property | Attribute | Description | Type | Default |
-| ------------------- | -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- | ----------- |
-| `allowCameraMode` | `allow-camera-mode` | If true, will allow the user to take a snapshot using the device camera. (only works over https). | `boolean` | `false` |
-| `allowedExtensions` | `allowed-extensions` | A list of allowed file extensions. If not specified, any file is allowed. Ex: ["jpg", "jpeg", "gif", "png"] | `string[] \| undefined` | `undefined` |
-| `captureQuality` | `capture-quality` | Specifies the jpeg quality for when the device camera is used to generate a picture. Needs to be a number between 0 and 1 and defaults to 0.8 | `number` | `0.8` |
-| `maxFileSize` | `max-file-size` | Max file size in bytes. | `number \| undefined` | `undefined` |
-| `name` | `name` | The name of the field when used in a form. | `string \| undefined` | `undefined` |
-| `resx` | `resx` | Localization strings | `DropzoneResx \| undefined` | `undefined` |
+| Property | Attribute | Description | Type | Default |
+| ------------------- | ------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- | ----------- |
+| `allowCameraMode` | `allow-camera-mode` | If true, will allow the user to take a snapshot using the device camera. (only works over https). | `boolean` | `false` |
+| `allowedExtensions` | -- | A list of allowed file extensions. If not specified, any file is allowed. Ex: ["jpg", "jpeg", "gif", "png"] | `string[] \| undefined` | `undefined` |
+| `captureQuality` | `capture-quality` | Specifies the jpeg quality for when the device camera is used to generate a picture. Needs to be a number between 0 and 1 and defaults to 0.8 | `number` | `0.8` |
+| `maxFileSize` | `max-file-size` | Max file size in bytes. | `number \| undefined` | `undefined` |
+| `multiple` | `multiple` | If true, allows multiple file selection. | `boolean` | `false` |
+| `name` | `name` | The name of the field when used in a form. | `string \| undefined` | `undefined` |
+| `resx` | -- | Localization strings | `DropzoneResx \| undefined` | `undefined` |
## Events
diff --git a/packages/stencil-library/src/components/dnn-dropzone/types.ts b/packages/stencil-library/src/components/dnn-dropzone/types.ts
index 85ecb02d1..9b16f976e 100644
--- a/packages/stencil-library/src/components/dnn-dropzone/types.ts
+++ b/packages/stencil-library/src/components/dnn-dropzone/types.ts
@@ -27,4 +27,7 @@ export interface DropzoneResx {
/** The information displayed about the allowed file extensions.
* {0} will be replaced by a comma separated list of allowed extensions. */
allowedFileExtensions?: string;
+
+ /** The text displayed when more than one file is provided but multiple is false. */
+ tooManyFiles?: string;
}
\ No newline at end of file
diff --git a/packages/stencil-library/src/components/dnn-image-cropper/readme.md b/packages/stencil-library/src/components/dnn-image-cropper/readme.md
index 1b5299253..994f525de 100644
--- a/packages/stencil-library/src/components/dnn-image-cropper/readme.md
+++ b/packages/stencil-library/src/components/dnn-image-cropper/readme.md
@@ -19,7 +19,7 @@ in an event that has a data-url of the image.
| `name` | `name` | The name of the control when used in a form. | `string \| undefined` | `undefined` |
| `preventUndersized` | `prevent-undersized` | When set to true, prevents cropping an image smaller than the required size, which would blow pixel and make the final picture look blurry. | `boolean` | `false` |
| `quality` | `quality` | Sets the output quality of the cropped image (number between 0 and 1). | `number` | `0.8` |
-| `resx` | `resx` | Can be used to customize controls text. Some values support tokens, see default values for examples. | `ImageCropperResx \| undefined` | `undefined` |
+| `resx` | -- | Can be used to customize controls text. Some values support tokens, see default values for examples. | `ImageCropperResx \| undefined` | `undefined` |
| `width` | `width` | Sets the desired final image width. | `number \| undefined` | `undefined` |
diff --git a/packages/stencil-library/src/components/dnn-monaco-editor/readme.md b/packages/stencil-library/src/components/dnn-monaco-editor/readme.md
index 78d894d72..dcfab8548 100644
--- a/packages/stencil-library/src/components/dnn-monaco-editor/readme.md
+++ b/packages/stencil-library/src/components/dnn-monaco-editor/readme.md
@@ -40,7 +40,7 @@
| Property | Attribute | Description | Type | Default |
| ---------- | ---------- | ----------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `language` | `language` | Defines the language for the editor. | `"html" \| "ruby" \| "plaintext" \| "r" \| "bat" \| "coffeescript" \| "c" \| "cpp" \| "csharp" \| "dockerfile" \| "fsharp" \| "go" \| "handlebars" \| "ini" \| "pug" \| "java" \| "lua" \| "markdown" \| "msdax" \| "objective-c" \| "postiats" \| "php" \| "powershell" \| "python" \| "razor" \| "swift" \| "sql" \| "vb" \| "xml" \| "less" \| "scss" \| "css" \| "yaml" \| "sol" \| "sb" \| "json" \| "typescript" \| "javascript"` | `"html"` |
+| `language` | `language` | Defines the language for the editor. | `"bat" \| "c" \| "coffeescript" \| "cpp" \| "csharp" \| "css" \| "dockerfile" \| "fsharp" \| "go" \| "handlebars" \| "html" \| "ini" \| "java" \| "javascript" \| "json" \| "less" \| "lua" \| "markdown" \| "msdax" \| "objective-c" \| "php" \| "plaintext" \| "postiats" \| "powershell" \| "pug" \| "python" \| "r" \| "razor" \| "ruby" \| "sb" \| "scss" \| "sol" \| "sql" \| "swift" \| "typescript" \| "vb" \| "xml" \| "yaml"` | `"html"` |
| `name` | `name` | The name of the control to use for forms. | `string \| undefined` | `undefined` |
| `value` | `value` | Sets the code contained in the editor | `string` | `""` |
diff --git a/packages/stencil-library/src/components/dnn-permissions-grid/readme.md b/packages/stencil-library/src/components/dnn-permissions-grid/readme.md
index 3e1b5e46e..7a14a2919 100644
--- a/packages/stencil-library/src/components/dnn-permissions-grid/readme.md
+++ b/packages/stencil-library/src/components/dnn-permissions-grid/readme.md
@@ -7,13 +7,13 @@
## Properties
-| Property | Attribute | Description | Type | Default |
-| -------------------------- | ------------- | ---------------------------------------------------------------------------------- | ---------------------------- | ----------- |
-| `foundUsers` | `found-users` | The list of users to show under the search users field when a search is performed. | `ISearchedUser[]` | `[]` |
-| `permissions` _(required)_ | `permissions` | The list of permissions. | `IPermissions` | `undefined` |
-| `resx` | `resx` | Optionally allows localizing the component strings. | `ILocalization \| undefined` | `undefined` |
-| `roleGroups` _(required)_ | `role-groups` | The list of role groups. | `IRoleGroup[]` | `undefined` |
-| `roles` _(required)_ | `roles` | The list of possible roles. | `IRole[]` | `undefined` |
+| Property | Attribute | Description | Type | Default |
+| -------------------------- | --------- | ---------------------------------------------------------------------------------- | ---------------------------- | ----------- |
+| `foundUsers` | -- | The list of users to show under the search users field when a search is performed. | `ISearchedUser[]` | `[]` |
+| `permissions` _(required)_ | -- | The list of permissions. | `IPermissions` | `undefined` |
+| `resx` | -- | Optionally allows localizing the component strings. | `ILocalization \| undefined` | `undefined` |
+| `roleGroups` _(required)_ | -- | The list of role groups. | `IRoleGroup[]` | `undefined` |
+| `roles` _(required)_ | -- | The list of possible roles. | `IRole[]` | `undefined` |
## Events
diff --git a/packages/stencil-library/src/components/dnn-richtext/dnn-richtext.scss b/packages/stencil-library/src/components/dnn-richtext/dnn-richtext.scss
index a0ab468eb..582c61d78 100644
--- a/packages/stencil-library/src/components/dnn-richtext/dnn-richtext.scss
+++ b/packages/stencil-library/src/components/dnn-richtext/dnn-richtext.scss
@@ -1,4 +1,4 @@
-@import "../../../node_modules/jodit/es2021.en/jodit.fat.min.css";
+@import "~jodit/es2021/jodit.fat.min.css";
:host {
display: block;
diff --git a/packages/stencil-library/src/components/dnn-richtext/readme.md b/packages/stencil-library/src/components/dnn-richtext/readme.md
index 4717215c5..d267e8cc4 100644
--- a/packages/stencil-library/src/components/dnn-richtext/readme.md
+++ b/packages/stencil-library/src/components/dnn-richtext/readme.md
@@ -7,13 +7,13 @@
## Properties
-| Property | Attribute | Description | Type | Default |
-| ------------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------- | ----------- |
-| `customizeOptions` | `customize-options` | Customize the options before initializing the editor, will have all the default options merged with 'options' if passed. This is called last after merging default options with your custom 'options' and just before initializing the editor. | `((options: Config) => Config) \| undefined` | `undefined` |
-| `name` | `name` | Name of the field when used in a form. | `string \| undefined` | `undefined` |
-| `options` | `options` | Optional configuration for Jodit, see https://xdsoft.net/jodit/docs/classes/config.Config.html This will be merged with the default options and passed to the editor. If you prefer to not have to pass a full config object, you can use 'customizeOptions' to modify the options before initializing the editor instead of providing all options here. | `Config \| undefined` | `undefined` |
-| `plugins` | `plugins` | Allows registering your own plugins. The callback will be called with the editor instance as the only argument durig initialization. All other behavior needs to be implemented in the plugin itself using editor.on("eventname"). See https://xdsoft.net/jodit/examples/plugin/custom_plugin.html for an example. Creating a plugin does NOT automatically add it to the toolbar, you need to do that yourself in 'options' or 'customizeOptions', See https://xdsoft.net/jodit/examples/toolbar/custom_button.html for an example. | `{ name: string; callback: (editor: Jodit) => void; }[]` | `[]` |
-| `value` | `value` | Sets the value of the content of the editor. | `string` | `""` |
+| Property | Attribute | Description | Type | Default |
+| ------------------ | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------- | ----------- |
+| `customizeOptions` | -- | Customize the options before initializing the editor, will have all the default options merged with 'options' if passed. This is called last after merging default options with your custom 'options' and just before initializing the editor. | `((options: Config) => Config) \| undefined` | `undefined` |
+| `name` | `name` | Name of the field when used in a form. | `string \| undefined` | `undefined` |
+| `options` | -- | Optional configuration for Jodit, see https://xdsoft.net/jodit/docs/classes/config.Config.html This will be merged with the default options and passed to the editor. If you prefer to not have to pass a full config object, you can use 'customizeOptions' to modify the options before initializing the editor instead of providing all options here. | `Config \| undefined` | `undefined` |
+| `plugins` | -- | Allows registering your own plugins. The callback will be called with the editor instance as the only argument durig initialization. All other behavior needs to be implemented in the plugin itself using editor.on("eventname"). See https://xdsoft.net/jodit/examples/plugin/custom_plugin.html for an example. Creating a plugin does NOT automatically add it to the toolbar, you need to do that yourself in 'options' or 'customizeOptions', See https://xdsoft.net/jodit/examples/toolbar/custom_button.html for an example. | `{ name: string; callback: (editor: Jodit) => void; }[]` | `[]` |
+| `value` | `value` | Sets the value of the content of the editor. | `string` | `""` |
## Events
diff --git a/packages/stencil-library/src/components/examples/dnn-example-form/dnn-example-form.tsx b/packages/stencil-library/src/components/examples/dnn-example-form/dnn-example-form.tsx
index 62c85befe..a01616c6d 100644
--- a/packages/stencil-library/src/components/examples/dnn-example-form/dnn-example-form.tsx
+++ b/packages/stencil-library/src/components/examples/dnn-example-form/dnn-example-form.tsx
@@ -7,7 +7,7 @@ import { DnnAutocompleteSuggestion } from '../../dnn-autocomplete/types';
styleUrl: 'dnn-example-form.scss',
})
export class DnnExampleForm {
- @State() resume?: File;
+ @State() supportingDocuments: File[] = [];
@State() profilePicData?: string;
@State() profilePicConfirmed = false;
@@ -102,8 +102,7 @@ export class DnnExampleForm {
}
private resumeDropped(detail: File[]): void {
- var singleFile = detail[0];
- this.resume = singleFile;
+ this.supportingDocuments = detail;
}
private profilePicCropped(imageData: string): void {
@@ -369,16 +368,24 @@ export class DnnExampleForm {
}}
onNeedMoreItems={e => this.loadMoreCharacters(e.detail.searchTerm)}
/>
-
- {this.resume === undefined &&
- this.resumeDropped(e.detail)} />
+
+ {this.supportingDocuments.length === 0 &&
+ this.resumeDropped(e.detail)}
+ multiple
+ />
}
- {this.resume &&
+ {this.supportingDocuments.map(file => (
- File: {this.resume.name}
- this.resume = undefined}>Remove
+ File: {file.name}
+ this.supportingDocuments = [...this.supportingDocuments!.filter(f => f.name != file.name)]}>
+ Remove
+
- }
+ ))}
diff --git a/packages/stencil-library/src/vite-env.d.ts b/packages/stencil-library/src/vite-env.d.ts
new file mode 100644
index 000000000..151aa6856
--- /dev/null
+++ b/packages/stencil-library/src/vite-env.d.ts
@@ -0,0 +1 @@
+///
\ No newline at end of file
diff --git a/packages/stencil-library/tsconfig.json b/packages/stencil-library/tsconfig.json
index 235b13586..63c4b0947 100644
--- a/packages/stencil-library/tsconfig.json
+++ b/packages/stencil-library/tsconfig.json
@@ -8,7 +8,7 @@
"dom",
"es2017"
],
- "moduleResolution": "node",
+ "moduleResolution": "bundler",
"module": "esnext",
"target": "es2017",
"noUnusedLocals": true,
@@ -25,6 +25,6 @@
"exclude": [
"node_modules",
"src/**/*.stories.ts",
- ".stencil/**/*"
+ "src/**/*.stories.tsx",
]
}
diff --git a/packages/stencil-library/tsconfig.stories.json b/packages/stencil-library/tsconfig.stories.json
new file mode 100644
index 000000000..c90817ba2
--- /dev/null
+++ b/packages/stencil-library/tsconfig.stories.json
@@ -0,0 +1,16 @@
+{
+ "extends": "./tsconfig.json",
+ "compilerOptions": {
+ "strict": false,
+ "noUnusedLocals": false,
+ "noUnusedParameters": false,
+ "noImplicitAny": false
+ },
+ "include": [
+ "vite-env.d.ts",
+ "src"
+ ],
+ "exclude": [
+ "node_modules"
+ ]
+}
diff --git a/packages/stencil-library/vite-env.d.ts b/packages/stencil-library/vite-env.d.ts
new file mode 100644
index 000000000..151aa6856
--- /dev/null
+++ b/packages/stencil-library/vite-env.d.ts
@@ -0,0 +1 @@
+///
\ No newline at end of file
diff --git a/packages/stencil-library/vscode-data.json b/packages/stencil-library/vscode-data.json
index fa447e2dc..248280f74 100644
--- a/packages/stencil-library/vscode-data.json
+++ b/packages/stencil-library/vscode-data.json
@@ -32,18 +32,10 @@
"name": "preload-threshold-pixels",
"description": "How many suggestions to preload in pixels of their height.\nThis is used to calculate the virtual scroll height and request\nmore items before they get into view."
},
- {
- "name": "render-suggestion",
- "description": "Callback to render suggestions, if not provided, only the label will be rendered."
- },
{
"name": "required",
"description": "Defines whether the field requires having a value."
},
- {
- "name": "suggestions",
- "description": "Sets the list of suggestions."
- },
{
"name": "total-suggestions",
"description": "The total amount of suggestions for the given search query.\nThis can be used to show virtual scroll and pagination progressive feeding.\nThe needMoreItems event should be used to request more items."
@@ -176,10 +168,6 @@
"name": "name",
"description": "The name to show in the formData (if using forms)."
},
- {
- "name": "next-state-handler",
- "description": "A function that will be called when the checkbox needs to change state and returns the next state.\nCan be used to customize the order of the states when the component is clicked.\nOnly called if you also use the tri-state feature (useIntermediate)."
- },
{
"name": "required",
"description": "If true, the checkbox needs to be checked for the form validation to succeed."
@@ -267,10 +255,6 @@
"name": "light-color",
"description": "Sets the initial light color, must be a valid 8 character hexadecimal string without the # sign."
},
- {
- "name": "localization",
- "description": "Can be used to customize the text language."
- },
{
"name": "name",
"description": "The name for this input if forms are used."
@@ -319,27 +303,23 @@
"attributes": [
{
"name": "allow-camera-mode",
- "description": "If true, will allow the user to take a snapshot\nusing the device camera. (only works over https)."
- },
- {
- "name": "allowed-extensions",
- "description": "A list of allowed file extensions.\nIf not specified, any file is allowed.\nEx: [\"jpg\", \"jpeg\", \"gif\", \"png\"]"
+ "description": "If true, will allow the user to take a snapshot\r\nusing the device camera. (only works over https)."
},
{
"name": "capture-quality",
- "description": "Specifies the jpeg quality for when the device\ncamera is used to generate a picture.\nNeeds to be a number between 0 and 1 and defaults to 0.8"
+ "description": "Specifies the jpeg quality for when the device\r\ncamera is used to generate a picture.\r\nNeeds to be a number between 0 and 1 and defaults to 0.8"
},
{
"name": "max-file-size",
"description": "Max file size in bytes."
},
{
- "name": "name",
- "description": "The name of the field when used in a form."
+ "name": "multiple",
+ "description": "If true, allows multiple file selection."
},
{
- "name": "resx",
- "description": "Localization strings"
+ "name": "name",
+ "description": "The name of the field when used in a form."
}
]
},
@@ -431,10 +411,6 @@
"name": "quality",
"description": "Sets the output quality of the cropped image (number between 0 and 1)."
},
- {
- "name": "resx",
- "description": "Can be used to customize controls text.\nSome values support tokens, see default values for examples."
- },
{
"name": "width",
"description": "Sets the desired final image width."
@@ -632,26 +608,14 @@
"name": "language",
"description": "Defines the language for the editor.",
"values": [
- {
- "name": "html"
- },
- {
- "name": "ruby"
- },
- {
- "name": "plaintext"
- },
- {
- "name": "r"
- },
{
"name": "bat"
},
{
- "name": "coffeescript"
+ "name": "c"
},
{
- "name": "c"
+ "name": "coffeescript"
},
{
"name": "cpp"
@@ -659,6 +623,9 @@
{
"name": "csharp"
},
+ {
+ "name": "css"
+ },
{
"name": "dockerfile"
},
@@ -672,14 +639,23 @@
"name": "handlebars"
},
{
- "name": "ini"
+ "name": "html"
},
{
- "name": "pug"
+ "name": "ini"
},
{
"name": "java"
},
+ {
+ "name": "javascript"
+ },
+ {
+ "name": "json"
+ },
+ {
+ "name": "less"
+ },
{
"name": "lua"
},
@@ -693,58 +669,58 @@
"name": "objective-c"
},
{
- "name": "postiats"
+ "name": "php"
},
{
- "name": "php"
+ "name": "plaintext"
},
{
- "name": "powershell"
+ "name": "postiats"
},
{
- "name": "python"
+ "name": "powershell"
},
{
- "name": "razor"
+ "name": "pug"
},
{
- "name": "swift"
+ "name": "python"
},
{
- "name": "sql"
+ "name": "r"
},
{
- "name": "vb"
+ "name": "razor"
},
{
- "name": "xml"
+ "name": "ruby"
},
{
- "name": "less"
+ "name": "sb"
},
{
"name": "scss"
},
{
- "name": "css"
+ "name": "sol"
},
{
- "name": "yaml"
+ "name": "sql"
},
{
- "name": "sol"
+ "name": "swift"
},
{
- "name": "sb"
+ "name": "typescript"
},
{
- "name": "json"
+ "name": "vb"
},
{
- "name": "typescript"
+ "name": "xml"
},
{
- "name": "javascript"
+ "name": "yaml"
}
]
},
@@ -764,28 +740,7 @@
"kind": "markdown",
"value": ""
},
- "attributes": [
- {
- "name": "found-users",
- "description": "The list of users to show under the search users field when a search is performed."
- },
- {
- "name": "permissions",
- "description": "The list of permissions."
- },
- {
- "name": "resx",
- "description": "Optionally allows localizing the component strings."
- },
- {
- "name": "role-groups",
- "description": "The list of role groups."
- },
- {
- "name": "roles",
- "description": "The list of possible roles."
- }
- ]
+ "attributes": []
},
{
"name": "dnn-progress-bar",
@@ -815,22 +770,10 @@
"value": ""
},
"attributes": [
- {
- "name": "customize-options",
- "description": "Customize the options before initializing the editor, will have all the default options merged with 'options' if passed.\nThis is called last after merging default options with your custom 'options' and just before initializing the editor."
- },
{
"name": "name",
"description": "Name of the field when used in a form."
},
- {
- "name": "options",
- "description": "Optional configuration for Jodit, see https://xdsoft.net/jodit/docs/classes/config.Config.html\nThis will be merged with the default options and passed to the editor.\nIf you prefer to not have to pass a full config object,\nyou can use 'customizeOptions' to modify the options before initializing the editor\ninstead of providing all options here."
- },
- {
- "name": "plugins",
- "description": "Allows registering your own plugins.\nThe callback will be called with the editor instance as the only argument durig initialization.\nAll other behavior needs to be implemented in the plugin itself using editor.on(\"eventname\").\nSee https://xdsoft.net/jodit/examples/plugin/custom_plugin.html for an example.\nCreating a plugin does NOT automatically add it to the toolbar, you need to do that yourself in 'options' or 'customizeOptions',\nSee https://xdsoft.net/jodit/examples/toolbar/custom_button.html for an example."
- },
{
"name": "value",
"description": "Sets the value of the content of the editor."