npm - @dnncommunity/dnn-elements - Versions diffs - 0.15.0-beta.3 → 0.15.0-beta.6 - Mend

@dnncommunity/dnn-elements 0.15.0-beta.3 → 0.15.0-beta.6

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 (50) hide show

package/dist/collection/components/dnn-button/dnn-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-button.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-button/dnn-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot Content of the button\n /\n@Component({\n tag: 'dnn-button',\n styleUrl: 'dnn-button.scss',\n shadow: true\n})\nexport class DnnButton {\n\n /\n Optional button style,\n * can be either primary, secondary or tertiary and defaults to primary if not specified\n /\n @Prop() type: 'primary' \| 'secondary' \| 'tertiary' = 'primary';\n\n /\n Optionally reverses the button style.\n /\n @Prop() reversed: boolean = false;\n\n /\n Optionally sets the button size, small normal or large, defaults to normal\n /\n @Prop() size?: 'small' \| 'normal' \| 'large' = 'normal';\n\n /\n Optionally add a confirmation dialog before firing the action.\n /\n @Prop() confirm?: boolean = false;\n\n /\n The text of the yes button for confirmation.\n /\n @Prop() confirmYesText?: string = \"Yes\";\n\n /\n The text of the no button for confirmation.\n /\n @Prop() confirmNoText?: string = \"No\";\n\n /\n The text of the confirmation message;\n /\n @Prop() confirmMessage?: string = \"Are you sure ?\";\n \n /\n Disables the button\n /\n @Prop() disabled: boolean = false;\n\n @State() modalVisible: boolean = false;\n\n @Element() el!: HTMLDnnButtonElement;\n\n private modal!: HTMLDnnModalElement;\n\n /* \n * Fires when confirm is true and the user confirms the action.\n /\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true\n }) confirmed: EventEmitter;\n\n /\n Fires when confirm is true and the user cancels the action.\n */\n @Event({bubbles: true}) canceled: EventEmitter;\n\n componentDidLoad(){\n this.modal = this.el.shadowRoot.querySelector('dnn-modal');\n }\n\n private handleConfirm(){\n this.modal.hide();\n this.modalVisible = false;\n this.confirmed.emit();\n }\n\n private handleCancel(){\n this.modal.hide();\n this.modalVisible = false;\n this.canceled.emit();\n }\n \n private handleClick(): void {\n if (this.confirm && !this.modalVisible){\n this.modal.show();\n this.modalVisible = true;\n }\n }\n\n private getElementClasses(): string \| { [className: string]: boolean; } {\n const classes: string[] = [];\n classes.push(this.type);\n if (this.reversed){\n classes.push('reversed');\n }\n if (this.size !== 'normal'){\n classes.push(this.size);\n }\n return classes.join(' ');\n }\n\n render() {\n return (\n <Host class={this.getElementClasses()} disabled={this.disabled} style={{'pointer-events': this.disabled ? 'none' : 'all'}}>\n <button class=\"button\" onClick={() => this.handleClick()} disabled={this.disabled}>\n <slot></slot>\n </button>\n {this.confirm &&\n <dnn-modal showCloseButton={false} backdropDismiss={false}>\n <p>{this.confirmMessage}</p>\n <div style={\n {\n display: 'flex',\n justifyContent: 'flex-end'\n }\n }>\n <dnn-button type='primary' style={{margin: '5px'}} onClick={() => this.handleConfirm()}>{this.confirmYesText}</dnn-button>\n <dnn-button type='secondary' style={{margin: '5px'}} onClick={() => this.handleCancel()}>{this.confirmNoText}</dnn-button>\n </div>\n </dnn-modal>\n }\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dnn-button.js","sourceRoot":"","sources":["../../../src/components/dnn-button/dnn-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot Content of the button\n /\n@Component({\n tag: 'dnn-button',\n styleUrl: 'dnn-button.scss',\n shadow: true\n})\nexport class DnnButton {\n\n /\n Optional button style,\n * can be either primary, secondary or tertiary and defaults to primary if not specified\n /\n @Prop() type: 'primary' \| 'secondary' \| 'tertiary' = 'primary';\n\n /\n Optionally reverses the button style.\n /\n @Prop() reversed: boolean = false;\n\n /\n Optionally sets the button size, small normal or large, defaults to normal\n /\n @Prop() size?: 'small' \| 'normal' \| 'large' = 'normal';\n\n /\n Optionally add a confirmation dialog before firing the action.\n /\n @Prop() confirm?: boolean = false;\n\n /\n The text of the yes button for confirmation.\n /\n @Prop() confirmYesText?: string = \"Yes\";\n\n /\n The text of the no button for confirmation.\n /\n @Prop() confirmNoText?: string = \"No\";\n\n /\n The text of the confirmation message;\n /\n @Prop() confirmMessage?: string = \"Are you sure ?\";\n \n /\n Disables the button\n /\n @Prop() disabled: boolean = false;\n\n @State() modalVisible: boolean = false;\n\n @Element() el!: HTMLDnnButtonElement;\n\n private modal!: HTMLDnnModalElement;\n\n /* \n * Fires when confirm is true and the user confirms the action.\n /\n @Event({\n bubbles: true,\n cancelable: true,\n composed: true\n }) confirmed: EventEmitter;\n\n /\n Fires when confirm is true and the user cancels the action.\n */\n @Event({bubbles: true}) canceled: EventEmitter;\n\n componentDidLoad(){\n this.modal = this.el.shadowRoot.querySelector('dnn-modal');\n }\n\n private handleConfirm(){\n this.modal.hide();\n this.modalVisible = false;\n this.confirmed.emit();\n }\n\n private handleCancel(){\n this.modal.hide();\n this.modalVisible = false;\n this.canceled.emit();\n }\n \n private handleClick(): void {\n if (this.confirm && !this.modalVisible){\n this.modal.show();\n this.modalVisible = true;\n }\n }\n\n private getElementClasses(): string \| { [className: string]: boolean; } {\n const classes: string[] = [];\n classes.push(this.type);\n if (this.reversed){\n classes.push('reversed');\n }\n if (this.size !== 'normal'){\n classes.push(this.size);\n }\n return classes.join(' ');\n }\n\n render() {\n return (\n <Host class={this.getElementClasses()} disabled={this.disabled} style={{'pointer-events': this.disabled ? 'none' : 'all'}}>\n <button class=\"button\" onClick={() => this.handleClick()} disabled={this.disabled}>\n <slot></slot>\n </button>\n {this.confirm &&\n <dnn-modal showCloseButton={false} backdropDismiss={false}>\n <p>{this.confirmMessage}</p>\n <div style={\n {\n display: 'flex',\n justifyContent: 'flex-end'\n }\n }>\n <dnn-button type='primary' style={{margin: '5px'}} onClick={() => this.handleConfirm()}>{this.confirmYesText}</dnn-button>\n <dnn-button type='secondary' style={{margin: '5px'}} onClick={() => this.handleCancel()}>{this.confirmNoText}</dnn-button>\n </div>\n </dnn-modal>\n }\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dnn-button/dnn-button.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-button.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-button/dnn-button.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAEhE,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,iBAAiB;EACxB,SAAS,EAAE,YAAY;EACvB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,WAAW,EAAE,UAAU,CAAC;KACrC;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,MAAM,EAAE;MACN,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,UAAU,CAAC;MAC7C,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;KACF;IACD,UAAU,EAAE;MACV,OAAO,EAAE,SAAS;KACnB;IACD,MAAM,EAAE;MACJ,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;MACrC,OAAO,EAAE;QACL,IAAI,EAAE,QAAQ;OACjB;KACJ;IACD,SAAS,EAAE;MACP,OAAO,EAAE,SAAS;KACrB;IACD,kBAAkB,EAAE;MAChB,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,MAAM;KAClB;IACD,UAAU,EAAE;MACV,OAAO,EAAE,SAAS;KACnB;GACF;CACE,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;mBAEW,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;wBACf,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;mBAC7B,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;uBAChB,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC;+BACf,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;8BAC/B,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;8BAC7B,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;wBACpC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;cAClC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;KAE9B,CAAC;AAEN,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG;EACV,IAAI,EAAE,SAAS;EACf,QAAQ,EAAE,KAAK;EACf,IAAI,EAAE,QAAQ;EACd,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,KAAK;EACrB,aAAa,EAAE,IAAI;EACnB,cAAc,EAAE,eAAe;EAC/B,QAAQ,EAAE,KAAK;EACf,IAAI,EAAE,WAAW;CACpB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Button',\n component: 'dnn-button',\n parameters: {\n actions: {\n handles: ['confirmed', 'canceled'],\n },\n notes: readme,\n },\n argTypes: {\n 'type': {\n options: ['primary', 'secondary', 'tertiary'],\n control: {\n type: 'select',\n },\n },\n 'reversed': {\n control: 'boolean',\n },\n 'size': {\n options: ['small', 'normal', 'large'],\n control: {\n type: 'select',\n },\n },\n 'confirm': {\n control: 'boolean',\n },\n 'confirm-yes-text': {\n control: 'text',\n },\n 'confirm-no-text': {\n control: 'text',\n },\n 'confirm-message': {\n control: 'text',\n },\n 'disabled': {\n control: 'boolean',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-button\n type=${ifDefined(args.type)}\n ?reversed=${ifDefined(args.reversed)}\n size=${ifDefined(args.size)}\n ?confirm=${ifDefined(args.confirm)}\n confirm-yes-text=${ifDefined(args.confirmYesText)}\n confirm-no-text=${ifDefined(args.confirmNoText)}\n confirm-message=${ifDefined(args.confirmMessage)}\n ?disabled=${ifDefined(args.disabled)}>\n ${unsafeHTML(args.slot)}\n </dnn-button>\n `;\n\nexport const Button = Template.bind({});\nButton.args = {\n type: 'primary',\n reversed: false,\n size: 'medium',\n confirm: true,\n confirmYesText: 'Yes',\n confirmNoText: 'No',\n confirmMessage: 'Are you sure?',\n disabled: false,\n slot: 'Click me!'\n};\n"]}
1	+ {"version":3,"file":"dnn-button.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-button/dnn-button.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAEhE,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,iBAAiB;EACxB,SAAS,EAAE,YAAY;EACvB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,WAAW,EAAE,UAAU,CAAC;KACrC;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,MAAM,EAAE;MACN,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,UAAU,CAAC;MAC7C,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;OACf;KACF;IACD,UAAU,EAAE;MACV,OAAO,EAAE,SAAS;KACnB;IACD,MAAM,EAAE;MACJ,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;MACrC,OAAO,EAAE;QACL,IAAI,EAAE,QAAQ;OACjB;KACJ;IACD,SAAS,EAAE;MACP,OAAO,EAAE,SAAS;KACrB;IACD,kBAAkB,EAAE;MAChB,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,MAAM;KAClB;IACD,UAAU,EAAE;MACV,OAAO,EAAE,SAAS;KACnB;GACF;CACE,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;mBAEW,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;wBACf,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;mBAC7B,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;uBAChB,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC;+BACf,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;8BAC/B,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;8BAC7B,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;wBACpC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;cAClC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;;KAE9B,CAAC;AAEN,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxC,MAAM,CAAC,IAAI,GAAG;EACV,IAAI,EAAE,SAAS;EACf,QAAQ,EAAE,KAAK;EACf,IAAI,EAAE,QAAQ;EACd,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,KAAK;EACrB,aAAa,EAAE,IAAI;EACnB,cAAc,EAAE,eAAe;EAC/B,QAAQ,EAAE,KAAK;EACf,IAAI,EAAE,WAAW;CACpB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Button',\n component: 'dnn-button',\n parameters: {\n actions: {\n handles: ['confirmed', 'canceled'],\n },\n notes: readme,\n },\n argTypes: {\n 'type': {\n options: ['primary', 'secondary', 'tertiary'],\n control: {\n type: 'select',\n },\n },\n 'reversed': {\n control: 'boolean',\n },\n 'size': {\n options: ['small', 'normal', 'large'],\n control: {\n type: 'select',\n },\n },\n 'confirm': {\n control: 'boolean',\n },\n 'confirm-yes-text': {\n control: 'text',\n },\n 'confirm-no-text': {\n control: 'text',\n },\n 'confirm-message': {\n control: 'text',\n },\n 'disabled': {\n control: 'boolean',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-button\n type=${ifDefined(args.type)}\n ?reversed=${ifDefined(args.reversed)}\n size=${ifDefined(args.size)}\n ?confirm=${ifDefined(args.confirm)}\n confirm-yes-text=${ifDefined(args.confirmYesText)}\n confirm-no-text=${ifDefined(args.confirmNoText)}\n confirm-message=${ifDefined(args.confirmMessage)}\n ?disabled=${ifDefined(args.disabled)}>\n ${unsafeHTML(args.slot)}\n </dnn-button>\n `;\n\nexport const Button = Template.bind({});\nButton.args = {\n type: 'primary',\n reversed: false,\n size: 'medium',\n confirm: true,\n confirmYesText: 'Yes',\n confirmNoText: 'No',\n confirmMessage: 'Are you sure?',\n disabled: false,\n slot: 'Click me!'\n};\n"]}

