npm - @verdocs/web-sdk - Versions diffs - 6.2.0-beta.11 → 6.2.0-beta.13 - Mend

@verdocs/web-sdk 6.2.0-beta.11 → 6.2.0-beta.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (732) hide show

package/dist/collection/components/controls/verdocs-date-input/verdocs-date-input.js CHANGED Viewed

@@ -89,7 +89,6 @@ export class VerdocsDateInput {
         return {
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -105,11 +104,11 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "value",
                 "defaultValue": "''"
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -125,11 +124,11 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label",
                 "defaultValue": "''"
             },
             "placeholder": {
                 "type": "string",
-                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -145,11 +144,11 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "placeholder",
                 "defaultValue": "''"
             },
             "helpText": {
                 "type": "string",
-                "attribute": "help-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -165,11 +164,11 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "help-text",
                 "defaultValue": "''"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -185,11 +184,11 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -205,6 +204,7 @@ export class VerdocsDateInput {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "required",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.js CHANGED Viewed

@@ -62,7 +62,6 @@ export class VerdocsDropdown {
         return {
             "options": {
                 "type": "unknown",
-                "attribute": "options",
                 "mutable": false,
                 "complexType": {
                     "original": "IMenuOption[]",

package/dist/collection/components/controls/verdocs-dropdown/verdocs-dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-dropdown.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-dropdown/verdocs-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,YAAY,EAAC,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAe,MAAM,eAAe,CAAC;AAE/E,MAAM,aAAa,GAAG,iLAAiL,CAAC;AASxM;;;;;;;;;;;;;;;GAeG;AAKH,MAAM,OAAO,eAAe;IAJ5B;QAQE;;WAEG;QACK,YAAO,GAAkB,EAAE,CAAC;QAQ3B,gBAAW,GAAG,gBAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC;QAE5E,eAAU,GAAG,KAAK,CAAC;KAqC7B;IAnCC,kBAAkB,CAAC,CAAM,EAAE,MAAmB;;QAC5C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAA,IAAI,CAAC,cAAc,0CAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,oBAAoB,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;QAEnD,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,aAAa,gBAAa,WAAW,EAAC,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,GAAI;YAEvI,IAAI,CAAC,UAAU,IAAI,CAClB,uEAAgB,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAC,6BAA6B,IACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACzB,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;oBAClB,OAAO,WAAK,KAAK,EAAC,iCAAiC,GAAG,CAAC;gBACzD,CAAC;qBAAM,CAAC;oBACN,OAAO,CACL,cAAQ,KAAK,EAAC,8BAA8B,EAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,MAAM,CAAC,IAC9H,MAAM,CAAC,KAAK,CACN,CACV,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CACa,CAClB,CACI,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {Host, State} from '@stencil/core';\nimport {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst DropdownArrow = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#50BE80\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M7 10l5 5 5-5H7z\"/></svg>`;\n\nexport interface IMenuOption {\n label: string;\n id?: any;\n faIcon?: any;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu button. A menu of the specified options will be displayed when the button is pressed. The menu will be hidden\n * when the button is pressed again, or an option is selected. Separators may be created by supplying an entry with an empty label.\n \n ```ts\n * <verdocs-dropdown\n * options={[\n * {label: 'Option 1', disabled: true},\n * {label: 'Option 2', id: '2'}\n * {label: ''}\n * {label: 'Option 3', id: '2'}\n * ]}\n * label=\"OK\" onClick={() => (console.log('OK clicked'))}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-dropdown',\n styleUrl: 'verdocs-dropdown.scss',\n})\nexport class VerdocsDropdown {\n @Element()\n el: HTMLElement;\n\n /\n The menu options to display.\n /\n @Prop() options: IMenuOption[] = [];\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IMenuOption>;\n\n @State() containerId = `verdocs-send-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showPicker = false;\n\n handleSelectOption(e: any, option: IMenuOption) {\n e.stopPropagation();\n this.optionSelected?.emit(option);\n this.showPicker = false;\n }\n\n toggle() {\n this.showPicker = !this.showPicker;\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host>\n <button class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" id={elId} onClick={() => (this.showPicker = !this.showPicker)} />\n\n {this.showPicker && (\n <verdocs-portal anchor={elId} onClickAway={() => (this.showPicker = false)} id=\"verdocs-dropdown-menu-items\">\n {this.options.map(option => {\n if (!option.label) {\n return <div class=\"verdocs-dropdown-menu-separator\" />;\n } else {\n return (\n <button class=\"verdocs-dropdown-menu-option\" disabled={option.disabled \|\| false} onClick={e => this.handleSelectOption(e, option)}>\n {option.label}\n </button>\n );\n }\n })}\n </verdocs-portal>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-dropdown.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-dropdown/verdocs-dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,YAAY,EAAC,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EAAE,KAAK,EAAe,MAAM,eAAe,CAAC;AAE/E,MAAM,aAAa,GAAG,iLAAiL,CAAC;AASxM;;;;;;;;;;;;;;;GAeG;AAKH,MAAM,OAAO,eAAe;IAJ5B;QAQE;;WAEG;QACK,YAAO,GAAkB,EAAE,CAAC;QAQ3B,gBAAW,GAAG,gBAAgB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC;QAE5E,eAAU,GAAG,KAAK,CAAC;KAqC7B;IAnCC,kBAAkB,CAAC,CAAM,EAAE,MAAmB;;QAC5C,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,MAAA,IAAI,CAAC,cAAc,0CAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAClC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;IACrC,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,oBAAoB,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;QAEnD,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,KAAK,EAAC,OAAO,EAAC,SAAS,EAAE,aAAa,gBAAa,WAAW,EAAC,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,GAAI;YAEvI,IAAI,CAAC,UAAU,IAAI,CAClB,uEAAgB,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAC,6BAA6B,IACzG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACzB,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;oBAClB,OAAO,WAAK,KAAK,EAAC,iCAAiC,GAAG,CAAC;gBACzD,CAAC;qBAAM,CAAC;oBACN,OAAO,CACL,cAAQ,KAAK,EAAC,8BAA8B,EAAC,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAI,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,MAAM,CAAC,IAC9H,MAAM,CAAC,KAAK,CACN,CACV,CAAC;gBACJ,CAAC;YACH,CAAC,CAAC,CACa,CAClB,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Host, State} from '@stencil/core';\nimport {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Element, h, Event, EventEmitter} from '@stencil/core';\n\nconst DropdownArrow = `<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#50BE80\"><path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M7 10l5 5 5-5H7z\"/></svg>`;\n\nexport interface IMenuOption {\n label: string;\n id?: any;\n faIcon?: any;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu button. A menu of the specified options will be displayed when the button is pressed. The menu will be hidden\n * when the button is pressed again, or an option is selected. Separators may be created by supplying an entry with an empty label.\n \n ```ts\n * <verdocs-dropdown\n * options={[\n * {label: 'Option 1', disabled: true},\n * {label: 'Option 2', id: '2'}\n * {label: ''}\n * {label: 'Option 3', id: '2'}\n * ]}\n * label=\"OK\" onClick={() => (console.log('OK clicked'))}\n * />\n * ```\n /\n@Component({\n tag: 'verdocs-dropdown',\n styleUrl: 'verdocs-dropdown.scss',\n})\nexport class VerdocsDropdown {\n @Element()\n el: HTMLElement;\n\n /\n The menu options to display.\n /\n @Prop() options: IMenuOption[] = [];\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IMenuOption>;\n\n @State() containerId = `verdocs-send-${Math.random().toString(36).substring(2, 11)}`;\n\n @State() showPicker = false;\n\n handleSelectOption(e: any, option: IMenuOption) {\n e.stopPropagation();\n this.optionSelected?.emit(option);\n this.showPicker = false;\n }\n\n toggle() {\n this.showPicker = !this.showPicker;\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host>\n <button class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" id={elId} onClick={() => (this.showPicker = !this.showPicker)} />\n\n {this.showPicker && (\n <verdocs-portal anchor={elId} onClickAway={() => (this.showPicker = false)} id=\"verdocs-dropdown-menu-items\">\n {this.options.map(option => {\n if (!option.label) {\n return <div class=\"verdocs-dropdown-menu-separator\" />;\n } else {\n return (\n <button class=\"verdocs-dropdown-menu-option\" disabled={option.disabled \|\| false} onClick={e => this.handleSelectOption(e, option)}>\n {option.label}\n </button>\n );\n }\n })}\n </verdocs-portal>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/controls/verdocs-file-chooser/verdocs-file-chooser.js CHANGED Viewed

@@ -48,7 +48,6 @@ export class VerdocsFileChooser {
         return {
             "endpoint": {
                 "type": "unknown",
-                "attribute": "endpoint",
                 "mutable": false,
                 "complexType": {
                     "original": "VerdocsEndpoint",

package/dist/collection/components/controls/verdocs-file-chooser/verdocs-file-chooser.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-file-chooser.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-file-chooser/verdocs-file-chooser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AACnF,OAAO,EAAC,WAAW,EAAC,MAAM,sBAAsB,CAAC;AAEjD;;;;;;;GAOG;AAMH,MAAM,OAAO,kBAAkB;IAL/B;QAME;;WAEG;QACK,aAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE,CAAC;KAiDlE;IAvCC,iBAAiB,CAAC,CAAM;;QACtB,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,CAAC,CAAC,MAAM,CAAC,KAAK,0CAAG,CAAC,CAAC,KAAI,IAAI,CAAC;QACxC,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC,CAAC,CAAC;QAC3C,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IACtD,CAAC;IAED,gBAAgB,CAAC,CAAM;;QACrB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAC;QACtC,MAAA,QAAQ,CAAC,cAAc,CAAC,sBAAsB,CAAC,0CAAE,KAAK,EAAE,CAAC;IAC3D,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,kCAAkC,CAAC;QAE/F,OAAO,CACL,EAAC,IAAI;YACH,8DACE,IAAI,EAAC,MAAM,EACX,QAAQ,QACR,EAAE,EAAC,sBAAsB,EACzB,MAAM,EAAC,4HAA4H,EACnI,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GACxC;YAEF,4DAAK,KAAK,EAAC,YAAY;gBAGrB,4DAAK,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAO;gBAEtF,4DAAK,KAAK,EAAC,WAAW,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,sBAAsB,CAAO;gBAE/E,uEAAgB,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAI,CACvF,CACD,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State, Host} from '@stencil/core';\nimport {unicodeNBSP} from '../../../utils/Icons';\n\n/*\n Displays a file picker to upload an attachment. This component is just the picker - the host application or component should\n * provide the actual upload functionality.\n \n ```ts\n * <verdocs-file-chooser onFileSelected={(e) => console.log('File Selected', e.detail)} />\n * ```\n /\n@Component({\n tag: 'verdocs-file-chooser',\n styleUrl: 'verdocs-file-chooser.scss',\n shadow: false,\n})\nexport class VerdocsFileChooser {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n Event fired when a file has been selected. Note that the file may be null if the user is choosing a different file.\n * Host applications should use this event to enable/disable buttons to upload or otherwise process the selected file.\n /\n @Event({composed: true}) fileSelected: EventEmitter<{file: File \| null}>;\n\n @State() file: File \| null;\n\n handleFileChanged(e: any) {\n this.file = e.target.files?.[0] \|\| null;\n this.fileSelected?.emit({file: this.file});\n console.debug('[CHOOSER] Selected file', this.file);\n }\n\n handleSelectFile(e: any) {\n e.stopPropagation();\n this.file = null;\n this.fileSelected?.emit({file: null});\n document.getElementById('verdocs-file-chooser')?.click();\n }\n\n render() {\n const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';\n\n return (\n <Host>\n <input\n type=\"file\"\n multiple\n id=\"verdocs-file-chooser\"\n accept=\"application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n style={{display: 'none'}}\n onChange={e => this.handleFileChanged(e)}\n />\n\n <div class=\"upload-box\">\n {/<div innerHTML={FileIcon} />*/}\n\n <div class=\"selected-filename\">{this.file ? this.file.name : 'Drag a file here'}</div>\n\n <div class=\"or-prefer\">{this.file ? unicodeNBSP : 'Or, if you prefer...'}</div>\n\n <verdocs-button label={buttonlabel} size=\"small\" onClick={e => this.handleSelectFile(e)} />\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-file-chooser.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-file-chooser/verdocs-file-chooser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AACnF,OAAO,EAAC,WAAW,EAAC,MAAM,sBAAsB,CAAC;AAEjD;;;;;;;GAOG;AAMH,MAAM,OAAO,kBAAkB;IAL/B;QAME;;WAEG;QACK,aAAQ,GAAoB,eAAe,CAAC,UAAU,EAAE,CAAC;KAiDlE;IAvCC,iBAAiB,CAAC,CAAM;;QACtB,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,CAAC,CAAC,MAAM,CAAC,KAAK,0CAAG,CAAC,CAAC,KAAI,IAAI,CAAC;QACxC,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAC,CAAC,CAAC;QAC3C,OAAO,CAAC,KAAK,CAAC,yBAAyB,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;IACtD,CAAC;IAED,gBAAgB,CAAC,CAAM;;QACrB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAC,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAC;QACtC,MAAA,QAAQ,CAAC,cAAc,CAAC,sBAAsB,CAAC,0CAAE,KAAK,EAAE,CAAC;IAC3D,CAAC;IAED,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,kCAAkC,CAAC;QAE/F,OAAO,CACL,EAAC,IAAI;YACH,8DACE,IAAI,EAAC,MAAM,EACX,QAAQ,QACR,EAAE,EAAC,sBAAsB,EACzB,MAAM,EAAC,4HAA4H,EACnI,KAAK,EAAE,EAAC,OAAO,EAAE,MAAM,EAAC,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,GACxC;YAEF,4DAAK,KAAK,EAAC,YAAY;gBAGrB,4DAAK,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAO;gBAEtF,4DAAK,KAAK,EAAC,WAAW,IAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,sBAAsB,CAAO;gBAE/E,uEAAgB,KAAK,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAI,CACvF,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {Component, h, Event, EventEmitter, Prop, State, Host} from '@stencil/core';\nimport {unicodeNBSP} from '../../../utils/Icons';\n\n/*\n Displays a file picker to upload an attachment. This component is just the picker - the host application or component should\n * provide the actual upload functionality.\n \n ```ts\n * <verdocs-file-chooser onFileSelected={(e) => console.log('File Selected', e.detail)} />\n * ```\n /\n@Component({\n tag: 'verdocs-file-chooser',\n styleUrl: 'verdocs-file-chooser.scss',\n shadow: false,\n})\nexport class VerdocsFileChooser {\n /\n The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n /\n @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n /\n Event fired when a file has been selected. Note that the file may be null if the user is choosing a different file.\n * Host applications should use this event to enable/disable buttons to upload or otherwise process the selected file.\n /\n @Event({composed: true}) fileSelected: EventEmitter<{file: File \| null}>;\n\n @State() file: File \| null;\n\n handleFileChanged(e: any) {\n this.file = e.target.files?.[0] \|\| null;\n this.fileSelected?.emit({file: this.file});\n console.debug('[CHOOSER] Selected file', this.file);\n }\n\n handleSelectFile(e: any) {\n e.stopPropagation();\n this.file = null;\n this.fileSelected?.emit({file: null});\n document.getElementById('verdocs-file-chooser')?.click();\n }\n\n render() {\n const buttonlabel = this.file ? 'Select a different file' : 'Select a file from your computer';\n\n return (\n <Host>\n <input\n type=\"file\"\n multiple\n id=\"verdocs-file-chooser\"\n accept=\"application/pdf,.pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n style={{display: 'none'}}\n onChange={e => this.handleFileChanged(e)}\n />\n\n <div class=\"upload-box\">\n {/<div innerHTML={FileIcon} />*/}\n\n <div class=\"selected-filename\">{this.file ? this.file.name : 'Drag a file here'}</div>\n\n <div class=\"or-prefer\">{this.file ? unicodeNBSP : 'Or, if you prefer...'}</div>\n\n <verdocs-button label={buttonlabel} size=\"small\" onClick={e => this.handleSelectFile(e)} />\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/controls/verdocs-help-icon/verdocs-help-icon.js CHANGED Viewed

@@ -59,7 +59,6 @@ export class VerdocsHelpIcon {
         return {
             "text": {
                 "type": "string",
-                "attribute": "text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -75,11 +74,11 @@ export class VerdocsHelpIcon {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "text",
                 "defaultValue": "''"
             },
             "icon": {
                 "type": "string",
-                "attribute": "icon",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -95,6 +94,7 @@ export class VerdocsHelpIcon {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "icon",
                 "defaultValue": "helpIcon"
             }
         };

package/dist/collection/components/controls/verdocs-menu-panel/verdocs-menu-panel.js CHANGED Viewed

@@ -84,7 +84,6 @@ export class VerdocsMenuPanel {
         return {
             "side": {
                 "type": "string",
-                "attribute": "side",
                 "mutable": false,
                 "complexType": {
                     "original": "'left' | 'right'",
@@ -100,11 +99,11 @@ export class VerdocsMenuPanel {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "side",
                 "defaultValue": "'right'"
             },
             "overlay": {
                 "type": "boolean",
-                "attribute": "overlay",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -120,11 +119,11 @@ export class VerdocsMenuPanel {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "overlay",
                 "defaultValue": "true"
             },
             "width": {
                 "type": "number",
-                "attribute": "width",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -140,6 +139,7 @@ export class VerdocsMenuPanel {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "width",
                 "defaultValue": "300"
             }
         };

package/dist/collection/components/controls/verdocs-multiselect/verdocs-multiselect.js CHANGED Viewed

@@ -56,7 +56,6 @@ export class VerdocsMultiselect {
         return {
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -72,11 +71,11 @@ export class VerdocsMultiselect {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label",
                 "defaultValue": "''"
             },
             "placeholder": {
                 "type": "string",
-                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -92,11 +91,11 @@ export class VerdocsMultiselect {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "placeholder",
                 "defaultValue": "'Select...'"
             },
             "options": {
                 "type": "unknown",
-                "attribute": "options",
                 "mutable": false,
                 "complexType": {
                     "original": "IMultiSelectOption[]",
@@ -120,7 +119,6 @@ export class VerdocsMultiselect {
             },
             "selectedOptions": {
                 "type": "unknown",
-                "attribute": "selected-options",
                 "mutable": false,
                 "complexType": {
                     "original": "string[]",

package/dist/collection/components/controls/verdocs-multiselect/verdocs-multiselect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-multiselect.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-multiselect/verdocs-multiselect.tsx"],"names":[],"mappings":"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~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Host, h, State, EventEmitter, Event} from '@stencil/core';\n\nexport interface IMultiSelectOption {\n label: string;\n value: string;\n}\n\nconst DownIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" /></svg>`;\nconst UpIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\" /></svg>`;\n\n/*\n Display a dropdown that allows multiple options to be selected. Note that events \"bubble\" from the\n * input field to the container, so you can subscribe to the same DOM events (input, blur, etc) that a\n * normal input would emit.\n \n ```ts\n * <verdocs-multiselect label=\"Methods:\" value={[]} options={[...options]} onInput={() => {}} />\n * ```\n /\n@Component({\n tag: 'verdocs-multiselect',\n styleUrl: 'verdocs-multiselect.scss',\n})\nexport class VerdocsMultiselect {\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the input element when no options are selected.\n /\n @Prop() placeholder: string = 'Select...';\n\n /\n The options to list.\n /\n @Prop() options: IMultiSelectOption[];\n\n /\n The currently selected options.\n /\n @Prop() selectedOptions: string[] = [];\n\n @Event({composed: true}) selectionChanged: EventEmitter<{selectedOptions: string[]}>;\n\n @State() showPicker = false;\n\n handleToggleOption(e: any, option: IMultiSelectOption) {\n if (e.target.checked) {\n this.selectedOptions = [...this.selectedOptions, option.value];\n } else {\n this.selectedOptions = this.selectedOptions.filter(selected => selected !== option.value);\n }\n\n this.selectionChanged?.emit({selectedOptions: this.selectedOptions});\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host class={this.showPicker ? 'open' : 'closed'}>\n <label>\n {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n <div class=\"input-wrapper\">\n <button id={elId} class=\"trigger\" value=\"\" onClick={() => (this.showPicker = !this.showPicker)}>\n {this.selectedOptions.length === 0 ? (\n <span class=\"placeholder\">{this.placeholder}</span>\n ) : (\n this.selectedOptions.map(option => <span class=\"selected-option\">{this.options.find(opt => opt.value === option)?.label \|\| 'Unknown'}</span>)\n )}\n </button>\n\n <div class=\"icon\" innerHTML={this.showPicker ? UpIcon : DownIcon} />\n\n {this.showPicker && (\n <div class=\"verdocs-multiselect-dropdown\">\n {/<verdocs-portal/}\n {/ anchor={elId}/}\n {/ voffset={2}/}\n {/ onClickAway={() => {/}\n {/ this.showPicker = false;/}\n {/ }}/}\n {/ id=\"verdocs-multiselect-menu-items\"/}\n {/>/}\n {this.options.map((option, i) => (\n <div class=\"option\" onClick={() => (this.showPicker = false)}>\n <verdocs-checkbox\n size=\"small\"\n id={`verdocs-multi-select-opt-${i}`}\n value={option.value}\n checked={this.selectedOptions.includes(option.value)}\n onInput={(e: any) => this.handleToggleOption(e, option)}\n />\n <label htmlFor={`verdocs-multi-select-option-${i}`}>{option.label}</label>\n </div>\n ))}\n {/</verdocs-portal>*/}\n </div>\n )}\n </div>\n </label>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-multiselect.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-multiselect/verdocs-multiselect.tsx"],"names":[],"mappings":"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","sourcesContent":["import {randomString} from '@verdocs/js-sdk';\nimport {Component, Prop, Host, h, State, EventEmitter, Event} from '@stencil/core';\n\nexport interface IMultiSelectOption {\n label: string;\n value: string;\n}\n\nconst DownIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\" /></svg>`;\nconst UpIcon = `<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\" /></svg>`;\n\n/*\n Display a dropdown that allows multiple options to be selected. Note that events \"bubble\" from the\n * input field to the container, so you can subscribe to the same DOM events (input, blur, etc) that a\n * normal input would emit.\n \n ```ts\n * <verdocs-multiselect label=\"Methods:\" value={[]} options={[...options]} onInput={() => {}} />\n * ```\n /\n@Component({\n tag: 'verdocs-multiselect',\n styleUrl: 'verdocs-multiselect.scss',\n})\nexport class VerdocsMultiselect {\n /\n The label for the field.\n /\n @Prop() label: string = '';\n\n /\n The placeholder for the input element when no options are selected.\n /\n @Prop() placeholder: string = 'Select...';\n\n /\n The options to list.\n /\n @Prop() options: IMultiSelectOption[];\n\n /\n The currently selected options.\n /\n @Prop() selectedOptions: string[] = [];\n\n @Event({composed: true}) selectionChanged: EventEmitter<{selectedOptions: string[]}>;\n\n @State() showPicker = false;\n\n handleToggleOption(e: any, option: IMultiSelectOption) {\n if (e.target.checked) {\n this.selectedOptions = [...this.selectedOptions, option.value];\n } else {\n this.selectedOptions = this.selectedOptions.filter(selected => selected !== option.value);\n }\n\n this.selectionChanged?.emit({selectedOptions: this.selectedOptions});\n }\n\n render() {\n const elId = `verdocs-dropdown-${randomString(8)}`;\n\n return (\n <Host class={this.showPicker ? 'open' : 'closed'}>\n <label>\n {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n <div class=\"input-wrapper\">\n <button id={elId} class=\"trigger\" value=\"\" onClick={() => (this.showPicker = !this.showPicker)}>\n {this.selectedOptions.length === 0 ? (\n <span class=\"placeholder\">{this.placeholder}</span>\n ) : (\n this.selectedOptions.map(option => <span class=\"selected-option\">{this.options.find(opt => opt.value === option)?.label \|\| 'Unknown'}</span>)\n )}\n </button>\n\n <div class=\"icon\" innerHTML={this.showPicker ? UpIcon : DownIcon} />\n\n {this.showPicker && (\n <div class=\"verdocs-multiselect-dropdown\">\n {/<verdocs-portal/}\n {/ anchor={elId}/}\n {/ voffset={2}/}\n {/ onClickAway={() => {/}\n {/ this.showPicker = false;/}\n {/ }}/}\n {/ id=\"verdocs-multiselect-menu-items\"/}\n {/>/}\n {this.options.map((option, i) => (\n <div class=\"option\" onClick={() => (this.showPicker = false)}>\n <verdocs-checkbox\n size=\"small\"\n id={`verdocs-multi-select-opt-${i}`}\n value={option.value}\n checked={this.selectedOptions.includes(option.value)}\n onInput={(e: any) => this.handleToggleOption(e, option)}\n />\n <label htmlFor={`verdocs-multi-select-option-${i}`}>{option.label}</label>\n </div>\n ))}\n {/</verdocs-portal>*/}\n </div>\n )}\n </div>\n </label>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/controls/verdocs-organization-card/verdocs-organization-card.js CHANGED Viewed

@@ -42,7 +42,6 @@ export class VerdocsOrganizationCard {
         return {
             "organization": {
                 "type": "unknown",
-                "attribute": "organization",
                 "mutable": false,
                 "complexType": {
                     "original": "Partial<IOrganization>",

package/dist/collection/components/controls/verdocs-organization-card/verdocs-organization-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-organization-card.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAGtE,yGAAyG;AACzG,6GAA6G;AAE7G,MAAM,YAAY,GAChB,gWAAgW,CAAC;AAEnW;;;;;;GAMG;AAKH,MAAM,OAAO,uBAAuB;IAJpC;QAWE,YAAO,GAAY,KAAK,CAAC;KA0D1B;IAvDC,WAAW;QACT,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAGD,UAAU;QACR,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,MAAM;;QACJ,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACtF,MAAM,YAAY,GAAG,YAAY,CAAC;QAClC,MAAM,QAAQ,GAAG,oBAAoB,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC;QAE5D,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,QAAQ;YACf,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,WAAK,KAAK,EAAC,MAAM,EAAC,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI;YAEzJ,6DAAM,KAAK,EAAC,SAAS,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ;YAEtD,uEAAgB,MAAM,EAAE,QAAQ;gBAC9B,4DAAK,KAAK,EAAC,wBAAwB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAC;oBAClF,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,CACjC,WAAK,KAAK,EAAC,wBAAwB;wBACjC,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG;wBACxD,WAAK,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAO,CAC9C,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;wBACvB,YAAM,KAAK,EAAC,QAAQ;4BAClB,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI,CACzC;wBACP,YAAM,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ,CAChD,CACP;oBAED,4DAAK,KAAK,EAAC,YAAY;wBACrB,4DAAK,KAAK,EAAC,OAAO;4BAChB,0EAAuB;4BACtB,MAAM,CAAC,IAAI,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,KAAI,SAAS,CAAC,EAAE,UAAU,CAAC,CACrE;wBACL,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CACxB,4DAAK,KAAK,EAAC,OAAO;4BAChB,2EAAwB;4BACxB,0DAAG,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,UAAU,IAC5D,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,CACrB,CACA,CACP,CACG,CACF,CACS,CACZ,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["import {format} from 'date-fns';\nimport {Component, Prop, h, Host, Listen, State} from '@stencil/core';\nimport type {IOrganization} from '@verdocs/js-sdk';\n\n// TODO: See what was done in Storybook. Move all SVG icons to a common file that both projects can share\n// and reduce duplication between components for re-used icons. Also bring icons into Figma for reuse there.\n\nconst BusinessIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" aria-hidden=\"true\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\"><path d=\"M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z\"></path></svg>';\n\n/*\n Display a small summary card describing an organization.\n \n ```ts\n * <verdocs-organization-card organization={organization} />\n * ```\n /\n@Component({\n tag: 'verdocs-organization-card',\n styleUrl: 'verdocs-organization-card.scss',\n})\nexport class VerdocsOrganizationCard {\n /\n The organization to display\n */\n @Prop() organization: Partial<IOrganization>;\n\n @State()\n hovered: boolean = false;\n\n @Listen('mouseover')\n onMouseOver() {\n this.hovered = true;\n }\n\n @Listen('mouseout')\n onMouseOut() {\n this.hovered = false;\n }\n\n render() {\n console.log('Rendering org card', this.organization.thumbnail_url, this.organization);\n const fallbackIcon = BusinessIcon;\n const portalId = `verdocs-org-card-${this.organization.id}`;\n\n return (\n <Host id={portalId}>\n {this.organization.thumbnail_url ? <img class=\"icon\" src={this.organization.thumbnail_url} alt=\"Logo\" /> : <span class=\"icon\" innerHTML={fallbackIcon} />}\n\n <span class=\"content\">{this.organization?.name}</span>\n\n <verdocs-portal anchor={portalId}>\n <div class=\"verdocs-org-card-popup\" style={{display: this.hovered ? 'block' : 'none'}}>\n {this.organization.full_logo_url ? (\n <div class=\"popup-header-with-logo\">\n <img src={this.organization.full_logo_url} alt=\"Logo\" />\n <div class=\"title\">{this.organization?.name}</div>\n </div>\n ) : (\n <div class=\"popup-header\">\n <span class=\"status\">\n <span class=\"icon\" innerHTML={fallbackIcon} />\n </span>\n <span class=\"title\">{this.organization?.name}</span>\n </div>\n )}\n\n <div class=\"popup-body\">\n <div class=\"field\">\n <strong>Joined</strong>\n {format(new Date(this.organization?.created_at \|\| undefined), 'LLL d, Y')}\n </div>\n {this.organization.url && (\n <div class=\"field\">\n <strong>Website</strong>\n <a href={this.organization?.url} target=\"_blank\" rel=\"nofollow\">\n {this.organization?.url}\n </a>\n </div>\n )}\n </div>\n </div>\n </verdocs-portal>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-organization-card.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAGtE,yGAAyG;AACzG,6GAA6G;AAE7G,MAAM,YAAY,GAChB,gWAAgW,CAAC;AAEnW;;;;;;GAMG;AAKH,MAAM,OAAO,uBAAuB;IAJpC;QAWE,YAAO,GAAY,KAAK,CAAC;KA0D1B;IAvDC,WAAW;QACT,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAGD,UAAU;QACR,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC;IAED,MAAM;;QACJ,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACtF,MAAM,YAAY,GAAG,YAAY,CAAC;QAClC,MAAM,QAAQ,GAAG,oBAAoB,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC;QAE5D,OAAO,CACL,EAAC,IAAI,qDAAC,EAAE,EAAE,QAAQ;YACf,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,WAAK,KAAK,EAAC,MAAM,EAAC,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG,CAAC,CAAC,CAAC,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI;YAEzJ,6DAAM,KAAK,EAAC,SAAS,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ;YAEtD,uEAAgB,MAAM,EAAE,QAAQ;gBAC9B,4DAAK,KAAK,EAAC,wBAAwB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAC;oBAClF,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,CAAC,CACjC,WAAK,KAAK,EAAC,wBAAwB;wBACjC,WAAK,GAAG,EAAE,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,GAAG,EAAC,MAAM,GAAG;wBACxD,WAAK,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAO,CAC9C,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;wBACvB,YAAM,KAAK,EAAC,QAAQ;4BAClB,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,YAAY,GAAI,CACzC;wBACP,YAAM,KAAK,EAAC,OAAO,IAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CAAQ,CAChD,CACP;oBAED,4DAAK,KAAK,EAAC,YAAY;wBACrB,4DAAK,KAAK,EAAC,OAAO;4BAChB,0EAAuB;4BACtB,MAAM,CAAC,IAAI,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,KAAI,SAAS,CAAC,EAAE,UAAU,CAAC,CACrE;wBACL,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CACxB,4DAAK,KAAK,EAAC,OAAO;4BAChB,2EAAwB;4BACxB,0DAAG,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,UAAU,IAC5D,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,CACrB,CACA,CACP,CACG,CACF,CACS,CACZ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {format} from 'date-fns';\nimport {Component, Prop, h, Host, Listen, State} from '@stencil/core';\nimport type {IOrganization} from '@verdocs/js-sdk';\n\n// TODO: See what was done in Storybook. Move all SVG icons to a common file that both projects can share\n// and reduce duplication between components for re-used icons. Also bring icons into Figma for reuse there.\n\nconst BusinessIcon =\n '<svg xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" aria-hidden=\"true\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\"><path d=\"M12 7V3H2v18h20V7H12zM6 19H4v-2h2v2zm0-4H4v-2h2v2zm0-4H4V9h2v2zm0-4H4V5h2v2zm4 12H8v-2h2v2zm0-4H8v-2h2v2zm0-4H8V9h2v2zm0-4H8V5h2v2zm10 12h-8v-2h2v-2h-2v-2h2v-2h-2V9h8v10zm-2-8h-2v2h2v-2zm0 4h-2v2h2v-2z\"></path></svg>';\n\n/*\n Display a small summary card describing an organization.\n \n ```ts\n * <verdocs-organization-card organization={organization} />\n * ```\n /\n@Component({\n tag: 'verdocs-organization-card',\n styleUrl: 'verdocs-organization-card.scss',\n})\nexport class VerdocsOrganizationCard {\n /\n The organization to display\n */\n @Prop() organization: Partial<IOrganization>;\n\n @State()\n hovered: boolean = false;\n\n @Listen('mouseover')\n onMouseOver() {\n this.hovered = true;\n }\n\n @Listen('mouseout')\n onMouseOut() {\n this.hovered = false;\n }\n\n render() {\n console.log('Rendering org card', this.organization.thumbnail_url, this.organization);\n const fallbackIcon = BusinessIcon;\n const portalId = `verdocs-org-card-${this.organization.id}`;\n\n return (\n <Host id={portalId}>\n {this.organization.thumbnail_url ? <img class=\"icon\" src={this.organization.thumbnail_url} alt=\"Logo\" /> : <span class=\"icon\" innerHTML={fallbackIcon} />}\n\n <span class=\"content\">{this.organization?.name}</span>\n\n <verdocs-portal anchor={portalId}>\n <div class=\"verdocs-org-card-popup\" style={{display: this.hovered ? 'block' : 'none'}}>\n {this.organization.full_logo_url ? (\n <div class=\"popup-header-with-logo\">\n <img src={this.organization.full_logo_url} alt=\"Logo\" />\n <div class=\"title\">{this.organization?.name}</div>\n </div>\n ) : (\n <div class=\"popup-header\">\n <span class=\"status\">\n <span class=\"icon\" innerHTML={fallbackIcon} />\n </span>\n <span class=\"title\">{this.organization?.name}</span>\n </div>\n )}\n\n <div class=\"popup-body\">\n <div class=\"field\">\n <strong>Joined</strong>\n {format(new Date(this.organization?.created_at \|\| undefined), 'LLL d, Y')}\n </div>\n {this.organization.url && (\n <div class=\"field\">\n <strong>Website</strong>\n <a href={this.organization?.url} target=\"_blank\" rel=\"nofollow\">\n {this.organization?.url}\n </a>\n </div>\n )}\n </div>\n </div>\n </verdocs-portal>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/controls/verdocs-pagination/verdocs-pagination.js CHANGED Viewed

@@ -70,7 +70,6 @@ export class VerdocsQuickFilter {
         return {
             "selectedPage": {
                 "type": "number",
-                "attribute": "selected-page",
                 "mutable": true,
                 "complexType": {
                     "original": "number",
@@ -86,11 +85,11 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "selected-page",
                 "defaultValue": "0"
             },
             "itemCount": {
                 "type": "number",
-                "attribute": "item-count",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -106,11 +105,11 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "item-count",
                 "defaultValue": "1"
             },
             "perPage": {
                 "type": "number",
-                "attribute": "per-page",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -126,6 +125,7 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "per-page",
                 "defaultValue": "10"
             }
         };

package/dist/collection/components/controls/verdocs-portal/verdocs-portal.js CHANGED Viewed

@@ -111,7 +111,6 @@ export class VerdocsPortal {
         return {
             "anchor": {
                 "type": "string",
-                "attribute": "anchor",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -126,11 +125,11 @@ export class VerdocsPortal {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "anchor"
             },
             "voffset": {
                 "type": "number",
-                "attribute": "voffset",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -146,6 +145,7 @@ export class VerdocsPortal {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "voffset",
                 "defaultValue": "0"
             }
         };

package/dist/collection/components/controls/verdocs-progress-bar/verdocs-progress-bar.js CHANGED Viewed

@@ -41,7 +41,6 @@ export class VerdocsProgressBar {
         return {
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -57,11 +56,11 @@ export class VerdocsProgressBar {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label",
                 "defaultValue": "''"
             },
             "showPercent": {
                 "type": "boolean",
-                "attribute": "show-percent",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -77,11 +76,11 @@ export class VerdocsProgressBar {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "show-percent",
                 "defaultValue": "false"
             },
             "percent": {
                 "type": "number",
-                "attribute": "percent",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -97,6 +96,7 @@ export class VerdocsProgressBar {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "percent",
                 "defaultValue": "0"
             }
         };

package/dist/collection/components/controls/verdocs-quick-filter/verdocs-quick-filter.js CHANGED Viewed

@@ -105,7 +105,6 @@ export class VerdocsQuickFilter {
         return {
             "options": {
                 "type": "unknown",
-                "attribute": "options",
                 "mutable": false,
                 "complexType": {
                     "original": "IFilterOption[]",
@@ -130,7 +129,6 @@ export class VerdocsQuickFilter {
             },
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -146,11 +144,11 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "label",
                 "defaultValue": "'Filter'"
             },
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -166,11 +164,11 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": true,
+                "attribute": "value",
                 "defaultValue": "''"
             },
             "placeholder": {
                 "type": "string",
-                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -186,6 +184,7 @@ export class VerdocsQuickFilter {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "placeholder",
                 "defaultValue": "'Select...'"
             }
         };

package/dist/collection/components/controls/verdocs-quick-filter/verdocs-quick-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"verdocs-quick-filter.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-quick-filter/verdocs-quick-filter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Host} from '@stencil/core';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Element, State, h, Event, EventEmitter} from '@stencil/core';\nimport {renderedTextWidth} from '../../../utils/utils';\n\nconst DropdownArrow = `<svg height=\"20\" width=\"20\" viewBox=\"0 0 20 20\" aria-hidden=\"true\" focusable=\"false\" class=\"css-8mmkcg\"><path d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"></path></svg>`;\n\nexport interface IFilterOption {\n value: string;\n label: string;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu of quick filter options.\n \n ```ts\n * <verdocs-quick-filter options={[...options]} value={1} label=\"Filter\" placeholder=\"All\" />\n * ```\n /\n@Component({\n tag: 'verdocs-quick-filter',\n styleUrl: 'verdocs-quick-filter.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n private dropdownButton?: HTMLElement;\n private dropdownMenu?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The menu options to display.\n /\n @Prop() options: IFilterOption[] = [];\n\n @Prop()\n label: string = 'Filter';\n\n @Prop({reflect: true, mutable: true})\n value: string = '';\n\n @Prop()\n placeholder: string = 'Select...';\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IFilterOption>;\n\n @State() open: boolean;\n\n // We need to do this to reliably disconnect the click-away listener\n clickListenerSymbol = new AbortController();\n componentDidLoad() {\n this.popper = createPopper(this.dropdownButton, this.dropdownMenu, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [-1, 14]}}]});\n\n window.addEventListener('click', this.clickListener.bind(this), {signal: this.clickListenerSymbol.signal});\n }\n\n disconnectedCallback() {\n this.clickListenerSymbol.abort();\n }\n\n clickListener(e: any) {\n const outside = !(e.target == this.el \|\| this.el.contains(e.target));\n if (outside) {\n this.hide();\n }\n }\n\n handleSelectOption(e: any, option: IFilterOption) {\n e.stopPropagation();\n this.optionSelected.emit(option);\n this.value = option.value;\n this.hide();\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.open = true;\n this.dropdownMenu.setAttribute('data-show', '');\n this.dropdownMenu.removeAttribute('aria-hidden');\n\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }))\n .catch(() => {});\n\n this.popper?.update().catch(() => {});\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown(e: any) {\n e.stopPropagation();\n\n if (this.open) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.open = false;\n this.dropdownMenu.removeAttribute('data-show');\n this.dropdownMenu.setAttribute('aria-hidden', 'true');\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }))\n .catch(() => {});\n }\n\n render() {\n const selectedOption = this.options?.find(option => option.value === this.value);\n const longestOption = this.options?.reduce((prev, curr) => (prev.label.length > curr.label.length ? prev : curr));\n const longestLabelWidth = renderedTextWidth(longestOption?.label \|\| 'FILLER', '14px Inter, Barlow, sans-serif');\n const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');\n const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;\n\n return (\n <Host class={{open: !!this.open}} style={{minWidth, display: 'inline-block'}}>\n <div class=\"control\" onClick={e => this.toggleDropdown(e)} onBlur={e => this.handleHideDropdown(e)}>\n <div class=\"title\" ref={el => (this.dropdownButton = el as HTMLElement)}>\n <span class=\"prefix\">{this.label}:</span>\n {selectedOption ? selectedOption.label : this.placeholder}\n </div>\n\n <div style={{flex: '1'}} />\n\n <div class=\"separator\" />\n\n <div class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" />\n </div>\n\n <div class=\"items\" aria-hidden={!this.open} ref={el => (this.dropdownMenu = el as HTMLDivElement)} style={{minWidth}}>\n {this.options?.map(option =>\n option.label ? (\n <button onClick={e => this.handleSelectOption(e, option)} class={`option ${option.value === this.value ? 'selected' : ''}`} disabled={option.disabled}>\n {option.label}\n </button>\n ) : (\n <div class=\"separator\" />\n ),\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"verdocs-quick-filter.js","sourceRoot":"","sources":["../../../../src/components/controls/verdocs-quick-filter/verdocs-quick-filter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Host} from '@stencil/core';\nimport {createPopper, Instance} from '@popperjs/core';\nimport {Component, Prop, Element, State, h, Event, EventEmitter} from '@stencil/core';\nimport {renderedTextWidth} from '../../../utils/utils';\n\nconst DropdownArrow = `<svg height=\"20\" width=\"20\" viewBox=\"0 0 20 20\" aria-hidden=\"true\" focusable=\"false\" class=\"css-8mmkcg\"><path d=\"M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z\"></path></svg>`;\n\nexport interface IFilterOption {\n value: string;\n label: string;\n disabled?: boolean;\n}\n\n/*\n Display a drop-down menu of quick filter options.\n \n ```ts\n * <verdocs-quick-filter options={[...options]} value={1} label=\"Filter\" placeholder=\"All\" />\n * ```\n /\n@Component({\n tag: 'verdocs-quick-filter',\n styleUrl: 'verdocs-quick-filter.scss',\n})\nexport class VerdocsQuickFilter {\n @Element()\n el: HTMLElement;\n\n private dropdownButton?: HTMLElement;\n private dropdownMenu?: HTMLDivElement;\n private popper?: Instance;\n\n /\n The menu options to display.\n /\n @Prop() options: IFilterOption[] = [];\n\n @Prop()\n label: string = 'Filter';\n\n @Prop({reflect: true, mutable: true})\n value: string = '';\n\n @Prop()\n placeholder: string = 'Select...';\n\n /\n Event fired when a menu option is clicked.\n * Web Component events need to be \"composed\" to cross the Shadow DOM and be received by parent frameworks.\n */\n @Event({composed: true}) optionSelected: EventEmitter<IFilterOption>;\n\n @State() open: boolean;\n\n // We need to do this to reliably disconnect the click-away listener\n clickListenerSymbol = new AbortController();\n componentDidLoad() {\n this.popper = createPopper(this.dropdownButton, this.dropdownMenu, {placement: 'bottom-start', modifiers: [{name: 'offset', options: {offset: [-1, 14]}}]});\n\n window.addEventListener('click', this.clickListener.bind(this), {signal: this.clickListenerSymbol.signal});\n }\n\n disconnectedCallback() {\n this.clickListenerSymbol.abort();\n }\n\n clickListener(e: any) {\n const outside = !(e.target == this.el \|\| this.el.contains(e.target));\n if (outside) {\n this.hide();\n }\n }\n\n handleSelectOption(e: any, option: IFilterOption) {\n e.stopPropagation();\n this.optionSelected.emit(option);\n this.value = option.value;\n this.hide();\n }\n\n // See https://popper.js.org/docs/v2/tutorial/\n // What we're doing here is clearing event listeners when they aren't needed, to increase performance in lists\n showDropdown() {\n this.open = true;\n this.dropdownMenu.setAttribute('data-show', '');\n this.dropdownMenu.removeAttribute('aria-hidden');\n\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: true}],\n }))\n .catch(() => {});\n\n this.popper?.update().catch(() => {});\n }\n\n handleHideDropdown(e: any) {\n if (e?.target?.localName === 'button' && e?.target?.className === 'arrow') {\n // This event is fired when a menu element is clicked because the button \"loses focus\" then too\n return;\n }\n\n this.hide();\n }\n\n toggleDropdown(e: any) {\n e.stopPropagation();\n\n if (this.open) {\n this.hide();\n } else {\n this.showDropdown();\n }\n }\n\n hide() {\n this.open = false;\n this.dropdownMenu.removeAttribute('data-show');\n this.dropdownMenu.setAttribute('aria-hidden', 'true');\n this.popper\n ?.setOptions(options => ({\n ...options,\n modifiers: [...options.modifiers, {name: 'eventListeners', enabled: false}],\n }))\n .catch(() => {});\n }\n\n render() {\n const selectedOption = this.options?.find(option => option.value === this.value);\n const longestOption = this.options?.reduce((prev, curr) => (prev.label.length > curr.label.length ? prev : curr));\n const longestLabelWidth = renderedTextWidth(longestOption?.label \|\| 'FILLER', '14px Inter, Barlow, sans-serif');\n const prefixWidth = renderedTextWidth(this.label, '14px Inter, Barlow, sans-serif');\n const minWidth = `${longestLabelWidth + prefixWidth + 40}px`;\n\n return (\n <Host class={{open: !!this.open}} style={{minWidth, display: 'inline-block'}}>\n <div class=\"control\" onClick={e => this.toggleDropdown(e)} onBlur={e => this.handleHideDropdown(e)}>\n <div class=\"title\" ref={el => (this.dropdownButton = el as HTMLElement)}>\n <span class=\"prefix\">{this.label}:</span>\n {selectedOption ? selectedOption.label : this.placeholder}\n </div>\n\n <div style={{flex: '1'}} />\n\n <div class=\"separator\" />\n\n <div class=\"arrow\" innerHTML={DropdownArrow} aria-label=\"Open Menu\" />\n </div>\n\n <div class=\"items\" aria-hidden={!this.open} ref={el => (this.dropdownMenu = el as HTMLDivElement)} style={{minWidth}}>\n {this.options?.map(option =>\n option.label ? (\n <button onClick={e => this.handleSelectOption(e, option)} class={`option ${option.value === this.value ? 'selected' : ''}`} disabled={option.disabled}>\n {option.label}\n </button>\n ) : (\n <div class=\"separator\" />\n ),\n )}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/controls/verdocs-radio-button/verdocs-radio-button.js CHANGED Viewed

@@ -54,7 +54,6 @@ export class VerdocsRadioButton {
         return {
             "checked": {
                 "type": "boolean",
-                "attribute": "checked",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -70,11 +69,11 @@ export class VerdocsRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "checked",
                 "defaultValue": "false"
             },
             "name": {
                 "type": "string",
-                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -90,11 +89,11 @@ export class VerdocsRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "name",
                 "defaultValue": "''"
             },
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -110,11 +109,11 @@ export class VerdocsRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "value",
                 "defaultValue": "''"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -130,6 +129,7 @@ export class VerdocsRadioButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             }
         };