package/dist/collection/components/dnn-checkbox/dnn-checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-checkbox.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-checkbox/dnn-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot - The label for the checkbox.\n * @slot checkedicon - Allows overriding the default checked icon.\n * @slot uncheckedicon - Allows overriding the unchecked icon.\n * @slot intermediateicon - If intermadiate state is used, allows overriding its icon.\n /\n@Component({\n tag: 'dnn-checkbox',\n styleUrl: 'dnn-checkbox.scss',\n shadow: true,\n})\nexport class DnnCheckbox {\n @Element() el: HTMLDnnCheckboxElement;\n\n /* Defines if the checkbox is checked (true) or unchecked (false) or in an intermediate state (undefined) /\n @Prop({mutable: true}) checked: \"checked\" \| \"unchecked\" \| \"intermediate\" = \"unchecked\";\n\n /* Defines if clicking the checkbox will go through the intermediate state between checked and unchecked (tri-state) /\n @Prop() useIntermediate: boolean = false;\n\n /* The value for this checkbox (not to be confused with its checked state). /\n @Prop() value: string;\n\n /* Fires up when the checkbox checked property changes. */\n @Event() checkedchange: EventEmitter<\"checked\" \| \"unchecked\" \| \"intermediate\">;\n\n private changeState(): void {\n if (!this.useIntermediate){\n switch (this.checked) {\n case \"checked\":\n this.checked = \"unchecked\";\n break;\n case \"unchecked\":\n case \"intermediate\":\n this.checked = \"checked\";\n break;\n default:\n break;\n }\n this.checkedchange.emit(this.checked);\n return;\n }\n switch (this.checked) {\n case \"checked\":\n this.checked = \"intermediate\";\n break;\n case \"intermediate\":\n this.checked = \"unchecked\";\n break;\n case \"unchecked\":\n this.checked = \"checked\";\n break;\n default:\n break;\n }\n this.checkedchange.emit(this.checked);\n }\n\n render() {\n return (\n <Host>\n <button\n class={`icon ${this.checked}`}\n onClick={() => this.changeState()}\n >\n <div class=\"unchecked\">\n <slot name=\"uncheckedicon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\"/></svg>\n </slot>\n </div>\n <div class=\"checked\">\n <slot name=\"checkedicon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>\n </slot>\n </div>\n <div class=\"intermediate\">\n <slot name=\"intermediateicon\">\n <svg class=\"undefined\" xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><g><g><path d=\"M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M17,13H7v-2h10V13z\"/></g></g></g></svg>\n </slot>\n </div>\n </button>\n <label htmlFor={this.el.id} onClick={() => this.changeState()}><slot></slot></label>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dnn-checkbox.js","sourceRoot":"","sources":["../../../src/components/dnn-checkbox/dnn-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/*\n @slot - The label for the checkbox.\n * @slot checkedicon - Allows overriding the default checked icon.\n * @slot uncheckedicon - Allows overriding the unchecked icon.\n * @slot intermediateicon - If intermadiate state is used, allows overriding its icon.\n /\n@Component({\n tag: 'dnn-checkbox',\n styleUrl: 'dnn-checkbox.scss',\n shadow: true,\n})\nexport class DnnCheckbox {\n @Element() el: HTMLDnnCheckboxElement;\n\n /* Defines if the checkbox is checked (true) or unchecked (false) or in an intermediate state (undefined) /\n @Prop({mutable: true}) checked: \"checked\" \| \"unchecked\" \| \"intermediate\" = \"unchecked\";\n\n /* Defines if clicking the checkbox will go through the intermediate state between checked and unchecked (tri-state) /\n @Prop() useIntermediate: boolean = false;\n\n /* The value for this checkbox (not to be confused with its checked state). /\n @Prop() value: string;\n\n /* Fires up when the checkbox checked property changes. */\n @Event() checkedchange: EventEmitter<\"checked\" \| \"unchecked\" \| \"intermediate\">;\n\n private changeState(): void {\n if (!this.useIntermediate){\n switch (this.checked) {\n case \"checked\":\n this.checked = \"unchecked\";\n break;\n case \"unchecked\":\n case \"intermediate\":\n this.checked = \"checked\";\n break;\n default:\n break;\n }\n this.checkedchange.emit(this.checked);\n return;\n }\n switch (this.checked) {\n case \"checked\":\n this.checked = \"intermediate\";\n break;\n case \"intermediate\":\n this.checked = \"unchecked\";\n break;\n case \"unchecked\":\n this.checked = \"checked\";\n break;\n default:\n break;\n }\n this.checkedchange.emit(this.checked);\n }\n\n render() {\n return (\n <Host>\n <button\n class={`icon ${this.checked}`}\n onClick={() => this.changeState()}\n >\n <div class=\"unchecked\">\n <slot name=\"uncheckedicon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\"/></svg>\n </slot>\n </div>\n <div class=\"checked\">\n <slot name=\"checkedicon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"/></svg>\n </slot>\n </div>\n <div class=\"intermediate\">\n <slot name=\"intermediateicon\">\n <svg class=\"undefined\" xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><g><g><path d=\"M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M17,13H7v-2h10V13z\"/></g></g></g></svg>\n </slot>\n </div>\n </button>\n <label htmlFor={this.el.id} onClick={() => this.changeState()}><slot></slot></label>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dnn-checkbox/dnn-checkbox.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-checkbox.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-checkbox/dnn-checkbox.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,eAAe;EACX,KAAK,EAAE,mBAAmB;EAC1B,SAAS,EAAE,cAAc;EACzB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,eAAe,CAAC;KAC7B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,SAAS,EAAE;MACP,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,cAAc,CAAC;MACjD,OAAO,EAAE,OAAO;KACnB;IACD,kBAAkB,EAAE;MAChB,OAAO,EAAE,SAAS;KACrB;IACD,OAAO,EAAE;MACL,OAAO,EAAE,MAAM;KAClB;GACF;CACE,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;sBAEc,IAAI,CAAC,OAAO;gCACF,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;oBAC3C,IAAI,CAAC,KAAK;;KAEzB,CAAC;AAEN,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACZ,OAAO,EAAE,WAAW;EACpB,eAAe,EAAE,KAAK;EACtB,KAAK,EAAE,GAAG;CACb,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\nimport { ifDefined } from \"lit-html/directives/if-defined\";\n\nexport default {\n title: 'Elements/Checkbox',\n component: 'dnn-checkbox',\n parameters: {\n actions: {\n handles: ['checkedchange'],\n },\n notes: readme,\n },\n argTypes: {\n 'checked': {\n options: ['checked', 'unchecked', 'intermediate'],\n control: 'radio',\n },\n 'use-intermediate': {\n control: 'boolean',\n },\n 'value': {\n control: 'text',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-checkbox\n checked=${args.checked}\n ?use-intermediate=${ifDefined(args.useIntermediate)}\n value=${args.value}>\n </dnn-checkbox>\n `;\n\nexport const Checkbox = Template.bind({});\nCheckbox.args = {\n checked: 'unchecked',\n useIntermediate: false,\n value: '1',\n};\n"]}
1	+ {"version":3,"file":"dnn-checkbox.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-checkbox/dnn-checkbox.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,eAAe;EACX,KAAK,EAAE,mBAAmB;EAC1B,SAAS,EAAE,cAAc;EACzB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,eAAe,CAAC;KAC7B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,SAAS,EAAE;MACP,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,cAAc,CAAC;MACjD,OAAO,EAAE,OAAO;KACnB;IACD,kBAAkB,EAAE;MAChB,OAAO,EAAE,SAAS;KACrB;IACD,OAAO,EAAE;MACL,OAAO,EAAE,MAAM;KAClB;GACF;CACE,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;sBAEc,IAAI,CAAC,OAAO;gCACF,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;oBAC3C,IAAI,CAAC,KAAK;;KAEzB,CAAC;AAEN,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACZ,OAAO,EAAE,WAAW;EACpB,eAAe,EAAE,KAAK;EACtB,KAAK,EAAE,GAAG;CACb,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\nimport { ifDefined } from \"lit-html/directives/if-defined\";\n\nexport default {\n title: 'Elements/Checkbox',\n component: 'dnn-checkbox',\n parameters: {\n actions: {\n handles: ['checkedchange'],\n },\n notes: readme,\n },\n argTypes: {\n 'checked': {\n options: ['checked', 'unchecked', 'intermediate'],\n control: 'radio',\n },\n 'use-intermediate': {\n control: 'boolean',\n },\n 'value': {\n control: 'text',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-checkbox\n checked=${args.checked}\n ?use-intermediate=${ifDefined(args.useIntermediate)}\n value=${args.value}>\n </dnn-checkbox>\n `;\n\nexport const Checkbox = Template.bind({});\nCheckbox.args = {\n checked: 'unchecked',\n useIntermediate: false,\n value: '1',\n};\n"]}

package/dist/collection/components/dnn-chevron/dnn-chevron.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-chevron.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-chevron/dnn-chevron.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEhE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOtC,MAAM,OAAO,UAAU;EALvB;IAOE,qCAAqC;IAC7B,eAAU,GAAY,QAAQ,CAAC;IAEvC,uCAAuC;IAC/B,iBAAY,GAAY,UAAU,CAAC;IAE3C,8BAA8B;IACQ,aAAQ,GAAa,KAAK,CAAC;GAsBlE;EAhBC,qBAAqB,CAAC,QAAiB;IACrC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;EAC9B,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,4BAAoB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EACrE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ;QAE7C,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;UAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;UAAA,YAAM,CAAC,EAAC,gDAAgD,GAAE,CAAM,CACpM,CACJ,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Event } from '@stencil/core';\nimport { EventEmitter } from '@stencil/core';\nimport { Watch } from '@stencil/core';\n\n@Component({\n tag: 'dnn-chevron',\n styleUrl: 'dnn-chevron.scss',\n shadow: true\n})\nexport class DnnChevron {\n\n /** Expand text for screen readers /\n @Prop() expandText?: string = \"expand\";\n\n /* Collapse text for screen readers /\n @Prop() collapseText?: string = \"collapse\";\n\n /* Is the chevron expanded /\n @Prop({mutable: true, reflect: true}) expanded?: boolean = false;\n\n /* Fires up when the expanded status changes */\n @Event() changed: EventEmitter;\n\n @Watch('expanded')\n handleExpandedChanged(newValue: boolean) {\n this.changed.emit(newValue);\n }\n\n render() {\n return (\n <Host>\n <button aria-label={this.expanded ? this.collapseText : this.expandText}\n onClick={() => this.expanded = !this.expanded}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"/></svg>\n </button>\n </Host>\n );\n }\n\n}\n"]}
1	+ {"version":3,"file":"dnn-chevron.js","sourceRoot":"","sources":["../../../src/components/dnn-chevron/dnn-chevron.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEhE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOtC,MAAM,OAAO,UAAU;EALvB;IAOE,qCAAqC;IAC7B,eAAU,GAAY,QAAQ,CAAC;IAEvC,uCAAuC;IAC/B,iBAAY,GAAY,UAAU,CAAC;IAE3C,8BAA8B;IACQ,aAAQ,GAAa,KAAK,CAAC;GAsBlE;EAhBC,qBAAqB,CAAC,QAAiB;IACrC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;EAC9B,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,4BAAoB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,EACrE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ;QAE7C,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;UAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;UAAA,YAAM,CAAC,EAAC,gDAAgD,GAAE,CAAM,CACpM,CACJ,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Event } from '@stencil/core';\nimport { EventEmitter } from '@stencil/core';\nimport { Watch } from '@stencil/core';\n\n@Component({\n tag: 'dnn-chevron',\n styleUrl: 'dnn-chevron.scss',\n shadow: true\n})\nexport class DnnChevron {\n\n /** Expand text for screen readers /\n @Prop() expandText?: string = \"expand\";\n\n /* Collapse text for screen readers /\n @Prop() collapseText?: string = \"collapse\";\n\n /* Is the chevron expanded /\n @Prop({mutable: true, reflect: true}) expanded?: boolean = false;\n\n /* Fires up when the expanded status changes */\n @Event() changed: EventEmitter;\n\n @Watch('expanded')\n handleExpandedChanged(newValue: boolean) {\n this.changed.emit(newValue);\n }\n\n render() {\n return (\n <Host>\n <button aria-label={this.expanded ? this.collapseText : this.expandText}\n onClick={() => this.expanded = !this.expanded}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"/></svg>\n </button>\n </Host>\n );\n }\n\n}\n"]}

package/dist/collection/components/dnn-chevron/dnn-chevron.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-chevron.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-chevron/dnn-chevron.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,kBAAkB;EACzB,SAAS,EAAE,aAAa;EACxB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,SAAS,CAAC;KACvB;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,aAAa,EAAE;MACX,OAAO,EAAE,MAAM;KAClB;IACD,eAAe,EAAE;MACb,OAAO,EAAE,MAAM;KAClB;IACD,UAAU,EAAE;MACR,OAAO,EAAE,SAAS;KACnB;GACF;CACA,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;0BAEkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;4BACxB,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC;wBAChC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;;KAE3C,CAAC;AAEN,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;EACX,UAAU,EAAE,QAAQ;EACpB,YAAY,EAAE,UAAU;EACxB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Chevron',\n component: 'dnn-chevron',\n parameters: {\n actions: {\n handles: ['changed'],\n },\n notes: readme,\n },\n argTypes: {\n 'expand-text': {\n control: 'text',\n },\n 'collapse-text': {\n control: 'text',\n },\n 'expanded': {\n control: 'boolean',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-chevron\n expand-text=${ifDefined(args.expandText)}\n collapse-text=${ifDefined(args.collapseText)}\n ?expanded=${ifDefined(args.expanded)}>\n </dnn-chevron>\n `;\n\nexport const Chevron = Template.bind({});\nChevron.args = {\n expandText: 'expand',\n collapseText: 'collapse',\n expanded: false,\n};\n"]}
1	+ {"version":3,"file":"dnn-chevron.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-chevron/dnn-chevron.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,kBAAkB;EACzB,SAAS,EAAE,aAAa;EACxB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,SAAS,CAAC;KACvB;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,aAAa,EAAE;MACX,OAAO,EAAE,MAAM;KAClB;IACD,eAAe,EAAE;MACb,OAAO,EAAE,MAAM;KAClB;IACD,UAAU,EAAE;MACR,OAAO,EAAE,SAAS;KACnB;GACF;CACA,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;0BAEkB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;4BACxB,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC;wBAChC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;;KAE3C,CAAC;AAEN,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;EACX,UAAU,EAAE,QAAQ;EACpB,YAAY,EAAE,UAAU;EACxB,QAAQ,EAAE,KAAK;CAClB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Chevron',\n component: 'dnn-chevron',\n parameters: {\n actions: {\n handles: ['changed'],\n },\n notes: readme,\n },\n argTypes: {\n 'expand-text': {\n control: 'text',\n },\n 'collapse-text': {\n control: 'text',\n },\n 'expanded': {\n control: 'boolean',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-chevron\n expand-text=${ifDefined(args.expandText)}\n collapse-text=${ifDefined(args.collapseText)}\n ?expanded=${ifDefined(args.expanded)}>\n </dnn-chevron>\n `;\n\nexport const Chevron = Template.bind({});\nChevron.args = {\n expandText: 'expand',\n collapseText: 'collapse',\n expanded: false,\n};\n"]}

package/dist/collection/components/dnn-collapsible/dnn-collapsible.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-collapsible.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-collapsible/dnn-collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAO9G,MAAM,OAAO,cAAc;EAL3B;IASE,+CAA+C;IACxB,aAAQ,GAAY,KAAK,CAAC;IAEjD,2DAA2D;IACnD,uBAAkB,GAAY,GAAG,CAAC;GAoE3C;EA9DC,mBAAmB;IACjB,qBAAqB,CAAC,GAAG,EAAE;MACzB,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC,CAAC,CAAA;EACJ,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,UAAU;IACd,IAAI,IAAI,CAAC,QAAQ,EAAC;MACd,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,IAAI,CAAC;MACtE,CAAC,CAAC,CAAC;MACH,UAAU,CAAC,GAAG,EAAE;QACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;MAC1C,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;KAC/B;EACH,CAAC;EAGD,sBAAsB,CAAC,QAAiB;IACtC,IAAI,QAAQ,EAAC;MACX,IAAI,CAAC,UAAU,EAAE,CAAC;KACnB;SACG;MACF,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,IAAI,CAAC;QACpE,qBAAqB,CAAC,GAAG,EAAE;UACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC;QACzC,CAAC,CAAC,CAAC;MACL,CAAC,CAAC,CAAC;KACJ;IACD,UAAU,CAAC,GAAG,EAAE;MACd,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,2BAA2B,CAAC,IAAI,EAAE,CAAC;MAC1C,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;EAC9B,CAAC;EAID,gBAAgB;IACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,cAAc,IAAI,CAAC,kBAAkB,gBAAgB,CAAC;EAC1F,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WACE,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,IAAI,CAAC,QAAQ,IAAI,UAAU,EAClC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,EAC9B,KAAK,EAAE,EAAC,UAAU,EAAE,cAAc,IAAI,CAAC,kBAAkB,gBAAgB,EAAC;QAExE,eAAa,CACX,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter, Watch, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: \"dnn-collapsible\",\n styleUrl: \"dnn-collapsible.scss\",\n shadow: true\n})\nexport class DnnCollapsible {\n\n @Element() el: HTMLDnnCollapsibleElement;\n\n /** Defines if the panel is expanded or not. /\n @Prop({reflect: true}) expanded: boolean = false;\n\n /* Defines the transition time in ms, defaults to 150ms /\n @Prop() transitionDuration?: number = 150;\n\n /* Fires whenever the collapsible height has changed /\n @Event({bubbles: true, composed: true}) dnnCollapsibleHeightChanged: EventEmitter<void>;\n\n @Listen(\"dnnCollapsibleHeightChanged\")\n handleHeightChanged(){\n requestAnimationFrame(() => {\n this.updateSize();\n })\n }\n\n /\n Updates the component height, use to update after a slot content changes.\n */\n @Method()\n async updateSize() {\n if (this.expanded){\n requestAnimationFrame(() => {\n this.container.style.maxHeight = `${this.container.scrollHeight}px`;\n });\n setTimeout(() => {\n this.container.style.maxHeight = \"none\";\n }, this.transitionDuration);\n }\n }\n \n @Watch(\"expanded\")\n handledExpandedChanged(expanded: boolean){\n if (expanded){\n this.updateSize();\n }\n else{\n requestAnimationFrame(() => {\n this.container.style.maxHeight = `${this.container.scrollHeight}px`;\n requestAnimationFrame(() => {\n this.container.style.maxHeight = \"0px\";\n });\n });\n }\n setTimeout(() => {\n requestAnimationFrame(() => {\n this.dnnCollapsibleHeightChanged.emit();\n });\n }, this.transitionDuration);\n }\n \n private container: HTMLDivElement;\n\n componentDidLoad() {\n this.container.style.transition = `max-height ${this.transitionDuration}ms ease-in-out`;\n }\n\n render() {\n return (\n <Host>\n <div\n id=\"container\"\n class={this.expanded && \"expanded\"}\n ref={el => this.container = el}\n style={{transition: `max-height ${this.transitionDuration}ms ease-in-out`}}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n\n}\n"]}
1	+ {"version":3,"file":"dnn-collapsible.js","sourceRoot":"","sources":["../../../src/components/dnn-collapsible/dnn-collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAO9G,MAAM,OAAO,cAAc;EAL3B;IASE,+CAA+C;IACxB,aAAQ,GAAY,KAAK,CAAC;IAEjD,2DAA2D;IACnD,uBAAkB,GAAY,GAAG,CAAC;GAoE3C;EA9DC,mBAAmB;IACjB,qBAAqB,CAAC,GAAG,EAAE;MACzB,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC,CAAC,CAAA;EACJ,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,UAAU;IACd,IAAI,IAAI,CAAC,QAAQ,EAAC;MACd,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,IAAI,CAAC;MACtE,CAAC,CAAC,CAAC;MACH,UAAU,CAAC,GAAG,EAAE;QACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,MAAM,CAAC;MAC1C,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;KAC/B;EACH,CAAC;EAGD,sBAAsB,CAAC,QAAiB;IACtC,IAAI,QAAQ,EAAC;MACX,IAAI,CAAC,UAAU,EAAE,CAAC;KACnB;SACG;MACF,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,YAAY,IAAI,CAAC;QACpE,qBAAqB,CAAC,GAAG,EAAE;UACzB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC;QACzC,CAAC,CAAC,CAAC;MACL,CAAC,CAAC,CAAC;KACJ;IACD,UAAU,CAAC,GAAG,EAAE;MACd,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,2BAA2B,CAAC,IAAI,EAAE,CAAC;MAC1C,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;EAC9B,CAAC;EAID,gBAAgB;IACd,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,cAAc,IAAI,CAAC,kBAAkB,gBAAgB,CAAC;EAC1F,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WACE,EAAE,EAAC,WAAW,EACd,KAAK,EAAE,IAAI,CAAC,QAAQ,IAAI,UAAU,EAClC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,EAC9B,KAAK,EAAE,EAAC,UAAU,EAAE,cAAc,IAAI,CAAC,kBAAkB,gBAAgB,EAAC;QAExE,eAAa,CACX,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, Element, Event, EventEmitter, Watch, Listen, Method } from '@stencil/core';\n\n@Component({\n tag: \"dnn-collapsible\",\n styleUrl: \"dnn-collapsible.scss\",\n shadow: true\n})\nexport class DnnCollapsible {\n\n @Element() el: HTMLDnnCollapsibleElement;\n\n /** Defines if the panel is expanded or not. /\n @Prop({reflect: true}) expanded: boolean = false;\n\n /* Defines the transition time in ms, defaults to 150ms /\n @Prop() transitionDuration?: number = 150;\n\n /* Fires whenever the collapsible height has changed /\n @Event({bubbles: true, composed: true}) dnnCollapsibleHeightChanged: EventEmitter<void>;\n\n @Listen(\"dnnCollapsibleHeightChanged\")\n handleHeightChanged(){\n requestAnimationFrame(() => {\n this.updateSize();\n })\n }\n\n /\n Updates the component height, use to update after a slot content changes.\n */\n @Method()\n async updateSize() {\n if (this.expanded){\n requestAnimationFrame(() => {\n this.container.style.maxHeight = `${this.container.scrollHeight}px`;\n });\n setTimeout(() => {\n this.container.style.maxHeight = \"none\";\n }, this.transitionDuration);\n }\n }\n \n @Watch(\"expanded\")\n handledExpandedChanged(expanded: boolean){\n if (expanded){\n this.updateSize();\n }\n else{\n requestAnimationFrame(() => {\n this.container.style.maxHeight = `${this.container.scrollHeight}px`;\n requestAnimationFrame(() => {\n this.container.style.maxHeight = \"0px\";\n });\n });\n }\n setTimeout(() => {\n requestAnimationFrame(() => {\n this.dnnCollapsibleHeightChanged.emit();\n });\n }, this.transitionDuration);\n }\n \n private container: HTMLDivElement;\n\n componentDidLoad() {\n this.container.style.transition = `max-height ${this.transitionDuration}ms ease-in-out`;\n }\n\n render() {\n return (\n <Host>\n <div\n id=\"container\"\n class={this.expanded && \"expanded\"}\n ref={el => this.container = el}\n style={{transition: `max-height ${this.transitionDuration}ms ease-in-out`}}\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n\n}\n"]}

package/dist/collection/components/dnn-collapsible/dnn-collapsible.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-collapsible.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-collapsible/dnn-collapsible.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,sBAAsB;EAC7B,SAAS,EAAE,iBAAiB;EAC5B,UAAU,EAAE;IACR,KAAK,EAAE,MAAM;IACb,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,6BAA6B,CAAC;KAC3C;GACJ;EACD,QAAQ,EAAE;IACN,QAAQ,EAAE;MACN,IAAI,EAAE,SAAS;KAClB;IACD,kBAAkB,EAAE;MAChB,IAAI,EAAE,QAAQ;KACjB;IACD,qBAAqB,EAAE;MACnB,IAAI,EAAE,QAAQ;MACd,OAAO,EAAE,QAAQ;KACpB;GACJ;CACI,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAwD,EAAE,EAAE,CAC1E,IAAI,CAAA;qCAC6B,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,wBAAwB,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC;;;;;;KAMlH,CAAC;AAEN,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;EACf,QAAQ,EAAE,KAAK;EACf,kBAAkB,EAAE,GAAG;CAC1B,CAAC","sourcesContent":["import { html } from \"lit-html\";\r\nimport { ifDefined } from 'lit-html/directives/if-defined';\r\nimport { Meta } from \"@storybook/web-components\";\r\nimport readme from \"./readme.md\";\r\n\r\nexport default {\r\n title: \"Elements/Collapsible\",\r\n component: \"dnn-collapsible\",\r\n parameters: {\r\n notes: readme,\r\n actions: {\r\n handles: ['dnnCollapsibleHeightChanged'],\r\n },\r\n },\r\n argTypes: {\r\n expanded: {\r\n type: \"boolean\",\r\n },\r\n transitionDuration: {\r\n type: \"number\",\r\n },\r\n 'transition-duration': {\r\n type: \"number\",\r\n control: \"number\",\r\n }\r\n }\r\n} as Meta;\r\n\r\nconst Template = (args: { expanded: boolean; transitionDuration: number; }) =>\r\n html`\r\n <dnn-collapsible ?expanded=${ifDefined(args.expanded)} transition-duration=${ifDefined(args.transitionDuration)}>\r\n <div style=\"border: 1px solid lightgray\">\r\n <h1>This title is inside the collapsible</h1>\r\n <p>Bacon ipsum dolor amet cupim hamburger beef ribs pork belly porchetta shankle swine. Pork belly jowl rump swine corned beef, pancetta kevin cow. Picanha pork chop pork loin corned beef beef prosciutto t-bone short loin bresaola short ribs chicken andouille. Pig leberkas meatball alcatra ribeye meatloaf. Prosciutto shoulder tongue chuck burgdoggen tenderloin, shank sirloin landjaeger doner shankle meatball kevin pork loin ham hock.</p>\r\n </div>\r\n </dnn-collapsible>\r\n `;\r\n\r\nexport const Collapsible = Template.bind({});\r\nCollapsible.args = {\r\n expanded: false,\r\n transitionDuration: 150,\r\n};"]}
1	+ {"version":3,"file":"dnn-collapsible.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-collapsible/dnn-collapsible.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,sBAAsB;EAC7B,SAAS,EAAE,iBAAiB;EAC5B,UAAU,EAAE;IACR,KAAK,EAAE,MAAM;IACb,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,6BAA6B,CAAC;KAC3C;GACJ;EACD,QAAQ,EAAE;IACN,QAAQ,EAAE;MACN,IAAI,EAAE,SAAS;KAClB;IACD,kBAAkB,EAAE;MAChB,IAAI,EAAE,QAAQ;KACjB;IACD,qBAAqB,EAAE;MACnB,IAAI,EAAE,QAAQ;MACd,OAAO,EAAE,QAAQ;KACpB;GACJ;CACI,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAwD,EAAE,EAAE,CAC1E,IAAI,CAAA;qCAC6B,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,wBAAwB,SAAS,CAAC,IAAI,CAAC,kBAAkB,CAAC;;;;;;KAMlH,CAAC;AAEN,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;EACf,QAAQ,EAAE,KAAK;EACf,kBAAkB,EAAE,GAAG;CAC1B,CAAC","sourcesContent":["import { html } from \"lit-html\";\r\nimport { ifDefined } from 'lit-html/directives/if-defined';\r\nimport { Meta } from \"@storybook/web-components\";\r\nimport readme from \"./readme.md\";\r\n\r\nexport default {\r\n title: \"Elements/Collapsible\",\r\n component: \"dnn-collapsible\",\r\n parameters: {\r\n notes: readme,\r\n actions: {\r\n handles: ['dnnCollapsibleHeightChanged'],\r\n },\r\n },\r\n argTypes: {\r\n expanded: {\r\n type: \"boolean\",\r\n },\r\n transitionDuration: {\r\n type: \"number\",\r\n },\r\n 'transition-duration': {\r\n type: \"number\",\r\n control: \"number\",\r\n }\r\n }\r\n} as Meta;\r\n\r\nconst Template = (args: { expanded: boolean; transitionDuration: number; }) =>\r\n html`\r\n <dnn-collapsible ?expanded=${ifDefined(args.expanded)} transition-duration=${ifDefined(args.transitionDuration)}>\r\n <div style=\"border: 1px solid lightgray\">\r\n <h1>This title is inside the collapsible</h1>\r\n <p>Bacon ipsum dolor amet cupim hamburger beef ribs pork belly porchetta shankle swine. Pork belly jowl rump swine corned beef, pancetta kevin cow. Picanha pork chop pork loin corned beef beef prosciutto t-bone short loin bresaola short ribs chicken andouille. Pig leberkas meatball alcatra ribeye meatloaf. Prosciutto shoulder tongue chuck burgdoggen tenderloin, shank sirloin landjaeger doner shankle meatball kevin pork loin ham hock.</p>\r\n </div>\r\n </dnn-collapsible>\r\n `;\r\n\r\nexport const Collapsible = Template.bind({});\r\nCollapsible.args = {\r\n expanded: false,\r\n transitionDuration: 150,\r\n};"]}

package/dist/collection/components/dnn-color-picker/dnn-color-picker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-color-picker.js","sourceRoot":"","sources":["../../../../src/components/dnn-color-picker/dnn-color-picker.tsx"],"names":[],"mappings":"AAAA;;;GAGG;;;;;;;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAgB,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC/F,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAEpD,2BAA2B;AAM3B,MAAM,OAAO,cAAc;EAL3B;IASI,iGAAiG;IACzF,UAAK,GAAW,QAAQ,CAAC;IAEjC;;OAEG;IACK,mBAAc,GAAW,KAAK,CAAC;IAG9B,eAAU,GAAW,MAAM,CAAC;IAC5B,eAAU,GAAW,MAAM,CAAC;IAC5B,eAAU,GAAW,MAAM,CAAC;IA6C7B,uCAAkC,GAAG,CAAC,CAAC,EAAE,EAAE;MAC/C,CAAC,CAAC,cAAc,EAAE,CAAC;MACnB,IAAI,CAAC,6BAA6B,CAAC,CAAC,CAAC,CAAC;MACtC,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,6BAA6B,CAAC,CAAC;MACzE,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,gCAAgC,CAAC,CAAC;IAC9E,CAAC,CAAA;IAEO,kCAA6B,GAAG,CAAC,CAAC,EAAE,EAAE;MAC1C,MAAM,IAAI,GAAG,IAAI,CAAC,sBAAsB,CAAC,qBAAqB,EAAE,CAAC;MAEjE,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;MAC9B,IAAI,CAAC,GAAG,CAAC,EAAE;QAAE,CAAC,GAAG,CAAC,CAAA;OAAC;MACnB,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE;QAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAA;OAAC;MACrC,CAAC,GAAG,CAAC,GAAC,IAAI,CAAC,KAAK,CAAC;MAEjB,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC;MAC7B,IAAI,CAAC,GAAG,CAAC,EAAE;QAAE,CAAC,GAAG,CAAC,CAAA;OAAC;MACnB,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE;QAAE,CAAC,GAAG,IAAI,CAAC,MAAM,CAAA;OAAC;MACvC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,GAAC,IAAI,CAAC,MAAM,CAAC,CAAC;MAExB,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MACjC,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;MACrC,QAAQ,CAAC,UAAU,GAAG,CAAC,CAAC;MACxB,QAAQ,CAAC,SAAS,GAAG,CAAC,CAAC;MACvB,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAA;IAEO,qCAAgC,GAAG,GAAG,EAAE;MAC5C,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,6BAA6B,CAAC,CAAC;MAC5E,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,gCAAgC,CAAC,CAAC;IACjF,CAAC,CAAA;IAEO,uBAAkB,GAAG,CAAC,CAAC,EAAE,EAAE;MAC/B,CAAC,CAAC,cAAc,EAAE,CAAC;MACnB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;MACtB,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;MACzD,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC9D,CAAC,CAAA;IAEO,qBAAgB,GAAG,GAAG,EAAE;MAC5B,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;MAC5D,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACjE,CAAC,CAAA;IAEO,kBAAa,GAAG,CAAC,CAAC,EAAE,EAAE;MAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,qBAAqB,EAAE,CAAC;MAEnD,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC;MAC9B,IAAI,CAAC,GAAG,CAAC,EAAE;QAAE,CAAC,GAAG,CAAC,CAAA;OAAC;MACnB,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE;QAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAA;OAAC;MACrC,CAAC,GAAG,CAAC,GAAC,IAAI,CAAC,KAAK,GAAC,GAAG,CAAC;MAErB,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MACjC,QAAQ,CAAC,GAAG,GAAG,CAAC,CAAC;MACjB,QAAQ,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC;MACnD,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;MACjD,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAA;IAEO,+BAA0B,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE;MAChD,IAAI,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;MACrC,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE;QAAE,OAAM;OAAE;MAC5B,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MACjC,IAAI,KAAK,GAAG,CAAC,EAAE;QAAE,KAAK,GAAG,CAAC,CAAC;OAAE;MAC7B,IAAI,KAAK,GAAG,GAAG,EAAE;QAAE,KAAK,GAAG,GAAG,CAAC;OAAE;MACjC,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;MAC9B,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;MAChC,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;MAC/B,QAAQ,OAAO,EAAE;QACb,KAAK,KAAK;UACN,CAAC,GAAG,KAAK,CAAC;UACV,MAAM;QACV,KAAK,OAAO;UACR,CAAC,GAAG,KAAK,CAAC;UACV,MAAM;QACV,KAAK,MAAM;UACP,CAAC,GAAG,KAAK,CAAC;UACV,MAAM;QACV;UACI,MAAM;OACb;MACD,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC;MACnB,QAAQ,CAAC,GAAG,GAAG,CAAC,CAAC;MACjB,QAAQ,CAAC,IAAI,GAAG,CAAC,CAAC;MAClB,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAA;IAEO,oBAAe,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,EAAE;MACvC,IAAI,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;MACrC,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE;QAAC,OAAM;OAAC;MAC1B,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MACjC,IAAI,KAAK,IAAI,IAAI,EAAE;QACf,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;QAC9B,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC;QACrC,IAAI,CAAC,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;QACpC,QAAQ,SAAS,EAAE;UACf,KAAK,KAAK;YACN,IAAI,KAAK,GAAG,CAAC,EAAE;cAAE,KAAK,GAAG,CAAC,CAAA;aAAC;YAC3B,IAAI,KAAK,GAAG,GAAG,EAAE;cAAE,KAAK,GAAG,CAAC,CAAA;aAAC;YAC7B,CAAC,GAAG,KAAK,CAAC;YACV,MAAM;UACV,KAAK,YAAY;YACb,IAAI,KAAK,GAAG,CAAC,EAAE;cAAE,KAAK,GAAG,CAAC,CAAA;aAAC;YAC3B,IAAI,KAAK,GAAG,GAAG,EAAE;cAAE,KAAK,GAAG,GAAG,CAAA;aAAC;YAC/B,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC;YAChB,MAAM;UACV,KAAK,WAAW;YACZ,IAAI,KAAK,GAAG,CAAC,EAAE;cAAE,KAAK,GAAG,CAAC,CAAA;aAAC;YAC3B,IAAI,KAAK,GAAG,GAAG,EAAE;cAAE,KAAK,GAAG,GAAG,CAAA;aAAC;YAC/B,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC;YAChB,MAAM;UACV;YACI,MAAM;SACb;QACD,QAAQ,CAAC,GAAG,GAAG,CAAC,CAAC;QACjB,QAAQ,CAAC,UAAU,GAAG,CAAC,CAAC;QACxB,QAAQ,CAAC,SAAS,GAAG,CAAC,CAAC;QACvB,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;OAChC;IACL,CAAC,CAAA;IA6CO,qCAAgC,GAAG,CAAC,CAAC,EAAE,EAAE;MAC7C,IAAI,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MAC/B,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;MACrC,QAAQ,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC;MACnD,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;MAEjD,IAAI,KAAK,GAAG,IAAI,CAAC;MACjB,IAAI,CAAC,CAAC,QAAQ,EAAE;QAAE,KAAK,GAAG,GAAG,CAAE;OAAC;MAEhC,QAAQ,CAAC,CAAC,GAAG,EAAE;QACX,KAAK,SAAS;UACV,QAAQ,CAAC,SAAS,IAAI,KAAK,CAAC;UAC5B,MAAM;QACV,KAAK,WAAW;UACZ,QAAQ,CAAC,SAAS,IAAI,KAAK,CAAC;UAC5B,MAAM;QACV,KAAK,WAAW;UACZ,QAAQ,CAAC,UAAU,IAAI,KAAK,CAAC;UAC7B,MAAM;QACV,KAAK,YAAY;UACb,QAAQ,CAAC,UAAU,IAAI,KAAK,CAAC;QACjC;UACI,MAAM;OACb;MACD,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAA;IAEO,qBAAgB,GAAG,CAAC,CAAC,EAAE,EAAE;MAC7B,IAAI,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;MAC/B,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;MACrC,QAAQ,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC;MACnD,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;MAEjD,IAAI,KAAK,GAAG,CAAC,CAAC;MACd,IAAI,CAAC,CAAC,QAAQ,EAAE;QAAE,KAAK,GAAG,EAAE,CAAA;OAAC;MAE7B,QAAQ,CAAC,CAAC,GAAG,EAAE;QACX,KAAK,WAAW;UACZ,QAAQ,CAAC,GAAG,IAAI,KAAK,CAAC;UACtB,MAAM;QACV,KAAK,YAAY;UACb,QAAQ,CAAC,GAAG,IAAI,KAAK,CAAC;QAC1B;UACI,MAAM;OACb;MACD,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAA;GA6IJ;EApYW,mBAAmB,CAAC,KAAgB;IACxC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAClC,CAAC;EAGD,wBAAwB,CAAC,QAAmB;IACxC,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC;EACvC,CAAC;EAMD,iBAAiB;IACb,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EACrC,CAAC;EAED,gBAAgB;IACX,IAAI,CAAC,EAA6B,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC;EAChH,CAAC;EAEO,MAAM;IACX,OAAO,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;EACtI,CAAC;EAEO,WAAW;IACf,OAAO,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC;EAC3C,CAAC;EAEO,UAAU,CAAC,KAAa;IAC5B,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;IACrD,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAC;MACzB,OAAO,GAAG,GAAG,WAAW,CAAC;KAC5B;IACD,OAAO,WAAW,CAAC;EACvB,CAAC;EA2HO,eAAe,CAAC,KAAa;IACjC,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC;IACjC,IAAI,KAAK,CAAC,KAAK,CAAC,8BAA8B,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;MACxD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAC;QACnB,IAAI,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAE,CAAC,CAAC,CAAC;QAChF,KAAK,GAAG,QAAQ,CAAC;OACpB;MACD,QAAQ,CAAC,GAAG,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;MAC/C,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;MACjD,QAAQ,CAAC,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;KACnD;SACG;MACA,QAAQ,CAAC,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;MACrC,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;MACzC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;KAC1C;IACD,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;EACjC,CAAC;EAEO,eAAe,CAAC,CAAC;IACrB,QAAO,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE;MAChB,KAAK,YAAY;QACb,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,MAAM;MACV,KAAK,YAAY;QACb,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,MAAM;MACV,KAAK,YAAY;QACb,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,MAAM;MACV;QACI,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;QACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;KAChC;EACL,CAAC;EAkDD,MAAM;IACF,MAAM,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;IAClC,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC;IAChD,MAAM,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;IAC9C,MAAM,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC;IAClC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;IACtC,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;IAEpC,OAAO,CACH,WAAK,KAAK,EAAC,kBAAkB;MACzB,WAAK,KAAK,EAAC,mBAAmB;QAC1B,WAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,CAAC,sBAAsB,GAAG,OAAyB,EAChG,KAAK,EAAE,EAAC,eAAe,EAAE,OAAO,GAAG,YAAY,EAAC,EAChD,WAAW,EAAE,IAAI,CAAC,kCAAkC,CAAC,IAAI,CAAC,IAAI,CAAC;UAE/D,cAAQ,KAAK,EAAC,gBAAgB,gBACf,qGAAqG,EAChH,IAAI,EAAC,QAAQ,mBACC,GAAG,mBACH,KAAK,oBACH,eAAe,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,GAAC,GAAG,CAAC,iBAAiB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,GAAC,GAAG,CAAC,GAAG,EAC1I,KAAK,EAAE;cACH,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,CAAC,GAAI,GAAG;cACzC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC,GAAI,GAAG;aAC7C,EACD,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,gCAAgC,CAAC,CAAC,CAAC,GAC5D,CACA;QACN,WAAK,KAAK,EAAC,eAAe;UACtB,WAAK,KAAK,EAAC,kBAAkB,EAAC,KAAK,EAAE;cACjC,eAAe,EAAE,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE;cACpC,SAAS,EAAE,cAAc,GAAG,GAAG,GAAG,IAAI,CAAC,WAAW,EAAE;aACvD,GACC;UACF,WAAK,KAAK,EAAC,eAAe,EACtB,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,OAAyB,EAC3D,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC;YAE/C,cAAQ,KAAK,EAAC,gBAAgB,gBACf,qEAAqE,EAChF,IAAI,EAAC,QAAQ,mBACC,GAAG,mBACH,KAAK,mBACJ,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,EAC9B,KAAK,EAAE,EAAC,IAAI,EAAE,CAAC,GAAG,GAAC,GAAG,GAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,GAAG,GAAG,EAAC,EAC7C,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAC5C,CACA,CACJ,CACJ;MACN,WAAK,KAAK,EAAC,kBAAkB;QACzB,WAAK,KAAK,EAAC,sBAAsB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAC;UAC/D,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,GAAG,gBAAa,WAAW,EAC1F,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC,EAAE,KAAK,CAAC,GAC5D,CACA;UACN,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,OAAO,EAAC,KAAK,EAAE,KAAK,gBAAa,aAAa,EACvF,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC,EAAE,OAAO,CAAC,GAC9D,CACA;UACN,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,gBAAa,YAAY,EACpF,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,0BAA0B,CAAC,CAAC,EAAE,MAAM,CAAC,GAC7D,CACA;UACN,WAAK,KAAK,EAAC,uBAAuB;YAC9B,cACI,EAAE,EAAC,YAAY,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,gBAC7B,mCAAmC;cAE9C,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;gBAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;gBAAA,YAAM,CAAC,EAAC,iEAAiE,GAAE,CAAM,CACvN,CACP,CACJ;QACN,WAAK,KAAK,EAAC,sBAAsB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAC;UAC/D,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,gBAAa,KAAK,EACpF,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE,KAAK,CAAC,GACjD,CACA;UACN,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAAC,GAAG,CAAC,gBAAa,YAAY,EACtG,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE,YAAY,CAAC,GACxD,CACA;UACN,WAAK,KAAK,EAAC,qBAAqB;YAC5B,qBAAgB;YAChB,aAAO,IAAI,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,GAAC,GAAG,CAAC,gBAAa,WAAW,EACpG,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE,WAAW,CAAC,GACvD,CACA;UACN,WAAK,KAAK,EAAC,uBAAuB;YAC9B,cACI,EAAE,EAAC,YAAY,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,gBAC7B,uCAAuC;cAElD,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;gBAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;gBAAA,YAAM,CAAC,EAAC,iEAAiE,GAAE,CAAM,CACvN,CACP,CACJ;QACN,WAAK,KAAK,EAAC,sBAAsB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAE,IAAI,CAAC,UAAU,EAAC;UAC/D,WAAK,KAAK,EAAC,qBAAqB;YAC5B,uBAAkB;YAClB,WAAK,KAAK,EAAC,WAAW;cAClB,aAAO,IAAI,EAAC,MAAM,gBAAY,mBAAmB,EAC7C,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,EACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,GAC3E;cACF,cACI,KAAK,EAAC,MAAM,gBACD,YAAY;gBAEvB,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;kBAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;kBAAA,YAAM,CAAC,EAAC,iIAAiI,GAAE,CAAM,CACvR,CACP,CACJ;UACN,WAAK,KAAK,EAAC,uBAAuB;YAC9B,cACI,EAAE,EAAC,YAAY,EACf,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,gBAC7B,2CAA2C;cAEtD,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;gBAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;gBAAA,YAAM,CAAC,EAAC,iEAAiE,GAAE,CAAM,CACvN,CACP,CACJ,CACJ,CACJ,CACT,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ;AApYG;EADC,QAAQ,CAAC,GAAG,CAAC;yDAGb","sourcesContent":["/** Reusable DNN UI component to pick a color\r\n * @copyright Copyright (c) .NET Foundation. All rights reserved.\r\n * @license MIT \r\n /\r\n\r\nimport { Component, h, State, Element, Prop, EventEmitter, Event, Watch } from \"@stencil/core\";\r\nimport { ColorInfo } from '../../utilities/colorInfo';\r\nimport { Debounce } from \"../../utilities/debounce\";\r\n\r\n/* Color Picker for Dnn /\r\n@Component({\r\n tag: 'dnn-color-picker',\r\n styleUrl: 'dnn-color-picker.scss',\r\n shadow: true\r\n})\r\nexport class DnnColorPicker {\r\n\r\n @Element() el: HTMLDnnColorPickerElement;\r\n\r\n /* Sets the initial color, must be a valid 8 character hexadecimal string without the # sign. /\r\n @Prop() color: string = \"FFFFFF\";\r\n\r\n /* Sets the width-height ratio of the color picker saturation-lightness box.\r\n * @example 100% renders a perfect square\r\n /\r\n @Prop() colorBoxHeight: string = \"50%\";\r\n \r\n @State() currentColor: ColorInfo;\r\n @State() rgbDisplay: string = \"flex\";\r\n @State() hslDisplay: string = \"none\";\r\n @State() hexDisplay: string = \"none\";\r\n\r\n /* Fires up when the color is changed and emits a ColorInfo object\r\n * @see ../../utilities/colorInfo.ts\r\n /\r\n @Event() colorChanged: EventEmitter<ColorInfo>;\r\n\r\n @Debounce(100)\r\n private colorChangedHandler(color: ColorInfo) {\r\n this.colorChanged.emit(color);\r\n }\r\n\r\n @Watch(\"currentColor\")\r\n handeCurrentColorChanged(newValue: ColorInfo){\r\n this.colorChangedHandler(newValue);\r\n }\r\n \r\n private saturationLightnessBox?: HTMLDivElement;\r\n private hueRange?: HTMLDivElement;\r\n\r\n\r\n componentWillLoad() {\r\n this.handleHexChange(this.color);\r\n }\r\n\r\n componentDidLoad() {\r\n (this.el as unknown as HTMLElement).style.setProperty(\"--color-box-height\", this.colorBoxHeight.toString());\r\n }\r\n \r\n private getHex() {\r\n return this.getDoublet(this.currentColor.red) + this.getDoublet(this.currentColor.green) + this.getDoublet(this.currentColor.blue);\r\n }\r\n\r\n private getContrast() {\r\n return this.currentColor.contrastColor;\r\n }\r\n\r\n private getDoublet(value: number){\r\n const valueString = value.toString(16).toUpperCase();\r\n if (valueString.length === 1){\r\n return '0' + valueString;\r\n }\r\n return valueString;\r\n }\r\n\r\n private handleSaturationLightnessMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragLightnessSaturation(e);\r\n window.addEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.addEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleDragLightnessSaturation = (e) => {\r\n const rect = this.saturationLightnessBox.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left; \r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width;\r\n\r\n let y = e.clientY - rect.top;\r\n if (y < 0) { y = 0}\r\n if (y > rect.height) { y = rect.height}\r\n y = 1 - (y/rect.height);\r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = x;\r\n newColor.lightness = y;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleSaturationLightnessMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.removeEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleHueMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragHue(e);\r\n window.addEventListener('mousemove', this.handleDragHue);\r\n window.addEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleHueMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragHue);\r\n window.removeEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleDragHue = (e) => {\r\n const rect = this.hueRange.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left;\r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width360; \r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = x;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleComponentValueChange = (e, channel) => {\r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) { return }\r\n const newColor = new ColorInfo();\r\n if (value < 0) { value = 0; }\r\n if (value > 255) { value = 255; }\r\n let r = this.currentColor.red;\r\n let g = this.currentColor.green;\r\n let b = this.currentColor.blue;\r\n switch (channel) {\r\n case 'red':\r\n r = value;\r\n break;\r\n case 'green':\r\n g = value;\r\n break;\r\n case 'blue':\r\n b = value;\r\n break;\r\n default:\r\n break;\r\n }\r\n newColor.green = g;\r\n newColor.red = r;\r\n newColor.blue = b;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHSLChange = (e, component) => { \r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) {return}\r\n const newColor = new ColorInfo();\r\n if (value != null) { \r\n let h = this.currentColor.hue;\r\n let s = this.currentColor.saturation;\r\n let l = this.currentColor.lightness;\r\n switch (component) {\r\n case \"hue\":\r\n if (value < 0) { value = 0}\r\n if (value > 359) { value = 0}\r\n h = value;\r\n break;\r\n case \"saturation\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n s = value / 100;\r\n break;\r\n case \"lightness\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n l = value / 100;\r\n break; \r\n default:\r\n break; \r\n }\r\n newColor.hue = h;\r\n newColor.saturation = s;\r\n newColor.lightness = l;\r\n this.currentColor = newColor;\r\n }\r\n }\r\n\r\n private handleHexChange(value: string){\r\n const newColor = new ColorInfo();\r\n if (value.match(/^(?:[\\da-f]{3}\|[\\da-f]{6})$/i).length > 0) {\r\n if (value.length === 3){\r\n let expanded = value[0] + value[0] + value[1] + value[1] + value[2] + value [2];\r\n value = expanded;\r\n }\r\n newColor.red = parseInt(value.substr(0,2), 16);\r\n newColor.green = parseInt(value.substr(2,2), 16);\r\n newColor.blue = parseInt(value.substr(4,2), 16);\r\n }\r\n else{\r\n newColor.red = this.currentColor.red;\r\n newColor.green = this.currentColor.green;\r\n newColor.blue = this.currentColor.blue;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private switchColorMode(e) {\r\n switch(e.target.id) {\r\n case \"rgb-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"flex\";\r\n break;\r\n case \"hex-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"flex\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n case \"hsl-switch\":\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n default:\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n }\r\n }\r\n\r\n private handleSaturationLightnessKeyDown = (e) => { \r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 0.01;\r\n if (e.shiftKey) { value = 0.1 ;}\r\n\r\n switch (e.key) {\r\n case \"ArrowUp\":\r\n newColor.lightness += value;\r\n break;\r\n case \"ArrowDown\":\r\n newColor.lightness -= value;\r\n break;\r\n case \"ArrowLeft\":\r\n newColor.saturation -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.saturation += value;\r\n default:\r\n break; \r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHueKeyDown = (e) => {\r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 1;\r\n if (e.shiftKey) { value = 10}\r\n\r\n switch (e.key) {\r\n case \"ArrowLeft\":\r\n newColor.hue -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.hue += value;\r\n default:\r\n break;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n render() {\r\n const hue = this.currentColor.hue;\r\n const saturation = this.currentColor.saturation;\r\n const lightness = this.currentColor.lightness;\r\n const red = this.currentColor.red;\r\n const green = this.currentColor.green;\r\n const blue = this.currentColor.blue;\r\n\r\n return (\r\n <div class=\"dnn-color-picker\">\r\n <div class=\"dnn-color-sliders\">\r\n <div class=\"dnn-color-s-b\" ref={(element) => this.saturationLightnessBox = element as HTMLDivElement}\r\n style={{backgroundColor: `hsl(${hue},100%,50%)`}}\r\n onMouseDown={this.handleSaturationLightnessMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-s-b-picker\"\r\n aria-label=\"Press up or down to adjust lightness, left or right to adjust saturation, hold shift to move by 10%\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n aria-valuetext={`Saturation: ${Math.round(this.currentColor.saturation100)}%, Lightness: ${Math.round(this.currentColor.lightness100)}%`}\r\n style={{\r\n left: Math.round(saturation * 100) + \"%\",\r\n bottom: Math.round(lightness * 100) + \"%\"\r\n }}\r\n onKeyDown={(e) => this.handleSaturationLightnessKeyDown(e)}\r\n />\r\n </div>\r\n <div class=\"dnn-color-bar\">\r\n <div class=\"dnn-color-result\" style={{\r\n backgroundColor: '#' + this.getHex(),\r\n boxShadow: \"0 0 2px 1px \" + \"#\" + this.getContrast()\r\n }} \r\n />\r\n <div class=\"dnn-color-hue\"\r\n ref={(element) => this.hueRange = element as HTMLDivElement}\r\n onMouseDown={this.handleHueMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-hue-picker\"\r\n aria-label=\"Press left or right to adjust hue, hold shift to move by 10 degrees\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"359\"\r\n aria-valuenow={Math.round(hue)}\r\n style={{left: (hue/359100).toString() + \"%\"}}\r\n onKeyDown={(e) => this.handleHueKeyDown(e)}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-fields\">\r\n <div class=\"dnn-rgb-color-fields\" style={{display: this.rgbDisplay}}>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>R</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" step=\"1\" class=\"red\" value={red} aria-label=\"red value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'red')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>G</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"green\" value={green} aria-label=\"green value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'green')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>B</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"blue\" value={blue} aria-label=\"blue value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'blue')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"rgb-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"switch to hexadecimal value entry\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hsl-color-fields\" style={{display: this.hslDisplay}}>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>H</label>\r\n <input type=\"number\" min=\"0\" max=\"359\" step={1} value={Math.round(hue)} aria-label=\"Hue\"\r\n onChange={(e) => this.handleHSLChange(e, 'hue')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>S</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(saturation100)} aria-label=\"Saturation\"\r\n onChange={(e) => this.handleHSLChange(e, 'saturation')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>L</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(lightness*100)} aria-label=\"Lightness\"\r\n onChange={(e) => this.handleHSLChange(e, 'lightness')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hsl-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to red, green, blue entry mode\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hex-color-fields\" style={{display: this.hexDisplay}}>\r\n <div class=\"dnn-hex-color-field\">\r\n <label>HEX</label>\r\n <div class=\"hex-input\">\r\n <input type=\"text\" aria-label=\"Hexadecimal value\"\r\n value={this.getHex()}\r\n onChange={e => this.handleHexChange((e.target as HTMLInputElement).value)}\r\n />\r\n <button\r\n class=\"copy\"\r\n aria-label=\"copy value\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hex-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to hue saturation lightness values\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}"]}
1	+ {"version":3,"file":"dnn-color-picker.js","sourceRoot":"","sources":["../../../src/components/dnn-color-picker/dnn-color-picker.tsx"],"names":[],"mappings":"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","sourcesContent":["/** Reusable DNN UI component to pick a color\r\n * @copyright Copyright (c) .NET Foundation. All rights reserved.\r\n * @license MIT \r\n /\r\n\r\nimport { Component, h, State, Element, Prop, EventEmitter, Event, Watch } from \"@stencil/core\";\r\nimport { ColorInfo } from '../../utilities/colorInfo';\r\nimport { Debounce } from \"../../utilities/debounce\";\r\n\r\n/* Color Picker for Dnn /\r\n@Component({\r\n tag: 'dnn-color-picker',\r\n styleUrl: 'dnn-color-picker.scss',\r\n shadow: true\r\n})\r\nexport class DnnColorPicker {\r\n\r\n @Element() el: HTMLDnnColorPickerElement;\r\n\r\n /* Sets the initial color, must be a valid 8 character hexadecimal string without the # sign. /\r\n @Prop() color: string = \"FFFFFF\";\r\n\r\n /* Sets the width-height ratio of the color picker saturation-lightness box.\r\n * @example 100% renders a perfect square\r\n /\r\n @Prop() colorBoxHeight: string = \"50%\";\r\n \r\n @State() currentColor: ColorInfo;\r\n @State() rgbDisplay: string = \"flex\";\r\n @State() hslDisplay: string = \"none\";\r\n @State() hexDisplay: string = \"none\";\r\n\r\n /* Fires up when the color is changed and emits a ColorInfo object\r\n * @see ../../utilities/colorInfo.ts\r\n /\r\n @Event() colorChanged: EventEmitter<ColorInfo>;\r\n\r\n @Debounce(100)\r\n private colorChangedHandler(color: ColorInfo) {\r\n this.colorChanged.emit(color);\r\n }\r\n\r\n @Watch(\"currentColor\")\r\n handeCurrentColorChanged(newValue: ColorInfo){\r\n this.colorChangedHandler(newValue);\r\n }\r\n \r\n private saturationLightnessBox?: HTMLDivElement;\r\n private hueRange?: HTMLDivElement;\r\n\r\n\r\n componentWillLoad() {\r\n this.handleHexChange(this.color);\r\n }\r\n\r\n componentDidLoad() {\r\n (this.el as unknown as HTMLElement).style.setProperty(\"--color-box-height\", this.colorBoxHeight.toString());\r\n }\r\n \r\n private getHex() {\r\n return this.getDoublet(this.currentColor.red) + this.getDoublet(this.currentColor.green) + this.getDoublet(this.currentColor.blue);\r\n }\r\n\r\n private getContrast() {\r\n return this.currentColor.contrastColor;\r\n }\r\n\r\n private getDoublet(value: number){\r\n const valueString = value.toString(16).toUpperCase();\r\n if (valueString.length === 1){\r\n return '0' + valueString;\r\n }\r\n return valueString;\r\n }\r\n\r\n private handleSaturationLightnessMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragLightnessSaturation(e);\r\n window.addEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.addEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleDragLightnessSaturation = (e) => {\r\n const rect = this.saturationLightnessBox.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left; \r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width;\r\n\r\n let y = e.clientY - rect.top;\r\n if (y < 0) { y = 0}\r\n if (y > rect.height) { y = rect.height}\r\n y = 1 - (y/rect.height);\r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = x;\r\n newColor.lightness = y;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleSaturationLightnessMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragLightnessSaturation);\r\n window.removeEventListener('mouseup', this.handleSaturationLightnessMouseUp);\r\n }\r\n\r\n private handleHueMouseDown = (e) => {\r\n e.preventDefault();\r\n this.handleDragHue(e);\r\n window.addEventListener('mousemove', this.handleDragHue);\r\n window.addEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleHueMouseUp = () => {\r\n window.removeEventListener('mousemove', this.handleDragHue);\r\n window.removeEventListener('mouseup', this.handleHueMouseUp); \r\n }\r\n\r\n private handleDragHue = (e) => {\r\n const rect = this.hueRange.getBoundingClientRect(); \r\n\r\n let x = e.clientX - rect.left;\r\n if (x < 0) { x = 0}\r\n if (x > rect.width) { x = rect.width}\r\n x = x/rect.width360; \r\n\r\n const newColor = new ColorInfo();\r\n newColor.hue = x;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleComponentValueChange = (e, channel) => {\r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) { return }\r\n const newColor = new ColorInfo();\r\n if (value < 0) { value = 0; }\r\n if (value > 255) { value = 255; }\r\n let r = this.currentColor.red;\r\n let g = this.currentColor.green;\r\n let b = this.currentColor.blue;\r\n switch (channel) {\r\n case 'red':\r\n r = value;\r\n break;\r\n case 'green':\r\n g = value;\r\n break;\r\n case 'blue':\r\n b = value;\r\n break;\r\n default:\r\n break;\r\n }\r\n newColor.green = g;\r\n newColor.red = r;\r\n newColor.blue = b;\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHSLChange = (e, component) => { \r\n let value = parseInt(e.target.value);\r\n if (isNaN(value)) {return}\r\n const newColor = new ColorInfo();\r\n if (value != null) { \r\n let h = this.currentColor.hue;\r\n let s = this.currentColor.saturation;\r\n let l = this.currentColor.lightness;\r\n switch (component) {\r\n case \"hue\":\r\n if (value < 0) { value = 0}\r\n if (value > 359) { value = 0}\r\n h = value;\r\n break;\r\n case \"saturation\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n s = value / 100;\r\n break;\r\n case \"lightness\":\r\n if (value < 0) { value = 0}\r\n if (value > 100) { value = 100}\r\n l = value / 100;\r\n break; \r\n default:\r\n break; \r\n }\r\n newColor.hue = h;\r\n newColor.saturation = s;\r\n newColor.lightness = l;\r\n this.currentColor = newColor;\r\n }\r\n }\r\n\r\n private handleHexChange(value: string){\r\n const newColor = new ColorInfo();\r\n if (value.match(/^(?:[\\da-f]{3}\|[\\da-f]{6})$/i).length > 0) {\r\n if (value.length === 3){\r\n let expanded = value[0] + value[0] + value[1] + value[1] + value[2] + value [2];\r\n value = expanded;\r\n }\r\n newColor.red = parseInt(value.substr(0,2), 16);\r\n newColor.green = parseInt(value.substr(2,2), 16);\r\n newColor.blue = parseInt(value.substr(4,2), 16);\r\n }\r\n else{\r\n newColor.red = this.currentColor.red;\r\n newColor.green = this.currentColor.green;\r\n newColor.blue = this.currentColor.blue;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private switchColorMode(e) {\r\n switch(e.target.id) {\r\n case \"rgb-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"flex\";\r\n break;\r\n case \"hex-switch\":\r\n this.rgbDisplay = \"none\";\r\n this.hslDisplay = \"flex\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n case \"hsl-switch\":\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n break;\r\n default:\r\n this.rgbDisplay = \"flex\";\r\n this.hslDisplay = \"none\";\r\n this.hexDisplay = \"none\";\r\n }\r\n }\r\n\r\n private handleSaturationLightnessKeyDown = (e) => { \r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 0.01;\r\n if (e.shiftKey) { value = 0.1 ;}\r\n\r\n switch (e.key) {\r\n case \"ArrowUp\":\r\n newColor.lightness += value;\r\n break;\r\n case \"ArrowDown\":\r\n newColor.lightness -= value;\r\n break;\r\n case \"ArrowLeft\":\r\n newColor.saturation -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.saturation += value;\r\n default:\r\n break; \r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n private handleHueKeyDown = (e) => {\r\n let newColor = new ColorInfo();\r\n newColor.hue = this.currentColor.hue;\r\n newColor.saturation = this.currentColor.saturation;\r\n newColor.lightness = this.currentColor.lightness;\r\n\r\n let value = 1;\r\n if (e.shiftKey) { value = 10}\r\n\r\n switch (e.key) {\r\n case \"ArrowLeft\":\r\n newColor.hue -= value;\r\n break;\r\n case \"ArrowRight\":\r\n newColor.hue += value;\r\n default:\r\n break;\r\n }\r\n this.currentColor = newColor;\r\n }\r\n\r\n render() {\r\n const hue = this.currentColor.hue;\r\n const saturation = this.currentColor.saturation;\r\n const lightness = this.currentColor.lightness;\r\n const red = this.currentColor.red;\r\n const green = this.currentColor.green;\r\n const blue = this.currentColor.blue;\r\n\r\n return (\r\n <div class=\"dnn-color-picker\">\r\n <div class=\"dnn-color-sliders\">\r\n <div class=\"dnn-color-s-b\" ref={(element) => this.saturationLightnessBox = element as HTMLDivElement}\r\n style={{backgroundColor: `hsl(${hue},100%,50%)`}}\r\n onMouseDown={this.handleSaturationLightnessMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-s-b-picker\"\r\n aria-label=\"Press up or down to adjust lightness, left or right to adjust saturation, hold shift to move by 10%\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"100\"\r\n aria-valuetext={`Saturation: ${Math.round(this.currentColor.saturation100)}%, Lightness: ${Math.round(this.currentColor.lightness100)}%`}\r\n style={{\r\n left: Math.round(saturation * 100) + \"%\",\r\n bottom: Math.round(lightness * 100) + \"%\"\r\n }}\r\n onKeyDown={(e) => this.handleSaturationLightnessKeyDown(e)}\r\n />\r\n </div>\r\n <div class=\"dnn-color-bar\">\r\n <div class=\"dnn-color-result\" style={{\r\n backgroundColor: '#' + this.getHex(),\r\n boxShadow: \"0 0 2px 1px \" + \"#\" + this.getContrast()\r\n }} \r\n />\r\n <div class=\"dnn-color-hue\"\r\n ref={(element) => this.hueRange = element as HTMLDivElement}\r\n onMouseDown={this.handleHueMouseDown.bind(this)}\r\n >\r\n <button class=\"dnn-hue-picker\"\r\n aria-label=\"Press left or right to adjust hue, hold shift to move by 10 degrees\"\r\n role=\"slider\"\r\n aria-valuemin=\"0\"\r\n aria-valuemax=\"359\"\r\n aria-valuenow={Math.round(hue)}\r\n style={{left: (hue/359100).toString() + \"%\"}}\r\n onKeyDown={(e) => this.handleHueKeyDown(e)}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-fields\">\r\n <div class=\"dnn-rgb-color-fields\" style={{display: this.rgbDisplay}}>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>R</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" step=\"1\" class=\"red\" value={red} aria-label=\"red value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'red')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>G</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"green\" value={green} aria-label=\"green value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'green')}\r\n />\r\n </div>\r\n <div class=\"dnn-rgb-color-field\">\r\n <label>B</label>\r\n <input type=\"number\" min=\"0\" max=\"255\" class=\"blue\" value={blue} aria-label=\"blue value\"\r\n onChange={(e) => this.handleComponentValueChange(e, 'blue')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"rgb-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"switch to hexadecimal value entry\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hsl-color-fields\" style={{display: this.hslDisplay}}>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>H</label>\r\n <input type=\"number\" min=\"0\" max=\"359\" step={1} value={Math.round(hue)} aria-label=\"Hue\"\r\n onChange={(e) => this.handleHSLChange(e, 'hue')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>S</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(saturation100)} aria-label=\"Saturation\"\r\n onChange={(e) => this.handleHSLChange(e, 'saturation')}\r\n />\r\n </div>\r\n <div class=\"dnn-hsl-color-field\">\r\n <label>L</label>\r\n <input type=\"number\" min=\"0\" max=\"100\" step={1} value={Math.round(lightness*100)} aria-label=\"Lightness\"\r\n onChange={(e) => this.handleHSLChange(e, 'lightness')}\r\n />\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hsl-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to red, green, blue entry mode\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-hex-color-fields\" style={{display: this.hexDisplay}}>\r\n <div class=\"dnn-hex-color-field\">\r\n <label>HEX</label>\r\n <div class=\"hex-input\">\r\n <input type=\"text\" aria-label=\"Hexadecimal value\"\r\n value={this.getHex()}\r\n onChange={e => this.handleHexChange((e.target as HTMLInputElement).value)}\r\n />\r\n <button\r\n class=\"copy\"\r\n aria-label=\"copy value\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"dnn-color-mode-switch\">\r\n <button\r\n id=\"hex-switch\"\r\n onClick={this.switchColorMode.bind(this)}\r\n aria-label=\"Switch to hue saturation lightness values\"\r\n >\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z\"/></svg>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}"]}

package/dist/collection/components/dnn-color-picker/dnn-color-picker.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-color-picker.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-color-picker/dnn-color-picker.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,uBAAuB;EAC9B,SAAS,EAAE,kBAAkB;EAC7B,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,cAAc,CAAC;KAC5B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,OAAO,EAAE;MACL,OAAO,EAAE,MAAM;KAClB;IACD,gBAAgB,EAAE;MACd,OAAO,EAAE,MAAM;KAClB;GACA;CACA,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;oBAEY,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;+BACV,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;;KAExD,CAAC;AAEN,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;EACf,KAAK,EAAE,QAAQ;EACf,cAAc,EAAE,KAAK;CACxB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Color Picker',\n component: 'dnn-color-picker',\n parameters: {\n actions: {\n handles: ['colorChanged'],\n },\n notes: readme,\n },\n argTypes: {\n 'color': {\n control: 'text',\n },\n 'colorBoxHeight': {\n control: 'text',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-color-picker\n color=${ifDefined(args.color)}\n color-box-height=${ifDefined(args.colorBoxHeight)}>\n </dnn-color-picker>\n `;\n\nexport const ColorPicker = Template.bind({});\nColorPicker.args = {\n color: 'FFFFFF',\n colorBoxHeight: '50%',\n};\n"]}
1	+ {"version":3,"file":"dnn-color-picker.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-color-picker/dnn-color-picker.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,uBAAuB;EAC9B,SAAS,EAAE,kBAAkB;EAC7B,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,cAAc,CAAC;KAC5B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,OAAO,EAAE;MACL,OAAO,EAAE,MAAM;KAClB;IACD,gBAAgB,EAAE;MACd,OAAO,EAAE,MAAM;KAClB;GACA;CACA,CAAC;AAEV,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;oBAEY,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC;+BACV,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;;KAExD,CAAC;AAEN,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;EACf,KAAK,EAAE,QAAQ;EACf,cAAc,EAAE,KAAK;CACxB,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Color Picker',\n component: 'dnn-color-picker',\n parameters: {\n actions: {\n handles: ['colorChanged'],\n },\n notes: readme,\n },\n argTypes: {\n 'color': {\n control: 'text',\n },\n 'colorBoxHeight': {\n control: 'text',\n },\n },\n} as Meta;\n\nconst Template = (args) =>\n html`\n <dnn-color-picker\n color=${ifDefined(args.color)}\n color-box-height=${ifDefined(args.colorBoxHeight)}>\n </dnn-color-picker>\n `;\n\nexport const ColorPicker = Template.bind({});\nColorPicker.args = {\n color: 'FFFFFF',\n colorBoxHeight: '50%',\n};\n"]}

package/dist/collection/components/dnn-dropzone/dnn-dropzone.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-dropzone.js","sourceRoot":"","sources":["../../../../src/components/dnn-dropzone/dnn-dropzone.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n})\nexport class DnnDropzone {\n /** Localization strings /\n @Prop() resx:{\n dragAndDropFile: string;\n capture: string;\n or: string;\n takePicture: string;\n uploadFile: string;\n } = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n }\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jped\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n\n @State() takingPicture: boolean = false;\n \n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private videoSettings!: MediaTrackSettings;\n\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n let files = this.getFilesFromFileList(element.files);\n\n this.filesSelected.emit(files);\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: FileList): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1];\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n if (this.allowedExtensions != undefined && !this.allowedExtensions.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(files)){\n return;\n }\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={this.handleDragOver}\n onDrop={this.handleDrop}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n >\n {!this.takingPicture &&\n [\n <p>{this.resx?.dragAndDropFile}</p>\n ,\n <p>- {this.resx?.or} -</p>\n ,\n <label class=\"upload-file\">\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g></svg>\n </span>\n  \n {this.resx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.resx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.resx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.resx?.capture}\n </button>\n </div>\n }\n </Host>\n );\n }\n\n}\n"]}
1	+ {"version":3,"file":"dnn-dropzone.js","sourceRoot":"","sources":["../../../src/components/dnn-dropzone/dnn-dropzone.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAOrF,MAAM,OAAO,WAAW;EALxB;IAME,2BAA2B;IACnB,SAAI,GAMR;MACF,eAAe,EAAE,sBAAsB;MACvC,OAAO,EAAE,SAAS;MAClB,EAAE,EAAE,IAAI;MACR,WAAW,EAAE,gBAAgB;MAC7B,UAAU,EAAE,eAAe;KAC5B,CAAA;IAQD;;;OAGG;IACK,oBAAe,GAAY,KAAK,CAAC;IAEzC;;;;OAIG;IACK,mBAAc,GAAW,GAAG,CAAC;IAK5B,qBAAgB,GAAY,KAAK,CAAC;IAElC,kBAAa,GAAY,KAAK,CAAC;IAkDhC,mBAAc,GAAG,CAAC,KAAgB,EAAE,EAAE;MAE5C,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,KAAK,CAAC,cAAc,EAAE,CAAC;MACvB,KAAK,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;MACvC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC,CAAC;IAoBM,eAAU,GAAG,CAAC,SAAoB,EAAE,EAAE;MAC5C,SAAS,CAAC,eAAe,EAAE,CAAC;MAC5B,SAAS,CAAC,cAAc,EAAE,CAAC;MAC3B,MAAM,KAAK,GAAG,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC;MAE3C,IAAI,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAC;QACnC,OAAO;OACR;MACD,IAAI,QAAQ,GAAG,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;MAChD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACpC,CAAC,CAAC;GAwFH;EAtKC,gBAAgB;IACd,IAAI,IAAI,CAAC,eAAe,EAAC;MACvB,IAAI,CAAC,8BAA8B,EAAE;SACpC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,gBAAgB,GAAG,MAAM,CAAC,CAAC;KACjD;IACD,IAAI,IAAI,CAAC,iBAAiB,IAAI,SAAS,IAAI,IAAI,CAAC,iBAAiB,CAAC,MAAM,GAAG,CAAC,EAAC;MAC3E,IAAI,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;MAClE,IAAI,cAAc,GAAG,kBAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;MAClD,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,cAAc,CAAC;KACxC;EACH,CAAC;EAEO,8BAA8B;IACpC,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;MAC7B,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,CAAC;MAC5C,IAAI,YAAY,IAAI,SAAS,IAAI,YAAY,CAAC,gBAAgB,IAAI,SAAS,EAAE;QAC3E,OAAO,CAAC,KAAK,CAAC,CAAC;OAChB;MACD,YAAY,CAAC,gBAAgB,EAAE;SAC5B,IAAI,CAAC,OAAO,CAAC,EAAE;QACd,IAAI,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,YAAY,CAAC,CAAC;QACjE,OAAO,CAAC,MAAM,CAAC,CAAC;MAClB,CAAC,CAAC,CAAC;IACP,CAAC,CAAC,CAAC;EACL,CAAC;EAEO,oBAAoB,CAAC,KAAe;IAC1C,IAAI,QAAQ,GAAW,EAAE,CAAC;IAC1B,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;MACjD,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;MAC1B,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACrB;IAED,OAAO,QAAQ,CAAC;EAClB,CAAC;EAEO,kBAAkB,CAAC,OAAyB;IAClD,IAAI,KAAK,GAAG,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAErD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EACjC,CAAC;EAUO,oBAAoB,CAAC,KAAe;IAC1C,IAAI,UAAU,GAAG,KAAK,CAAC;IACvB,KAAK,IAAI,SAAS,GAAG,CAAC,EAAE,SAAS,GAAG,KAAK,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE;MAC7D,MAAM,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;MAC9B,IAAI,KAAK,GAAG,iBAAiB,CAAC;MAC9B,MAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;MAC/C,IAAI,aAAa,IAAI,SAAS,EAAC;QAC7B,UAAU,GAAG,IAAI,CAAC;OACnB;MAED,IAAI,IAAI,CAAC,iBAAiB,IAAI,SAAS,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAC;QACzF,UAAU,GAAG,IAAI,CAAC;OACnB;MAED,OAAO,UAAU,CAAC;KACnB;EACH,CAAC;EAcO,YAAY;IAClB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,YAAY,CAAC,YAAY,CAAC,EAAC,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAC,CAAC;OAC/D,IAAI,CAAC,MAAM,CAAC,EAAE;MACb,MAAM,CAAA;MACN,IAAI,CAAC,YAAY,CAAC,SAAS,GAAG,MAAM,CAAC;MACrC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE;SACvB,IAAI,CAAC,GAAG,EAAE;QACT,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;MAChE,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;OACD,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;EAChC,CAAC;EAEO,aAAa;IACnB,IAAI,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC9C,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC;IACxC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC;IAC1C,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAC3C,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;MACnB,IAAI,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,EAAE,YAAY,EAAE,EAAC,IAAI,EAAC,YAAY,EAAC,CAAC,CAAC;MAC/D,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;MAE3B,IAAI,QAAQ,GAAG,CAAC,IAAI,CAAC,CAAC;MACtB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IACnC,CAAC,EAAE,YAAY,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;EACxC,CAAC;EAED,MAAM;;IACJ,OAAO,CACL,EAAC,IAAI,IACH,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,EAC3B,KAAK,EAAC,UAAU,EAChB,UAAU,EAAE,IAAI,CAAC,cAAc,EAC/B,MAAM,EAAE,IAAI,CAAC,UAAU,EACvB,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC;MAE5D,CAAC,IAAI,CAAC,aAAa;QAClB;UACE,aAAI,MAAA,IAAI,CAAC,IAAI,0CAAE,eAAe,CAAK;UAEnC;kBAAM,MAAA,IAAI,CAAC,IAAI;eAAE,EAAE;iBAAO;UAE1B,aAAO,KAAK,EAAC,aAAa;YACxB,aACE,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,GAAG,EAAE,EAC9B,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAA0B,CAAC,GAE9D;YACR;cACE,WAAK,KAAK,EAAC,4BAA4B,uBAAmB,eAAe,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;gBAAC;kBAAG,YAAM,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,GAAE,CAAI;gBAAA;kBAAG,YAAM,CAAC,EAAC,+CAA+C,GAAE,CAAI,CAAM,CAC1P;sBAEN,MAAA,IAAI,CAAC,IAAI;eAAE,UAAU,CAChB;UAER,IAAI,CAAC,gBAAgB;YACnB;cACE;sBAAM,MAAA,IAAI,CAAC,IAAI;mBAAE,EAAE;qBAAO;cAE1B,cACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE;gBAElC,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;kBAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;kBAAA,cAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,KAAK,GAAE;kBAAA,YAAM,CAAC,EAAC,2JAA2J,GAAE,CAAM,EACtV,MAAA,IAAI,CAAC,IAAI;mBAAE,WAAW,CAChB;aACV;SACJ;MAEF,IAAI,CAAC,aAAa;QACjB,WAAK,KAAK,EAAC,eAAe;UACxB,aAAO,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,GAAI;UAC1C,cACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE;YAEnC,WAAK,KAAK,EAAC,4BAA4B,EAAC,MAAM,EAAC,MAAM,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,SAAS;cAAC,YAAM,CAAC,EAAC,eAAe,EAAC,IAAI,EAAC,MAAM,GAAE;cAAA,cAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,KAAK,GAAE;cAAA,YAAM,CAAC,EAAC,2JAA2J,GAAE,CAAM;sBACtV,MAAA,IAAI,CAAC,IAAI;eAAE,OAAO,CACZ,CACL,CAEH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n tag: 'dnn-dropzone',\n styleUrl: 'dnn-dropzone.scss',\n shadow: true,\n})\nexport class DnnDropzone {\n /** Localization strings /\n @Prop() resx:{\n dragAndDropFile: string;\n capture: string;\n or: string;\n takePicture: string;\n uploadFile: string;\n } = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n }\n\n /* A list of allowed file extensions.\n * If not specified, any file is allowed.\n * Ex: [\"jpg\", \"jped\", \"gif\", \"png\"]\n /\n @Prop() allowedExtensions: string[];\n\n /\n If true, will allow the user to take a snapshot\n * using the device camera. (only works over https).\n /\n @Prop() allowCameraMode: boolean = false;\n\n /\n Specifies the jpeg quality for when the device\n * camera is used to generate a picture.\n * Needs to be a number between 0 and 1 and defaults to 0.8\n /\n @Prop() captureQuality: number = 0.8;\n\n /* Fires when file were selected. */\n @Event() filesSelected: EventEmitter<File[]>;\n \n @State() canTakeSnapshots: boolean = false;\n\n @State() takingPicture: boolean = false;\n \n private dropzone: HTMLElement;\n private fileInput: HTMLInputElement;\n private videoPreview: HTMLVideoElement;\n private videoSettings!: MediaTrackSettings;\n\n\n componentDidLoad() {\n if (this.allowCameraMode){\n this.checkIfBrowserCanTakeSnapshots()\n .then(result => this.canTakeSnapshots = result);\n }\n if (this.allowedExtensions != undefined && this.allowedExtensions.length > 0){\n var extensionsWithDots = this.allowedExtensions.map(e => `.${e}`);\n var extensionsList = extensionsWithDots.join(\",\");\n this.fileInput.accept = extensionsList;\n }\n }\n\n private checkIfBrowserCanTakeSnapshots(): Promise<boolean> {\n return new Promise((resolve) => {\n const mediaDevices = navigator.mediaDevices;\n if (mediaDevices == undefined \|\| mediaDevices.enumerateDevices == undefined) {\n resolve(false);\n }\n mediaDevices.enumerateDevices()\n .then(devices => {\n var result = devices.some(device => device.kind == \"videoinput\");\n resolve(result);\n });\n });\n }\n\n private getFilesFromFileList(files: FileList) : File[] {\n var fileList: File[] = [];\n for (let index = 0; index < files.length; index++) {\n const file = files[index];\n fileList.push(file);\n }\n\n return fileList;\n }\n\n private handleUploadButton(element: HTMLInputElement): void {\n let files = this.getFilesFromFileList(element.files);\n\n this.filesSelected.emit(files);\n }\n\n private handleDragOver = (event: DragEvent) => \n {\n event.stopPropagation();\n event.preventDefault();\n event.dataTransfer.dropEffect = \"copy\";\n this.dropzone.classList.add(\"dropping\");\n };\n\n private hasInvalidExtensions(files: FileList): boolean{\n var hasInvalid = false;\n for (let fileIndex = 0; fileIndex < files.length; fileIndex++) {\n const file = files[fileIndex];\n var regex = /(?:\\.([^.]+))?$/;\n const fileExtension = regex.exec(file.name)[1];\n if (fileExtension == undefined){\n hasInvalid = true;\n }\n\n if (this.allowedExtensions != undefined && !this.allowedExtensions.includes(fileExtension)){\n hasInvalid = true;\n }\n\n return hasInvalid;\n }\n }\n\n private handleDrop = (dropEvent: DragEvent) => {\n dropEvent.stopPropagation();\n dropEvent.preventDefault();\n const files = dropEvent.dataTransfer.files;\n\n if (this.hasInvalidExtensions(files)){\n return;\n }\n var fileList = this.getFilesFromFileList(files);\n this.filesSelected.emit(fileList);\n };\n\n private takeSnapshot(): void {\n this.takingPicture = true;\n navigator.mediaDevices.getUserMedia({video: true, audio: false})\n .then(stream => {\n stream\n this.videoPreview.srcObject = stream;\n this.videoPreview.play()\n .then(() => {\n this.videoSettings = stream.getVideoTracks()[0].getSettings();\n });\n })\n .catch(error => alert(error));\n }\n\n private applySnapshot(): void {\n var canvas = document.createElement(\"canvas\");\n const context = canvas.getContext(\"2d\");\n canvas.width = this.videoSettings.width;\n canvas.height = this.videoSettings.height;\n context.drawImage(this.videoPreview, 0, 0);\n canvas.toBlob(blob => {\n var file = new File([blob], \"image.jpeg\", {type:\"image/jpeg\"});\n this.takingPicture = false;\n \n var fileList = [file];\n this.filesSelected.emit(fileList)\n }, \"image/jpeg\", this.captureQuality);\n }\n \n render() {\n return (\n <Host\n ref={e => this.dropzone = e}\n class=\"dropzone\"\n onDragOver={this.handleDragOver}\n onDrop={this.handleDrop}\n onDragLeave={() => this.dropzone.classList.remove(\"dropping\")}\n >\n {!this.takingPicture &&\n [\n <p>{this.resx?.dragAndDropFile}</p>\n ,\n <p>- {this.resx?.or} -</p>\n ,\n <label class=\"upload-file\">\n <input\n type=\"file\"\n ref={el => this.fileInput = el}\n onChange={e => this.handleUploadButton(e.target as HTMLInputElement)}\n >\n </input>\n <span>\n <svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><g><rect fill=\"none\" height=\"24\" width=\"24\"/></g><g><path d=\"M5,20h14v-2H5V20z M5,10h4v6h6v-6h4l-7-7L5,10z\"/></g></svg>\n </span>\n  \n {this.resx?.uploadFile}\n </label>\n ,\n this.canTakeSnapshots &&\n [\n <p>- {this.resx?.or} -</p>\n ,\n <button\n onClick={() => this.takeSnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg>\n {this.resx?.takePicture}\n </button>\n ]\n ]\n }\n {this.takingPicture &&\n <div class=\"video-preview\">\n <video ref={e => this.videoPreview = e} />\n <button\n onClick={() => this.applySnapshot()}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><circle cx=\"12\" cy=\"12\" r=\"3.2\"/><path d=\"M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z\"/></svg> \n {this.resx?.capture}\n </button>\n </div>\n }\n </Host>\n );\n }\n\n}\n"]}

package/dist/collection/components/dnn-dropzone/dnn-dropzone.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dnn-dropzone.stories.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-dropzone/dnn-dropzone.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,mBAAmB;EAC1B,SAAS,EAAE,cAAc;EACzB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,eAAe,CAAC;KAC7B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,mBAAmB,EAAE;MACjB,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,SAAS;KACnB;GACF;EACD,gBAAgB,EAAE;IACd,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAChE,OAAO,EAAE,QAAQ;GACpB;CACA,CAAC;AAEV,MAAM,IAAI,GAMN;EACA,eAAe,EAAE,sBAAsB;EACvC,OAAO,EAAE,SAAS;EAClB,EAAE,EAAE,IAAI;EACR,WAAW,EAAE,gBAAgB;EAC7B,UAAU,EAAE,eAAe;CAC9B,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;oBAEY,IAAI,CAAC,IAAI;iCACI,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC;iCACjC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;8BAChC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;;KAEvD,CAAC;AAEN,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACZ,iBAAiB,EAAE,kBAAkB;EACrC,eAAe,EAAE,KAAK;EACtB,cAAc,EAAE,GAAG;EACnB,IAAI;CACP,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Dropzone',\n component: 'dnn-dropzone',\n parameters: {\n actions: {\n handles: ['filesSelected'],\n },\n notes: readme,\n },\n argTypes: {\n 'allowedExtensions': {\n control: 'text',\n },\n 'allowCameraMode': {\n control: 'boolean',\n },\n },\n 'captureQuality': {\n options: [0.0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1.0],\n control: 'number',\n }\n} as Meta;\n\nconst resx:{\n dragAndDropFile: string;\n capture: string;\n or: string;\n takePicture: string;\n uploadFile: string;\n} = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n};\n\nconst Template = (args) =>\n html`\n <dnn-dropzone\n .resx=${args.resx}\n allowed-extensions=${ifDefined(args.allowedExtensions)}\n ?allow-camera-mode=${ifDefined(args.allCameraMode)}\n capture-quality=${ifDefined(args.captureQuality)}>\n </dnn-dropzone>\n `;\n\nexport const Dropzone = Template.bind({});\nDropzone.args = {\n allowedExtensions: 'jpg,jpeg,png,gif',\n allowCameraMode: false,\n captureQuality: 0.8,\n resx,\n};\n"]}
1	+ {"version":3,"file":"dnn-dropzone.stories.js","sourceRoot":"","sources":["../../../src/components/dnn-dropzone/dnn-dropzone.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,eAAe;EACX,KAAK,EAAE,mBAAmB;EAC1B,SAAS,EAAE,cAAc;EACzB,UAAU,EAAE;IACR,OAAO,EAAE;MACL,OAAO,EAAE,CAAC,eAAe,CAAC;KAC7B;IACD,KAAK,EAAG,MAAM;GACjB;EACD,QAAQ,EAAE;IACN,mBAAmB,EAAE;MACjB,OAAO,EAAE,MAAM;KAClB;IACD,iBAAiB,EAAE;MACf,OAAO,EAAE,SAAS;KACnB;GACF;EACD,gBAAgB,EAAE;IACd,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAChE,OAAO,EAAE,QAAQ;GACpB;CACA,CAAC;AAEV,MAAM,IAAI,GAMN;EACA,eAAe,EAAE,sBAAsB;EACvC,OAAO,EAAE,SAAS;EAClB,EAAE,EAAE,IAAI;EACR,WAAW,EAAE,gBAAgB;EAC7B,UAAU,EAAE,eAAe;CAC9B,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACtB,IAAI,CAAA;;oBAEY,IAAI,CAAC,IAAI;iCACI,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC;iCACjC,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;8BAChC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC;;KAEvD,CAAC;AAEN,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;EACZ,iBAAiB,EAAE,kBAAkB;EACrC,eAAe,EAAE,KAAK;EACtB,cAAc,EAAE,GAAG;EACnB,IAAI;CACP,CAAC","sourcesContent":["import { html } from \"lit-html\";\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { Meta } from \"@storybook/web-components\";\nimport readme from './readme.md';\n\nexport default {\n title: 'Elements/Dropzone',\n component: 'dnn-dropzone',\n parameters: {\n actions: {\n handles: ['filesSelected'],\n },\n notes: readme,\n },\n argTypes: {\n 'allowedExtensions': {\n control: 'text',\n },\n 'allowCameraMode': {\n control: 'boolean',\n },\n },\n 'captureQuality': {\n options: [0.0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1.0],\n control: 'number',\n }\n} as Meta;\n\nconst resx:{\n dragAndDropFile: string;\n capture: string;\n or: string;\n takePicture: string;\n uploadFile: string;\n} = {\n dragAndDropFile: \"Drag and drop a file\",\n capture: \"Capture\",\n or: \"or\",\n takePicture: \"Take a picture\",\n uploadFile: \"Upload a file\",\n};\n\nconst Template = (args) =>\n html`\n <dnn-dropzone\n .resx=${args.resx}\n allowed-extensions=${ifDefined(args.allowedExtensions)}\n ?allow-camera-mode=${ifDefined(args.allCameraMode)}\n capture-quality=${ifDefined(args.captureQuality)}>\n </dnn-dropzone>\n `;\n\nexport const Dropzone = Template.bind({});\nDropzone.args = {\n allowedExtensions: 'jpg,jpeg,png,gif',\n allowCameraMode: false,\n captureQuality: 0.8,\n resx,\n};\n"]}

package/dist/collection/components/dnn-image-cropper/CornerType.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CornerType.js","sourceRoot":"","sources":["~~../../../../~~src/components/dnn-image-cropper/CornerType.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,UAKX;AALD,WAAY,UAAU;EAClB,uCAAI,CAAA;EACJ,uCAAI,CAAA;EACJ,uCAAI,CAAA;EACJ,uCAAI,CAAA;AACR,CAAC,EALW,UAAU,KAAV,UAAU,QAKrB;AAAA,CAAC","sourcesContent":["export enum CornerType {\r\n \"nw\",\r\n \"ne\",\r\n \"se\",\r\n \"sw\",\r\n};"]}
1	+ {"version":3,"file":"CornerType.js","sourceRoot":"","sources":["../../../src/components/dnn-image-cropper/CornerType.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,UAKX;AALD,WAAY,UAAU;EAClB,uCAAI,CAAA;EACJ,uCAAI,CAAA;EACJ,uCAAI,CAAA;EACJ,uCAAI,CAAA;AACR,CAAC,EALW,UAAU,KAAV,UAAU,QAKrB;AAAA,CAAC","sourcesContent":["export enum CornerType {\r\n \"nw\",\r\n \"ne\",\r\n \"se\",\r\n \"sw\",\r\n};"]}