@getflip/swirl-components 0.3.0 → 0.4.0
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.
- package/dist/cjs/flip-action-list-item.cjs.entry.js +1 -1
- package/dist/cjs/flip-action-list-item.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-avatar-group.cjs.entry.js +11 -1
- package/dist/cjs/flip-avatar-group.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-avatar.cjs.entry.js +11 -1
- package/dist/cjs/flip-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-button-group.cjs.entry.js +9 -3
- package/dist/cjs/flip-button-group.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-button.cjs.entry.js +1 -1
- package/dist/cjs/flip-button.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/flip-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-date-picker_3.cjs.entry.js +20 -12
- package/dist/cjs/flip-date-picker_3.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-dialog.cjs.entry.js +1 -1
- package/dist/cjs/flip-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-file-uploader.cjs.entry.js +1 -1
- package/dist/cjs/flip-file-uploader.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-file-viewer-audio_6.cjs.entry.js +3 -3
- package/dist/cjs/flip-file-viewer-audio_6.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-file-viewer.cjs.entry.js +2 -1
- package/dist/cjs/flip-file-viewer.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-form-group.cjs.entry.js +1 -1
- package/dist/cjs/flip-form-group.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-icon-arrow-left_3.cjs.entry.js +50 -0
- package/dist/cjs/flip-icon-arrow-left_3.cjs.entry.js.map +1 -0
- package/dist/cjs/flip-lightbox.cjs.entry.js +205 -0
- package/dist/cjs/flip-lightbox.cjs.entry.js.map +1 -0
- package/dist/cjs/flip-modal.cjs.entry.js +14 -2
- package/dist/cjs/flip-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/flip-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-radio.cjs.entry.js +1 -1
- package/dist/cjs/flip-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-tabs.cjs.entry.js +3 -40
- package/dist/cjs/flip-tabs.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-text-input.cjs.entry.js +1 -1
- package/dist/cjs/flip-text-input.cjs.entry.js.map +1 -1
- package/dist/cjs/flip-toast.cjs.entry.js +1 -1
- package/dist/cjs/flip-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/swirl-components.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/flip-action-list-item/flip-action-list-item.css +4 -0
- package/dist/collection/components/flip-avatar/flip-avatar.js +11 -1
- package/dist/collection/components/flip-avatar/flip-avatar.js.map +1 -1
- package/dist/collection/components/flip-avatar-group/flip-avatar-group.js +11 -1
- package/dist/collection/components/flip-avatar-group/flip-avatar-group.js.map +1 -1
- package/dist/collection/components/flip-button/flip-button.css +10 -2
- package/dist/collection/components/flip-button-group/flip-button-group.css +57 -0
- package/dist/collection/components/flip-button-group/flip-button-group.js +27 -5
- package/dist/collection/components/flip-button-group/flip-button-group.js.map +1 -1
- package/dist/collection/components/flip-button-group/flip-button-group.stories.js +8 -2
- package/dist/collection/components/flip-button-group/flip-button-group.stories.js.map +1 -1
- package/dist/collection/components/flip-checkbox/flip-checkbox.css +1 -1
- package/dist/collection/components/flip-date-picker/flip-date-picker.css +0 -1
- package/dist/collection/components/flip-dialog/flip-dialog.css +1 -1
- package/dist/collection/components/flip-file-uploader/flip-file-uploader.css +3 -1
- package/dist/collection/components/flip-file-viewer/flip-file-viewer.js +20 -1
- package/dist/collection/components/flip-file-viewer/flip-file-viewer.js.map +1 -1
- package/dist/collection/components/flip-file-viewer/viewers/flip-file-viewer-csv/flip-file-viewer-csv.css +2 -0
- package/dist/collection/components/flip-file-viewer/viewers/flip-file-viewer-text/flip-file-viewer-text.css +2 -0
- package/dist/collection/components/flip-file-viewer/viewers/flip-file-viewer-video/flip-file-viewer-video.css +2 -2
- package/dist/collection/components/flip-form-group/flip-form-group.css +6 -2
- package/dist/collection/components/flip-lightbox/flip-lightbox.css +208 -0
- package/dist/collection/components/flip-lightbox/flip-lightbox.js +375 -0
- package/dist/collection/components/flip-lightbox/flip-lightbox.js.map +1 -0
- package/dist/collection/components/flip-lightbox/flip-lightbox.stories.js +44 -0
- package/dist/collection/components/flip-lightbox/flip-lightbox.stories.js.map +1 -0
- package/dist/collection/components/flip-modal/flip-modal.css +14 -3
- package/dist/collection/components/flip-modal/flip-modal.js +16 -2
- package/dist/collection/components/flip-modal/flip-modal.js.map +1 -1
- package/dist/collection/components/flip-popover/flip-popover.css +1 -1
- package/dist/collection/components/flip-popover/flip-popover.js +18 -10
- package/dist/collection/components/flip-popover/flip-popover.js.map +1 -1
- package/dist/collection/components/flip-radio/flip-radio.css +1 -1
- package/dist/collection/components/flip-radio-group/flip-radio-group.css +1 -1
- package/dist/collection/components/flip-tabs/flip-tabs.css +25 -36
- package/dist/collection/components/flip-tabs/flip-tabs.js +12 -59
- package/dist/collection/components/flip-tabs/flip-tabs.js.map +1 -1
- package/dist/collection/components/flip-text-input/flip-text-input.css +2 -0
- package/dist/collection/components/flip-toast/flip-toast.css +1 -1
- package/dist/components/flip-action-list-item.js +1 -1
- package/dist/components/flip-action-list-item.js.map +1 -1
- package/dist/components/flip-avatar-group.js +11 -1
- package/dist/components/flip-avatar-group.js.map +1 -1
- package/dist/components/flip-avatar.js +11 -1
- package/dist/components/flip-avatar.js.map +1 -1
- package/dist/components/flip-button-group2.js +9 -3
- package/dist/components/flip-button-group2.js.map +1 -1
- package/dist/components/flip-button2.js +1 -1
- package/dist/components/flip-button2.js.map +1 -1
- package/dist/components/flip-checkbox.js +1 -1
- package/dist/components/flip-checkbox.js.map +1 -1
- package/dist/components/flip-date-picker2.js +1 -1
- package/dist/components/flip-date-picker2.js.map +1 -1
- package/dist/components/flip-dialog.js +1 -1
- package/dist/components/flip-dialog.js.map +1 -1
- package/dist/components/flip-file-uploader.js +1 -1
- package/dist/components/flip-file-uploader.js.map +1 -1
- package/dist/components/flip-file-viewer-csv2.js +1 -1
- package/dist/components/flip-file-viewer-csv2.js.map +1 -1
- package/dist/components/flip-file-viewer-text2.js +1 -1
- package/dist/components/flip-file-viewer-text2.js.map +1 -1
- package/dist/components/flip-file-viewer-video2.js +1 -1
- package/dist/components/flip-file-viewer-video2.js.map +1 -1
- package/dist/components/flip-file-viewer.js +3 -1
- package/dist/components/flip-file-viewer.js.map +1 -1
- package/dist/components/flip-form-group.js +1 -1
- package/dist/components/flip-form-group.js.map +1 -1
- package/dist/components/flip-icon-arrow-left.js +1 -32
- package/dist/components/flip-icon-arrow-left.js.map +1 -1
- package/dist/{esm/flip-icon-arrow-left.entry.js → components/flip-icon-arrow-left2.js} +26 -8
- package/dist/components/flip-icon-arrow-left2.js.map +1 -0
- package/dist/components/flip-icon-arrow-right.js +1 -32
- package/dist/components/flip-icon-arrow-right.js.map +1 -1
- package/dist/{esm/flip-icon-arrow-right.entry.js → components/flip-icon-arrow-right2.js} +26 -8
- package/dist/components/flip-icon-arrow-right2.js.map +1 -0
- package/dist/components/flip-icon-download.js +1 -32
- package/dist/components/flip-icon-download.js.map +1 -1
- package/dist/{esm/flip-icon-download.entry.js → components/flip-icon-download2.js} +26 -8
- package/dist/components/flip-icon-download2.js.map +1 -0
- package/dist/components/flip-lightbox.d.ts +11 -0
- package/dist/components/flip-lightbox.js +255 -0
- package/dist/components/flip-lightbox.js.map +1 -0
- package/dist/components/flip-modal.js +16 -2
- package/dist/components/flip-modal.js.map +1 -1
- package/dist/components/flip-popover2.js +19 -11
- package/dist/components/flip-popover2.js.map +1 -1
- package/dist/components/flip-radio-group.js +1 -1
- package/dist/components/flip-radio-group.js.map +1 -1
- package/dist/components/flip-radio.js +1 -1
- package/dist/components/flip-radio.js.map +1 -1
- package/dist/components/flip-tabs.js +4 -42
- package/dist/components/flip-tabs.js.map +1 -1
- package/dist/components/flip-text-input.js +1 -1
- package/dist/components/flip-text-input.js.map +1 -1
- package/dist/components/flip-toast2.js +1 -1
- package/dist/components/flip-toast2.js.map +1 -1
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +1 -0
- package/dist/components/index.js.map +1 -1
- package/dist/esm/flip-action-list-item.entry.js +1 -1
- package/dist/esm/flip-action-list-item.entry.js.map +1 -1
- package/dist/esm/flip-avatar-group.entry.js +11 -1
- package/dist/esm/flip-avatar-group.entry.js.map +1 -1
- package/dist/esm/flip-avatar.entry.js +11 -1
- package/dist/esm/flip-avatar.entry.js.map +1 -1
- package/dist/esm/flip-button-group.entry.js +9 -3
- package/dist/esm/flip-button-group.entry.js.map +1 -1
- package/dist/esm/flip-button.entry.js +1 -1
- package/dist/esm/flip-button.entry.js.map +1 -1
- package/dist/esm/flip-checkbox.entry.js +1 -1
- package/dist/esm/flip-checkbox.entry.js.map +1 -1
- package/dist/esm/flip-date-picker_3.entry.js +20 -12
- package/dist/esm/flip-date-picker_3.entry.js.map +1 -1
- package/dist/esm/flip-dialog.entry.js +1 -1
- package/dist/esm/flip-dialog.entry.js.map +1 -1
- package/dist/esm/flip-file-uploader.entry.js +1 -1
- package/dist/esm/flip-file-uploader.entry.js.map +1 -1
- package/dist/esm/flip-file-viewer-audio_6.entry.js +3 -3
- package/dist/esm/flip-file-viewer-audio_6.entry.js.map +1 -1
- package/dist/esm/flip-file-viewer.entry.js +2 -1
- package/dist/esm/flip-file-viewer.entry.js.map +1 -1
- package/dist/esm/flip-form-group.entry.js +1 -1
- package/dist/esm/flip-form-group.entry.js.map +1 -1
- package/dist/esm/flip-icon-arrow-left_3.entry.js +44 -0
- package/dist/esm/flip-icon-arrow-left_3.entry.js.map +1 -0
- package/dist/esm/flip-lightbox.entry.js +201 -0
- package/dist/esm/flip-lightbox.entry.js.map +1 -0
- package/dist/esm/flip-modal.entry.js +14 -2
- package/dist/esm/flip-modal.entry.js.map +1 -1
- package/dist/esm/flip-radio-group.entry.js +1 -1
- package/dist/esm/flip-radio-group.entry.js.map +1 -1
- package/dist/esm/flip-radio.entry.js +1 -1
- package/dist/esm/flip-radio.entry.js.map +1 -1
- package/dist/esm/flip-tabs.entry.js +3 -40
- package/dist/esm/flip-tabs.entry.js.map +1 -1
- package/dist/esm/flip-text-input.entry.js +1 -1
- package/dist/esm/flip-text-input.entry.js.map +1 -1
- package/dist/esm/flip-toast.entry.js +1 -1
- package/dist/esm/flip-toast.entry.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/swirl-components.js +1 -1
- package/dist/swirl-components/p-013a1742.entry.js +2 -0
- package/dist/swirl-components/p-013a1742.entry.js.map +1 -0
- package/dist/swirl-components/{p-c8db8af8.entry.js → p-04eefcca.entry.js} +2 -2
- package/dist/swirl-components/p-04eefcca.entry.js.map +1 -0
- package/dist/swirl-components/p-1ff7b440.entry.js +2 -0
- package/dist/swirl-components/p-1ff7b440.entry.js.map +1 -0
- package/dist/swirl-components/p-3147334a.entry.js +2 -0
- package/dist/swirl-components/p-3147334a.entry.js.map +1 -0
- package/dist/swirl-components/p-5022e258.entry.js +2 -0
- package/dist/swirl-components/p-5022e258.entry.js.map +1 -0
- package/dist/swirl-components/p-6ddd889e.entry.js +2 -0
- package/dist/swirl-components/p-6ddd889e.entry.js.map +1 -0
- package/dist/swirl-components/p-6febfe15.entry.js +2 -0
- package/dist/swirl-components/p-6febfe15.entry.js.map +1 -0
- package/dist/swirl-components/p-8784a282.entry.js +2 -0
- package/dist/swirl-components/p-8784a282.entry.js.map +1 -0
- package/dist/swirl-components/p-8faa2889.entry.js +2 -0
- package/dist/swirl-components/p-8faa2889.entry.js.map +1 -0
- package/dist/swirl-components/p-95c9ef17.entry.js +2 -0
- package/dist/swirl-components/p-95c9ef17.entry.js.map +1 -0
- package/dist/swirl-components/p-a15a28d3.entry.js +2 -0
- package/dist/swirl-components/p-a15a28d3.entry.js.map +1 -0
- package/dist/swirl-components/p-a178d901.entry.js +2 -0
- package/dist/swirl-components/p-a178d901.entry.js.map +1 -0
- package/dist/swirl-components/p-ad92140f.entry.js +2 -0
- package/dist/swirl-components/p-ad92140f.entry.js.map +1 -0
- package/dist/swirl-components/p-b1532bdb.entry.js +2 -0
- package/dist/swirl-components/p-b1532bdb.entry.js.map +1 -0
- package/dist/swirl-components/{p-c4c5a7ca.entry.js → p-bb9a65d7.entry.js} +3 -3
- package/dist/swirl-components/p-bb9a65d7.entry.js.map +1 -0
- package/dist/swirl-components/{p-7c20748f.entry.js → p-d6bb9690.entry.js} +2 -2
- package/dist/swirl-components/{p-7c20748f.entry.js.map → p-d6bb9690.entry.js.map} +1 -1
- package/dist/swirl-components/p-d9dfcd01.entry.js +2 -0
- package/dist/swirl-components/p-d9dfcd01.entry.js.map +1 -0
- package/dist/swirl-components/{p-06a08b17.entry.js → p-e34707fb.entry.js} +2 -2
- package/dist/swirl-components/{p-06a08b17.entry.js.map → p-e34707fb.entry.js.map} +1 -1
- package/dist/swirl-components/{p-692cb3d7.entry.js → p-f6a8ea5d.entry.js} +2 -2
- package/dist/swirl-components/p-f6a8ea5d.entry.js.map +1 -0
- package/dist/swirl-components/p-f94fc675.entry.js +2 -0
- package/dist/swirl-components/p-f94fc675.entry.js.map +1 -0
- package/dist/swirl-components/swirl-components.css +1 -1
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/swirl-components/swirl-components.esm.js.map +1 -1
- package/dist/types/components/flip-avatar/flip-avatar.d.ts +3 -0
- package/dist/types/components/flip-avatar-group/flip-avatar-group.d.ts +3 -0
- package/dist/types/components/flip-button-group/flip-button-group.d.ts +4 -3
- package/dist/types/components/flip-button-group/flip-button-group.stories.d.ts +5 -0
- package/dist/types/components/flip-file-viewer/flip-file-viewer.d.ts +1 -0
- package/dist/types/components/flip-lightbox/flip-lightbox.d.ts +49 -0
- package/dist/types/components/flip-lightbox/flip-lightbox.stories.d.ts +16 -0
- package/dist/types/components/flip-modal/flip-modal.d.ts +2 -0
- package/dist/types/components/flip-popover/flip-popover.d.ts +2 -0
- package/dist/types/components/flip-tabs/flip-tabs.d.ts +0 -7
- package/dist/types/components.d.ts +43 -3
- package/package.json +1 -1
- package/vscode-data.json +37 -0
- package/dist/cjs/flip-icon-arrow-left.cjs.entry.js +0 -22
- package/dist/cjs/flip-icon-arrow-left.cjs.entry.js.map +0 -1
- package/dist/cjs/flip-icon-arrow-right.cjs.entry.js +0 -22
- package/dist/cjs/flip-icon-arrow-right.cjs.entry.js.map +0 -1
- package/dist/cjs/flip-icon-download.cjs.entry.js +0 -22
- package/dist/cjs/flip-icon-download.cjs.entry.js.map +0 -1
- package/dist/esm/flip-icon-arrow-left.entry.js.map +0 -1
- package/dist/esm/flip-icon-arrow-right.entry.js.map +0 -1
- package/dist/esm/flip-icon-download.entry.js.map +0 -1
- package/dist/swirl-components/p-273b12eb.entry.js +0 -2
- package/dist/swirl-components/p-273b12eb.entry.js.map +0 -1
- package/dist/swirl-components/p-4aafa158.entry.js +0 -2
- package/dist/swirl-components/p-4aafa158.entry.js.map +0 -1
- package/dist/swirl-components/p-529bace4.entry.js +0 -2
- package/dist/swirl-components/p-529bace4.entry.js.map +0 -1
- package/dist/swirl-components/p-692cb3d7.entry.js.map +0 -1
- package/dist/swirl-components/p-91ccf392.entry.js +0 -2
- package/dist/swirl-components/p-91ccf392.entry.js.map +0 -1
- package/dist/swirl-components/p-91cd33f9.entry.js +0 -2
- package/dist/swirl-components/p-91cd33f9.entry.js.map +0 -1
- package/dist/swirl-components/p-9ffa5f69.entry.js +0 -2
- package/dist/swirl-components/p-9ffa5f69.entry.js.map +0 -1
- package/dist/swirl-components/p-b65aec9d.entry.js +0 -2
- package/dist/swirl-components/p-b65aec9d.entry.js.map +0 -1
- package/dist/swirl-components/p-bada1dda.entry.js +0 -2
- package/dist/swirl-components/p-bada1dda.entry.js.map +0 -1
- package/dist/swirl-components/p-bc94ecde.entry.js +0 -2
- package/dist/swirl-components/p-bc94ecde.entry.js.map +0 -1
- package/dist/swirl-components/p-c4c5a7ca.entry.js.map +0 -1
- package/dist/swirl-components/p-c8db8af8.entry.js.map +0 -1
- package/dist/swirl-components/p-c9f5b33a.entry.js +0 -2
- package/dist/swirl-components/p-c9f5b33a.entry.js.map +0 -1
- package/dist/swirl-components/p-d9b3b617.entry.js +0 -2
- package/dist/swirl-components/p-d9b3b617.entry.js.map +0 -1
- package/dist/swirl-components/p-df639805.entry.js +0 -2
- package/dist/swirl-components/p-df639805.entry.js.map +0 -1
- package/dist/swirl-components/p-dfd81ceb.entry.js +0 -2
- package/dist/swirl-components/p-dfd81ceb.entry.js.map +0 -1
- package/dist/swirl-components/p-e1debe08.entry.js +0 -2
- package/dist/swirl-components/p-e1debe08.entry.js.map +0 -1
- package/dist/swirl-components/p-f9c75666.entry.js +0 -2
- package/dist/swirl-components/p-f9c75666.entry.js.map +0 -1
- package/dist/swirl-components/p-fefffb34.entry.js +0 -2
- package/dist/swirl-components/p-fefffb34.entry.js.map +0 -1
|
@@ -13,7 +13,7 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
return bootstrapLazy(JSON.parse("[[\"flip-file-viewer\",[[1,\"flip-file-viewer\",{\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"type\":[1],\"typeUnsupportedMessage\":[1,\"type-unsupported-message\"],\"zoom\":[8],\"download\":[64],\"print\":[64]}]]],[\"flip-resource-list-file-item\",[[1,\"flip-resource-list-file-item\",{\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"icon\":[1],\"label\":[1],\"loading\":[4],\"removable\":[4],\"removeButtonLabel\":[1,\"remove-button-label\"]}]]],[\"flip-text-input\",[[2,\"flip-text-input\",{\"autoComplete\":[1,\"auto-complete\"],\"autoFocus\":[4,\"auto-focus\"],\"autoSelect\":[4,\"auto-select\"],\"clearable\":[4],\"clearButtonLabel\":[1,\"clear-button-label\"],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"invalid\":[4],\"maxLength\":[2,\"max-length\"],\"max\":[2],\"min\":[2],\"mode\":[1],\"prefixLabel\":[1,\"prefix-label\"],\"required\":[4],\"rows\":[2],\"showCharacterCounter\":[4,\"show-character-counter\"],\"spellCheck\":[4,\"spell-check\"],\"suffixLabel\":[1,\"suffix-label\"],\"step\":[2],\"passwordToggleLabel\":[1,\"password-toggle-label\"],\"type\":[1],\"value\":[1537],\"showPassword\":[32]}]]],[\"flip-modal\",[[1,\"flip-modal\",{\"closeButtonLabel\":[1,\"close-button-label\"],\"label\":[1],\"primaryActionLabel\":[1,\"primary-action-label\"],\"secondaryActionLabel\":[1,\"secondary-action-label\"],\"closing\":[32],\"scrolled\":[32],\"open\":[64],\"close\":[64]},[[9,\"resize\",\"onWindowResize\"]]]]],[\"flip-date-input\",[[2,\"flip-date-input\",{\"autoFocus\":[4,\"auto-focus\"],\"autoSelect\":[4,\"auto-select\"],\"datePickerLabel\":[1,\"date-picker-label\"],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"format\":[1],\"invalid\":[4],\"locale\":[16],\"placeholder\":[1],\"required\":[4],\"value\":[1537]}]]],[\"flip-dialog\",[[1,\"flip-dialog\",{\"hideLabel\":[4,\"hide-label\"],\"intent\":[1],\"label\":[1],\"primaryActionLabel\":[1,\"primary-action-label\"],\"secondaryActionLabel\":[1,\"secondary-action-label\"],\"closing\":[32],\"open\":[64],\"close\":[64]}]]],[\"flip-pagination\",[[1,\"flip-pagination\",{\"accessibleNextButtonLabel\":[1,\"accessible-next-button-label\"],\"accessiblePrevButtonLabel\":[1,\"accessible-prev-button-label\"],\"nextButtonLabel\":[1,\"next-button-label\"],\"pageLabel\":[1,\"page-label\"],\"prevButtonLabel\":[1,\"prev-button-label\"],\"label\":[1],\"page\":[2],\"pages\":[2],\"pageSelectLabel\":[1,\"page-select-label\"],\"variant\":[1]}]]],[\"flip-toast-provider\",[[1,\"flip-toast-provider\",{\"globalDuration\":[2,\"global-duration\"],\"toasts\":[32],\"clearAll\":[64],\"dismiss\":[64],\"toast\":[64]}]]],[\"flip-checkbox\",[[2,\"flip-checkbox\",{\"checked\":[1032],\"description\":[1],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"invalid\":[4],\"label\":[1],\"value\":[1]}]]],[\"flip-empty-state\",[[1,\"flip-empty-state\",{\"heading\":[1],\"illustration\":[1]}]]],[\"flip-file-uploader\",[[2,\"flip-file-uploader\",{\"accept\":[1],\"ctaLabel\":[1,\"cta-label\"],\"description\":[1],\"disabled\":[4],\"dragDropLabel\":[1,\"drag-drop-label\"],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"label\":[1],\"multiple\":[4],\"showDropzone\":[4,\"show-dropzone\"],\"uploadButtonLabel\":[1,\"upload-button-label\"],\"reset\":[64]}]]],[\"flip-form-control\",[[6,\"flip-form-control\",{\"description\":[1],\"disabled\":[4],\"errorMessage\":[1,\"error-message\"],\"invalid\":[4],\"label\":[1],\"hasFocus\":[32],\"inputValue\":[32]},[[8,\"click\",\"onWindowClick\"]]]]],[\"flip-option-list-item\",[[1,\"flip-option-list-item\",{\"context\":[1025],\"disabled\":[4],\"icon\":[1],\"label\":[1],\"selected\":[1028],\"value\":[1]}]]],[\"flip-resource-list-item\",[[1,\"flip-resource-list-item\",{\"checked\":[1028],\"description\":[1],\"disabled\":[4],\"hideDivider\":[4,\"hide-divider\"],\"href\":[1],\"label\":[1],\"media\":[1],\"menuTriggerId\":[1,\"menu-trigger-id\"],\"menuTriggerLabel\":[1,\"menu-trigger-label\"],\"meta\":[1],\"selectable\":[4],\"value\":[1]}]]],[\"flip-search\",[[2,\"flip-search\",{\"autoFocus\":[4,\"auto-focus\"],\"clearButtonLabel\":[1,\"clear-button-label\"],\"disabled\":[4],\"inputName\":[1,\"input-name\"],\"inputId\":[1,\"input-id\"],\"label\":[1],\"placeholder\":[1],\"value\":[1025]},[[8,\"keydown\",\"onKeyDown\"]]]]],[\"flip-avatar\",[[1,\"flip-avatar\",{\"badge\":[1],\"badgePosition\":[1,\"badge-position\"],\"icon\":[1],\"initials\":[1],\"interactive\":[4],\"label\":[1],\"showLabel\":[4,\"show-label\"],\"size\":[1],\"src\":[1],\"variant\":[1],\"imageAvailable\":[32]}]]],[\"flip-banner\",[[1,\"flip-banner\",{\"actionLabel\":[1,\"action-label\"],\"content\":[1],\"dismissable\":[4],\"dismissLabel\":[1,\"dismiss-label\"],\"importance\":[1],\"intent\":[1],\"showIcon\":[4,\"show-icon\"]}]]],[\"flip-radio\",[[2,\"flip-radio\",{\"checked\":[1032],\"description\":[1],\"disabled\":[4],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"invalid\":[4],\"label\":[1],\"value\":[1]}]]],[\"flip-resource-list\",[[1,\"flip-resource-list\",{\"label\":[1]}]]],[\"flip-switch\",[[2,\"flip-switch\",{\"checked\":[1028],\"disabled\":[4],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"label\":[1],\"size\":[1],\"value\":[1]},[[9,\"pointerup\",\"onWindowPointerUp\"]]]]],[\"flip-tag\",[[1,\"flip-tag\",{\"intent\":[1],\"label\":[1],\"removable\":[4],\"removalButtonLabel\":[1,\"removal-button-label\"]}]]],[\"flip-video-thumbnail\",[[1,\"flip-video-thumbnail\",{\"durationLabel\":[1,\"duration-label\"],\"duration\":[1],\"label\":[1],\"src\":[1]}]]],[\"flip-action-list\",[[1,\"flip-action-list\"]]],[\"flip-action-list-item\",[[1,\"flip-action-list-item\",{\"disabled\":[4],\"description\":[1],\"icon\":[1],\"intent\":[1],\"label\":[1],\"size\":[1],\"suffix\":[1]}]]],[\"flip-action-list-section\",[[1,\"flip-action-list-section\",{\"label\":[1]}]]],[\"flip-avatar-group\",[[1,\"flip-avatar-group\",{\"badge\":[1]}]]],[\"flip-badge\",[[1,\"flip-badge\",{\"icon\":[1],\"intent\":[1],\"label\":[1],\"size\":[1],\"variant\":[1]}]]],[\"flip-chip\",[[1,\"flip-chip\",{\"avatar\":[1],\"icon\":[1],\"intent\":[1],\"interactive\":[4],\"label\":[1]}]]],[\"flip-description-list\",[[1,\"flip-description-list\"]]],[\"flip-description-list-item\",[[1,\"flip-description-list-item\",{\"term\":[1]}]]],[\"flip-form-group\",[[6,\"flip-form-group\",{\"orientation\":[1]}]]],[\"flip-icon-add\",[[1,\"flip-icon-add\",{\"size\":[2]}]]],[\"flip-icon-add-photo\",[[1,\"flip-icon-add-photo\",{\"size\":[2]}]]],[\"flip-icon-admin-panel-settings\",[[1,\"flip-icon-admin-panel-settings\",{\"size\":[2]}]]],[\"flip-icon-arrow-back\",[[1,\"flip-icon-arrow-back\",{\"size\":[2]}]]],[\"flip-icon-arrow-forward\",[[1,\"flip-icon-arrow-forward\",{\"size\":[2]}]]],[\"flip-icon-arrow-left\",[[1,\"flip-icon-arrow-left\",{\"size\":[2]}]]],[\"flip-icon-arrow-right\",[[1,\"flip-icon-arrow-right\",{\"size\":[2]}]]],[\"flip-icon-arrow-right-small\",[[1,\"flip-icon-arrow-right-small\",{\"size\":[2]}]]],[\"flip-icon-attachment\",[[1,\"flip-icon-attachment\",{\"size\":[2]}]]],[\"flip-icon-chat-bubble\",[[1,\"flip-icon-chat-bubble\",{\"size\":[2]}]]],[\"flip-icon-check\",[[1,\"flip-icon-check\",{\"size\":[2]}]]],[\"flip-icon-check-circle\",[[1,\"flip-icon-check-circle\",{\"size\":[2]}]]],[\"flip-icon-chevron-left\",[[1,\"flip-icon-chevron-left\",{\"size\":[2]}]]],[\"flip-icon-chevron-right\",[[1,\"flip-icon-chevron-right\",{\"size\":[2]}]]],[\"flip-icon-close-small\",[[1,\"flip-icon-close-small\",{\"size\":[2]}]]],[\"flip-icon-comment\",[[1,\"flip-icon-comment\",{\"size\":[2]}]]],[\"flip-icon-copy\",[[1,\"flip-icon-copy\",{\"size\":[2]}]]],[\"flip-icon-date-range\",[[1,\"flip-icon-date-range\",{\"size\":[2]}]]],[\"flip-icon-delete\",[[1,\"flip-icon-delete\",{\"size\":[2]}]]],[\"flip-icon-description\",[[1,\"flip-icon-description\",{\"size\":[2]}]]],[\"flip-icon-download\",[[1,\"flip-icon-download\",{\"size\":[2]}]]],[\"flip-icon-edit\",[[1,\"flip-icon-edit\",{\"size\":[2]}]]],[\"flip-icon-emoji-mood\",[[1,\"flip-icon-emoji-mood\",{\"size\":[2]}]]],[\"flip-icon-emoji-satisfied\",[[1,\"flip-icon-emoji-satisfied\",{\"size\":[2]}]]],[\"flip-icon-file\",[[1,\"flip-icon-file\",{\"size\":[2]}]]],[\"flip-icon-folder-shared\",[[1,\"flip-icon-folder-shared\",{\"size\":[2]}]]],[\"flip-icon-fullscreen\",[[1,\"flip-icon-fullscreen\",{\"size\":[2]}]]],[\"flip-icon-fullscreen-exit\",[[1,\"flip-icon-fullscreen-exit\",{\"size\":[2]}]]],[\"flip-icon-group-assign\",[[1,\"flip-icon-group-assign\",{\"size\":[2]}]]],[\"flip-icon-groups\",[[1,\"flip-icon-groups\",{\"size\":[2]}]]],[\"flip-icon-groups-custom\",[[1,\"flip-icon-groups-custom\",{\"size\":[2]}]]],[\"flip-icon-image\",[[1,\"flip-icon-image\",{\"size\":[2]}]]],[\"flip-icon-info\",[[1,\"flip-icon-info\",{\"size\":[2]}]]],[\"flip-icon-inventory\",[[1,\"flip-icon-inventory\",{\"size\":[2]}]]],[\"flip-icon-like\",[[1,\"flip-icon-like\",{\"size\":[2]}]]],[\"flip-icon-link\",[[1,\"flip-icon-link\",{\"size\":[2]}]]],[\"flip-icon-lock\",[[1,\"flip-icon-lock\",{\"size\":[2]}]]],[\"flip-icon-logout\",[[1,\"flip-icon-logout\",{\"size\":[2]}]]],[\"flip-icon-mail\",[[1,\"flip-icon-mail\",{\"size\":[2]}]]],[\"flip-icon-manage-accounts\",[[1,\"flip-icon-manage-accounts\",{\"size\":[2]}]]],[\"flip-icon-mention\",[[1,\"flip-icon-mention\",{\"size\":[2]}]]],[\"flip-icon-message\",[[1,\"flip-icon-message\",{\"size\":[2]}]]],[\"flip-icon-more-horizontal\",[[1,\"flip-icon-more-horizontal\",{\"size\":[2]}]]],[\"flip-icon-more-vertikal\",[[1,\"flip-icon-more-vertikal\",{\"size\":[2]}]]],[\"flip-icon-notifications\",[[1,\"flip-icon-notifications\",{\"size\":[2]}]]],[\"flip-icon-notifications-active\",[[1,\"flip-icon-notifications-active\",{\"size\":[2]}]]],[\"flip-icon-notifications-off\",[[1,\"flip-icon-notifications-off\",{\"size\":[2]}]]],[\"flip-icon-open-in-new\",[[1,\"flip-icon-open-in-new\",{\"size\":[2]}]]],[\"flip-icon-people-alt\",[[1,\"flip-icon-people-alt\",{\"size\":[2]}]]],[\"flip-icon-person-off\",[[1,\"flip-icon-person-off\",{\"size\":[2]}]]],[\"flip-icon-phone\",[[1,\"flip-icon-phone\",{\"size\":[2]}]]],[\"flip-icon-poll\",[[1,\"flip-icon-poll\",{\"size\":[2]}]]],[\"flip-icon-print\",[[1,\"flip-icon-print\",{\"size\":[2]}]]],[\"flip-icon-recieved\",[[1,\"flip-icon-recieved\",{\"size\":[2]}]]],[\"flip-icon-remove\",[[1,\"flip-icon-remove\",{\"size\":[2]}]]],[\"flip-icon-search-strong\",[[1,\"flip-icon-search-strong\",{\"size\":[2]}]]],[\"flip-icon-send\",[[1,\"flip-icon-send\",{\"size\":[2]}]]],[\"flip-icon-settings\",[[1,\"flip-icon-settings\",{\"size\":[2]}]]],[\"flip-icon-time-filled\",[[1,\"flip-icon-time-filled\",{\"size\":[2]}]]],[\"flip-icon-time-outlined\",[[1,\"flip-icon-time-outlined\",{\"size\":[2]}]]],[\"flip-icon-user-assign\",[[1,\"flip-icon-user-assign\",{\"size\":[2]}]]],[\"flip-icon-video-camera\",[[1,\"flip-icon-video-camera\",{\"size\":[2]}]]],[\"flip-icon-warning\",[[1,\"flip-icon-warning\",{\"size\":[2]}]]],[\"flip-link\",[[1,\"flip-link\",{\"href\":[1],\"label\":[1],\"target\":[1]}]]],[\"flip-list\",[[4,\"flip-list\"]]],[\"flip-option-list\",[[1,\"flip-option-list\",{\"disabled\":[4],\"label\":[1],\"multiSelect\":[4,\"multi-select\"],\"value\":[1040]}]]],[\"flip-option-list-section\",[[1,\"flip-option-list-section\",{\"label\":[1]}]]],[\"flip-progress-indicator\",[[1,\"flip-progress-indicator\",{\"label\":[1],\"size\":[1],\"value\":[2],\"variant\":[1]}]]],[\"flip-radio-group\",[[6,\"flip-radio-group\",{\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"value\":[1537]}]]],[\"flip-tab\",[[1,\"flip-tab\",{\"active\":[4],\"label\":[1],\"tabId\":[1,\"tab-id\"]}]]],[\"flip-tabs\",[[6,\"flip-tabs\",{\"initialTab\":[1,\"initial-tab\"],\"label\":[1],\"activeTab\":[32],\"highlightedTab\":[32],\"activateTab\":[64]},[[9,\"resize\",\"onWindowResize\"]]]]],[\"flip-theme-provider\",[[6,\"flip-theme-provider\",{\"config\":[16],\"getActiveTheme\":[64],\"getPreferredTheme\":[64],\"setPreferredTheme\":[64],\"resetPreferredTheme\":[64]}]]],[\"flip-thumbnail\",[[1,\"flip-thumbnail\",{\"alt\":[1],\"format\":[1],\"size\":[1],\"src\":[1]}]]],[\"flip-tooltip\",[[1,\"flip-tooltip\",{\"content\":[1],\"delay\":[2],\"position\":[1],\"actualPosition\":[32],\"visible\":[32]},[[1,\"mouseenter\",\"onMouseEnter\"],[1,\"mouseleave\",\"onMouseLeave\"],[9,\"resize\",\"onWindowResize\"],[9,\"scroll\",\"onWindowScroll\"]]]]],[\"flip-icon-close\",[[1,\"flip-icon-close\",{\"size\":[2]}]]],[\"flip-toast\",[[1,\"flip-toast\",{\"accessibleDismissLabel\":[1,\"accessible-dismiss-label\"],\"content\":[1],\"dismissLabel\":[1,\"dismiss-label\"],\"duration\":[2],\"icon\":[1],\"intent\":[1],\"toastId\":[1,\"toast-id\"]}]]],[\"flip-icon-check-small\",[[1,\"flip-icon-check-small\",{\"size\":[2]}]]],[\"flip-icon-cloud-upload\",[[1,\"flip-icon-cloud-upload\",{\"size\":[2]}]]],[\"flip-icon-person\",[[1,\"flip-icon-person\",{\"size\":[2]}]]],[\"flip-icon-search\",[[1,\"flip-icon-search\",{\"size\":[2]}]]],[\"flip-text\",[[1,\"flip-text\",{\"align\":[1],\"as\":[1],\"color\":[1],\"fontStyle\":[1,\"font-style\"],\"size\":[1],\"weight\":[1]}]]],[\"flip-button-group\",[[1,\"flip-button-group\",{\"orientation\":[1],\"stretch\":[4],\"wrap\":[4]}]]],[\"flip-heading\",[[1,\"flip-heading\",{\"align\":[1],\"as\":[1],\"headingId\":[1,\"heading-id\"],\"level\":[2],\"text\":[1]}]]],[\"flip-icon-cancel\",[[1,\"flip-icon-cancel\",{\"size\":[2]}]]],[\"flip-icon-expand-more\",[[1,\"flip-icon-expand-more\",{\"size\":[2]}]]],[\"flip-date-picker_3\",[[1,\"flip-date-picker\",{\"locale\":[16],\"maxDate\":[16],\"minDate\":[16],\"range\":[4],\"startDate\":[16],\"value\":[1040]}],[1,\"flip-icon-today\",{\"size\":[2]}],[1,\"flip-popover\",{\"label\":[1],\"placement\":[1],\"popoverId\":[1,\"popover-id\"],\"trigger\":[1],\"active\":[32],\"closing\":[32],\"position\":[32],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClick\"]]]]],[\"flip-icon-expand-less_3\",[[1,\"flip-icon-expand-less\",{\"size\":[2]}],[1,\"flip-icon-visibility\",{\"size\":[2]}],[1,\"flip-icon-visibility-off\",{\"size\":[2]}]]],[\"flip-icon-check-strong\",[[1,\"flip-icon-check-strong\",{\"size\":[2]}]]],[\"flip-stack\",[[1,\"flip-stack\",{\"align\":[1],\"as\":[1],\"justify\":[1],\"orientation\":[1],\"spacing\":[1],\"wrap\":[4]}]]],[\"flip-visually-hidden\",[[1,\"flip-visually-hidden\"]]],[\"flip-file-viewer-audio_6\",[[1,\"flip-file-viewer-csv\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"data\":[32],\"error\":[32],\"loading\":[32]}],[1,\"flip-file-viewer-image\",{\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"error\":[32],\"loading\":[32]}],[1,\"flip-file-viewer-pdf\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"zoom\":[8],\"doc\":[32],\"error\":[32],\"loading\":[32],\"visiblePages\":[32],\"print\":[64]},[[9,\"resize\",\"onWindowResize\"]]],[1,\"flip-file-viewer-text\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"error\":[32],\"loading\":[32],\"text\":[32]}],[1,\"flip-file-viewer-audio\",{\"file\":[1],\"type\":[1]}],[1,\"flip-file-viewer-video\",{\"file\":[1],\"type\":[1]}]]],[\"flip-button\",[[2,\"flip-button\",{\"disabled\":[4],\"download\":[1],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"flipAriaLabel\":[1,\"flip-aria-label\"],\"form\":[1],\"hideLabel\":[4,\"hide-label\"],\"href\":[1],\"icon\":[1],\"iconPosition\":[1,\"icon-position\"],\"intent\":[1],\"label\":[1],\"name\":[1],\"size\":[1],\"target\":[1],\"type\":[1],\"value\":[1],\"variant\":[1]}]]],[\"flip-icon-error_3\",[[1,\"flip-spinner\",{\"label\":[1],\"size\":[1]}],[1,\"flip-inline-error\",{\"message\":[1],\"size\":[1]}],[1,\"flip-icon-error\",{\"size\":[2]}]]]]"), options);
|
|
16
|
+
return bootstrapLazy(JSON.parse("[[\"flip-file-viewer\",[[1,\"flip-file-viewer\",{\"active\":[4],\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"type\":[1],\"typeUnsupportedMessage\":[1,\"type-unsupported-message\"],\"zoom\":[8],\"download\":[64],\"print\":[64]}]]],[\"flip-resource-list-file-item\",[[1,\"flip-resource-list-file-item\",{\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"icon\":[1],\"label\":[1],\"loading\":[4],\"removable\":[4],\"removeButtonLabel\":[1,\"remove-button-label\"]}]]],[\"flip-text-input\",[[2,\"flip-text-input\",{\"autoComplete\":[1,\"auto-complete\"],\"autoFocus\":[4,\"auto-focus\"],\"autoSelect\":[4,\"auto-select\"],\"clearable\":[4],\"clearButtonLabel\":[1,\"clear-button-label\"],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"invalid\":[4],\"maxLength\":[2,\"max-length\"],\"max\":[2],\"min\":[2],\"mode\":[1],\"prefixLabel\":[1,\"prefix-label\"],\"required\":[4],\"rows\":[2],\"showCharacterCounter\":[4,\"show-character-counter\"],\"spellCheck\":[4,\"spell-check\"],\"suffixLabel\":[1,\"suffix-label\"],\"step\":[2],\"passwordToggleLabel\":[1,\"password-toggle-label\"],\"type\":[1],\"value\":[1537],\"showPassword\":[32]}]]],[\"flip-lightbox\",[[1,\"flip-lightbox\",{\"closeButtonLabel\":[1,\"close-button-label\"],\"downloadButtonLabel\":[1,\"download-button-label\"],\"label\":[1],\"nextSlideButtonLabel\":[1,\"next-slide-button-label\"],\"previousSlideButtonLabel\":[1,\"previous-slide-button-label\"],\"activeSlideIndex\":[32],\"closing\":[32],\"slides\":[32],\"open\":[64],\"close\":[64],\"activateSlide\":[64]}]]],[\"flip-modal\",[[1,\"flip-modal\",{\"closeButtonLabel\":[1,\"close-button-label\"],\"label\":[1],\"primaryActionLabel\":[1,\"primary-action-label\"],\"secondaryActionLabel\":[1,\"secondary-action-label\"],\"closing\":[32],\"scrollable\":[32],\"scrolled\":[32],\"scrolledDown\":[32],\"open\":[64],\"close\":[64]},[[9,\"resize\",\"onWindowResize\"]]]]],[\"flip-date-input\",[[2,\"flip-date-input\",{\"autoFocus\":[4,\"auto-focus\"],\"autoSelect\":[4,\"auto-select\"],\"datePickerLabel\":[1,\"date-picker-label\"],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"format\":[1],\"invalid\":[4],\"locale\":[16],\"placeholder\":[1],\"required\":[4],\"value\":[1537]}]]],[\"flip-dialog\",[[1,\"flip-dialog\",{\"hideLabel\":[4,\"hide-label\"],\"intent\":[1],\"label\":[1],\"primaryActionLabel\":[1,\"primary-action-label\"],\"secondaryActionLabel\":[1,\"secondary-action-label\"],\"closing\":[32],\"open\":[64],\"close\":[64]}]]],[\"flip-pagination\",[[1,\"flip-pagination\",{\"accessibleNextButtonLabel\":[1,\"accessible-next-button-label\"],\"accessiblePrevButtonLabel\":[1,\"accessible-prev-button-label\"],\"nextButtonLabel\":[1,\"next-button-label\"],\"pageLabel\":[1,\"page-label\"],\"prevButtonLabel\":[1,\"prev-button-label\"],\"label\":[1],\"page\":[2],\"pages\":[2],\"pageSelectLabel\":[1,\"page-select-label\"],\"variant\":[1]}]]],[\"flip-toast-provider\",[[1,\"flip-toast-provider\",{\"globalDuration\":[2,\"global-duration\"],\"toasts\":[32],\"clearAll\":[64],\"dismiss\":[64],\"toast\":[64]}]]],[\"flip-checkbox\",[[2,\"flip-checkbox\",{\"checked\":[1032],\"description\":[1],\"disabled\":[4],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"invalid\":[4],\"label\":[1],\"value\":[1]}]]],[\"flip-empty-state\",[[1,\"flip-empty-state\",{\"heading\":[1],\"illustration\":[1]}]]],[\"flip-file-uploader\",[[2,\"flip-file-uploader\",{\"accept\":[1],\"ctaLabel\":[1,\"cta-label\"],\"description\":[1],\"disabled\":[4],\"dragDropLabel\":[1,\"drag-drop-label\"],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"label\":[1],\"multiple\":[4],\"showDropzone\":[4,\"show-dropzone\"],\"uploadButtonLabel\":[1,\"upload-button-label\"],\"reset\":[64]}]]],[\"flip-form-control\",[[6,\"flip-form-control\",{\"description\":[1],\"disabled\":[4],\"errorMessage\":[1,\"error-message\"],\"invalid\":[4],\"label\":[1],\"hasFocus\":[32],\"inputValue\":[32]},[[8,\"click\",\"onWindowClick\"]]]]],[\"flip-option-list-item\",[[1,\"flip-option-list-item\",{\"context\":[1025],\"disabled\":[4],\"icon\":[1],\"label\":[1],\"selected\":[1028],\"value\":[1]}]]],[\"flip-resource-list-item\",[[1,\"flip-resource-list-item\",{\"checked\":[1028],\"description\":[1],\"disabled\":[4],\"hideDivider\":[4,\"hide-divider\"],\"href\":[1],\"label\":[1],\"media\":[1],\"menuTriggerId\":[1,\"menu-trigger-id\"],\"menuTriggerLabel\":[1,\"menu-trigger-label\"],\"meta\":[1],\"selectable\":[4],\"value\":[1]}]]],[\"flip-search\",[[2,\"flip-search\",{\"autoFocus\":[4,\"auto-focus\"],\"clearButtonLabel\":[1,\"clear-button-label\"],\"disabled\":[4],\"inputName\":[1,\"input-name\"],\"inputId\":[1,\"input-id\"],\"label\":[1],\"placeholder\":[1],\"value\":[1025]},[[8,\"keydown\",\"onKeyDown\"]]]]],[\"flip-avatar\",[[1,\"flip-avatar\",{\"badge\":[1],\"badgePosition\":[1,\"badge-position\"],\"icon\":[1],\"initials\":[1],\"interactive\":[4],\"label\":[1],\"showLabel\":[4,\"show-label\"],\"size\":[1],\"src\":[1],\"variant\":[1],\"imageAvailable\":[32]}]]],[\"flip-banner\",[[1,\"flip-banner\",{\"actionLabel\":[1,\"action-label\"],\"content\":[1],\"dismissable\":[4],\"dismissLabel\":[1,\"dismiss-label\"],\"importance\":[1],\"intent\":[1],\"showIcon\":[4,\"show-icon\"]}]]],[\"flip-radio\",[[2,\"flip-radio\",{\"checked\":[1032],\"description\":[1],\"disabled\":[4],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"invalid\":[4],\"label\":[1],\"value\":[1]}]]],[\"flip-resource-list\",[[1,\"flip-resource-list\",{\"label\":[1]}]]],[\"flip-switch\",[[2,\"flip-switch\",{\"checked\":[1028],\"disabled\":[4],\"inputId\":[1,\"input-id\"],\"inputName\":[1,\"input-name\"],\"label\":[1],\"size\":[1],\"value\":[1]},[[9,\"pointerup\",\"onWindowPointerUp\"]]]]],[\"flip-tag\",[[1,\"flip-tag\",{\"intent\":[1],\"label\":[1],\"removable\":[4],\"removalButtonLabel\":[1,\"removal-button-label\"]}]]],[\"flip-video-thumbnail\",[[1,\"flip-video-thumbnail\",{\"durationLabel\":[1,\"duration-label\"],\"duration\":[1],\"label\":[1],\"src\":[1]}]]],[\"flip-action-list\",[[1,\"flip-action-list\"]]],[\"flip-action-list-item\",[[1,\"flip-action-list-item\",{\"disabled\":[4],\"description\":[1],\"icon\":[1],\"intent\":[1],\"label\":[1],\"size\":[1],\"suffix\":[1]}]]],[\"flip-action-list-section\",[[1,\"flip-action-list-section\",{\"label\":[1]}]]],[\"flip-avatar-group\",[[1,\"flip-avatar-group\",{\"badge\":[1]}]]],[\"flip-badge\",[[1,\"flip-badge\",{\"icon\":[1],\"intent\":[1],\"label\":[1],\"size\":[1],\"variant\":[1]}]]],[\"flip-chip\",[[1,\"flip-chip\",{\"avatar\":[1],\"icon\":[1],\"intent\":[1],\"interactive\":[4],\"label\":[1]}]]],[\"flip-description-list\",[[1,\"flip-description-list\"]]],[\"flip-description-list-item\",[[1,\"flip-description-list-item\",{\"term\":[1]}]]],[\"flip-form-group\",[[6,\"flip-form-group\",{\"orientation\":[1]}]]],[\"flip-icon-add\",[[1,\"flip-icon-add\",{\"size\":[2]}]]],[\"flip-icon-add-photo\",[[1,\"flip-icon-add-photo\",{\"size\":[2]}]]],[\"flip-icon-admin-panel-settings\",[[1,\"flip-icon-admin-panel-settings\",{\"size\":[2]}]]],[\"flip-icon-arrow-back\",[[1,\"flip-icon-arrow-back\",{\"size\":[2]}]]],[\"flip-icon-arrow-forward\",[[1,\"flip-icon-arrow-forward\",{\"size\":[2]}]]],[\"flip-icon-arrow-right-small\",[[1,\"flip-icon-arrow-right-small\",{\"size\":[2]}]]],[\"flip-icon-attachment\",[[1,\"flip-icon-attachment\",{\"size\":[2]}]]],[\"flip-icon-chat-bubble\",[[1,\"flip-icon-chat-bubble\",{\"size\":[2]}]]],[\"flip-icon-check\",[[1,\"flip-icon-check\",{\"size\":[2]}]]],[\"flip-icon-check-circle\",[[1,\"flip-icon-check-circle\",{\"size\":[2]}]]],[\"flip-icon-chevron-left\",[[1,\"flip-icon-chevron-left\",{\"size\":[2]}]]],[\"flip-icon-chevron-right\",[[1,\"flip-icon-chevron-right\",{\"size\":[2]}]]],[\"flip-icon-close-small\",[[1,\"flip-icon-close-small\",{\"size\":[2]}]]],[\"flip-icon-comment\",[[1,\"flip-icon-comment\",{\"size\":[2]}]]],[\"flip-icon-copy\",[[1,\"flip-icon-copy\",{\"size\":[2]}]]],[\"flip-icon-date-range\",[[1,\"flip-icon-date-range\",{\"size\":[2]}]]],[\"flip-icon-delete\",[[1,\"flip-icon-delete\",{\"size\":[2]}]]],[\"flip-icon-description\",[[1,\"flip-icon-description\",{\"size\":[2]}]]],[\"flip-icon-edit\",[[1,\"flip-icon-edit\",{\"size\":[2]}]]],[\"flip-icon-emoji-mood\",[[1,\"flip-icon-emoji-mood\",{\"size\":[2]}]]],[\"flip-icon-emoji-satisfied\",[[1,\"flip-icon-emoji-satisfied\",{\"size\":[2]}]]],[\"flip-icon-file\",[[1,\"flip-icon-file\",{\"size\":[2]}]]],[\"flip-icon-folder-shared\",[[1,\"flip-icon-folder-shared\",{\"size\":[2]}]]],[\"flip-icon-fullscreen\",[[1,\"flip-icon-fullscreen\",{\"size\":[2]}]]],[\"flip-icon-fullscreen-exit\",[[1,\"flip-icon-fullscreen-exit\",{\"size\":[2]}]]],[\"flip-icon-group-assign\",[[1,\"flip-icon-group-assign\",{\"size\":[2]}]]],[\"flip-icon-groups\",[[1,\"flip-icon-groups\",{\"size\":[2]}]]],[\"flip-icon-groups-custom\",[[1,\"flip-icon-groups-custom\",{\"size\":[2]}]]],[\"flip-icon-image\",[[1,\"flip-icon-image\",{\"size\":[2]}]]],[\"flip-icon-info\",[[1,\"flip-icon-info\",{\"size\":[2]}]]],[\"flip-icon-inventory\",[[1,\"flip-icon-inventory\",{\"size\":[2]}]]],[\"flip-icon-like\",[[1,\"flip-icon-like\",{\"size\":[2]}]]],[\"flip-icon-link\",[[1,\"flip-icon-link\",{\"size\":[2]}]]],[\"flip-icon-lock\",[[1,\"flip-icon-lock\",{\"size\":[2]}]]],[\"flip-icon-logout\",[[1,\"flip-icon-logout\",{\"size\":[2]}]]],[\"flip-icon-mail\",[[1,\"flip-icon-mail\",{\"size\":[2]}]]],[\"flip-icon-manage-accounts\",[[1,\"flip-icon-manage-accounts\",{\"size\":[2]}]]],[\"flip-icon-mention\",[[1,\"flip-icon-mention\",{\"size\":[2]}]]],[\"flip-icon-message\",[[1,\"flip-icon-message\",{\"size\":[2]}]]],[\"flip-icon-more-horizontal\",[[1,\"flip-icon-more-horizontal\",{\"size\":[2]}]]],[\"flip-icon-more-vertikal\",[[1,\"flip-icon-more-vertikal\",{\"size\":[2]}]]],[\"flip-icon-notifications\",[[1,\"flip-icon-notifications\",{\"size\":[2]}]]],[\"flip-icon-notifications-active\",[[1,\"flip-icon-notifications-active\",{\"size\":[2]}]]],[\"flip-icon-notifications-off\",[[1,\"flip-icon-notifications-off\",{\"size\":[2]}]]],[\"flip-icon-open-in-new\",[[1,\"flip-icon-open-in-new\",{\"size\":[2]}]]],[\"flip-icon-people-alt\",[[1,\"flip-icon-people-alt\",{\"size\":[2]}]]],[\"flip-icon-person-off\",[[1,\"flip-icon-person-off\",{\"size\":[2]}]]],[\"flip-icon-phone\",[[1,\"flip-icon-phone\",{\"size\":[2]}]]],[\"flip-icon-poll\",[[1,\"flip-icon-poll\",{\"size\":[2]}]]],[\"flip-icon-print\",[[1,\"flip-icon-print\",{\"size\":[2]}]]],[\"flip-icon-recieved\",[[1,\"flip-icon-recieved\",{\"size\":[2]}]]],[\"flip-icon-remove\",[[1,\"flip-icon-remove\",{\"size\":[2]}]]],[\"flip-icon-search-strong\",[[1,\"flip-icon-search-strong\",{\"size\":[2]}]]],[\"flip-icon-send\",[[1,\"flip-icon-send\",{\"size\":[2]}]]],[\"flip-icon-settings\",[[1,\"flip-icon-settings\",{\"size\":[2]}]]],[\"flip-icon-time-filled\",[[1,\"flip-icon-time-filled\",{\"size\":[2]}]]],[\"flip-icon-time-outlined\",[[1,\"flip-icon-time-outlined\",{\"size\":[2]}]]],[\"flip-icon-user-assign\",[[1,\"flip-icon-user-assign\",{\"size\":[2]}]]],[\"flip-icon-video-camera\",[[1,\"flip-icon-video-camera\",{\"size\":[2]}]]],[\"flip-icon-warning\",[[1,\"flip-icon-warning\",{\"size\":[2]}]]],[\"flip-link\",[[1,\"flip-link\",{\"href\":[1],\"label\":[1],\"target\":[1]}]]],[\"flip-list\",[[4,\"flip-list\"]]],[\"flip-option-list\",[[1,\"flip-option-list\",{\"disabled\":[4],\"label\":[1],\"multiSelect\":[4,\"multi-select\"],\"value\":[1040]}]]],[\"flip-option-list-section\",[[1,\"flip-option-list-section\",{\"label\":[1]}]]],[\"flip-progress-indicator\",[[1,\"flip-progress-indicator\",{\"label\":[1],\"size\":[1],\"value\":[2],\"variant\":[1]}]]],[\"flip-radio-group\",[[6,\"flip-radio-group\",{\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"value\":[1537]}]]],[\"flip-tab\",[[1,\"flip-tab\",{\"active\":[4],\"label\":[1],\"tabId\":[1,\"tab-id\"]}]]],[\"flip-tabs\",[[6,\"flip-tabs\",{\"initialTab\":[1,\"initial-tab\"],\"label\":[1],\"activeTab\":[32],\"activateTab\":[64]}]]],[\"flip-theme-provider\",[[6,\"flip-theme-provider\",{\"config\":[16],\"getActiveTheme\":[64],\"getPreferredTheme\":[64],\"setPreferredTheme\":[64],\"resetPreferredTheme\":[64]}]]],[\"flip-thumbnail\",[[1,\"flip-thumbnail\",{\"alt\":[1],\"format\":[1],\"size\":[1],\"src\":[1]}]]],[\"flip-tooltip\",[[1,\"flip-tooltip\",{\"content\":[1],\"delay\":[2],\"position\":[1],\"actualPosition\":[32],\"visible\":[32]},[[1,\"mouseenter\",\"onMouseEnter\"],[1,\"mouseleave\",\"onMouseLeave\"],[9,\"resize\",\"onWindowResize\"],[9,\"scroll\",\"onWindowScroll\"]]]]],[\"flip-toast\",[[1,\"flip-toast\",{\"accessibleDismissLabel\":[1,\"accessible-dismiss-label\"],\"content\":[1],\"dismissLabel\":[1,\"dismiss-label\"],\"duration\":[2],\"icon\":[1],\"intent\":[1],\"toastId\":[1,\"toast-id\"]}]]],[\"flip-icon-check-small\",[[1,\"flip-icon-check-small\",{\"size\":[2]}]]],[\"flip-icon-cloud-upload\",[[1,\"flip-icon-cloud-upload\",{\"size\":[2]}]]],[\"flip-icon-person\",[[1,\"flip-icon-person\",{\"size\":[2]}]]],[\"flip-icon-search\",[[1,\"flip-icon-search\",{\"size\":[2]}]]],[\"flip-text\",[[1,\"flip-text\",{\"align\":[1],\"as\":[1],\"color\":[1],\"fontStyle\":[1,\"font-style\"],\"size\":[1],\"weight\":[1]}]]],[\"flip-button-group\",[[1,\"flip-button-group\",{\"orientation\":[1],\"segmented\":[4],\"stretch\":[4],\"wrap\":[4]}]]],[\"flip-heading\",[[1,\"flip-heading\",{\"align\":[1],\"as\":[1],\"headingId\":[1,\"heading-id\"],\"level\":[2],\"text\":[1]}]]],[\"flip-icon-cancel\",[[1,\"flip-icon-cancel\",{\"size\":[2]}]]],[\"flip-icon-expand-more\",[[1,\"flip-icon-expand-more\",{\"size\":[2]}]]],[\"flip-date-picker_3\",[[1,\"flip-date-picker\",{\"locale\":[16],\"maxDate\":[16],\"minDate\":[16],\"range\":[4],\"startDate\":[16],\"value\":[1040]}],[1,\"flip-icon-today\",{\"size\":[2]}],[1,\"flip-popover\",{\"label\":[1],\"placement\":[1],\"popoverId\":[1,\"popover-id\"],\"trigger\":[1],\"active\":[32],\"closing\":[32],\"position\":[32],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClick\"]]]]],[\"flip-icon-arrow-left_3\",[[1,\"flip-icon-arrow-left\",{\"size\":[2]}],[1,\"flip-icon-arrow-right\",{\"size\":[2]}],[1,\"flip-icon-download\",{\"size\":[2]}]]],[\"flip-icon-expand-less_3\",[[1,\"flip-icon-expand-less\",{\"size\":[2]}],[1,\"flip-icon-visibility\",{\"size\":[2]}],[1,\"flip-icon-visibility-off\",{\"size\":[2]}]]],[\"flip-icon-check-strong\",[[1,\"flip-icon-check-strong\",{\"size\":[2]}]]],[\"flip-icon-close\",[[1,\"flip-icon-close\",{\"size\":[2]}]]],[\"flip-stack\",[[1,\"flip-stack\",{\"align\":[1],\"as\":[1],\"justify\":[1],\"orientation\":[1],\"spacing\":[1],\"wrap\":[4]}]]],[\"flip-visually-hidden\",[[1,\"flip-visually-hidden\"]]],[\"flip-file-viewer-audio_6\",[[1,\"flip-file-viewer-csv\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"data\":[32],\"error\":[32],\"loading\":[32]}],[1,\"flip-file-viewer-image\",{\"description\":[1],\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"error\":[32],\"loading\":[32]}],[1,\"flip-file-viewer-pdf\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"zoom\":[8],\"doc\":[32],\"error\":[32],\"loading\":[32],\"visiblePages\":[32],\"print\":[64]},[[9,\"resize\",\"onWindowResize\"]]],[1,\"flip-file-viewer-text\",{\"errorMessage\":[1,\"error-message\"],\"file\":[1],\"error\":[32],\"loading\":[32],\"text\":[32]}],[1,\"flip-file-viewer-audio\",{\"file\":[1],\"type\":[1]}],[1,\"flip-file-viewer-video\",{\"file\":[1],\"type\":[1]}]]],[\"flip-button\",[[2,\"flip-button\",{\"disabled\":[4],\"download\":[1],\"flipAriaDescribedby\":[1,\"flip-aria-describedby\"],\"flipAriaLabel\":[1,\"flip-aria-label\"],\"form\":[1],\"hideLabel\":[4,\"hide-label\"],\"href\":[1],\"icon\":[1],\"iconPosition\":[1,\"icon-position\"],\"intent\":[1],\"label\":[1],\"name\":[1],\"size\":[1],\"target\":[1],\"type\":[1],\"value\":[1],\"variant\":[1]}]]],[\"flip-icon-error_3\",[[1,\"flip-spinner\",{\"label\":[1],\"size\":[1]}],[1,\"flip-inline-error\",{\"message\":[1],\"size\":[1]}],[1,\"flip-icon-error\",{\"size\":[2]}]]]]"), options);
|
|
17
17
|
});
|
|
18
18
|
|
|
19
19
|
//# sourceMappingURL=swirl-components.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as o,h as r,H as i}from"./p-9fe00e8a.js";import{c as p}from"./p-efffd297.js";import"./p-86bd3473.js";const s=".sc-flip-form-group-h{display:block;width:100%}.sc-flip-form-group-h *.sc-flip-form-group{box-sizing:border-box}.form-group.sc-flip-form-group{display:flex;flex-direction:column;gap:var(--s-space-16)}@media (min-width: 768px){.form-group.sc-flip-form-group{gap:var(--s-space-24)}}.form-group--orientation-horizontal.sc-flip-form-group{gap:var(--s-space-16)}@media (min-width: 768px){.form-group--orientation-horizontal.sc-flip-form-group{flex-direction:row}}";const f=class{constructor(r){o(this,r);this.orientation="vertical"}render(){const o=p("form-group",`form-group--orientation-${this.orientation}`);return r(i,null,r("div",{class:o},r("slot",null)))}};f.style=s;export{f as flip_form_group};
|
|
2
|
+
//# sourceMappingURL=p-013a1742.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-form-group/flip-form-group.css?tag=flip-form-group&encapsulation=scoped","src/components/flip-form-group/flip-form-group.tsx"],"names":["flipFormGroupCss","FlipFormGroup","[object Object]","hostRef","this","orientation","className","classnames","h","Host","class"],"mappings":"8GAAA,MAAMA,EAAmB,mdCiBZC,EAAa,MAZ1BC,YAAAC,aAaUC,KAAAC,YAAwC,WAEhDH,SACE,MAAMI,EAAYC,EAChB,aACA,2BAA2BH,KAAKC,eAGlC,OACEG,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKE,MAAOJ,GACVE,EAAA,OAAA","sourcesContent":["@import \"../../styles/media-queries.css\";\n\n:host {\n display: block;\n width: 100%;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.form-group {\n display: flex;\n flex-direction: column;\n gap: var(--s-space-16);\n\n @media (--from-tablet) {\n gap: var(--s-space-24);\n }\n}\n\n.form-group--orientation-horizontal {\n gap: var(--s-space-16);\n\n @media (--from-tablet) {\n flex-direction: row;\n }\n}\n","import { Component, h, Host, Prop } from \"@stencil/core\";\nimport classnames from \"classnames\";\n\nexport type FlipFormGroupOrientation = \"horizontal\" | \"vertical\";\n\n@Component({\n /**\n * Form controls in shadow dom can still not be associated with labels in the\n * light dom, cross browser. So for now we disable shadow dom for form\n * controls (inputs, buttons, selects, etc.). Instead we use Stencil's scoping.\n * https://caniuse.com/?search=attachInternals\n */\n scoped: true,\n shadow: false,\n styleUrl: \"flip-form-group.css\",\n tag: \"flip-form-group\",\n})\nexport class FlipFormGroup {\n @Prop() orientation: FlipFormGroupOrientation = \"vertical\";\n\n render() {\n const className = classnames(\n \"form-group\",\n `form-group--orientation-${this.orientation}`\n );\n\n return (\n <Host>\n <div class={className}>\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{r as a,h as t,H as i,g as r}from"./p-9fe00e8a.js";import{c as e}from"./p-efffd297.js";import"./p-86bd3473.js";const s=":host{display:inline-flex;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--s-surface-raised-default)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus{outline-color:var(--s-focus-default)}.avatar--size-xs{width:1.75rem;height:1.75rem;font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-xs.avatar--variant-square,.avatar--size-xs.avatar--variant-square .avatar__image,.avatar--size-xs.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-s{width:2rem;height:2rem;font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-s.avatar--variant-square,.avatar--size-s.avatar--variant-square .avatar__image,.avatar--size-s.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-m{width:2.5rem;height:2.5rem;font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-m.avatar--variant-square,.avatar--size-m.avatar--variant-square .avatar__image,.avatar--size-m.avatar--variant-square .avatar__initials{border-radius:0.625rem}.avatar--size-l{width:3rem;height:3rem;font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-l.avatar--variant-square,.avatar--size-l.avatar--variant-square .avatar__image,.avatar--size-l.avatar--variant-square .avatar__initials{border-radius:0.75rem}.avatar--size-xl{width:4rem;height:4rem;font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-xl.avatar--variant-square,.avatar--size-xl.avatar--variant-square .avatar__image,.avatar--size-xl.avatar--variant-square .avatar__initials{border-radius:1rem}.avatar--size-2xl{width:9rem;height:9rem;font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl.avatar--variant-square,.avatar--size-2xl.avatar--variant-square .avatar__image,.avatar--size-2xl.avatar--variant-square .avatar__initials{border-radius:2.25rem}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:50%}.avatar__image>img{width:100%;height:100%}.avatar__icon{display:inline-flex;width:100%;height:100%}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{display:inline-flex;width:100%;min-width:0;height:100%;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:50%;background-color:var(--s-decorative-6-default)}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}";const n={xs:28,s:32,m:40,l:48,xl:64,"2xl":144};const
|
|
2
|
-
//# sourceMappingURL=p-
|
|
1
|
+
import{r as a,h as t,H as i,g as r}from"./p-9fe00e8a.js";import{c as e}from"./p-efffd297.js";import"./p-86bd3473.js";const s=":host{display:inline-flex;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--s-surface-raised-default)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus{outline-color:var(--s-focus-default)}.avatar--size-xs{width:1.75rem;height:1.75rem;font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-xs.avatar--variant-square,.avatar--size-xs.avatar--variant-square .avatar__image,.avatar--size-xs.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-s{width:2rem;height:2rem;font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-s.avatar--variant-square,.avatar--size-s.avatar--variant-square .avatar__image,.avatar--size-s.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-m{width:2.5rem;height:2.5rem;font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-m.avatar--variant-square,.avatar--size-m.avatar--variant-square .avatar__image,.avatar--size-m.avatar--variant-square .avatar__initials{border-radius:0.625rem}.avatar--size-l{width:3rem;height:3rem;font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-l.avatar--variant-square,.avatar--size-l.avatar--variant-square .avatar__image,.avatar--size-l.avatar--variant-square .avatar__initials{border-radius:0.75rem}.avatar--size-xl{width:4rem;height:4rem;font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-xl.avatar--variant-square,.avatar--size-xl.avatar--variant-square .avatar__image,.avatar--size-xl.avatar--variant-square .avatar__initials{border-radius:1rem}.avatar--size-2xl{width:9rem;height:9rem;font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl.avatar--variant-square,.avatar--size-2xl.avatar--variant-square .avatar__image,.avatar--size-2xl.avatar--variant-square .avatar__initials{border-radius:2.25rem}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:50%}.avatar__image>img{width:100%;height:100%}.avatar__icon{display:inline-flex;width:100%;height:100%}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{display:inline-flex;width:100%;min-width:0;height:100%;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:50%;background-color:var(--s-decorative-6-default)}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}";const n={xs:28,s:32,m:40,l:48,xl:64,"2xl":144};const o=class{constructor(t){a(this,t);this.badgePosition="bottom";this.interactive=false;this.showLabel=false;this.size="m";this.variant="round";this.setImageAvailable=()=>{this.imageAvailable=true};this.setImageUnavailable=()=>{this.imageAvailable=false};this.onKeydown=a=>{if(a.code==="Space"){a.preventDefault()}else if(a.code==="Enter"){a.preventDefault();this.element.click()}};this.onKeyup=a=>{if(a.code==="Space"){a.preventDefault();this.element.click()}}}componentDidLoad(){this.forceBadgeProps()}watchSrcProp(){this.imageAvailable=undefined}forceBadgeProps(){if(!Boolean(this.badge)){return}const a=this.badgeEl.querySelector("flip-badge");a===null||a===void 0?void 0:a.setAttribute("size","m")}render(){const a=Boolean(this.src)&&(this.imageAvailable||this.imageAvailable===undefined);const r=!a&&Boolean(this.initials);const s=!a&&!r&&Boolean(this.icon);const o=!a&&!r&&!s;const v=Boolean(this.badge)&&this.size==="m";const h=this.interactive?"button":"img";const l=e("avatar",`avatar--size-${this.size}`,`avatar--variant-${this.variant}`,{"avatar--has-icon":s||o,"avatar--has-initials":r,"avatar--interactive":this.interactive});const d=e("avatar__badge",`avatar__badge--position-${this.badgePosition}`);return t(i,{"aria-label":this.label,onKeydown:this.interactive?this.onKeydown:undefined,onKeyup:this.interactive?this.onKeyup:undefined,role:h,tabIndex:this.interactive?0:undefined},t("span",{class:l,part:"avatar"},a&&t("span",{class:"avatar__image"},t("img",{alt:"",height:n[this.size],onError:this.setImageUnavailable,onLoad:this.setImageAvailable,src:this.src,width:n[this.size]})),r&&t("span",{class:"avatar__initials"},t("span",null,this.initials)),s&&t("span",{class:"avatar__icon",innerHTML:this.icon}),o&&t("span",{class:"avatar__icon"},t("flip-icon-person",null)),v&&t("span",{class:d,innerHTML:this.badge,ref:a=>this.badgeEl=a})),this.showLabel&&t("span",{"aria-hidden":true,class:"avatar__label"},this.label))}get element(){return r(this)}static get watchers(){return{src:["watchSrcProp"]}}};o.style=s;export{o as flip_avatar};
|
|
2
|
+
//# sourceMappingURL=p-04eefcca.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-avatar/flip-avatar.css?tag=flip-avatar&encapsulation=shadow","src/components/flip-avatar/flip-avatar.tsx"],"names":["flipAvatarCss","flipAvatarSizeMappings","xs","s","m","l","xl","2xl","FlipAvatar","[object Object]","hostRef","this","badgePosition","interactive","showLabel","size","variant","setImageAvailable","imageAvailable","setImageUnavailable","onKeydown","event","code","preventDefault","element","click","onKeyup","forceBadgeProps","undefined","Boolean","badge","badgeEl","querySelector","setAttribute","showImage","src","showInitials","initials","showIcon","icon","showFallbackIcon","showBadge","role","className","classnames","avatar--has-icon","avatar--has-initials","avatar--interactive","badgeClassName","h","Host","aria-label","label","tabIndex","class","part","alt","height","onError","onLoad","width","innerHTML","ref","el","aria-hidden"],"mappings":"qHAAA,MAAMA,EAAgB,w2GCOtB,MAAMC,EAA8D,CAClEC,GAAI,GACJC,EAAG,GACHC,EAAG,GACHC,EAAG,GACHC,GAAI,GACJC,MAAO,WAQIC,EAAU,MALvBC,YAAAC,aASUC,KAAAC,cAA0C,SAG1CD,KAAAE,YAAwB,MAExBF,KAAAG,UAAsB,MACtBH,KAAAI,KAAwB,IAExBJ,KAAAK,QAA8B,QAyB9BL,KAAAM,kBAAoB,KAC1BN,KAAKO,eAAiB,MAGhBP,KAAAQ,oBAAsB,KAC5BR,KAAKO,eAAiB,OAGhBP,KAAAS,UAAaC,IAKnB,GAAIA,EAAMC,OAAS,QAAS,CAC1BD,EAAME,sBACD,GAAIF,EAAMC,OAAS,QAAS,CACjCD,EAAME,iBAENZ,KAAKa,QAAQC,UAITd,KAAAe,QAAWL,IACjB,GAAIA,EAAMC,OAAS,QAAS,CAC1BD,EAAME,iBAENZ,KAAKa,QAAQC,UA7CjBhB,mBACEE,KAAKgB,kBAIPlB,eACEE,KAAKO,eAAiBU,UAGhBnB,kBACN,IAAKoB,QAAQlB,KAAKmB,OAAQ,CACxB,OAGF,MAAMA,EAAQnB,KAAKoB,QAAQC,cAAc,cAEzCF,IAAK,MAALA,SAAK,OAAA,EAALA,EAAOG,aAAa,OAAQ,KAiC9BxB,SACE,MAAMyB,EACJL,QAAQlB,KAAKwB,OACZxB,KAAKO,gBAAkBP,KAAKO,iBAAmBU,WAElD,MAAMQ,GAAgBF,GAAaL,QAAQlB,KAAK0B,UAChD,MAAMC,GAAYJ,IAAcE,GAAgBP,QAAQlB,KAAK4B,MAC7D,MAAMC,GAAoBN,IAAcE,IAAiBE,EACzD,MAAMG,EAAYZ,QAAQlB,KAAKmB,QAAUnB,KAAKI,OAAS,IAEvD,MAAM2B,EAAO/B,KAAKE,YAAc,SAAW,MAE3C,MAAM8B,EAAYC,EAChB,SACA,gBAAgBjC,KAAKI,OACrB,mBAAmBJ,KAAKK,UACxB,CACE6B,mBAAoBP,GAAYE,EAChCM,uBAAwBV,EACxBW,sBAAuBpC,KAAKE,cAIhC,MAAMmC,EAAiBJ,EACrB,gBACA,2BAA2BjC,KAAKC,iBAGlC,OACEqC,EAACC,EAAI,CAAAC,aACSxC,KAAKyC,MACjBhC,UAAWT,KAAKE,YAAcF,KAAKS,UAAYQ,UAC/CF,QAASf,KAAKE,YAAcF,KAAKe,QAAUE,UAC3Cc,KAAMA,EACNW,SAAU1C,KAAKE,YAAc,EAAIe,WAEjCqB,EAAA,OAAA,CAAMK,MAAOX,EAAWY,KAAK,UAC1BrB,GACCe,EAAA,OAAA,CAAMK,MAAM,iBACVL,EAAA,MAAA,CACEO,IAAI,GACJC,OAAQxD,EAAuBU,KAAKI,MACpC2C,QAAS/C,KAAKQ,oBACdwC,OAAQhD,KAAKM,kBACbkB,IAAKxB,KAAKwB,IACVyB,MAAO3D,EAAuBU,KAAKI,SAIxCqB,GACCa,EAAA,OAAA,CAAMK,MAAM,oBACVL,EAAA,OAAA,KAAOtC,KAAK0B,WAGfC,GAAYW,EAAA,OAAA,CAAMK,MAAM,eAAeO,UAAWlD,KAAK4B,OACvDC,GACCS,EAAA,OAAA,CAAMK,MAAM,gBACVL,EAAA,mBAAA,OAGHR,GACCQ,EAAA,OAAA,CACEK,MAAON,EACPa,UAAWlD,KAAKmB,MAChBgC,IAAMC,GAAQpD,KAAKoB,QAAUgC,KAKlCpD,KAAKG,WACJmC,EAAA,OAAA,CAAAe,cAAA,KAAkBV,MAAM,iBACrB3C,KAAKyC","sourcesContent":[":host {\n display: inline-flex;\n align-items: center;\n flex-direction: column;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.avatar {\n position: relative;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n\n.avatar--has-icon {\n color: var(--s-icon-default);\n background-color: var(--s-surface-raised-default);\n}\n\n.avatar--has-initials {\n padding-right: 0;\n padding-left: 0;\n color: #fff;\n}\n\n.avatar--interactive {\n cursor: pointer;\n\n &:focus {\n outline-color: var(--s-focus-default);\n }\n}\n\n.avatar--size-xs {\n width: 1.75rem;\n height: 1.75rem;\n font-size: 0.75rem;\n\n &.avatar--has-icon {\n padding-right: 0.4375rem;\n padding-left: 0.4375rem;\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 0.5rem;\n }\n}\n\n.avatar--size-s {\n width: 2rem;\n height: 2rem;\n font-size: 0.75rem;\n\n &.avatar--has-icon {\n padding-right: var(--s-space-8);\n padding-left: var(--s-space-8);\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 0.5rem;\n }\n}\n\n.avatar--size-m {\n width: 2.5rem;\n height: 2.5rem;\n font-size: var(--s-font-size-base);\n\n &.avatar--has-icon {\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 0.625rem;\n }\n}\n\n.avatar--size-l {\n width: 3rem;\n height: 3rem;\n font-size: var(--s-font-size-lg);\n\n &.avatar--has-icon {\n padding-right: var(--s-space-12);\n padding-left: var(--s-space-12);\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 0.75rem;\n }\n}\n\n.avatar--size-xl {\n width: 4rem;\n height: 4rem;\n font-size: var(--s-font-size-xl);\n\n &.avatar--has-icon {\n padding-right: var(--s-space-16);\n padding-left: var(--s-space-16);\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 1rem;\n }\n}\n\n.avatar--size-2xl {\n width: 9rem;\n height: 9rem;\n font-size: 3.375rem;\n\n &.avatar--has-icon {\n padding-right: var(--s-space-32);\n padding-left: var(--s-space-32);\n }\n\n &.avatar--variant-square,\n &.avatar--variant-square .avatar__image,\n &.avatar--variant-square .avatar__initials {\n border-radius: 2.25rem;\n }\n}\n\n.avatar__image {\n overflow: hidden;\n width: 100%;\n height: 100%;\n border-radius: 50%;\n\n & > img {\n width: 100%;\n height: 100%;\n }\n}\n\n.avatar__icon {\n display: inline-flex;\n width: 100%;\n height: 100%;\n\n & > * {\n width: 100%;\n height: 100%;\n }\n\n & > *::part(icon) {\n width: 100%;\n height: 100%;\n }\n}\n\n.avatar__initials {\n display: inline-flex;\n width: 100%;\n min-width: 0;\n height: 100%;\n padding-right: 0.0625rem;\n padding-left: 0.0625rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n background-color: var(--s-decorative-6-default);\n\n & > span {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n}\n\n.avatar__badge {\n position: absolute;\n bottom: 0;\n left: 55%;\n display: inline-flex;\n min-width: 1.5rem;\n height: 1.5rem;\n transform: translate3d(0, 25%, 0);\n}\n\n.avatar__badge--position-top {\n top: 0;\n bottom: auto;\n transform: translate3d(0, -25%, 0);\n}\n\n.avatar__label {\n margin-top: var(--s-space-4);\n color: var(--s-icon-default);\n font-size: var(--s-font-size-sm);\n font-weight: var(--s-font-weight-medium);\n line-height: var(--s-line-height-sm);\n text-align: center;\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from \"@stencil/core\";\nimport classnames from \"classnames\";\n\nexport type FlipAvatarBadgePosition = \"bottom\" | \"top\";\nexport type FlipAvatarSize = \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\" | \"2xl\";\nexport type FlipAvatarVariant = \"round\" | \"square\";\n\nconst flipAvatarSizeMappings: { [key in FlipAvatarSize]: number } = {\n xs: 28,\n s: 32,\n m: 40,\n l: 48,\n xl: 64,\n \"2xl\": 144,\n};\n\n@Component({\n shadow: true,\n styleUrl: \"flip-avatar.css\",\n tag: \"flip-avatar\",\n})\nexport class FlipAvatar {\n @Element() element: HTMLElement;\n\n @Prop() badge?: string;\n @Prop() badgePosition?: FlipAvatarBadgePosition = \"bottom\";\n @Prop() icon?: string;\n @Prop() initials?: string;\n @Prop() interactive?: boolean = false;\n @Prop() label!: string;\n @Prop() showLabel?: boolean = false;\n @Prop() size?: FlipAvatarSize = \"m\";\n @Prop() src?: string;\n @Prop() variant?: FlipAvatarVariant = \"round\";\n\n @State() imageAvailable: boolean | undefined;\n\n private badgeEl: HTMLElement;\n\n componentDidLoad() {\n this.forceBadgeProps();\n }\n\n @Watch(\"src\")\n watchSrcProp() {\n this.imageAvailable = undefined;\n }\n\n private forceBadgeProps() {\n if (!Boolean(this.badge)) {\n return;\n }\n\n const badge = this.badgeEl.querySelector(\"flip-badge\");\n\n badge?.setAttribute(\"size\", \"m\");\n }\n\n private setImageAvailable = () => {\n this.imageAvailable = true;\n };\n\n private setImageUnavailable = () => {\n this.imageAvailable = false;\n };\n\n private onKeydown = (event: KeyboardEvent) => {\n // The interactive avatar is activated by the space key on the keyup event,\n // but the default action for space is already triggered on keydown. It\n // needs to be prevented to stop scrolling the page before activating the\n // avatar.\n if (event.code === \"Space\") {\n event.preventDefault();\n } else if (event.code === \"Enter\") {\n event.preventDefault();\n\n this.element.click();\n }\n };\n\n private onKeyup = (event: KeyboardEvent) => {\n if (event.code === \"Space\") {\n event.preventDefault();\n\n this.element.click();\n }\n };\n\n render() {\n const showImage =\n Boolean(this.src) &&\n (this.imageAvailable || this.imageAvailable === undefined);\n\n const showInitials = !showImage && Boolean(this.initials);\n const showIcon = !showImage && !showInitials && Boolean(this.icon);\n const showFallbackIcon = !showImage && !showInitials && !showIcon;\n const showBadge = Boolean(this.badge) && this.size === \"m\";\n\n const role = this.interactive ? \"button\" : \"img\";\n\n const className = classnames(\n \"avatar\",\n `avatar--size-${this.size}`,\n `avatar--variant-${this.variant}`,\n {\n \"avatar--has-icon\": showIcon || showFallbackIcon,\n \"avatar--has-initials\": showInitials,\n \"avatar--interactive\": this.interactive,\n }\n );\n\n const badgeClassName = classnames(\n \"avatar__badge\",\n `avatar__badge--position-${this.badgePosition}`\n );\n\n return (\n <Host\n aria-label={this.label}\n onKeydown={this.interactive ? this.onKeydown : undefined}\n onKeyup={this.interactive ? this.onKeyup : undefined}\n role={role}\n tabIndex={this.interactive ? 0 : undefined}\n >\n <span class={className} part=\"avatar\">\n {showImage && (\n <span class=\"avatar__image\">\n <img\n alt=\"\"\n height={flipAvatarSizeMappings[this.size]}\n onError={this.setImageUnavailable}\n onLoad={this.setImageAvailable}\n src={this.src}\n width={flipAvatarSizeMappings[this.size]}\n />\n </span>\n )}\n {showInitials && (\n <span class=\"avatar__initials\">\n <span>{this.initials}</span>\n </span>\n )}\n {showIcon && <span class=\"avatar__icon\" innerHTML={this.icon}></span>}\n {showFallbackIcon && (\n <span class=\"avatar__icon\">\n <flip-icon-person></flip-icon-person>\n </span>\n )}\n {showBadge && (\n <span\n class={badgeClassName}\n innerHTML={this.badge}\n ref={(el) => (this.badgeEl = el)}\n ></span>\n )}\n </span>\n\n {this.showLabel && (\n <span aria-hidden class=\"avatar__label\">\n {this.label}\n </span>\n )}\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,c as r,h as s,H as o,g as t}from"./p-9fe00e8a.js";const e=".sc-flip-radio-group-h{display:block}.sc-flip-radio-group-h *.sc-flip-radio-group{box-sizing:border-box}.radio-group.sc-flip-radio-group{display:flex;flex-direction:column;gap:var(--s-space-12)}";const a=class{constructor(s){i(this,s);this.valueChange=r(this,"valueChange",7)}componentDidLoad(){this.radioButtons=Array.from(this.el.querySelectorAll("flip-radio"));this.initValue();this.handleValueChanges()}initValue(){if(this.value===undefined){return}const i=this.radioButtons.find((i=>i.value===this.value));if(!Boolean(i)){return}i.checked=true}handleValueChanges(){for(const[i,r]of Object.entries(this.radioButtons)){r.addEventListener("valueChange",(()=>{if(r.checked===true||r.checked==="true"){this.valueChange.emit(r.value);this.value=r.value;this.radioButtons.forEach(((r,s)=>{if(String(s)===i){return}r.checked=false}))}}))}}render(){return s(o,{"aria-describedby":this.flipAriaDescribedby,role:"radiogroup"},s("div",{class:"radio-group"},s("slot",null)))}get el(){return t(this)}};a.style=e;export{a as flip_radio_group};
|
|
2
|
+
//# sourceMappingURL=p-1ff7b440.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-radio-group/flip-radio-group.css?tag=flip-radio-group&encapsulation=scoped","src/components/flip-radio-group/flip-radio-group.tsx"],"names":["flipRadioGroupCss","FlipRadioGroup","[object Object]","this","radioButtons","Array","from","el","querySelectorAll","initValue","handleValueChanges","value","undefined","radioWithValue","find","radio","Boolean","checked","key","Object","entries","addEventListener","valueChange","emit","forEach","r","k","String","h","Host","aria-describedby","flipAriaDescribedby","role","class"],"mappings":"gEAAA,MAAMA,EAAoB,2MCsBbC,EAAc,wEAUzBC,mBACEC,KAAKC,aAAeC,MAAMC,KAAKH,KAAKI,GAAGC,iBAAiB,eACxDL,KAAKM,YACLN,KAAKO,qBAGCR,YACN,GAAIC,KAAKQ,QAAUC,UAAW,CAC5B,OAGF,MAAMC,EAAiBV,KAAKC,aAAaU,MACtCC,GAAUA,EAAMJ,QAAUR,KAAKQ,QAGlC,IAAKK,QAAQH,GAAiB,CAC5B,OAGFA,EAAeI,QAAU,KAGnBf,qBACN,IAAK,MAAOgB,EAAKH,KAAUI,OAAOC,QAAQjB,KAAKC,cAAe,CAC5DW,EAAMM,iBAAiB,eAAe,KACpC,GAAIN,EAAME,UAAY,MAAQF,EAAME,UAAY,OAAQ,CACtDd,KAAKmB,YAAYC,KAAKR,EAAMJ,OAC5BR,KAAKQ,MAAQI,EAAMJ,MAEnBR,KAAKC,aAAaoB,SAAQ,CAACC,EAAGC,KAC5B,GAAIC,OAAOD,KAAOR,EAAK,CACrB,OAGFO,EAAER,QAAU,cAOtBf,SACE,OACE0B,EAACC,EAAI,CAAAC,mBAAmB3B,KAAK4B,oBAAqBC,KAAK,cACrDJ,EAAA,MAAA,CAAKK,MAAM,eACTL,EAAA,OAAA","sourcesContent":[":host {\n display: block;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.radio-group {\n display: flex;\n flex-direction: column;\n gap: var(--s-space-12);\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from \"@stencil/core\";\n\n@Component({\n /**\n * Form controls in shadow dom can still not be associated with labels in the\n * light dom, cross browser. So for now we disable shadow dom for form\n * controls (inputs, buttons, selects, etc.). Instead we use Stencil's scoping.\n * https://caniuse.com/?search=attachInternals\n */\n scoped: true,\n shadow: false,\n styleUrl: \"flip-radio-group.css\",\n tag: \"flip-radio-group\",\n})\nexport class FlipRadioGroup {\n @Element() el: HTMLElement;\n\n @Prop() flipAriaDescribedby?: string;\n @Prop({ mutable: true, reflect: true }) value?: string;\n\n @Event() valueChange: EventEmitter<string>;\n\n private radioButtons: HTMLFlipRadioElement[];\n\n componentDidLoad() {\n this.radioButtons = Array.from(this.el.querySelectorAll(\"flip-radio\"));\n this.initValue();\n this.handleValueChanges();\n }\n\n private initValue() {\n if (this.value === undefined) {\n return;\n }\n\n const radioWithValue = this.radioButtons.find(\n (radio) => radio.value === this.value\n );\n\n if (!Boolean(radioWithValue)) {\n return;\n }\n\n radioWithValue.checked = true;\n }\n\n private handleValueChanges() {\n for (const [key, radio] of Object.entries(this.radioButtons)) {\n radio.addEventListener(\"valueChange\", () => {\n if (radio.checked === true || radio.checked === \"true\") {\n this.valueChange.emit(radio.value);\n this.value = radio.value;\n\n this.radioButtons.forEach((r, k) => {\n if (String(k) === key) {\n return;\n }\n\n r.checked = false;\n });\n }\n });\n }\n }\n\n render() {\n return (\n <Host aria-describedby={this.flipAriaDescribedby} role=\"radiogroup\">\n <div class=\"radio-group\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as C,h as t,F as l}from"./p-9fe00e8a.js";const i=":host{display:inline-flex}";const s=class{constructor(t){C(this,t);this.size=24}render(){return t("svg",{class:"flip-icon",fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${this.size} ${this.size}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},this.size===16&&t(l,null,t("path",{d:"M7.15 12.8666L2.81667 8.53327C2.73889 8.45549 2.68333 8.37216 2.65 8.28327C2.61667 8.19438 2.6 8.09993 2.6 7.99993C2.6 7.89993 2.61667 7.80549 2.65 7.7166C2.68333 7.62771 2.73889 7.54438 2.81667 7.4666L7.15 3.13327C7.29444 2.99993 7.46955 2.93038 7.67533 2.9246C7.88066 2.91927 8.06111 2.98882 8.21666 3.13327C8.37222 3.27771 8.45289 3.45549 8.45867 3.6666C8.464 3.87771 8.38889 4.05549 8.23333 4.19993L5.2 7.23327H12.3167C12.5278 7.23327 12.7084 7.30838 12.8587 7.4586C13.0084 7.60838 13.0833 7.78882 13.0833 7.99993C13.0833 8.21105 13.0084 8.39149 12.8587 8.54127C12.7084 8.69149 12.5278 8.7666 12.3167 8.7666H5.2L8.23333 11.7999C8.37778 11.9333 8.45289 12.1084 8.45867 12.3253C8.464 12.5417 8.38889 12.7222 8.23333 12.8666C8.08889 13.011 7.91111 13.0833 7.7 13.0833C7.48889 13.0833 7.30555 13.011 7.15 12.8666V12.8666Z",fill:"currentColor"})),this.size===24&&t(l,null,t("path",{d:"M10.725 19.2999L4.225 12.7999C4.10833 12.6832 4.025 12.5582 3.975 12.4249C3.925 12.2916 3.9 12.1499 3.9 11.9999C3.9 11.8499 3.925 11.7082 3.975 11.5749C4.025 11.4416 4.10833 11.3166 4.225 11.1999L10.725 4.6999C10.9417 4.4999 11.2043 4.39557 11.513 4.3869C11.821 4.3789 12.0917 4.48323 12.325 4.6999C12.5583 4.91657 12.6793 5.18324 12.688 5.4999C12.696 5.81657 12.5833 6.08324 12.35 6.2999L7.8 10.8499H18.475C18.7917 10.8499 19.0627 10.9626 19.288 11.1879C19.5127 11.4126 19.625 11.6832 19.625 11.9999C19.625 12.3166 19.5127 12.5872 19.288 12.8119C19.0627 13.0372 18.7917 13.1499 18.475 13.1499H7.8L12.35 17.6999C12.5667 17.8999 12.6793 18.1626 12.688 18.4879C12.696 18.8126 12.5833 19.0832 12.35 19.2999C12.1333 19.5166 11.8667 19.6249 11.55 19.6249C11.2333 19.6249 10.9583 19.5166 10.725 19.2999V19.2999Z",fill:"currentColor"})),this.size===28&&t(l,null,t("path",{d:"M12.5125 22.5167L4.92917 14.9333C4.79306 14.7972 4.69584 14.6514 4.6375 14.4958C4.57917 14.3403 4.55 14.175 4.55 14C4.55 13.825 4.57917 13.6597 4.6375 13.5042C4.69584 13.3486 4.79306 13.2028 4.92917 13.0667L12.5125 5.48334C12.7653 5.25001 13.0717 5.12829 13.4318 5.11817C13.7912 5.10884 14.1069 5.23056 14.3792 5.48334C14.6514 5.73612 14.7926 6.04723 14.8027 6.41667C14.812 6.78612 14.6806 7.09723 14.4083 7.35001L9.1 12.6583H21.5542C21.9236 12.6583 22.2398 12.7898 22.5027 13.0527C22.7648 13.3148 22.8958 13.6306 22.8958 14C22.8958 14.3695 22.7648 14.6852 22.5027 14.9473C22.2398 15.2102 21.9236 15.3417 21.5542 15.3417H9.1L14.4083 20.65C14.6611 20.8833 14.7926 21.1898 14.8027 21.5693C14.812 21.9481 14.6806 22.2639 14.4083 22.5167C14.1556 22.7695 13.8444 22.8958 13.475 22.8958C13.1056 22.8958 12.7847 22.7695 12.5125 22.5167V22.5167Z",fill:"currentColor"})))}};s.style=i;const r=":host{display:inline-flex}";const n=class{constructor(t){C(this,t);this.size=24}render(){return t("svg",{class:"flip-icon",fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${this.size} ${this.size}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},this.size===16&&t(l,null,t("path",{d:"M7.46667 12.8667C7.32222 12.7222 7.24733 12.5445 7.242 12.3333C7.23622 12.1222 7.30555 11.9445 7.45 11.8L10.4833 8.76668H3.36667C3.15555 8.76668 2.97511 8.69157 2.82533 8.54135C2.67511 8.39157 2.6 8.21113 2.6 8.00002C2.6 7.7889 2.67511 7.60846 2.82533 7.45868C2.97511 7.30846 3.15555 7.23335 3.36667 7.23335H10.4833L7.45 4.20002C7.30555 4.05557 7.23622 3.87779 7.242 3.66668C7.24733 3.45557 7.32222 3.27779 7.46667 3.13335C7.61111 3.00002 7.78889 2.93335 8 2.93335C8.21111 2.93335 8.38889 3.00002 8.53333 3.13335L12.8667 7.46668C12.9444 7.53335 13 7.61379 13.0333 7.70802C13.0667 7.80268 13.0833 7.90002 13.0833 8.00002C13.0833 8.10002 13.0667 8.19446 13.0333 8.28335C13 8.37224 12.9444 8.45557 12.8667 8.53335L8.53333 12.8667C8.38889 13.0111 8.21111 13.0807 8 13.0753C7.78889 13.0696 7.61111 13 7.46667 12.8667V12.8667Z",fill:"currentColor"})),this.size===24&&t(l,null,t("path",{d:"M11.2 19.2999C10.9833 19.0832 10.871 18.8166 10.863 18.4999C10.8543 18.1832 10.9583 17.9166 11.175 17.6999L15.725 13.1499H5.05C4.73333 13.1499 4.46267 13.0372 4.238 12.8119C4.01267 12.5872 3.9 12.3166 3.9 11.9999C3.9 11.6832 4.01267 11.4126 4.238 11.1879C4.46267 10.9626 4.73333 10.8499 5.05 10.8499H15.725L11.175 6.2999C10.9583 6.08324 10.8543 5.81657 10.863 5.4999C10.871 5.18324 10.9833 4.91657 11.2 4.6999C11.4167 4.4999 11.6833 4.3999 12 4.3999C12.3167 4.3999 12.5833 4.4999 12.8 4.6999L19.3 11.1999C19.4167 11.2999 19.5 11.4206 19.55 11.5619C19.6 11.7039 19.625 11.8499 19.625 11.9999C19.625 12.1499 19.6 12.2916 19.55 12.4249C19.5 12.5582 19.4167 12.6832 19.3 12.7999L12.8 19.2999C12.5833 19.5166 12.3167 19.6209 12 19.6129C11.6833 19.6042 11.4167 19.4999 11.2 19.2999V19.2999Z",fill:"currentColor"})),this.size===28&&t(l,null,t("path",{d:"M13.0667 22.5166C12.8139 22.2639 12.6828 21.9527 12.6735 21.5833C12.6634 21.2139 12.7847 20.9027 13.0375 20.65L18.3458 15.3416H5.89167C5.52223 15.3416 5.20645 15.2102 4.94434 14.9473C4.68145 14.6852 4.55 14.3694 4.55 14C4.55 13.6305 4.68145 13.3147 4.94434 13.0526C5.20645 12.7897 5.52223 12.6583 5.89167 12.6583H18.3458L13.0375 7.34997C12.7847 7.09719 12.6634 6.78608 12.6735 6.41663C12.6828 6.04719 12.8139 5.73608 13.0667 5.4833C13.3194 5.24997 13.6306 5.1333 14 5.1333C14.3694 5.1333 14.6806 5.24997 14.9333 5.4833L22.5167 13.0666C22.6528 13.1833 22.75 13.3241 22.8083 13.489C22.8667 13.6546 22.8958 13.825 22.8958 14C22.8958 14.175 22.8667 14.3402 22.8083 14.4958C22.75 14.6514 22.6528 14.7972 22.5167 14.9333L14.9333 22.5166C14.6806 22.7694 14.3694 22.8911 14 22.8818C13.6306 22.8717 13.3194 22.75 13.0667 22.5166V22.5166Z",fill:"currentColor"})))}};n.style=r;const o=":host{display:inline-flex}";const h=class{constructor(t){C(this,t);this.size=24}render(){return t("svg",{class:"flip-icon",fill:"none",height:this.size,part:"icon",viewBox:`0 0 ${this.size} ${this.size}`,width:this.size,xmlns:"http://www.w3.org/2000/svg"},this.size===16&&t(l,null,t("path",{d:"M7.99999 10.2333C7.89999 10.2333 7.80555 10.2167 7.71666 10.1833C7.62777 10.15 7.54444 10.0944 7.46666 10.0167L5.01666 7.56665C4.87222 7.42221 4.79999 7.24443 4.79999 7.03332C4.79999 6.82221 4.87222 6.64443 5.01666 6.49999C5.14999 6.36665 5.32488 6.29732 5.54133 6.29199C5.75822 6.28621 5.93888 6.34999 6.08333 6.48332L7.23333 7.64999V3.04999C7.23333 2.83888 7.30844 2.6611 7.45866 2.51665C7.60844 2.37221 7.78888 2.29999 7.99999 2.29999C8.2111 2.29999 8.39155 2.37221 8.54133 2.51665C8.69155 2.6611 8.76666 2.83888 8.76666 3.04999V7.64999L9.91666 6.48332C10.0611 6.34999 10.2418 6.28621 10.4587 6.29199C10.6751 6.29732 10.85 6.36665 10.9833 6.49999C11.1278 6.64443 11.2 6.82221 11.2 7.03332C11.2 7.24443 11.1278 7.42221 10.9833 7.56665L8.53333 10.0167C8.45555 10.0944 8.37222 10.15 8.28333 10.1833C8.19444 10.2167 8.09999 10.2333 7.99999 10.2333ZM3.91666 13.5833C3.49444 13.5833 3.13622 13.436 2.84199 13.1413C2.54733 12.8471 2.39999 12.4889 2.39999 12.0667V10.5833C2.39999 10.3722 2.47511 10.1944 2.62533 10.05C2.77511 9.90554 2.95555 9.83332 3.16666 9.83332C3.37777 9.83332 3.55555 9.90554 3.69999 10.05C3.84444 10.1944 3.91666 10.3722 3.91666 10.5833V12.0667H12.0667V10.5833C12.0667 10.3722 12.1418 10.1944 12.292 10.05C12.4418 9.90554 12.6222 9.83332 12.8333 9.83332C13.0444 9.83332 13.2222 9.90554 13.3667 10.05C13.5111 10.1944 13.5833 10.3722 13.5833 10.5833V12.0667C13.5833 12.4889 13.436 12.8471 13.1413 13.1413C12.8471 13.436 12.4889 13.5833 12.0667 13.5833H3.91666Z",fill:"currentColor"})),this.size===24&&t(l,null,t("path",{d:"M12 15.35C11.85 15.35 11.7083 15.325 11.575 15.275C11.4417 15.225 11.3167 15.1417 11.2 15.025L7.52501 11.35C7.30834 11.1333 7.20001 10.8667 7.20001 10.55C7.20001 10.2333 7.30834 9.96668 7.52501 9.75001C7.72501 9.55001 7.98734 9.44601 8.31201 9.43801C8.63734 9.42935 8.90834 9.52501 9.12501 9.72501L10.85 11.475V4.57501C10.85 4.25835 10.9627 3.99168 11.188 3.77501C11.4127 3.55835 11.6833 3.45001 12 3.45001C12.3167 3.45001 12.5873 3.55835 12.812 3.77501C13.0373 3.99168 13.15 4.25835 13.15 4.57501V11.475L14.875 9.72501C15.0917 9.52501 15.3627 9.42935 15.688 9.43801C16.0127 9.44601 16.275 9.55001 16.475 9.75001C16.6917 9.96668 16.8 10.2333 16.8 10.55C16.8 10.8667 16.6917 11.1333 16.475 11.35L12.8 15.025C12.6833 15.1417 12.5583 15.225 12.425 15.275C12.2917 15.325 12.15 15.35 12 15.35ZM5.87501 20.375C5.24167 20.375 4.70434 20.154 4.26301 19.712C3.82101 19.2707 3.60001 18.7333 3.60001 18.1V15.875C3.60001 15.5583 3.71267 15.2917 3.93801 15.075C4.16267 14.8583 4.43334 14.75 4.75001 14.75C5.06667 14.75 5.33334 14.8583 5.55001 15.075C5.76667 15.2917 5.87501 15.5583 5.87501 15.875V18.1H18.1V15.875C18.1 15.5583 18.2127 15.2917 18.438 15.075C18.6627 14.8583 18.9333 14.75 19.25 14.75C19.5667 14.75 19.8333 14.8583 20.05 15.075C20.2667 15.2917 20.375 15.5583 20.375 15.875V18.1C20.375 18.7333 20.154 19.2707 19.712 19.712C19.2707 20.154 18.7333 20.375 18.1 20.375H5.87501Z",fill:"currentColor"})),this.size===28&&t(l,null,t("path",{d:"M14 17.9084C13.825 17.9084 13.6597 17.8792 13.5042 17.8209C13.3486 17.7625 13.2028 17.6653 13.0667 17.5292L8.77918 13.2417C8.5264 12.9889 8.40001 12.6778 8.40001 12.3084C8.40001 11.9389 8.5264 11.6278 8.77918 11.375C9.01251 11.1417 9.31857 11.0204 9.69735 11.011C10.0769 11.0009 10.3931 11.1125 10.6458 11.3459L12.6583 13.3875V5.33752C12.6583 4.96808 12.7898 4.65697 13.0527 4.40419C13.3148 4.15141 13.6306 4.02502 14 4.02502C14.3695 4.02502 14.6852 4.15141 14.9473 4.40419C15.2102 4.65697 15.3417 4.96808 15.3417 5.33752V13.3875L17.3542 11.3459C17.607 11.1125 17.9231 11.0009 18.3027 11.011C18.6815 11.0204 18.9875 11.1417 19.2208 11.375C19.4736 11.6278 19.6 11.9389 19.6 12.3084C19.6 12.6778 19.4736 12.9889 19.2208 13.2417L14.9333 17.5292C14.7972 17.6653 14.6514 17.7625 14.4958 17.8209C14.3403 17.8792 14.175 17.9084 14 17.9084ZM6.85418 23.7709C6.11529 23.7709 5.4884 23.513 4.97351 22.9974C4.45785 22.4825 4.20001 21.8556 4.20001 21.1167V18.5209C4.20001 18.1514 4.33146 17.8403 4.59435 17.5875C4.85646 17.3347 5.17223 17.2084 5.54168 17.2084C5.91112 17.2084 6.22223 17.3347 6.47501 17.5875C6.72779 17.8403 6.85418 18.1514 6.85418 18.5209V21.1167H21.1167V18.5209C21.1167 18.1514 21.2481 17.8403 21.511 17.5875C21.7731 17.3347 22.0889 17.2084 22.4583 17.2084C22.8278 17.2084 23.1389 17.3347 23.3917 17.5875C23.6445 17.8403 23.7708 18.1514 23.7708 18.5209V21.1167C23.7708 21.8556 23.513 22.4825 22.9973 22.9974C22.4825 23.513 21.8556 23.7709 21.1167 23.7709H6.85418Z",fill:"currentColor"})))}};h.style=o;export{s as flip_icon_arrow_left,n as flip_icon_arrow_right,h as flip_icon_download};
|
|
2
|
+
//# sourceMappingURL=p-3147334a.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-icon/flip-icon.css?tag=flip-icon-arrow-left&encapsulation=shadow","src/components/flip-icon/icons/flip-icon-arrow-left.tsx","src/components/flip-icon/flip-icon.css?tag=flip-icon-arrow-right&encapsulation=shadow","src/components/flip-icon/icons/flip-icon-arrow-right.tsx","src/components/flip-icon/flip-icon.css?tag=flip-icon-download&encapsulation=shadow","src/components/flip-icon/icons/flip-icon-download.tsx"],"names":["flipIconCss","FlipIconArrowLeft","[object Object]","hostRef","this","size","h","class","fill","height","part","viewBox","width","xmlns","Fragment","d","FlipIconArrowRight","FlipIconDownload"],"mappings":"kDAAA,MAAMA,EAAc,mCCUPC,EAAiB,MAL9BC,YAAAC,aAMUC,KAAAC,KAAqB,GAE7BH,SACE,OACEI,EAAA,MAAA,CACEC,MAAM,YACNC,KAAK,OACLC,OAAQL,KAAKC,KACbK,KAAK,OACLC,QAAS,OAAOP,KAAKC,QAAQD,KAAKC,OAClCO,MAAOR,KAAKC,KACZQ,MAAM,8BAELT,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,wzBACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,wyBACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,w0BACFP,KAAK,+BC5CnB,MAAMR,EAAc,mCCUPgB,EAAkB,MAL/Bd,YAAAC,aAMUC,KAAAC,KAAqB,GAE7BH,SACE,OACEI,EAAA,MAAA,CACEC,MAAM,YACNC,KAAK,OACLC,OAAQL,KAAKC,KACbK,KAAK,OACLC,QAAS,OAAOP,KAAKC,QAAQD,KAAKC,OAClCO,MAAOR,KAAKC,KACZQ,MAAM,8BAELT,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,uzBACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,mxBACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,+zBACFP,KAAK,+BC5CnB,MAAMR,EAAc,mCCUPiB,EAAgB,MAL7Bf,YAAAC,aAMUC,KAAAC,KAAqB,GAE7BH,SACE,OACEI,EAAA,MAAA,CACEC,MAAM,YACNC,KAAK,OACLC,OAAQL,KAAKC,KACbK,KAAK,OACLC,QAAS,OAAOP,KAAKC,QAAQD,KAAKC,OAClCO,MAAOR,KAAKC,KACZQ,MAAM,8BAELT,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,u8CACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,g2CACFP,KAAK,kBAIVJ,KAAKC,OAAS,IACbC,EAACQ,EAAQ,KACPR,EAAA,OAAA,CACES,EAAE,+7CACFP,KAAK","sourcesContent":[":host {\n display: inline-flex;\n}\n","// DO NOT EDIT. THIS FILE GETS GENERATED VIA \"yarn generate\".\n\nimport { Component, Fragment, h, Prop } from \"@stencil/core\";\nimport { FlipIconSize } from \"../flip-icon.types\";\n\n@Component({\n shadow: true,\n styleUrl: \"../flip-icon.css\",\n tag: \"flip-icon-arrow-left\",\n})\nexport class FlipIconArrowLeft {\n @Prop() size: FlipIconSize = 24;\n\n render() {\n return (\n <svg\n class=\"flip-icon\"\n fill=\"none\"\n height={this.size}\n part=\"icon\"\n viewBox={`0 0 ${this.size} ${this.size}`}\n width={this.size}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n {this.size === 16 && (\n <Fragment>\n <path\n d=\"M7.15 12.8666L2.81667 8.53327C2.73889 8.45549 2.68333 8.37216 2.65 8.28327C2.61667 8.19438 2.6 8.09993 2.6 7.99993C2.6 7.89993 2.61667 7.80549 2.65 7.7166C2.68333 7.62771 2.73889 7.54438 2.81667 7.4666L7.15 3.13327C7.29444 2.99993 7.46955 2.93038 7.67533 2.9246C7.88066 2.91927 8.06111 2.98882 8.21666 3.13327C8.37222 3.27771 8.45289 3.45549 8.45867 3.6666C8.464 3.87771 8.38889 4.05549 8.23333 4.19993L5.2 7.23327H12.3167C12.5278 7.23327 12.7084 7.30838 12.8587 7.4586C13.0084 7.60838 13.0833 7.78882 13.0833 7.99993C13.0833 8.21105 13.0084 8.39149 12.8587 8.54127C12.7084 8.69149 12.5278 8.7666 12.3167 8.7666H5.2L8.23333 11.7999C8.37778 11.9333 8.45289 12.1084 8.45867 12.3253C8.464 12.5417 8.38889 12.7222 8.23333 12.8666C8.08889 13.011 7.91111 13.0833 7.7 13.0833C7.48889 13.0833 7.30555 13.011 7.15 12.8666V12.8666Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 24 && (\n <Fragment>\n <path\n d=\"M10.725 19.2999L4.225 12.7999C4.10833 12.6832 4.025 12.5582 3.975 12.4249C3.925 12.2916 3.9 12.1499 3.9 11.9999C3.9 11.8499 3.925 11.7082 3.975 11.5749C4.025 11.4416 4.10833 11.3166 4.225 11.1999L10.725 4.6999C10.9417 4.4999 11.2043 4.39557 11.513 4.3869C11.821 4.3789 12.0917 4.48323 12.325 4.6999C12.5583 4.91657 12.6793 5.18324 12.688 5.4999C12.696 5.81657 12.5833 6.08324 12.35 6.2999L7.8 10.8499H18.475C18.7917 10.8499 19.0627 10.9626 19.288 11.1879C19.5127 11.4126 19.625 11.6832 19.625 11.9999C19.625 12.3166 19.5127 12.5872 19.288 12.8119C19.0627 13.0372 18.7917 13.1499 18.475 13.1499H7.8L12.35 17.6999C12.5667 17.8999 12.6793 18.1626 12.688 18.4879C12.696 18.8126 12.5833 19.0832 12.35 19.2999C12.1333 19.5166 11.8667 19.6249 11.55 19.6249C11.2333 19.6249 10.9583 19.5166 10.725 19.2999V19.2999Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 28 && (\n <Fragment>\n <path\n d=\"M12.5125 22.5167L4.92917 14.9333C4.79306 14.7972 4.69584 14.6514 4.6375 14.4958C4.57917 14.3403 4.55 14.175 4.55 14C4.55 13.825 4.57917 13.6597 4.6375 13.5042C4.69584 13.3486 4.79306 13.2028 4.92917 13.0667L12.5125 5.48334C12.7653 5.25001 13.0717 5.12829 13.4318 5.11817C13.7912 5.10884 14.1069 5.23056 14.3792 5.48334C14.6514 5.73612 14.7926 6.04723 14.8027 6.41667C14.812 6.78612 14.6806 7.09723 14.4083 7.35001L9.1 12.6583H21.5542C21.9236 12.6583 22.2398 12.7898 22.5027 13.0527C22.7648 13.3148 22.8958 13.6306 22.8958 14C22.8958 14.3695 22.7648 14.6852 22.5027 14.9473C22.2398 15.2102 21.9236 15.3417 21.5542 15.3417H9.1L14.4083 20.65C14.6611 20.8833 14.7926 21.1898 14.8027 21.5693C14.812 21.9481 14.6806 22.2639 14.4083 22.5167C14.1556 22.7695 13.8444 22.8958 13.475 22.8958C13.1056 22.8958 12.7847 22.7695 12.5125 22.5167V22.5167Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n </svg>\n );\n }\n}\n",":host {\n display: inline-flex;\n}\n","// DO NOT EDIT. THIS FILE GETS GENERATED VIA \"yarn generate\".\n\nimport { Component, Fragment, h, Prop } from \"@stencil/core\";\nimport { FlipIconSize } from \"../flip-icon.types\";\n\n@Component({\n shadow: true,\n styleUrl: \"../flip-icon.css\",\n tag: \"flip-icon-arrow-right\",\n})\nexport class FlipIconArrowRight {\n @Prop() size: FlipIconSize = 24;\n\n render() {\n return (\n <svg\n class=\"flip-icon\"\n fill=\"none\"\n height={this.size}\n part=\"icon\"\n viewBox={`0 0 ${this.size} ${this.size}`}\n width={this.size}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n {this.size === 16 && (\n <Fragment>\n <path\n d=\"M7.46667 12.8667C7.32222 12.7222 7.24733 12.5445 7.242 12.3333C7.23622 12.1222 7.30555 11.9445 7.45 11.8L10.4833 8.76668H3.36667C3.15555 8.76668 2.97511 8.69157 2.82533 8.54135C2.67511 8.39157 2.6 8.21113 2.6 8.00002C2.6 7.7889 2.67511 7.60846 2.82533 7.45868C2.97511 7.30846 3.15555 7.23335 3.36667 7.23335H10.4833L7.45 4.20002C7.30555 4.05557 7.23622 3.87779 7.242 3.66668C7.24733 3.45557 7.32222 3.27779 7.46667 3.13335C7.61111 3.00002 7.78889 2.93335 8 2.93335C8.21111 2.93335 8.38889 3.00002 8.53333 3.13335L12.8667 7.46668C12.9444 7.53335 13 7.61379 13.0333 7.70802C13.0667 7.80268 13.0833 7.90002 13.0833 8.00002C13.0833 8.10002 13.0667 8.19446 13.0333 8.28335C13 8.37224 12.9444 8.45557 12.8667 8.53335L8.53333 12.8667C8.38889 13.0111 8.21111 13.0807 8 13.0753C7.78889 13.0696 7.61111 13 7.46667 12.8667V12.8667Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 24 && (\n <Fragment>\n <path\n d=\"M11.2 19.2999C10.9833 19.0832 10.871 18.8166 10.863 18.4999C10.8543 18.1832 10.9583 17.9166 11.175 17.6999L15.725 13.1499H5.05C4.73333 13.1499 4.46267 13.0372 4.238 12.8119C4.01267 12.5872 3.9 12.3166 3.9 11.9999C3.9 11.6832 4.01267 11.4126 4.238 11.1879C4.46267 10.9626 4.73333 10.8499 5.05 10.8499H15.725L11.175 6.2999C10.9583 6.08324 10.8543 5.81657 10.863 5.4999C10.871 5.18324 10.9833 4.91657 11.2 4.6999C11.4167 4.4999 11.6833 4.3999 12 4.3999C12.3167 4.3999 12.5833 4.4999 12.8 4.6999L19.3 11.1999C19.4167 11.2999 19.5 11.4206 19.55 11.5619C19.6 11.7039 19.625 11.8499 19.625 11.9999C19.625 12.1499 19.6 12.2916 19.55 12.4249C19.5 12.5582 19.4167 12.6832 19.3 12.7999L12.8 19.2999C12.5833 19.5166 12.3167 19.6209 12 19.6129C11.6833 19.6042 11.4167 19.4999 11.2 19.2999V19.2999Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 28 && (\n <Fragment>\n <path\n d=\"M13.0667 22.5166C12.8139 22.2639 12.6828 21.9527 12.6735 21.5833C12.6634 21.2139 12.7847 20.9027 13.0375 20.65L18.3458 15.3416H5.89167C5.52223 15.3416 5.20645 15.2102 4.94434 14.9473C4.68145 14.6852 4.55 14.3694 4.55 14C4.55 13.6305 4.68145 13.3147 4.94434 13.0526C5.20645 12.7897 5.52223 12.6583 5.89167 12.6583H18.3458L13.0375 7.34997C12.7847 7.09719 12.6634 6.78608 12.6735 6.41663C12.6828 6.04719 12.8139 5.73608 13.0667 5.4833C13.3194 5.24997 13.6306 5.1333 14 5.1333C14.3694 5.1333 14.6806 5.24997 14.9333 5.4833L22.5167 13.0666C22.6528 13.1833 22.75 13.3241 22.8083 13.489C22.8667 13.6546 22.8958 13.825 22.8958 14C22.8958 14.175 22.8667 14.3402 22.8083 14.4958C22.75 14.6514 22.6528 14.7972 22.5167 14.9333L14.9333 22.5166C14.6806 22.7694 14.3694 22.8911 14 22.8818C13.6306 22.8717 13.3194 22.75 13.0667 22.5166V22.5166Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n </svg>\n );\n }\n}\n",":host {\n display: inline-flex;\n}\n","// DO NOT EDIT. THIS FILE GETS GENERATED VIA \"yarn generate\".\n\nimport { Component, Fragment, h, Prop } from \"@stencil/core\";\nimport { FlipIconSize } from \"../flip-icon.types\";\n\n@Component({\n shadow: true,\n styleUrl: \"../flip-icon.css\",\n tag: \"flip-icon-download\",\n})\nexport class FlipIconDownload {\n @Prop() size: FlipIconSize = 24;\n\n render() {\n return (\n <svg\n class=\"flip-icon\"\n fill=\"none\"\n height={this.size}\n part=\"icon\"\n viewBox={`0 0 ${this.size} ${this.size}`}\n width={this.size}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n {this.size === 16 && (\n <Fragment>\n <path\n d=\"M7.99999 10.2333C7.89999 10.2333 7.80555 10.2167 7.71666 10.1833C7.62777 10.15 7.54444 10.0944 7.46666 10.0167L5.01666 7.56665C4.87222 7.42221 4.79999 7.24443 4.79999 7.03332C4.79999 6.82221 4.87222 6.64443 5.01666 6.49999C5.14999 6.36665 5.32488 6.29732 5.54133 6.29199C5.75822 6.28621 5.93888 6.34999 6.08333 6.48332L7.23333 7.64999V3.04999C7.23333 2.83888 7.30844 2.6611 7.45866 2.51665C7.60844 2.37221 7.78888 2.29999 7.99999 2.29999C8.2111 2.29999 8.39155 2.37221 8.54133 2.51665C8.69155 2.6611 8.76666 2.83888 8.76666 3.04999V7.64999L9.91666 6.48332C10.0611 6.34999 10.2418 6.28621 10.4587 6.29199C10.6751 6.29732 10.85 6.36665 10.9833 6.49999C11.1278 6.64443 11.2 6.82221 11.2 7.03332C11.2 7.24443 11.1278 7.42221 10.9833 7.56665L8.53333 10.0167C8.45555 10.0944 8.37222 10.15 8.28333 10.1833C8.19444 10.2167 8.09999 10.2333 7.99999 10.2333ZM3.91666 13.5833C3.49444 13.5833 3.13622 13.436 2.84199 13.1413C2.54733 12.8471 2.39999 12.4889 2.39999 12.0667V10.5833C2.39999 10.3722 2.47511 10.1944 2.62533 10.05C2.77511 9.90554 2.95555 9.83332 3.16666 9.83332C3.37777 9.83332 3.55555 9.90554 3.69999 10.05C3.84444 10.1944 3.91666 10.3722 3.91666 10.5833V12.0667H12.0667V10.5833C12.0667 10.3722 12.1418 10.1944 12.292 10.05C12.4418 9.90554 12.6222 9.83332 12.8333 9.83332C13.0444 9.83332 13.2222 9.90554 13.3667 10.05C13.5111 10.1944 13.5833 10.3722 13.5833 10.5833V12.0667C13.5833 12.4889 13.436 12.8471 13.1413 13.1413C12.8471 13.436 12.4889 13.5833 12.0667 13.5833H3.91666Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 24 && (\n <Fragment>\n <path\n d=\"M12 15.35C11.85 15.35 11.7083 15.325 11.575 15.275C11.4417 15.225 11.3167 15.1417 11.2 15.025L7.52501 11.35C7.30834 11.1333 7.20001 10.8667 7.20001 10.55C7.20001 10.2333 7.30834 9.96668 7.52501 9.75001C7.72501 9.55001 7.98734 9.44601 8.31201 9.43801C8.63734 9.42935 8.90834 9.52501 9.12501 9.72501L10.85 11.475V4.57501C10.85 4.25835 10.9627 3.99168 11.188 3.77501C11.4127 3.55835 11.6833 3.45001 12 3.45001C12.3167 3.45001 12.5873 3.55835 12.812 3.77501C13.0373 3.99168 13.15 4.25835 13.15 4.57501V11.475L14.875 9.72501C15.0917 9.52501 15.3627 9.42935 15.688 9.43801C16.0127 9.44601 16.275 9.55001 16.475 9.75001C16.6917 9.96668 16.8 10.2333 16.8 10.55C16.8 10.8667 16.6917 11.1333 16.475 11.35L12.8 15.025C12.6833 15.1417 12.5583 15.225 12.425 15.275C12.2917 15.325 12.15 15.35 12 15.35ZM5.87501 20.375C5.24167 20.375 4.70434 20.154 4.26301 19.712C3.82101 19.2707 3.60001 18.7333 3.60001 18.1V15.875C3.60001 15.5583 3.71267 15.2917 3.93801 15.075C4.16267 14.8583 4.43334 14.75 4.75001 14.75C5.06667 14.75 5.33334 14.8583 5.55001 15.075C5.76667 15.2917 5.87501 15.5583 5.87501 15.875V18.1H18.1V15.875C18.1 15.5583 18.2127 15.2917 18.438 15.075C18.6627 14.8583 18.9333 14.75 19.25 14.75C19.5667 14.75 19.8333 14.8583 20.05 15.075C20.2667 15.2917 20.375 15.5583 20.375 15.875V18.1C20.375 18.7333 20.154 19.2707 19.712 19.712C19.2707 20.154 18.7333 20.375 18.1 20.375H5.87501Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n {this.size === 28 && (\n <Fragment>\n <path\n d=\"M14 17.9084C13.825 17.9084 13.6597 17.8792 13.5042 17.8209C13.3486 17.7625 13.2028 17.6653 13.0667 17.5292L8.77918 13.2417C8.5264 12.9889 8.40001 12.6778 8.40001 12.3084C8.40001 11.9389 8.5264 11.6278 8.77918 11.375C9.01251 11.1417 9.31857 11.0204 9.69735 11.011C10.0769 11.0009 10.3931 11.1125 10.6458 11.3459L12.6583 13.3875V5.33752C12.6583 4.96808 12.7898 4.65697 13.0527 4.40419C13.3148 4.15141 13.6306 4.02502 14 4.02502C14.3695 4.02502 14.6852 4.15141 14.9473 4.40419C15.2102 4.65697 15.3417 4.96808 15.3417 5.33752V13.3875L17.3542 11.3459C17.607 11.1125 17.9231 11.0009 18.3027 11.011C18.6815 11.0204 18.9875 11.1417 19.2208 11.375C19.4736 11.6278 19.6 11.9389 19.6 12.3084C19.6 12.6778 19.4736 12.9889 19.2208 13.2417L14.9333 17.5292C14.7972 17.6653 14.6514 17.7625 14.4958 17.8209C14.3403 17.8792 14.175 17.9084 14 17.9084ZM6.85418 23.7709C6.11529 23.7709 5.4884 23.513 4.97351 22.9974C4.45785 22.4825 4.20001 21.8556 4.20001 21.1167V18.5209C4.20001 18.1514 4.33146 17.8403 4.59435 17.5875C4.85646 17.3347 5.17223 17.2084 5.54168 17.2084C5.91112 17.2084 6.22223 17.3347 6.47501 17.5875C6.72779 17.8403 6.85418 18.1514 6.85418 18.5209V21.1167H21.1167V18.5209C21.1167 18.1514 21.2481 17.8403 21.511 17.5875C21.7731 17.3347 22.0889 17.2084 22.4583 17.2084C22.8278 17.2084 23.1389 17.3347 23.3917 17.5875C23.6445 17.8403 23.7708 18.1514 23.7708 18.5209V21.1167C23.7708 21.8556 23.513 22.4825 22.9973 22.9974C22.4825 23.513 21.8556 23.7709 21.1167 23.7709H6.85418Z\"\n fill=\"currentColor\"\n />\n </Fragment>\n )}\n </svg>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as o,c as a,h as i,H as t}from"./p-9fe00e8a.js";import{A as s}from"./p-fe0b5250.js";import{d as e,e as d}from"./p-33c168b3.js";import{c as l}from"./p-efffd297.js";import"./p-86bd3473.js";const r=':host{--flip-ghost-button-background-default:var(--s-surface-overlay-default);--flip-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--flip-ghost-button-background-pressed:var(--s-surface-overlay-pressed);display:block}:host *{box-sizing:border-box}.modal{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0}.modal[aria-hidden="true"]{display:none}.modal:not(.modal--closing) .modal__backdrop{-webkit-animation:0.15s modal-backdrop-fade-in;animation:0.15s modal-backdrop-fade-in}@media (prefers-reduced-motion){.modal:not(.modal--closing) .modal__backdrop{-webkit-animation:none;animation:none}}.modal:not(.modal--closing) .modal__body{-webkit-animation:0.15s modal-scale-in;animation:0.15s modal-scale-in}@media (prefers-reduced-motion){.modal:not(.modal--closing) .modal__body{-webkit-animation:none;animation:none}}.modal--closing{-webkit-animation:0.15s modal-fade-out;animation:0.15s modal-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.modal--closing{-webkit-animation:none;animation:none}}@media (min-width: 768px){.modal--scrollable .modal__content{padding-bottom:0}}.modal--scrollable:not(.modal--scrolled-down) .modal__controls{border-top:var(--s-border-width-default) solid var(--s-border-default)}@media (min-width: 768px){.modal--scrolled .modal__header{border-bottom:var(--s-border-width-default) solid var(--s-border-default)}}.modal__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.modal__body{position:relative;z-index:var(--s-z-40);display:flex;width:100vw;height:100vh;background-color:var(--s-surface-overlay-default);flex-direction:column}@media (min-width: 768px){.modal__body{width:90vw;max-width:33.75rem;height:auto;max-height:90vh;border-radius:var(--s-border-radius-base);box-shadow:0.125rem 0.25rem 1rem rgba(0, 0, 0, 0.14)}}.modal__close-button{position:absolute;top:var(--s-space-8);left:var(--s-space-8)}@media (min-width: 768px){.modal__close-button{top:var(--s-space-16);right:var(--s-space-16);left:auto}}.modal__header{display:flex;height:3.5rem;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:calc(var(--s-space-8) + 2.5rem + var(--s-space-8));flex-shrink:0;align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);gap:var(--s-space-16)}@media (min-width: 768px){.modal__header{height:4.125rem;padding-top:var(--s-space-24);padding-right:calc(var(--s-space-16) + 2.5rem + var(--s-space-8));padding-bottom:var(--s-space-16);padding-left:var(--s-space-24);border-bottom:none}}.modal__heading{overflow:hidden}.modal__heading::part(heading){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.modal__content{overflow-x:hidden;overflow-y:auto;padding-top:var(--s-space-24);padding-right:var(--s-space-16);padding-bottom:var(--s-space-24);padding-left:var(--s-space-16);flex-grow:1;line-height:var(--s-line-height-base)}.modal__content ::slotted(*){margin:0}@media (min-width: 768px){.modal__content{padding-top:0;padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24)}}.modal__controls{display:flex;padding-top:var(--s-space-16);padding-right:var(--s-space-24);padding-bottom:var(--s-space-16);padding-left:var(--s-space-24);flex-shrink:0;justify-content:flex-end}@-webkit-keyframes modal-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes modal-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes modal-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes modal-backdrop-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes modal-fade-out{from{opacity:1}to{opacity:0}}@keyframes modal-fade-out{from{opacity:1}to{opacity:0}}';const n=class{constructor(i){o(this,i);this.primaryAction=a(this,"primaryAction",7);this.secondaryAction=a(this,"secondaryAction",7);this.closeButtonLabel="Close modal";this.closing=false;this.scrollable=false;this.scrolled=false;this.scrolledDown=false;this.onKeyDown=o=>{if(o.code==="Escape"){this.close()}};this.onBackdropClick=()=>{this.close()};this.onCloseButtonClick=()=>{this.close()};this.onPrimaryAction=o=>{this.primaryAction.emit(o);this.close()};this.onSecondaryAction=o=>{this.secondaryAction.emit(o);this.close()};this.determineScrollStatus=()=>{var o,a,i,t,s,e;const d=((o=this.scrollContainer)===null||o===void 0?void 0:o.scrollTop)>0;const l=Math.ceil(((a=this.scrollContainer)===null||a===void 0?void 0:a.scrollTop)+((i=this.scrollContainer)===null||i===void 0?void 0:i.offsetHeight))>=((t=this.scrollContainer)===null||t===void 0?void 0:t.scrollHeight);const r=((s=this.scrollContainer)===null||s===void 0?void 0:s.scrollHeight)>((e=this.scrollContainer)===null||e===void 0?void 0:e.offsetHeight);if(d!==this.scrolled){this.scrolled=d}if(l!==this.scrolledDown){this.scrolledDown=l}if(r!==this.scrollable){this.scrollable=r}}}componentDidLoad(){this.modal=new s(this.modalEl);this.determineScrollStatus()}disconnectedCallback(){var o;(o=this.modal)===null||o===void 0?void 0:o.destroy();this.unlockBodyScroll()}onWindowResize(){this.determineScrollStatus()}async open(){this.modal.show();this.lockBodyScroll();this.determineScrollStatus()}async close(){if(this.closing){return}this.closing=true;this.unlockBodyScroll();setTimeout((()=>{this.modal.hide();this.closing=false}),150)}lockBodyScroll(){e(this.scrollContainer)}unlockBodyScroll(){d(this.scrollContainer)}render(){const o=l("modal",{"modal--closing":this.closing,"modal--scrollable":this.scrollable,"modal--scrolled":this.scrolled,"modal--scrolled-down":this.scrolledDown});return i(t,null,i("section",{"aria-hidden":"true","aria-label":this.label,class:o,id:"modal",onKeyDown:this.onKeyDown,ref:o=>this.modalEl=o},i("div",{class:"modal__backdrop",onClick:this.onBackdropClick}),i("div",{class:"modal__body",role:"document"},i("flip-button",{class:"modal__close-button",hideLabel:true,icon:"<flip-icon-close></flip-icon-close>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),i("header",{class:"modal__header"},i("flip-heading",{as:"h2",class:"modal__heading",level:3,text:this.label})),i("div",{class:"modal__content",onScroll:this.determineScrollStatus,ref:o=>this.scrollContainer=o},i("slot",null)),i("footer",{class:"modal__controls"},i("flip-button-group",{wrap:true},this.secondaryActionLabel&&i("flip-button",{label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&i("flip-button",{intent:"primary",label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:"flat"}))))))}};n.style=r;export{n as flip_modal};
|
|
2
|
+
//# sourceMappingURL=p-5022e258.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-modal/flip-modal.css?tag=flip-modal&encapsulation=shadow","src/components/flip-modal/flip-modal.tsx"],"names":["flipModalCss","FlipModal","[object Object]","hostRef","this","closeButtonLabel","closing","scrollable","scrolled","scrolledDown","onKeyDown","event","code","close","onBackdropClick","onCloseButtonClick","onPrimaryAction","primaryAction","emit","onSecondaryAction","secondaryAction","determineScrollStatus","_a","scrollContainer","scrollTop","Math","ceil","_b","_c","offsetHeight","_d","scrollHeight","_e","_f","modal","A11yDialog","modalEl","destroy","unlockBodyScroll","show","lockBodyScroll","setTimeout","hide","disableBodyScroll","enableBodyScroll","className","classnames","modal--closing","modal--scrollable","modal--scrolled","modal--scrolled-down","h","Host","aria-hidden","aria-label","label","class","id","ref","el","onClick","role","hideLabel","icon","as","level","text","onScroll","wrap","secondaryActionLabel","primaryActionLabel","intent","variant"],"mappings":"oMAAA,MAAMA,EAAe,utHCoBRC,EAAS,MALtBC,YAAAC,2GAMUC,KAAAC,iBAA4B,cAQ3BD,KAAAE,QAAU,MACVF,KAAAG,WAAa,MACbH,KAAAI,SAAW,MACXJ,KAAAK,aAAe,MAiDxBL,KAAAM,UAAaC,IACX,GAAIA,EAAMC,OAAS,SAAU,CAC3BR,KAAKS,UAIDT,KAAAU,gBAAkB,KACxBV,KAAKS,SAGCT,KAAAW,mBAAqB,KAC3BX,KAAKS,SAGCT,KAAAY,gBAAmBL,IACzBP,KAAKa,cAAcC,KAAKP,GACxBP,KAAKS,SAGCT,KAAAe,kBAAqBR,IAC3BP,KAAKgB,gBAAgBF,KAAKP,GAC1BP,KAAKS,SAGCT,KAAAiB,sBAAwB,qBAC9B,MAAMb,IAAWc,EAAAlB,KAAKmB,mBAAe,MAAAD,SAAA,OAAA,EAAAA,EAAEE,WAAY,EAEnD,MAAMf,EACJgB,KAAKC,OACHC,EAAAvB,KAAKmB,mBAAe,MAAAI,SAAA,OAAA,EAAAA,EAAEH,aAAYI,EAAAxB,KAAKmB,mBAAe,MAAAK,SAAA,OAAA,EAAAA,EAAEC,kBACrDC,EAAA1B,KAAKmB,mBAAe,MAAAO,SAAA,OAAA,EAAAA,EAAEC,cAE7B,MAAMxB,IACJyB,EAAA5B,KAAKmB,mBAAe,MAAAS,SAAA,OAAA,EAAAA,EAAED,gBAAeE,EAAA7B,KAAKmB,mBAAe,MAAAU,SAAA,OAAA,EAAAA,EAAEJ,cAE7D,GAAIrB,IAAaJ,KAAKI,SAAU,CAC9BJ,KAAKI,SAAWA,EAGlB,GAAIC,IAAiBL,KAAKK,aAAc,CACtCL,KAAKK,aAAeA,EAGtB,GAAIF,IAAeH,KAAKG,WAAY,CAClCH,KAAKG,WAAaA,IAvFtBL,mBACEE,KAAK8B,MAAQ,IAAIC,EAAW/B,KAAKgC,SACjChC,KAAKiB,wBAGPnB,8BACEoB,EAAAlB,KAAK8B,SAAK,MAAAZ,SAAA,OAAA,EAAAA,EAAEe,UACZjC,KAAKkC,mBAIPpC,iBACEE,KAAKiB,wBAOPnB,aACEE,KAAK8B,MAAMK,OACXnC,KAAKoC,iBACLpC,KAAKiB,wBAOPnB,cACE,GAAIE,KAAKE,QAAS,CAChB,OAGFF,KAAKE,QAAU,KACfF,KAAKkC,mBAELG,YAAW,KACTrC,KAAK8B,MAAMQ,OACXtC,KAAKE,QAAU,QACd,KAmDGJ,iBACNyC,EAAkBvC,KAAKmB,iBAGjBrB,mBACN0C,EAAiBxC,KAAKmB,iBAGxBrB,SACE,MAAM2C,EAAYC,EAAW,QAAS,CACpCC,iBAAkB3C,KAAKE,QACvB0C,oBAAqB5C,KAAKG,WAC1B0C,kBAAmB7C,KAAKI,SACxB0C,uBAAwB9C,KAAKK,eAG/B,OACE0C,EAACC,EAAI,KACHD,EAAA,UAAA,CAAAE,cACc,OAAMC,aACNlD,KAAKmD,MACjBC,MAAOX,EACPY,GAAG,QACH/C,UAAWN,KAAKM,UAChBgD,IAAMC,GAAQvD,KAAKgC,QAAUuB,GAE7BR,EAAA,MAAA,CAAKK,MAAM,kBAAkBI,QAASxD,KAAKU,kBAC3CqC,EAAA,MAAA,CAAKK,MAAM,cAAcK,KAAK,YAC5BV,EAAA,cAAA,CACEK,MAAM,sBACNM,UAAS,KACTC,KAAK,sCACLR,MAAOnD,KAAKC,iBACZuD,QAASxD,KAAKW,qBAEhBoC,EAAA,SAAA,CAAQK,MAAM,iBACZL,EAAA,eAAA,CACEa,GAAG,KACHR,MAAM,iBACNS,MAAO,EACPC,KAAM9D,KAAKmD,SAGfJ,EAAA,MAAA,CACEK,MAAM,iBACNW,SAAU/D,KAAKiB,sBACfqC,IAAMC,GAAQvD,KAAKmB,gBAAkBoC,GAErCR,EAAA,OAAA,OAEFA,EAAA,SAAA,CAAQK,MAAM,mBACZL,EAAA,oBAAA,CAAmBiB,KAAI,MACpBhE,KAAKiE,sBACJlB,EAAA,cAAA,CACEI,MAAOnD,KAAKiE,qBACZT,QAASxD,KAAKe,oBAGjBf,KAAKkE,oBACJnB,EAAA,cAAA,CACEoB,OAAO,UACPhB,MAAOnD,KAAKkE,mBACZV,QAASxD,KAAKY,gBACdwD,QAAQ","sourcesContent":["@import \"../../styles/media-queries.css\";\n\n:host {\n --flip-ghost-button-background-default: var(--s-surface-overlay-default);\n --flip-ghost-button-background-hovered: var(--s-surface-overlay-hovered);\n --flip-ghost-button-background-pressed: var(--s-surface-overlay-pressed);\n\n display: block;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.modal {\n position: fixed;\n z-index: var(--s-z-40);\n display: flex;\n justify-content: center;\n align-items: center;\n inset: 0;\n\n &[aria-hidden=\"true\"] {\n display: none;\n }\n}\n\n.modal:not(.modal--closing) {\n & .modal__backdrop {\n animation: 0.15s modal-backdrop-fade-in;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n }\n\n & .modal__body {\n animation: 0.15s modal-scale-in;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n }\n}\n\n.modal--closing {\n animation: 0.15s modal-fade-out;\n animation-fill-mode: forwards;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n}\n\n.modal--scrollable {\n & .modal__content {\n @media (--from-tablet) {\n padding-bottom: 0;\n }\n }\n\n &:not(.modal--scrolled-down) {\n & .modal__controls {\n border-top: var(--s-border-width-default) solid var(--s-border-default);\n }\n }\n}\n\n.modal--scrolled {\n @media (--from-tablet) {\n & .modal__header {\n border-bottom: var(--s-border-width-default) solid var(--s-border-default);\n }\n }\n}\n\n.modal__backdrop {\n position: fixed;\n background-color: rgba(0, 0, 0, 0.2);\n inset: 0;\n}\n\n.modal__body {\n position: relative;\n z-index: var(--s-z-40);\n display: flex;\n width: 100vw;\n height: 100vh;\n background-color: var(--s-surface-overlay-default);\n flex-direction: column;\n\n @media (--from-tablet) {\n width: 90vw;\n max-width: 33.75rem;\n height: auto;\n max-height: 90vh;\n border-radius: var(--s-border-radius-base);\n box-shadow: 0.125rem 0.25rem 1rem rgba(0, 0, 0, 0.14);\n }\n}\n\n.modal__close-button {\n position: absolute;\n top: var(--s-space-8);\n left: var(--s-space-8);\n\n @media (--from-tablet) {\n top: var(--s-space-16);\n right: var(--s-space-16);\n left: auto;\n }\n}\n\n.modal__header {\n display: flex;\n height: 3.5rem;\n padding-top: var(--s-space-8);\n padding-right: var(--s-space-16);\n padding-bottom: var(--s-space-8);\n padding-left: calc(var(--s-space-8) + 2.5rem + var(--s-space-8));\n flex-shrink: 0;\n align-items: center;\n border-bottom: var(--s-border-width-default) solid var(--s-border-default);\n gap: var(--s-space-16);\n\n @media (--from-tablet) {\n height: 4.125rem;\n padding-top: var(--s-space-24);\n padding-right: calc(var(--s-space-16) + 2.5rem + var(--s-space-8));\n padding-bottom: var(--s-space-16);\n padding-left: var(--s-space-24);\n border-bottom: none;\n }\n}\n\n.modal__heading {\n overflow: hidden;\n\n &::part(heading) {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n}\n\n.modal__content {\n overflow-x: hidden;\n overflow-y: auto;\n padding-top: var(--s-space-24);\n padding-right: var(--s-space-16);\n padding-bottom: var(--s-space-24);\n padding-left: var(--s-space-16);\n flex-grow: 1;\n line-height: var(--s-line-height-base);\n\n & ::slotted(*) {\n margin: 0;\n }\n\n @media (--from-tablet) {\n padding-top: 0;\n padding-right: var(--s-space-24);\n padding-bottom: var(--s-space-16);\n padding-left: var(--s-space-24);\n }\n}\n\n.modal__controls {\n display: flex;\n padding-top: var(--s-space-16);\n padding-right: var(--s-space-24);\n padding-bottom: var(--s-space-16);\n padding-left: var(--s-space-24);\n flex-shrink: 0;\n justify-content: flex-end;\n}\n\n@keyframes modal-scale-in {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes modal-backdrop-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes modal-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n","import {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n} from \"@stencil/core\";\nimport A11yDialog from \"a11y-dialog\";\nimport { disableBodyScroll, enableBodyScroll } from \"body-scroll-lock\";\nimport classnames from \"classnames\";\n\n@Component({\n shadow: true,\n styleUrl: \"flip-modal.css\",\n tag: \"flip-modal\",\n})\nexport class FlipModal {\n @Prop() closeButtonLabel?: string = \"Close modal\";\n @Prop() label!: string;\n @Prop() primaryActionLabel?: string;\n @Prop() secondaryActionLabel?: string;\n\n @Event() primaryAction: EventEmitter<MouseEvent>;\n @Event() secondaryAction: EventEmitter<MouseEvent>;\n\n @State() closing = false;\n @State() scrollable = false;\n @State() scrolled = false;\n @State() scrolledDown = false;\n\n private modal: A11yDialog;\n private modalEl: HTMLElement;\n private scrollContainer: HTMLElement;\n\n componentDidLoad() {\n this.modal = new A11yDialog(this.modalEl);\n this.determineScrollStatus();\n }\n\n disconnectedCallback() {\n this.modal?.destroy();\n this.unlockBodyScroll();\n }\n\n @Listen(\"resize\", { target: \"window\" })\n onWindowResize() {\n this.determineScrollStatus();\n }\n\n /**\n * Open the modal.\n */\n @Method()\n async open() {\n this.modal.show();\n this.lockBodyScroll();\n this.determineScrollStatus();\n }\n\n /**\n * Close the modal.\n */\n @Method()\n async close() {\n if (this.closing) {\n return;\n }\n\n this.closing = true;\n this.unlockBodyScroll();\n\n setTimeout(() => {\n this.modal.hide();\n this.closing = false;\n }, 150);\n }\n\n onKeyDown = (event: KeyboardEvent) => {\n if (event.code === \"Escape\") {\n this.close();\n }\n };\n\n private onBackdropClick = () => {\n this.close();\n };\n\n private onCloseButtonClick = () => {\n this.close();\n };\n\n private onPrimaryAction = (event: MouseEvent) => {\n this.primaryAction.emit(event);\n this.close();\n };\n\n private onSecondaryAction = (event: MouseEvent) => {\n this.secondaryAction.emit(event);\n this.close();\n };\n\n private determineScrollStatus = () => {\n const scrolled = this.scrollContainer?.scrollTop > 0;\n\n const scrolledDown =\n Math.ceil(\n this.scrollContainer?.scrollTop + this.scrollContainer?.offsetHeight\n ) >= this.scrollContainer?.scrollHeight;\n\n const scrollable =\n this.scrollContainer?.scrollHeight > this.scrollContainer?.offsetHeight;\n\n if (scrolled !== this.scrolled) {\n this.scrolled = scrolled;\n }\n\n if (scrolledDown !== this.scrolledDown) {\n this.scrolledDown = scrolledDown;\n }\n\n if (scrollable !== this.scrollable) {\n this.scrollable = scrollable;\n }\n };\n\n private lockBodyScroll() {\n disableBodyScroll(this.scrollContainer);\n }\n\n private unlockBodyScroll() {\n enableBodyScroll(this.scrollContainer);\n }\n\n render() {\n const className = classnames(\"modal\", {\n \"modal--closing\": this.closing,\n \"modal--scrollable\": this.scrollable,\n \"modal--scrolled\": this.scrolled,\n \"modal--scrolled-down\": this.scrolledDown,\n });\n\n return (\n <Host>\n <section\n aria-hidden=\"true\"\n aria-label={this.label}\n class={className}\n id=\"modal\"\n onKeyDown={this.onKeyDown}\n ref={(el) => (this.modalEl = el)}\n >\n <div class=\"modal__backdrop\" onClick={this.onBackdropClick}></div>\n <div class=\"modal__body\" role=\"document\">\n <flip-button\n class=\"modal__close-button\"\n hideLabel\n icon=\"<flip-icon-close></flip-icon-close>\"\n label={this.closeButtonLabel}\n onClick={this.onCloseButtonClick}\n ></flip-button>\n <header class=\"modal__header\">\n <flip-heading\n as=\"h2\"\n class=\"modal__heading\"\n level={3}\n text={this.label}\n ></flip-heading>\n </header>\n <div\n class=\"modal__content\"\n onScroll={this.determineScrollStatus}\n ref={(el) => (this.scrollContainer = el)}\n >\n <slot></slot>\n </div>\n <footer class=\"modal__controls\">\n <flip-button-group wrap>\n {this.secondaryActionLabel && (\n <flip-button\n label={this.secondaryActionLabel}\n onClick={this.onSecondaryAction}\n ></flip-button>\n )}\n {this.primaryActionLabel && (\n <flip-button\n intent=\"primary\"\n label={this.primaryActionLabel}\n onClick={this.onPrimaryAction}\n variant=\"flat\"\n ></flip-button>\n )}\n </flip-button-group>\n </footer>\n </div>\n </section>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as i,h as s,H as e}from"./p-9fe00e8a.js";import{c as n}from"./p-efffd297.js";import"./p-86bd3473.js";const p='.sc-flip-text-input-h{display:block;width:100%}.sc-flip-text-input-h *.sc-flip-text-input{box-sizing:border-box}.text-input.sc-flip-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm)}.text-input--clearable.sc-flip-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--type-number.sc-flip-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-flip-text-input .text-input__input.sc-flip-text-input{width:100%}.text-input--disabled.sc-flip-text-input .text-input__character-counter.sc-flip-text-input{color:var(--s-text-disabled)}.text-input__input.sc-flip-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-flip-text-input:focus{outline:none}.text-input__input.sc-flip-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-flip-text-input::-webkit-outer-spin-button,.text-input__input.sc-flip-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type="number"].sc-flip-text-input{-moz-appearance:textfield}input.text-input__input.sc-flip-text-input:not([type="password"]){width:0.25rem;min-width:0.25rem}.text-input__clear-button.sc-flip-text-input,.text-input__password-toggle.sc-flip-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-flip-text-input:focus,.text-input__password-toggle.sc-flip-text-input:focus{outline-color:var(--s-focus-default)}.text-input__stepper.sc-flip-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}.text-input__step-button.sc-flip-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-flip-text-input:focus{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-flip-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}.text-input__prefix.sc-flip-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-flip-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}';const o=class{constructor(s){t(this,s);this.valueChange=i(this,"valueChange",7);this.autoComplete="on";this.clearButtonLabel="Clear input";this.rows=1;this.passwordToggleLabel="Toggle password display";this.type="text";this.showPassword=false;this.clear=()=>{this.inputEl.value="";this.value="";this.valueChange.emit("");this.inputEl.focus()};this.onChange=t=>{const i=t.target;this.value=i.value;this.valueChange.emit(i.value)};this.onFocus=t=>{this.handleAutoSelect(t)};this.onInput=t=>{this.onChange(t)};this.onKeyPress=t=>{if(this.type!=="number"){return}if(["+","-","e"].includes(t.key)){t.preventDefault()}};this.decreaseValue=()=>{if(this.type!=="number"){return}const t=this.step||1;const i=isNaN(this.inputEl.valueAsNumber)?this.min!==undefined?this.min+1:1:this.inputEl.valueAsNumber;this.value=String(Math.max(this.min||-Infinity,i-t));this.valueChange.emit(this.value)};this.increaseValue=()=>{if(this.type!=="number"){return}const t=this.step||1;const i=isNaN(this.inputEl.valueAsNumber)?this.min!==undefined?this.min-1:-1:this.inputEl.valueAsNumber;this.value=String(Math.min(this.max||Infinity,i+t));this.valueChange.emit(this.value)};this.togglePassword=()=>{if(this.type!=="password"){return}this.showPassword=!this.showPassword}}componentDidRender(){this.adjustInputSize()}adjustInputSize(){if(this.rows>1){this.inputEl.style.width="";this.inputEl.style.height="";this.inputEl.style.height=this.inputEl.scrollHeight/16+"rem"}if(this.rows===1){this.inputEl.style.height="";this.inputEl.style.width="";if(this.type!=="password"){this.inputEl.style.width=this.inputEl.scrollWidth/16+"rem"}}}handleAutoSelect(t){if(!this.autoSelect){return}t.target.select()}render(){var t;const i=this.rows===1?"input":"textarea";const p=this.invalid===true?"true":this.invalid===false?"false":undefined;const o=this.type==="number"&&!this.disabled;const r=this.type==="password"&&!this.disabled;const a=this.clearable&&!this.disabled&&Boolean(this.value)&&!r&&!o&&!this.showCharacterCounter;const u=this.type==="password"&&this.showPassword?"text":this.type;const h=n("text-input",`text-input--type-${this.type}`,{"text-input--clearable":this.clearable,"text-input--disabled":this.disabled,"text-input--show-password":this.type==="password"&&this.showPassword});return s(e,null,s("div",{class:h},this.prefixLabel&&s("span",{class:"text-input__prefix"},this.prefixLabel),s(i,{"aria-describedby":this.flipAriaDescribedby,"aria-disabled":this.disabled?"true":undefined,"aria-invalid":p,autoComplete:this.autoComplete,autoFocus:this.autoFocus,class:"text-input__input",disabled:this.disabled,inputMode:this.mode,maxLength:this.maxLength,max:this.type==="number"?this.max:undefined,min:this.type==="number"?this.min:undefined,onFocus:this.onFocus,onInput:this.onInput,onKeyPress:this.onKeyPress,ref:t=>this.inputEl=t,required:this.required,rows:this.rows>1?this.rows:undefined,spellcheck:this.spellCheck,step:this.type==="number"?this.step:undefined,type:u,value:this.rows===1?this.value:undefined},this.rows>1&&this.value),this.suffixLabel&&s("span",{class:"text-input__suffix"},this.suffixLabel),a&&s("button",{"aria-label":this.clearButtonLabel,class:"text-input__clear-button",onClick:this.clear,type:"button"},s("flip-icon-cancel",null)),r&&s("button",{"aria-label":this.passwordToggleLabel,class:"text-input__password-toggle",onClick:this.togglePassword,type:"button"},this.showPassword?s("flip-icon-visibility-off",null):s("flip-icon-visibility",null)),o&&s("span",{class:"text-input__stepper"},s("button",{"aria-hidden":"true",class:"text-input__step-button",onClick:this.increaseValue,tabIndex:-1,type:"button"},s("flip-icon-expand-less",null)),s("button",{"aria-hidden":"true",class:"text-input__step-button",onClick:this.decreaseValue,tabIndex:-1,type:"button"},s("flip-icon-expand-more",null))),this.showCharacterCounter&&s("span",{class:"text-input__character-counter"},((t=this.value)===null||t===void 0?void 0:t.length)||0," ",Boolean(this.maxLength)?`/ ${this.maxLength}`:"")))}};o.style=p;export{o as flip_text_input};
|
|
2
|
+
//# sourceMappingURL=p-6ddd889e.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-text-input/flip-text-input.css?tag=flip-text-input&encapsulation=scoped","src/components/flip-text-input/flip-text-input.tsx"],"names":["flipTextInputCss","FlipTextInput","[object Object]","hostRef","this","autoComplete","clearButtonLabel","rows","passwordToggleLabel","type","showPassword","clear","inputEl","value","valueChange","emit","focus","onChange","event","el","target","onFocus","handleAutoSelect","onInput","onKeyPress","includes","key","preventDefault","decreaseValue","step","currentValue","isNaN","valueAsNumber","min","undefined","String","Math","max","Infinity","increaseValue","togglePassword","adjustInputSize","style","width","height","scrollHeight","scrollWidth","autoSelect","select","Tag","ariaInvalid","invalid","showStepper","disabled","showPasswordToggle","showClearButton","clearable","Boolean","showCharacterCounter","className","classnames","text-input--clearable","text-input--disabled","text-input--show-password","h","Host","class","prefixLabel","aria-describedby","flipAriaDescribedby","aria-disabled","aria-invalid","autoFocus","inputMode","mode","maxLength","ref","required","spellcheck","spellCheck","suffixLabel","aria-label","onClick","aria-hidden","tabIndex","_a","length"],"mappings":"qHAAA,MAAMA,EAAmB,grFC4CZC,EAAa,MAZ1BC,YAAAC,sDAaUC,KAAAC,aAAwB,KAIxBD,KAAAE,iBAA4B,cAU5BF,KAAAG,KAAgB,EAKhBH,KAAAI,oBAA+B,0BAC/BJ,KAAAK,KAA2B,OAG1BL,KAAAM,aAAe,MA2BhBN,KAAAO,MAAQ,KACdP,KAAKQ,QAAQC,MAAQ,GACrBT,KAAKS,MAAQ,GACbT,KAAKU,YAAYC,KAAK,IACtBX,KAAKQ,QAAQI,SAGPZ,KAAAa,SAAYC,IAClB,MAAMC,EAAKD,EAAME,OAEjBhB,KAAKS,MAAQM,EAAGN,MAChBT,KAAKU,YAAYC,KAAKI,EAAGN,QAGnBT,KAAAiB,QAAWH,IACjBd,KAAKkB,iBAAiBJ,IAGhBd,KAAAmB,QAAWL,IACjBd,KAAKa,SAASC,IAGRd,KAAAoB,WAAcN,IACpB,GAAId,KAAKK,OAAS,SAAU,CAC1B,OAGF,GAAI,CAAC,IAAK,IAAK,KAAKgB,SAASP,EAAMQ,KAAM,CACvCR,EAAMS,mBAIFvB,KAAAwB,cAAgB,KACtB,GAAIxB,KAAKK,OAAS,SAAU,CAC1B,OAEF,MAAMoB,EAAOzB,KAAKyB,MAAQ,EAC1B,MAAMC,EAAeC,MAAM3B,KAAKQ,QAAQoB,eACpC5B,KAAK6B,MAAQC,UACX9B,KAAK6B,IAAM,EACX,EACF7B,KAAKQ,QAAQoB,cAEjB5B,KAAKS,MAAQsB,OAAOC,KAAKC,IAAIjC,KAAK6B,MAAQK,SAAUR,EAAeD,IACnEzB,KAAKU,YAAYC,KAAKX,KAAKS,QAGrBT,KAAAmC,cAAgB,KACtB,GAAInC,KAAKK,OAAS,SAAU,CAC1B,OAGF,MAAMoB,EAAOzB,KAAKyB,MAAQ,EAC1B,MAAMC,EAAeC,MAAM3B,KAAKQ,QAAQoB,eACpC5B,KAAK6B,MAAQC,UACX9B,KAAK6B,IAAM,GACV,EACH7B,KAAKQ,QAAQoB,cAEjB5B,KAAKS,MAAQsB,OAAOC,KAAKH,IAAI7B,KAAKiC,KAAOC,SAAUR,EAAeD,IAClEzB,KAAKU,YAAYC,KAAKX,KAAKS,QAWrBT,KAAAoC,eAAiB,KACvB,GAAIpC,KAAKK,OAAS,WAAY,CAC5B,OAGFL,KAAKM,cAAgBN,KAAKM,cAjG5BR,qBACEE,KAAKqC,kBAGCvC,kBACN,GAAIE,KAAKG,KAAO,EAAG,CACjBH,KAAKQ,QAAQ8B,MAAMC,MAAQ,GAC3BvC,KAAKQ,QAAQ8B,MAAME,OAAS,GAC5BxC,KAAKQ,QAAQ8B,MAAME,OAASxC,KAAKQ,QAAQiC,aAAe,GAAK,MAG/D,GAAIzC,KAAKG,OAAS,EAAG,CACnBH,KAAKQ,QAAQ8B,MAAME,OAAS,GAC5BxC,KAAKQ,QAAQ8B,MAAMC,MAAQ,GAE3B,GAAIvC,KAAKK,OAAS,WAAY,CAC5BL,KAAKQ,QAAQ8B,MAAMC,MAAQvC,KAAKQ,QAAQkC,YAAc,GAAK,QAoEzD5C,iBAAiBgB,GACvB,IAAKd,KAAK2C,WAAY,CACpB,OAGD7B,EAAME,OAA4B4B,SAWrC9C,eACE,MAAM+C,EAAM7C,KAAKG,OAAS,EAAI,QAAU,WAExC,MAAM2C,EACJ9C,KAAK+C,UAAY,KACb,OACA/C,KAAK+C,UAAY,MACjB,QACAjB,UAEN,MAAMkB,EAAchD,KAAKK,OAAS,WAAaL,KAAKiD,SACpD,MAAMC,EAAqBlD,KAAKK,OAAS,aAAeL,KAAKiD,SAE7D,MAAME,EACJnD,KAAKoD,YACJpD,KAAKiD,UACNI,QAAQrD,KAAKS,SACZyC,IACAF,IACAhD,KAAKsD,qBAER,MAAMjD,EACJL,KAAKK,OAAS,YAAcL,KAAKM,aAAe,OAASN,KAAKK,KAEhE,MAAMkD,EAAYC,EAChB,aACA,oBAAoBxD,KAAKK,OACzB,CACEoD,wBAAyBzD,KAAKoD,UAC9BM,uBAAwB1D,KAAKiD,SAC7BU,4BACE3D,KAAKK,OAAS,YAAcL,KAAKM,eAIvC,OACEsD,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKE,MAAOP,GACTvD,KAAK+D,aACJH,EAAA,OAAA,CAAME,MAAM,sBAAsB9D,KAAK+D,aAEzCH,EAACf,EAAG,CAAAmB,mBACgBhE,KAAKiE,oBAAmBC,gBAC3BlE,KAAKiD,SAAW,OAASnB,UAASqC,eACnCrB,EACd7C,aAAcD,KAAKC,aACnBmE,UAAWpE,KAAKoE,UAChBN,MAAM,oBACNb,SAAUjD,KAAKiD,SACfoB,UAAWrE,KAAKsE,KAChBC,UAAWvE,KAAKuE,UAChBtC,IAAKjC,KAAKK,OAAS,SAAWL,KAAKiC,IAAMH,UACzCD,IAAK7B,KAAKK,OAAS,SAAWL,KAAK6B,IAAMC,UACzCb,QAASjB,KAAKiB,QACdE,QAASnB,KAAKmB,QACdC,WAAYpB,KAAKoB,WACjBoD,IAAMzD,GAAQf,KAAKQ,QAAUO,EAC7B0D,SAAUzE,KAAKyE,SACftE,KAAMH,KAAKG,KAAO,EAAIH,KAAKG,KAAO2B,UAClC4C,WAAY1E,KAAK2E,WACjBlD,KAAMzB,KAAKK,OAAS,SAAWL,KAAKyB,KAAOK,UAC3CzB,KAAMA,EACNI,MAAOT,KAAKG,OAAS,EAAIH,KAAKS,MAAQqB,WAErC9B,KAAKG,KAAO,GAAKH,KAAKS,OAExBT,KAAK4E,aACJhB,EAAA,OAAA,CAAME,MAAM,sBAAsB9D,KAAK4E,aAExCzB,GACCS,EAAA,SAAA,CAAAiB,aACc7E,KAAKE,iBACjB4D,MAAM,2BACNgB,QAAS9E,KAAKO,MACdF,KAAK,UAELuD,EAAA,mBAAA,OAGHV,GACCU,EAAA,SAAA,CAAAiB,aACc7E,KAAKI,oBACjB0D,MAAM,8BACNgB,QAAS9E,KAAKoC,eACd/B,KAAK,UAEJL,KAAKM,aACJsD,EAAA,2BAAA,MAEAA,EAAA,uBAAA,OAILZ,GACCY,EAAA,OAAA,CAAME,MAAM,uBACVF,EAAA,SAAA,CAAAmB,cACc,OACZjB,MAAM,0BACNgB,QAAS9E,KAAKmC,cACd6C,UAAW,EACX3E,KAAK,UAELuD,EAAA,wBAAA,OAEFA,EAAA,SAAA,CAAAmB,cACc,OACZjB,MAAM,0BACNgB,QAAS9E,KAAKwB,cACdwD,UAAW,EACX3E,KAAK,UAELuD,EAAA,wBAAA,QAIL5D,KAAKsD,sBACJM,EAAA,OAAA,CAAME,MAAM,mCACTmB,EAAAjF,KAAKS,SAAK,MAAAwE,SAAA,OAAA,EAAAA,EAAEC,SAAU,EAAG,IACzB7B,QAAQrD,KAAKuE,WAAa,KAAKvE,KAAKuE,YAAc","sourcesContent":[":host {\n display: block;\n width: 100%;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.text-input {\n position: relative;\n display: flex;\n width: 100%;\n align-items: center;\n color: var(--s-text-default);\n font: inherit;\n line-height: var(--s-line-height-sm);\n}\n\n.text-input--clearable {\n padding-right: calc(1.5rem + var(--s-space-8));\n}\n\n.text-input--type-number {\n padding-right: calc(1.5rem + var(--s-space-8));\n}\n\n.text-input--show-password {\n & .text-input__input {\n width: 100%;\n }\n}\n\n.text-input--disabled {\n & .text-input__character-counter {\n color: var(--s-text-disabled);\n }\n}\n\n.text-input__input {\n display: inline-flex;\n width: 100%;\n max-height: 13.75rem;\n margin: 0;\n padding: 0;\n border: none;\n color: var(--s-text-default);\n background-color: transparent;\n font: inherit;\n font-size: var(--s-font-size-base);\n line-height: var(--s-line-height-base);\n resize: none;\n caret-color: var(--s-border-highlight);\n\n &:focus {\n outline: none;\n }\n\n &:disabled {\n color: var(--s-text-disabled);\n background-color: transparent;\n }\n\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n margin: 0;\n -webkit-appearance: none;\n }\n\n &[type=\"number\"] {\n -moz-appearance: textfield;\n }\n}\n\ninput.text-input__input:not([type=\"password\"]) {\n width: 0.25rem;\n min-width: 0.25rem;\n}\n\n.text-input__clear-button,\n.text-input__password-toggle {\n position: absolute;\n top: calc(-1 * var(--s-space-12));\n right: 0;\n display: inline-flex;\n margin: 0;\n padding: 0;\n border: none;\n color: var(--s-icon-default);\n background-color: transparent;\n cursor: pointer;\n\n &:focus {\n outline-color: var(--s-focus-default);\n }\n}\n\n.text-input__stepper {\n position: absolute;\n top: -1.4375rem;\n right: 0;\n display: flex;\n flex-direction: column;\n}\n\n.text-input__step-button {\n display: inline-flex;\n margin: 0;\n padding: 0;\n border: none;\n color: var(--s-icon-default);\n background-color: transparent;\n cursor: pointer;\n\n &:focus {\n outline-color: var(--s-focus-default);\n }\n}\n\n.text-input__character-counter {\n position: absolute;\n top: -1.375rem;\n right: 0;\n display: flex;\n color: var(--s-text-subdued);\n line-height: var(--s-line-height-sm);\n flex-direction: column;\n}\n\n.text-input__prefix {\n padding-right: var(--s-space-4);\n color: var(--s-text-subdued);\n font-size: var(--s-font-size-base);\n}\n\n.text-input__suffix {\n padding-left: var(--s-space-4);\n color: var(--s-text-subdued);\n font-size: var(--s-font-size-base);\n}\n","import {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n} from \"@stencil/core\";\nimport classnames from \"classnames\";\nimport { FlipFormInput } from \"../../utils\";\n\nexport type FlipTextInputType =\n | \"date\"\n | \"datetime-local\"\n | \"email\"\n | \"number\"\n | \"password\"\n | \"reset\"\n | \"tel\"\n | \"text\"\n | \"url\";\n\nexport type FlipTextInputMode =\n | \"decimal\"\n | \"email\"\n | \"numeric\"\n | \"search\"\n | \"tel\"\n | \"text\"\n | \"url\";\n\n@Component({\n /**\n * Form controls in shadow dom can still not be associated with labels in the\n * light dom, cross browser. So for now we disable shadow dom for form\n * controls (inputs, buttons, selects, etc.). Instead we use Stencil's scoping.\n * https://caniuse.com/?search=attachInternals\n */\n scoped: true,\n shadow: false,\n styleUrl: \"flip-text-input.css\",\n tag: \"flip-text-input\",\n})\nexport class FlipTextInput implements FlipFormInput {\n @Prop() autoComplete?: string = \"on\";\n @Prop() autoFocus?: boolean;\n @Prop() autoSelect?: boolean;\n @Prop() clearable?: boolean;\n @Prop() clearButtonLabel?: string = \"Clear input\";\n @Prop() disabled?: boolean;\n @Prop() flipAriaDescribedby?: string;\n @Prop() invalid?: boolean;\n @Prop() maxLength?: number;\n @Prop() max?: number;\n @Prop() min?: number;\n @Prop() mode?: FlipTextInputMode;\n @Prop() prefixLabel?: string;\n @Prop() required?: boolean;\n @Prop() rows?: number = 1;\n @Prop() showCharacterCounter?: boolean;\n @Prop() spellCheck?: boolean;\n @Prop() suffixLabel?: string;\n @Prop() step?: number;\n @Prop() passwordToggleLabel?: string = \"Toggle password display\";\n @Prop() type?: FlipTextInputType = \"text\";\n @Prop({ mutable: true, reflect: true }) value?: string;\n\n @State() showPassword = false;\n\n @Event() valueChange: EventEmitter<string>;\n\n private inputEl: HTMLInputElement;\n\n componentDidRender() {\n this.adjustInputSize();\n }\n\n private adjustInputSize() {\n if (this.rows > 1) {\n this.inputEl.style.width = \"\";\n this.inputEl.style.height = \"\";\n this.inputEl.style.height = this.inputEl.scrollHeight / 16 + \"rem\";\n }\n\n if (this.rows === 1) {\n this.inputEl.style.height = \"\";\n this.inputEl.style.width = \"\";\n\n if (this.type !== \"password\") {\n this.inputEl.style.width = this.inputEl.scrollWidth / 16 + \"rem\";\n }\n }\n }\n\n private clear = () => {\n this.inputEl.value = \"\";\n this.value = \"\";\n this.valueChange.emit(\"\");\n this.inputEl.focus();\n };\n\n private onChange = (event: Event) => {\n const el = event.target as HTMLInputElement;\n\n this.value = el.value;\n this.valueChange.emit(el.value);\n };\n\n private onFocus = (event: FocusEvent) => {\n this.handleAutoSelect(event);\n };\n\n private onInput = (event: InputEvent) => {\n this.onChange(event);\n };\n\n private onKeyPress = (event: KeyboardEvent) => {\n if (this.type !== \"number\") {\n return;\n }\n\n if ([\"+\", \"-\", \"e\"].includes(event.key)) {\n event.preventDefault();\n }\n };\n\n private decreaseValue = () => {\n if (this.type !== \"number\") {\n return;\n }\n const step = this.step || 1;\n const currentValue = isNaN(this.inputEl.valueAsNumber)\n ? this.min !== undefined\n ? this.min + 1\n : 1\n : this.inputEl.valueAsNumber;\n\n this.value = String(Math.max(this.min || -Infinity, currentValue - step));\n this.valueChange.emit(this.value);\n };\n\n private increaseValue = () => {\n if (this.type !== \"number\") {\n return;\n }\n\n const step = this.step || 1;\n const currentValue = isNaN(this.inputEl.valueAsNumber)\n ? this.min !== undefined\n ? this.min - 1\n : -1\n : this.inputEl.valueAsNumber;\n\n this.value = String(Math.min(this.max || Infinity, currentValue + step));\n this.valueChange.emit(this.value);\n };\n\n private handleAutoSelect(event: FocusEvent) {\n if (!this.autoSelect) {\n return;\n }\n\n (event.target as HTMLInputElement).select();\n }\n\n private togglePassword = () => {\n if (this.type !== \"password\") {\n return;\n }\n\n this.showPassword = !this.showPassword;\n };\n\n render() {\n const Tag = this.rows === 1 ? \"input\" : \"textarea\";\n\n const ariaInvalid =\n this.invalid === true\n ? \"true\"\n : this.invalid === false\n ? \"false\"\n : undefined;\n\n const showStepper = this.type === \"number\" && !this.disabled;\n const showPasswordToggle = this.type === \"password\" && !this.disabled;\n\n const showClearButton =\n this.clearable &&\n !this.disabled &&\n Boolean(this.value) &&\n !showPasswordToggle &&\n !showStepper &&\n !this.showCharacterCounter;\n\n const type =\n this.type === \"password\" && this.showPassword ? \"text\" : this.type;\n\n const className = classnames(\n \"text-input\",\n `text-input--type-${this.type}`,\n {\n \"text-input--clearable\": this.clearable,\n \"text-input--disabled\": this.disabled,\n \"text-input--show-password\":\n this.type === \"password\" && this.showPassword,\n }\n );\n\n return (\n <Host>\n <div class={className}>\n {this.prefixLabel && (\n <span class=\"text-input__prefix\">{this.prefixLabel}</span>\n )}\n <Tag\n aria-describedby={this.flipAriaDescribedby}\n aria-disabled={this.disabled ? \"true\" : undefined}\n aria-invalid={ariaInvalid}\n autoComplete={this.autoComplete}\n autoFocus={this.autoFocus}\n class=\"text-input__input\"\n disabled={this.disabled}\n inputMode={this.mode}\n maxLength={this.maxLength}\n max={this.type === \"number\" ? this.max : undefined}\n min={this.type === \"number\" ? this.min : undefined}\n onFocus={this.onFocus}\n onInput={this.onInput}\n onKeyPress={this.onKeyPress}\n ref={(el) => (this.inputEl = el)}\n required={this.required}\n rows={this.rows > 1 ? this.rows : undefined}\n spellcheck={this.spellCheck}\n step={this.type === \"number\" ? this.step : undefined}\n type={type}\n value={this.rows === 1 ? this.value : undefined}\n >\n {this.rows > 1 && this.value}\n </Tag>\n {this.suffixLabel && (\n <span class=\"text-input__suffix\">{this.suffixLabel}</span>\n )}\n {showClearButton && (\n <button\n aria-label={this.clearButtonLabel}\n class=\"text-input__clear-button\"\n onClick={this.clear}\n type=\"button\"\n >\n <flip-icon-cancel></flip-icon-cancel>\n </button>\n )}\n {showPasswordToggle && (\n <button\n aria-label={this.passwordToggleLabel}\n class=\"text-input__password-toggle\"\n onClick={this.togglePassword}\n type=\"button\"\n >\n {this.showPassword ? (\n <flip-icon-visibility-off></flip-icon-visibility-off>\n ) : (\n <flip-icon-visibility></flip-icon-visibility>\n )}\n </button>\n )}\n {showStepper && (\n <span class=\"text-input__stepper\">\n <button\n aria-hidden=\"true\"\n class=\"text-input__step-button\"\n onClick={this.increaseValue}\n tabIndex={-1}\n type=\"button\"\n >\n <flip-icon-expand-less></flip-icon-expand-less>\n </button>\n <button\n aria-hidden=\"true\"\n class=\"text-input__step-button\"\n onClick={this.decreaseValue}\n tabIndex={-1}\n type=\"button\"\n >\n <flip-icon-expand-more></flip-icon-expand-more>\n </button>\n </span>\n )}\n {this.showCharacterCounter && (\n <span class=\"text-input__character-counter\">\n {this.value?.length || 0}{\" \"}\n {Boolean(this.maxLength) ? `/ ${this.maxLength}` : \"\"}\n </span>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,h as t,H as e}from"./p-9fe00e8a.js";import{c as s}from"./p-efffd297.js";import"./p-86bd3473.js";const a=":host{display:block}:host *{box-sizing:border-box}.action-list-item{display:inline-flex;width:100%;min-width:15rem;margin:0;padding:var(--s-space-12) var(--s-space-16);justify-content:flex-start;align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;cursor:pointer;gap:var(--s-space-12)}.action-list-item:hover{background-color:var(--s-surface-overlay-hovered)}.action-list-item:focus{background-color:var(--s-surface-overlay-hovered);outline:none}.action-list-item:active{background-color:var(--s-surface-overlay-pressed)}.action-list-item:disabled{background-color:var(--s-surface-overlay-default);cursor:default}.action-list-item:disabled .action-list-item__label,.action-list-item:disabled .action-list-item__description{color:var(--s-text-disabled)}.action-list-item:disabled .action-list-item__icon{color:var(--s-icon-disabled)}.action-list-item--size-l{padding:var(--s-space-16)}.action-list-item--intent-critical ::part(icon){color:var(--s-icon-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__label{color:var(--s-text-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__icon{color:var(--s-icon-critical)}.action-list-item__icon{display:inline-flex;flex-shrink:0;color:var(--s-icon-default)}.action-list-item__label-container{display:inline-flex;min-width:0;flex-grow:1;align-items:flex-start;flex-direction:column}.action-list-item__label{overflow:hidden;max-width:100%;padding-top:0.0625rem;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.action-list-item__description{color:var(--s-text-subdued)}.action-list-item__suffix{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}";const o=class{constructor(t){i(this,t);this.intent="default";this.size="m"}render(){const i=Boolean(this.suffix)&&!this.disabled;const a=s("action-list-item",`action-list-item--intent-${this.intent}`,`action-list-item--size-${this.size}`);return t(e,null,t("button",{class:a,disabled:this.disabled,role:"menuitem",tabIndex:-1,type:"button"},this.icon&&t("span",{class:"action-list-item__icon",innerHTML:this.icon}),t("span",{class:"action-list-item__label-container"},t("span",{class:"action-list-item__label"},this.label),this.description&&t("span",{class:"action-list-item__description"},this.description)),i&&t("span",{class:"action-list-item__suffix",innerHTML:this.suffix})))}};o.style=a;export{o as flip_action_list_item};
|
|
2
|
+
//# sourceMappingURL=p-6febfe15.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-action-list-item/flip-action-list-item.css?tag=flip-action-list-item&encapsulation=shadow","src/components/flip-action-list-item/flip-action-list-item.tsx"],"names":["flipActionListItemCss","FlipActionListItem","[object Object]","hostRef","this","intent","size","showSuffix","Boolean","suffix","disabled","className","classnames","h","Host","class","role","tabIndex","type","icon","innerHTML","label","description"],"mappings":"8GAAA,MAAMA,EAAwB,2xDCYjBC,EAAkB,MAL/BC,YAAAC,aASUC,KAAAC,OAAoC,UAEpCD,KAAAE,KAAgC,IAGxCJ,SACE,MAAMK,EAAaC,QAAQJ,KAAKK,UAAYL,KAAKM,SAEjD,MAAMC,EAAYC,EAChB,mBACA,4BAA4BR,KAAKC,SACjC,0BAA0BD,KAAKE,QAGjC,OACEO,EAACC,EAAI,KACHD,EAAA,SAAA,CACEE,MAAOJ,EACPD,SAAUN,KAAKM,SACfM,KAAK,WACLC,UAAW,EACXC,KAAK,UAEJd,KAAKe,MACJN,EAAA,OAAA,CAAME,MAAM,yBAAyBK,UAAWhB,KAAKe,OAEvDN,EAAA,OAAA,CAAME,MAAM,qCACVF,EAAA,OAAA,CAAME,MAAM,2BAA2BX,KAAKiB,OAC3CjB,KAAKkB,aACJT,EAAA,OAAA,CAAME,MAAM,iCACTX,KAAKkB,cAIXf,GACCM,EAAA,OAAA,CACEE,MAAM,2BACNK,UAAWhB,KAAKK","sourcesContent":[":host {\n display: block;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.action-list-item {\n display: inline-flex;\n width: 100%;\n min-width: 15rem;\n margin: 0;\n padding: var(--s-space-12) var(--s-space-16);\n justify-content: flex-start;\n align-items: center;\n border: none;\n color: var(--s-text-default);\n background-color: var(--s-surface-overlay-default);\n font: inherit;\n line-height: var(--s-line-height-base);\n text-align: left;\n cursor: pointer;\n gap: var(--s-space-12);\n\n &:hover {\n background-color: var(--s-surface-overlay-hovered);\n }\n\n &:focus {\n background-color: var(--s-surface-overlay-hovered);\n outline: none;\n }\n\n &:active {\n background-color: var(--s-surface-overlay-pressed);\n }\n\n &:disabled {\n background-color: var(--s-surface-overlay-default);\n cursor: default;\n\n & .action-list-item__label,\n & .action-list-item__description {\n color: var(--s-text-disabled);\n }\n\n & .action-list-item__icon {\n color: var(--s-icon-disabled);\n }\n }\n}\n\n.action-list-item--size-l {\n padding: var(--s-space-16);\n}\n\n.action-list-item--intent-critical {\n & ::part(icon) {\n color: var(--s-icon-critical);\n }\n\n &:not(:disabled) {\n & .action-list-item__label {\n color: var(--s-text-critical);\n }\n\n & .action-list-item__icon {\n color: var(--s-icon-critical);\n }\n }\n}\n\n.action-list-item__icon {\n display: inline-flex;\n flex-shrink: 0;\n color: var(--s-icon-default);\n}\n\n.action-list-item__label-container {\n display: inline-flex;\n min-width: 0;\n flex-grow: 1;\n align-items: flex-start;\n flex-direction: column;\n}\n\n.action-list-item__label {\n overflow: hidden;\n max-width: 100%;\n padding-top: 0.0625rem;\n font-weight: var(--s-font-weight-medium);\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n\n.action-list-item__description {\n color: var(--s-text-subdued);\n}\n\n.action-list-item__suffix {\n display: inline-flex;\n flex-shrink: 0;\n color: var(--s-icon-highlight);\n}\n","import { Component, h, Host, Prop } from \"@stencil/core\";\nimport classnames from \"classnames\";\n\nexport type FlipActionListItemIntent = \"default\" | \"critical\";\n\nexport type FlipActionListItemSize = \"m\" | \"l\";\n\n@Component({\n shadow: true,\n styleUrl: \"flip-action-list-item.css\",\n tag: \"flip-action-list-item\",\n})\nexport class FlipActionListItem {\n @Prop() disabled?: boolean;\n @Prop() description?: string;\n @Prop() icon?: string;\n @Prop() intent?: FlipActionListItemIntent = \"default\";\n @Prop() label!: string;\n @Prop() size?: FlipActionListItemSize = \"m\";\n @Prop() suffix?: string;\n\n render() {\n const showSuffix = Boolean(this.suffix) && !this.disabled;\n\n const className = classnames(\n \"action-list-item\",\n `action-list-item--intent-${this.intent}`,\n `action-list-item--size-${this.size}`\n );\n\n return (\n <Host>\n <button\n class={className}\n disabled={this.disabled}\n role=\"menuitem\"\n tabIndex={-1}\n type=\"button\"\n >\n {this.icon && (\n <span class=\"action-list-item__icon\" innerHTML={this.icon}></span>\n )}\n <span class=\"action-list-item__label-container\">\n <span class=\"action-list-item__label\">{this.label}</span>\n {this.description && (\n <span class=\"action-list-item__description\">\n {this.description}\n </span>\n )}\n </span>\n {showSuffix && (\n <span\n class=\"action-list-item__suffix\"\n innerHTML={this.suffix}\n ></span>\n )}\n </button>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as o,H as r}from"./p-9fe00e8a.js";import{c as i}from"./p-efffd297.js";import"./p-86bd3473.js";const s=':host{display:block}:host *{box-sizing:border-box}.button-group--segmented ::slotted(*:not(:last-child)){position:relative}.button-group--segmented ::slotted(*:not(:last-child)):after{position:absolute;z-index:1;top:50%;left:100%;width:var(--s-border-width-default);height:calc(100% - var(--s-space-16));background-color:var(--s-border-strong);content:"";transform:translate3d(-50%, -50%, 0);pointer-events:none}.button-group--segmented ::slotted(*:not(:last-child):not([disabled])[intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:last-child)[disabled="false"][intent="primary"]):after{background-color:var(--s-text-on-action-primary)}.button-group--segmented ::slotted(*:not(:first-child):not(:last-child)){--flip-button-border-top-right-radius:0;--flip-button-border-top-left-radius:0;--flip-button-border-bottom-right-radius:0;--flip-button-border-bottom-left-radius:0;--flip-icon-button-border-top-right-radius:0;--flip-icon-button-border-top-left-radius:0;--flip-icon-button-border-bottom-right-radius:0;--flip-icon-button-border-bottom-left-radius:0}.button-group--segmented ::slotted(*:first-child){--flip-button-border-top-right-radius:0;--flip-button-border-bottom-right-radius:0;--flip-icon-button-border-top-right-radius:0;--flip-icon-button-border-bottom-right-radius:0;--flip-icon-button-border-top-left-radius:var(--s-border-radius-base);--flip-icon-button-border-bottom-left-radius:var(--s-border-radius-base)}.button-group--segmented ::slotted(*:last-child){--flip-button-border-top-left-radius:0;--flip-button-border-bottom-left-radius:0;--flip-icon-button-border-top-right-radius:var(--s-border-radius-base);--flip-icon-button-border-bottom-right-radius:var(--s-border-radius-base);--flip-icon-button-border-top-left-radius:0;--flip-icon-button-border-bottom-left-radius:0}';const e=class{constructor(o){t(this,o);this.orientation="horizontal"}render(){const t=this.segmented?"0":"8";const s=i("button-group",{"button-group--segmented":this.segmented});return o(r,null,o("flip-stack",{align:this.orientation==="vertical"&&this.stretch?"stretch":"start",class:s,justify:this.orientation==="horizontal"&&this.stretch?"stretch":"start",orientation:this.orientation,role:"group",spacing:t,wrap:this.wrap},o("slot",null)))}};e.style=s;export{e as flip_button_group};
|
|
2
|
+
//# sourceMappingURL=p-8784a282.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-button-group/flip-button-group.css?tag=flip-button-group&encapsulation=shadow","src/components/flip-button-group/flip-button-group.tsx"],"names":["flipButtonGroupCss","FlipButtonGroup","[object Object]","hostRef","this","orientation","spacing","segmented","className","classnames","button-group--segmented","h","Host","align","stretch","class","justify","role","wrap"],"mappings":"8GAAA,MAAMA,EAAqB,20DCWdC,EAAe,MAL5BC,YAAAC,aAMUC,KAAAC,YAA2C,aAKnDH,SACE,MAAMI,EAAUF,KAAKG,UAAY,IAAM,IAEvC,MAAMC,EAAYC,EAAW,eAAgB,CAC3CC,0BAA2BN,KAAKG,YAGlC,OACEI,EAACC,EAAI,KACHD,EAAA,aAAA,CACEE,MACET,KAAKC,cAAgB,YAAcD,KAAKU,QACpC,UACA,QAENC,MAAOP,EACPQ,QACEZ,KAAKC,cAAgB,cAAgBD,KAAKU,QACtC,UACA,QAENT,YAAaD,KAAKC,YAClBY,KAAK,QACLX,QAASA,EACTY,KAAMd,KAAKc,MAEXP,EAAA,OAAA","sourcesContent":[":host {\n display: block;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.button-group--segmented {\n & ::slotted(*:not(:last-child)) {\n position: relative;\n\n &:after {\n position: absolute;\n z-index: 1;\n top: 50%;\n left: 100%;\n width: var(--s-border-width-default);\n height: calc(100% - var(--s-space-16));\n background-color: var(--s-border-strong);\n content: \"\";\n transform: translate3d(-50%, -50%, 0);\n pointer-events: none;\n }\n }\n\n & ::slotted(*:not(:last-child):not([disabled])[intent=\"primary\"]) {\n &:after {\n background-color: var(--s-text-on-action-primary);\n }\n }\n\n & ::slotted(*:not(:last-child)[disabled=\"false\"][intent=\"primary\"]) {\n &:after {\n background-color: var(--s-text-on-action-primary);\n }\n }\n\n & ::slotted(*:not(:first-child):not(:last-child)) {\n --flip-button-border-top-right-radius: 0;\n --flip-button-border-top-left-radius: 0;\n --flip-button-border-bottom-right-radius: 0;\n --flip-button-border-bottom-left-radius: 0;\n\n --flip-icon-button-border-top-right-radius: 0;\n --flip-icon-button-border-top-left-radius: 0;\n --flip-icon-button-border-bottom-right-radius: 0;\n --flip-icon-button-border-bottom-left-radius: 0;\n }\n\n & ::slotted(*:first-child) {\n --flip-button-border-top-right-radius: 0;\n --flip-button-border-bottom-right-radius: 0;\n\n --flip-icon-button-border-top-right-radius: 0;\n --flip-icon-button-border-bottom-right-radius: 0;\n --flip-icon-button-border-top-left-radius: var(--s-border-radius-base);\n --flip-icon-button-border-bottom-left-radius: var(--s-border-radius-base);\n }\n\n & ::slotted(*:last-child) {\n --flip-button-border-top-left-radius: 0;\n --flip-button-border-bottom-left-radius: 0;\n\n --flip-icon-button-border-top-right-radius: var(--s-border-radius-base);\n --flip-icon-button-border-bottom-right-radius: var(--s-border-radius-base);\n --flip-icon-button-border-top-left-radius: 0;\n --flip-icon-button-border-bottom-left-radius: 0;\n }\n}\n","import { Component, h, Host, Prop } from \"@stencil/core\";\nimport classnames from \"classnames\";\nimport { FlipStackOrientation } from \"../flip-stack/flip-stack\";\n\nexport type FlipButtonGroupOrientation = FlipStackOrientation;\n\n@Component({\n shadow: true,\n styleUrl: \"flip-button-group.css\",\n tag: \"flip-button-group\",\n})\nexport class FlipButtonGroup {\n @Prop() orientation?: FlipButtonGroupOrientation = \"horizontal\";\n @Prop() segmented?: boolean;\n @Prop() stretch?: boolean;\n @Prop() wrap?: boolean;\n\n render() {\n const spacing = this.segmented ? \"0\" : \"8\";\n\n const className = classnames(\"button-group\", {\n \"button-group--segmented\": this.segmented,\n });\n\n return (\n <Host>\n <flip-stack\n align={\n this.orientation === \"vertical\" && this.stretch\n ? \"stretch\"\n : \"start\"\n }\n class={className}\n justify={\n this.orientation === \"horizontal\" && this.stretch\n ? \"stretch\"\n : \"start\"\n }\n orientation={this.orientation}\n role=\"group\"\n spacing={spacing}\n wrap={this.wrap}\n >\n <slot></slot>\n </flip-stack>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as o,H as n}from"./p-9fe00e8a.js";import{c as i}from"./p-efffd297.js";import"./p-86bd3473.js";const a=".sc-flip-button-h{display:inline-block;max-width:100%}.sc-flip-button-h *.sc-flip-button{box-sizing:border-box}.button.sc-flip-button{display:inline-flex;width:100%;padding:var(--s-space-8) var(--s-space-16);justify-content:center;align-items:center;border:none;border-top-right-radius:var(--flip-button-border-top-right-radius);border-top-left-radius:var(--flip-button-border-top-left-radius);border-bottom-right-radius:var(--flip-button-border-bottom-right-radius);border-bottom-left-radius:var(--flip-button-border-bottom-left-radius);color:var(--s-text-subdued);background-color:var(--flip-ghost-button-background-default);font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-lg);text-decoration:none;cursor:pointer;gap:var(--s-space-8)}.button.sc-flip-button:hover{background-color:var(--flip-ghost-button-background-hovered)}.button.sc-flip-button:active{background-color:var(--flip-ghost-button-background-pressed)}.button.sc-flip-button:disabled{color:var(--s-text-disabled);background-color:var(--flip-ghost-button-background-default);cursor:default}.button.sc-flip-button:disabled .button__icon.sc-flip-button{color:var(--s-icon-disabled)}.button.sc-flip-button:focus{outline-color:var(--s-focus-default)}.button--variant-ghost.button--intent-primary.sc-flip-button:not(:disabled){color:var(--s-text-highlight)}.button--variant-ghost.button--intent-primary.sc-flip-button:not(:disabled) .button__icon.sc-flip-button{color:var(--s-icon-highlight)}.button--variant-ghost.button--intent-critical.sc-flip-button:not(:disabled){color:var(--s-text-critical)}.button--variant-ghost.button--intent-critical.sc-flip-button:not(:disabled) .button__icon.sc-flip-button{color:var(--s-icon-critical)}.button--variant-ghost.button--size-l.sc-flip-button{padding:var(--s-space-12) var(--s-space-20)}.button--variant-ghost.button--size-l.button--icon-only.sc-flip-button{padding:var(--s-space-12)}.button--variant-flat.sc-flip-button{color:var(--s-text-default);background-color:var(--s-action-neutral-default)}.button--variant-flat.sc-flip-button:hover{background-color:var(--s-action-neutral-hovered)}.button--variant-flat.sc-flip-button:active{background-color:var(--s-action-neutral-pressed)}.button--variant-flat.sc-flip-button:disabled{background-color:var(--s-action-neutral-disabled)}.button--variant-flat.button--intent-primary.sc-flip-button:not(:disabled){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-flat.button--intent-primary.sc-flip-button:not(:disabled):hover{background-color:var(--s-action-primary-hovered)}.button--variant-flat.button--intent-primary.sc-flip-button:not(:disabled):active{background-color:var(--s-action-primary-pressed)}.button--variant-flat.button--intent-primary.sc-flip-button:not(:disabled) .button__icon.sc-flip-button{color:var(--s-icon-on-action-primary)}.button--variant-flat.sc-flip-button .button__icon.sc-flip-button{color:var(--s-icon-strong)}.button--variant-plain.sc-flip-button{padding:0;border-radius:0;color:var(--s-interactive-neutral-default);background-color:transparent}.button--variant-plain.sc-flip-button:hover:not(:disabled){color:var(--s-interactive-neutral-default);background-color:transparent;text-decoration:underline;text-underline-offset:var(--s-space-4)}.button--variant-plain.sc-flip-button:hover:not(:disabled) .button__icon.sc-flip-button{color:var(--s-interactive-neutral-default)}.button--variant-plain.sc-flip-button:active:not(:disabled){color:var(--s-interactive-neutral-hovered);background-color:transparent}.button--variant-plain.sc-flip-button:active:not(:disabled) .button__icon.sc-flip-button{color:var(--s-interactive-neutral-hovered)}.button--variant-plain.sc-flip-button:disabled{color:var(--s-interactive-neutral-disabled);background-color:transparent}.button--variant-plain.sc-flip-button:disabled .button__icon.sc-flip-button{color:var(--s-interactive-neutral-disabled)}.button--variant-plain.button--intent-primary.sc-flip-button{color:var(--s-interactive-primary-default)}.button--variant-plain.button--intent-primary.sc-flip-button:hover{color:var(--s-interactive-primary-default)}.button--variant-plain.button--intent-primary.sc-flip-button:hover .button__icon.sc-flip-button{color:var(--s-interactive-primary-default)}.button--variant-plain.button--intent-primary.sc-flip-button:active{color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-flip-button:active .button__icon.sc-flip-button{color:var(--s-interactive-primary-hovered)}.button--variant-plain.button--intent-primary.sc-flip-button:disabled{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-flip-button:disabled .button__icon.sc-flip-button{color:var(--s-interactive-primary-disabled)}.button--variant-plain.button--intent-primary.sc-flip-button .button__icon.sc-flip-button{color:var(--s-interactive-primary-default)}.button--variant-plain.sc-flip-button .button__icon.sc-flip-button{color:var(--s-interactive-neutral-default)}.button--variant-on-image.sc-flip-button{color:var(--s-text-on-image);background:linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n rgba(255, 255, 255, 0.3)}.button--variant-on-image.sc-flip-button:hover{background:linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),\n rgba(255, 255, 255, 0.4)}.button--variant-on-image.sc-flip-button:active{background:linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),\n rgba(255, 255, 255, 0.5)}.button--variant-on-image.sc-flip-button:disabled{color:var(--s-text-on-image);background:linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n rgba(255, 255, 255, 0.3)}.button--variant-on-image.sc-flip-button:disabled .button__icon.sc-flip-button{color:var(--s-icon-on-image)}.button--variant-on-image.sc-flip-button .button__icon.sc-flip-button{color:var(--s-icon-on-image)}.button--variant-floating.sc-flip-button{color:var(--s-text-default);background-color:var(--s-surface-overlay-default);box-shadow:0.125rem 0.25rem 2.5rem rgba(0, 0, 0, 0.14)}.button--variant-floating.sc-flip-button:hover{color:var(--s-text-on-action-primary);background-color:var(--s-surface-overlay-hovered)}.button--variant-floating.sc-flip-button:active{color:var(--s-text-on-action-primary);background-color:var(--s-surface-overlay-pressed)}.button--variant-floating.button--icon-only.sc-flip-button{padding:var(--s-space-4)}.button--variant-floating.button--intent-primary.sc-flip-button{padding:var(--s-space-12) var(--s-space-20);border-radius:1.5rem;color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-default)}.button--variant-floating.button--intent-primary.sc-flip-button:hover:not(:disabled){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-hovered)}.button--variant-floating.button--intent-primary.sc-flip-button:active:not(:disabled){color:var(--s-text-on-action-primary);background-color:var(--s-action-primary-pressed)}.button--variant-floating.button--intent-primary.sc-flip-button:disabled{color:var(--s-text-on-action-primary)}.button--variant-floating.button--intent-primary.sc-flip-button:disabled .button__icon.sc-flip-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.button--intent-primary.sc-flip-button .button__icon.sc-flip-button{color:var(--s-icon-on-action-primary)}.button--variant-floating.sc-flip-button .button__icon.sc-flip-button{color:var(--s-icon-strong)}.button--icon-position-end.sc-flip-button .button__icon.sc-flip-button{margin-right:calc(-1 * var(--s-space-4));margin-left:0;order:2}.button--icon-only.sc-flip-button{padding:var(--s-space-8);border-top-right-radius:var(--flip-icon-button-border-top-right-radius);border-top-left-radius:var(--flip-icon-button-border-top-left-radius);border-bottom-right-radius:var(\n --flip-icon-button-border-bottom-right-radius\n );border-bottom-left-radius:var(--flip-icon-button-border-bottom-left-radius)}.button--icon-only.sc-flip-button .button__icon.sc-flip-button{margin-right:0;margin-left:0}.button__icon.sc-flip-button{display:inline-flex;margin-left:calc(-1 * var(--s-space-4));color:var(--s-icon-default);order:0}.button__label.sc-flip-button{overflow:hidden;max-width:100%;white-space:nowrap;text-overflow:ellipsis;order:1}";const r=class{constructor(o){t(this,o);this.iconPosition="start";this.intent="default";this.size="m";this.type="button";this.variant="ghost"}componentDidLoad(){this.forceIconProps()}forceIconProps(){if(!Boolean(this.iconEl)){return}const t=this.iconEl.children[0];t===null||t===void 0?void 0:t.setAttribute("size","24")}render(){const t=this.hideLabel&&Boolean(this.icon)||this.variant==="floating"&&this.intent==="default";const a=Boolean(this.href);const r=Boolean(this.flipAriaLabel)?this.flipAriaLabel:t?this.label:undefined;const e=i("button",`button--icon-position-${this.iconPosition}`,`button--intent-${this.intent}`,`button--size-${this.size}`,`button--variant-${this.variant}`,{"button--icon-only":t});const l=a?"a":"button";return o(n,null,o(l,{"aria-describedby":this.flipAriaDescribedby,"aria-disabled":this.disabled&&!a?"true":undefined,"aria-label":r,class:e,disabled:a?undefined:this.disabled,download:a?undefined:this.download,form:a?undefined:this.form,href:this.href,name:a?undefined:this.name,target:a?this.target:undefined,type:a?undefined:this.type,value:a?undefined:this.value},this.icon&&o("span",{class:"button__icon",innerHTML:this.icon,ref:t=>this.iconEl=t}),!t&&o("span",{class:"button__label"},this.label)))}};r.style=a;export{r as flip_button};
|
|
2
|
+
//# sourceMappingURL=p-8faa2889.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-button/flip-button.css?tag=flip-button&encapsulation=scoped","src/components/flip-button/flip-button.tsx"],"names":["flipButtonCss","FlipButton","[object Object]","hostRef","this","iconPosition","intent","size","type","variant","forceIconProps","Boolean","iconEl","icon","children","setAttribute","hideLabel","isLink","href","ariaLabel","flipAriaLabel","label","undefined","className","classnames","button--icon-only","Tag","h","Host","aria-describedby","flipAriaDescribedby","aria-disabled","disabled","aria-label","class","download","form","name","target","value","innerHTML","ref","el"],"mappings":"8GAAA,MAAMA,EAAgB,qoQC8BTC,EAAU,MAZvBC,YAAAC,aAqBUC,KAAAC,aAAuC,QACvCD,KAAAE,OAA4B,UAG5BF,KAAAG,KAAwB,IAExBH,KAAAI,KAAwB,SAExBJ,KAAAK,QAA8B,QAItCP,mBACEE,KAAKM,iBAGCR,iBACN,IAAKS,QAAQP,KAAKQ,QAAS,CACzB,OAGF,MAAMC,EAAOT,KAAKQ,OAAOE,SAAS,GAElCD,IAAI,MAAJA,SAAI,OAAA,EAAJA,EAAME,aAAa,OAAQ,MAG7Bb,SACE,MAAMc,EACHZ,KAAKY,WAAaL,QAAQP,KAAKS,OAC/BT,KAAKK,UAAY,YAAcL,KAAKE,SAAW,UAElD,MAAMW,EAASN,QAAQP,KAAKc,MAE5B,MAAMC,EAAYR,QAAQP,KAAKgB,eAC3BhB,KAAKgB,cACLJ,EACAZ,KAAKiB,MACLC,UAEJ,MAAMC,EAAYC,EAChB,SACA,yBAAyBpB,KAAKC,eAC9B,kBAAkBD,KAAKE,SACvB,gBAAgBF,KAAKG,OACrB,mBAAmBH,KAAKK,UACxB,CACEgB,oBAAqBT,IAIzB,MAAMU,EAAMT,EAAS,IAAM,SAE3B,OACEU,EAACC,EAAI,KACHD,EAACD,EAAG,CAAAG,mBACgBzB,KAAK0B,oBAAmBC,gBAC3B3B,KAAK4B,WAAaf,EAAS,OAASK,UAASW,aAChDd,EACZe,MAAOX,EACPS,SAAUf,EAASK,UAAYlB,KAAK4B,SACpCG,SAAUlB,EAASK,UAAYlB,KAAK+B,SACpCC,KAAMnB,EAASK,UAAYlB,KAAKgC,KAChClB,KAAMd,KAAKc,KACXmB,KAAMpB,EAASK,UAAYlB,KAAKiC,KAChCC,OAAQrB,EAASb,KAAKkC,OAAShB,UAC/Bd,KAAMS,EAASK,UAAYlB,KAAKI,KAChC+B,MAAOtB,EAASK,UAAYlB,KAAKmC,OAEhCnC,KAAKS,MACJc,EAAA,OAAA,CACEO,MAAM,eACNM,UAAWpC,KAAKS,KAChB4B,IAAMC,GAAQtC,KAAKQ,OAAS8B,KAG9B1B,GAAaW,EAAA,OAAA,CAAMO,MAAM,iBAAiB9B,KAAKiB","sourcesContent":[":host {\n display: inline-block;\n max-width: 100%;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.button {\n display: inline-flex;\n width: 100%;\n padding: var(--s-space-8) var(--s-space-16);\n justify-content: center;\n align-items: center;\n border: none;\n border-top-right-radius: var(--flip-button-border-top-right-radius);\n border-top-left-radius: var(--flip-button-border-top-left-radius);\n border-bottom-right-radius: var(--flip-button-border-bottom-right-radius);\n border-bottom-left-radius: var(--flip-button-border-bottom-left-radius);\n color: var(--s-text-subdued);\n background-color: var(--flip-ghost-button-background-default);\n font: inherit;\n font-weight: var(--s-font-weight-medium);\n line-height: var(--s-line-height-lg);\n text-decoration: none;\n cursor: pointer;\n gap: var(--s-space-8);\n\n &:hover {\n background-color: var(--flip-ghost-button-background-hovered);\n }\n\n &:active {\n background-color: var(--flip-ghost-button-background-pressed);\n }\n\n &:disabled {\n color: var(--s-text-disabled);\n background-color: var(--flip-ghost-button-background-default);\n cursor: default;\n\n & .button__icon {\n color: var(--s-icon-disabled);\n }\n }\n\n &:focus {\n outline-color: var(--s-focus-default);\n }\n}\n\n.button--variant-ghost {\n &.button--intent-primary:not(:disabled) {\n color: var(--s-text-highlight);\n\n & .button__icon {\n color: var(--s-icon-highlight);\n }\n }\n\n &.button--intent-critical:not(:disabled) {\n color: var(--s-text-critical);\n\n & .button__icon {\n color: var(--s-icon-critical);\n }\n }\n\n &.button--size-l {\n padding: var(--s-space-12) var(--s-space-20);\n\n &.button--icon-only {\n padding: var(--s-space-12);\n }\n }\n}\n\n.button--variant-flat {\n color: var(--s-text-default);\n background-color: var(--s-action-neutral-default);\n\n &:hover {\n background-color: var(--s-action-neutral-hovered);\n }\n\n &:active {\n background-color: var(--s-action-neutral-pressed);\n }\n\n &:disabled {\n background-color: var(--s-action-neutral-disabled);\n }\n\n &.button--intent-primary:not(:disabled) {\n color: var(--s-text-on-action-primary);\n background-color: var(--s-action-primary-default);\n\n &:hover {\n background-color: var(--s-action-primary-hovered);\n }\n\n &:active {\n background-color: var(--s-action-primary-pressed);\n }\n\n & .button__icon {\n color: var(--s-icon-on-action-primary);\n }\n }\n\n & .button__icon {\n color: var(--s-icon-strong);\n }\n}\n\n.button--variant-plain {\n padding: 0;\n border-radius: 0;\n color: var(--s-interactive-neutral-default);\n background-color: transparent;\n\n &:hover:not(:disabled) {\n color: var(--s-interactive-neutral-default);\n background-color: transparent;\n text-decoration: underline;\n text-underline-offset: var(--s-space-4);\n\n & .button__icon {\n color: var(--s-interactive-neutral-default);\n }\n }\n\n &:active:not(:disabled) {\n color: var(--s-interactive-neutral-hovered);\n background-color: transparent;\n\n & .button__icon {\n color: var(--s-interactive-neutral-hovered);\n }\n }\n\n &:disabled {\n color: var(--s-interactive-neutral-disabled);\n background-color: transparent;\n\n & .button__icon {\n color: var(--s-interactive-neutral-disabled);\n }\n }\n\n &.button--intent-primary {\n color: var(--s-interactive-primary-default);\n\n &:hover {\n color: var(--s-interactive-primary-default);\n\n & .button__icon {\n color: var(--s-interactive-primary-default);\n }\n }\n\n &:active {\n color: var(--s-interactive-primary-hovered);\n\n & .button__icon {\n color: var(--s-interactive-primary-hovered);\n }\n }\n\n &:disabled {\n color: var(--s-interactive-primary-disabled);\n\n & .button__icon {\n color: var(--s-interactive-primary-disabled);\n }\n }\n\n & .button__icon {\n color: var(--s-interactive-primary-default);\n }\n }\n\n & .button__icon {\n color: var(--s-interactive-neutral-default);\n }\n}\n\n.button--variant-on-image {\n color: var(--s-text-on-image);\n background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n rgba(255, 255, 255, 0.3);\n\n &:hover {\n background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),\n rgba(255, 255, 255, 0.4);\n }\n\n &:active {\n background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),\n rgba(255, 255, 255, 0.5);\n }\n\n &:disabled {\n color: var(--s-text-on-image);\n background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n rgba(255, 255, 255, 0.3);\n\n & .button__icon {\n color: var(--s-icon-on-image);\n }\n }\n\n & .button__icon {\n color: var(--s-icon-on-image);\n }\n}\n\n.button--variant-floating {\n color: var(--s-text-default);\n background-color: var(--s-surface-overlay-default);\n box-shadow: 0.125rem 0.25rem 2.5rem rgba(0, 0, 0, 0.14);\n\n &:hover {\n color: var(--s-text-on-action-primary);\n background-color: var(--s-surface-overlay-hovered);\n }\n\n &:active {\n color: var(--s-text-on-action-primary);\n background-color: var(--s-surface-overlay-pressed);\n }\n\n &.button--icon-only {\n padding: var(--s-space-4);\n }\n\n &.button--intent-primary {\n padding: var(--s-space-12) var(--s-space-20);\n border-radius: 1.5rem;\n color: var(--s-text-on-action-primary);\n background-color: var(--s-action-primary-default);\n\n &:hover:not(:disabled) {\n color: var(--s-text-on-action-primary);\n background-color: var(--s-action-primary-hovered);\n }\n\n &:active:not(:disabled) {\n color: var(--s-text-on-action-primary);\n background-color: var(--s-action-primary-pressed);\n }\n\n &:disabled {\n color: var(--s-text-on-action-primary);\n\n & .button__icon {\n color: var(--s-icon-on-action-primary);\n }\n }\n\n & .button__icon {\n color: var(--s-icon-on-action-primary);\n }\n }\n\n & .button__icon {\n color: var(--s-icon-strong);\n }\n}\n\n.button--icon-position-end {\n & .button__icon {\n margin-right: calc(-1 * var(--s-space-4));\n margin-left: 0;\n order: 2;\n }\n}\n\n.button--icon-only {\n padding: var(--s-space-8);\n border-top-right-radius: var(--flip-icon-button-border-top-right-radius);\n border-top-left-radius: var(--flip-icon-button-border-top-left-radius);\n border-bottom-right-radius: var(\n --flip-icon-button-border-bottom-right-radius\n );\n border-bottom-left-radius: var(--flip-icon-button-border-bottom-left-radius);\n\n & .button__icon {\n margin-right: 0;\n margin-left: 0;\n }\n}\n\n.button__icon {\n display: inline-flex;\n margin-left: calc(-1 * var(--s-space-4));\n color: var(--s-icon-default);\n order: 0;\n}\n\n.button__label {\n overflow: hidden;\n max-width: 100%;\n white-space: nowrap;\n text-overflow: ellipsis;\n order: 1;\n}\n","import { Component, h, Host, Prop } from \"@stencil/core\";\nimport classnames from \"classnames\";\n\nexport type FlipButtonIconPosition = \"start\" | \"end\";\n\nexport type FlipButtonIntent = \"default\" | \"primary\" | \"critical\";\n\nexport type FlipButtonSize = \"m\" | \"l\";\n\nexport type FlipButtonType = \"button\" | \"submit\";\n\nexport type FlipButtonVariant =\n | \"flat\"\n | \"ghost\"\n | \"plain\"\n | \"floating\"\n | \"on-image\";\n\n@Component({\n /**\n * Form controls in shadow dom can still not be associated with labels in the\n * light dom, cross browser. So for now we disable shadow dom for form\n * controls (inputs, buttons, selects, etc.). Instead we use Stencil's scoping.\n * https://caniuse.com/?search=attachInternals\n */\n scoped: true,\n shadow: false,\n tag: \"flip-button\",\n styleUrl: \"flip-button.css\",\n})\nexport class FlipButton {\n @Prop() disabled?: boolean;\n @Prop() download?: string;\n @Prop() flipAriaDescribedby?: string;\n @Prop() flipAriaLabel?: string;\n @Prop() form?: string;\n @Prop() hideLabel?: boolean;\n @Prop() href?: string;\n @Prop() icon?: string;\n @Prop() iconPosition: FlipButtonIconPosition = \"start\";\n @Prop() intent?: FlipButtonIntent = \"default\";\n @Prop() label!: string;\n @Prop() name?: string;\n @Prop() size?: FlipButtonSize = \"m\";\n @Prop() target?: string;\n @Prop() type?: FlipButtonType = \"button\";\n @Prop() value?: string;\n @Prop() variant?: FlipButtonVariant = \"ghost\";\n\n private iconEl: HTMLElement;\n\n componentDidLoad() {\n this.forceIconProps();\n }\n\n private forceIconProps() {\n if (!Boolean(this.iconEl)) {\n return;\n }\n\n const icon = this.iconEl.children[0];\n\n icon?.setAttribute(\"size\", \"24\");\n }\n\n render() {\n const hideLabel =\n (this.hideLabel && Boolean(this.icon)) ||\n (this.variant === \"floating\" && this.intent === \"default\");\n\n const isLink = Boolean(this.href);\n\n const ariaLabel = Boolean(this.flipAriaLabel)\n ? this.flipAriaLabel\n : hideLabel\n ? this.label\n : undefined;\n\n const className = classnames(\n \"button\",\n `button--icon-position-${this.iconPosition}`,\n `button--intent-${this.intent}`,\n `button--size-${this.size}`,\n `button--variant-${this.variant}`,\n {\n \"button--icon-only\": hideLabel,\n }\n );\n\n const Tag = isLink ? \"a\" : \"button\";\n\n return (\n <Host>\n <Tag\n aria-describedby={this.flipAriaDescribedby}\n aria-disabled={this.disabled && !isLink ? \"true\" : undefined}\n aria-label={ariaLabel}\n class={className}\n disabled={isLink ? undefined : this.disabled}\n download={isLink ? undefined : this.download}\n form={isLink ? undefined : this.form}\n href={this.href}\n name={isLink ? undefined : this.name}\n target={isLink ? this.target : undefined}\n type={isLink ? undefined : this.type}\n value={isLink ? undefined : this.value}\n >\n {this.icon && (\n <span\n class=\"button__icon\"\n innerHTML={this.icon}\n ref={(el) => (this.iconEl = el)}\n ></span>\n )}\n {!hideLabel && <span class=\"button__label\">{this.label}</span>}\n </Tag>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as i,c as a,h as o,H as t}from"./p-9fe00e8a.js";import{A as e}from"./p-fe0b5250.js";import{c as s}from"./p-efffd297.js";import"./p-86bd3473.js";const n=':host{--flip-ghost-button-background-default:var(--s-surface-overlay-default);--flip-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--flip-ghost-button-background-pressed:var(--s-surface-overlay-pressed);display:block}:host *{box-sizing:border-box}.dialog{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0}.dialog[aria-hidden="true"]{display:none}.dialog:not(.dialog--closing) .dialog__backdrop{-webkit-animation:0.15s dialog-backdrop-fade-in;animation:0.15s dialog-backdrop-fade-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__backdrop{-webkit-animation:none;animation:none}}.dialog:not(.dialog--closing) .dialog__body{-webkit-animation:0.15s dialog-scale-in;animation:0.15s dialog-scale-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__body{-webkit-animation:none;animation:none}}.dialog--closing{-webkit-animation:0.15s dialog-fade-out;animation:0.15s dialog-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.dialog--closing{-webkit-animation:none;animation:none}}.dialog__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.dialog__body{z-index:var(--s-z-40);overflow-x:hidden;overflow-y:auto;width:18.5rem;max-height:90vh;padding-top:var(--s-space-24);padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);padding-left:var(--s-space-8);border-radius:var(--s-border-radius-l);background-color:var(--s-surface-overlay-default);text-align:center;box-shadow:0.125rem 0.25rem 1rem rgba(0, 0, 0, 0.14)}.dialog__heading{margin:0;margin-bottom:var(--s-space-8);font-size:var(--s-font-size-lg);font-weight:var(--s-font-weight-semibold);line-height:var(--s-line-height-lg)}.dialog__content{margin-bottom:var(--s-space-24);line-height:var(--s-line-height-base)}.dialog__content ::slotted(*){margin:0}@-webkit-keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}@keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}';const r=class{constructor(o){i(this,o);this.primaryAction=a(this,"primaryAction",7);this.secondaryAction=a(this,"secondaryAction",7);this.intent="primary";this.closing=false;this.onKeyDown=i=>{if(i.code==="Escape"){this.close()}};this.onBackdropClick=()=>{this.close()};this.onPrimaryAction=i=>{this.primaryAction.emit(i);this.close()};this.onSecondaryAction=i=>{this.secondaryAction.emit(i);this.close()}}componentDidLoad(){this.dialog=new e(this.dialogEl);this.dialog.on("show",(()=>{var i;(i=this.controlsContainerEl.querySelector("flip-button button"))===null||i===void 0?void 0:i.focus()}))}disconnectedCallback(){var i;(i=this.dialog)===null||i===void 0?void 0:i.destroy()}async open(){this.dialog.show()}async close(){if(this.closing){return}this.closing=true;setTimeout((()=>{this.dialog.hide();this.closing=false}),150)}render(){const i=s("dialog",{"dialog--closing":this.closing});return o(t,null,o("div",{"aria-describedby":"content","aria-hidden":"true","aria-labelledby":this.hideLabel?undefined:"label","aria-label":this.hideLabel?this.label:undefined,"aria-modal":"true",class:i,onKeyDown:this.onKeyDown,ref:i=>this.dialogEl=i,role:"alertdialog"},o("div",{class:"dialog__backdrop",onClick:this.onBackdropClick}),o("div",{class:"dialog__body",role:"document"},!this.hideLabel&&o("h2",{class:"dialog__heading",id:"label"},this.label),o("div",{class:"dialog__content",id:"content"},o("slot",null)),o("flip-button-group",{class:"dialog__controls",ref:i=>this.controlsContainerEl=i,stretch:true,wrap:true},this.secondaryActionLabel&&o("flip-button",{label:this.secondaryActionLabel,onClick:this.onSecondaryAction}),this.primaryActionLabel&&o("flip-button",{intent:this.intent,label:this.primaryActionLabel,onClick:this.onPrimaryAction,variant:this.intent==="critical"?"ghost":"flat"})))))}};r.style=n;export{r as flip_dialog};
|
|
2
|
+
//# sourceMappingURL=p-95c9ef17.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-dialog/flip-dialog.css?tag=flip-dialog&encapsulation=shadow","src/components/flip-dialog/flip-dialog.tsx"],"names":["flipDialogCss","FlipDialog","[object Object]","hostRef","this","intent","closing","onKeyDown","event","code","close","onBackdropClick","onPrimaryAction","primaryAction","emit","onSecondaryAction","secondaryAction","dialog","A11yDialog","dialogEl","on","_a","controlsContainerEl","querySelector","focus","destroy","show","setTimeout","hide","className","classnames","dialog--closing","h","Host","aria-describedby","aria-hidden","aria-labelledby","hideLabel","undefined","aria-label","label","aria-modal","class","ref","el","role","onClick","id","stretch","wrap","secondaryActionLabel","primaryActionLabel","variant"],"mappings":"yJAAA,MAAMA,EAAgB,8wECuBTC,EAAU,MALvBC,YAAAC,2GAOUC,KAAAC,OAA4B,UAQ3BD,KAAAE,QAAU,MA6CnBF,KAAAG,UAAaC,IACX,GAAIA,EAAMC,OAAS,SAAU,CAC3BL,KAAKM,UAIDN,KAAAO,gBAAkB,KACxBP,KAAKM,SAGCN,KAAAQ,gBAAmBJ,IACzBJ,KAAKS,cAAcC,KAAKN,GACxBJ,KAAKM,SAGCN,KAAAW,kBAAqBP,IAC3BJ,KAAKY,gBAAgBF,KAAKN,GAC1BJ,KAAKM,SAxDPR,mBACEE,KAAKa,OAAS,IAAIC,EAAWd,KAAKe,UAElCf,KAAKa,OAAOG,GAAG,QAAQ,YACrBC,EAAAjB,KAAKkB,oBACFC,cAAiC,yBAAqB,MAAAF,SAAA,OAAA,EAAAA,EACrDG,WAIRtB,8BACEmB,EAAAjB,KAAKa,UAAM,MAAAI,SAAA,OAAA,EAAAA,EAAEI,UAOfvB,aACEE,KAAKa,OAAOS,OAOdxB,cACE,GAAIE,KAAKE,QAAS,CAChB,OAGFF,KAAKE,QAAU,KAEfqB,YAAW,KACTvB,KAAKa,OAAOW,OACZxB,KAAKE,QAAU,QACd,KAuBLJ,SACE,MAAM2B,EAAYC,EAAW,SAAU,CAAEC,kBAAmB3B,KAAKE,UAEjE,OACE0B,EAACC,EAAI,KACHD,EAAA,MAAA,CAAAE,mBACmB,UAASC,cACd,OAAMC,kBACDhC,KAAKiC,UAAYC,UAAY,QAAOC,aACzCnC,KAAKiC,UAAYjC,KAAKoC,MAAQF,UAASG,aACxC,OACXC,MAAOb,EACPtB,UAAWH,KAAKG,UAChBoC,IAAMC,GAAQxC,KAAKe,SAAWyB,EAC9BC,KAAK,eAELb,EAAA,MAAA,CAAKU,MAAM,mBAAmBI,QAAS1C,KAAKO,kBAC5CqB,EAAA,MAAA,CAAKU,MAAM,eAAeG,KAAK,aAC3BzC,KAAKiC,WACLL,EAAA,KAAA,CAAIU,MAAM,kBAAkBK,GAAG,SAC5B3C,KAAKoC,OAGVR,EAAA,MAAA,CAAKU,MAAM,kBAAkBK,GAAG,WAC9Bf,EAAA,OAAA,OAEFA,EAAA,oBAAA,CACEU,MAAM,mBACNC,IAAMC,GAAQxC,KAAKkB,oBAAsBsB,EACzCI,QAAO,KACPC,KAAI,MAEH7C,KAAK8C,sBACJlB,EAAA,cAAA,CACEQ,MAAOpC,KAAK8C,qBACZJ,QAAS1C,KAAKW,oBAGjBX,KAAK+C,oBACJnB,EAAA,cAAA,CACE3B,OAAQD,KAAKC,OACbmC,MAAOpC,KAAK+C,mBACZL,QAAS1C,KAAKQ,gBACdwC,QAAShD,KAAKC,SAAW,WAAa,QAAU","sourcesContent":[":host {\n --flip-ghost-button-background-default: var(--s-surface-overlay-default);\n --flip-ghost-button-background-hovered: var(--s-surface-overlay-hovered);\n --flip-ghost-button-background-pressed: var(--s-surface-overlay-pressed);\n\n display: block;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.dialog {\n position: fixed;\n z-index: var(--s-z-40);\n display: flex;\n justify-content: center;\n align-items: center;\n inset: 0;\n\n &[aria-hidden=\"true\"] {\n display: none;\n }\n}\n\n.dialog:not(.dialog--closing) {\n & .dialog__backdrop {\n animation: 0.15s dialog-backdrop-fade-in;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n }\n\n & .dialog__body {\n animation: 0.15s dialog-scale-in;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n }\n}\n\n.dialog--closing {\n animation: 0.15s dialog-fade-out;\n animation-fill-mode: forwards;\n\n @media (prefers-reduced-motion) {\n animation: none;\n }\n}\n\n.dialog__backdrop {\n position: fixed;\n background-color: rgba(0, 0, 0, 0.2);\n inset: 0;\n}\n\n.dialog__body {\n z-index: var(--s-z-40);\n overflow-x: hidden;\n overflow-y: auto;\n width: 18.5rem;\n max-height: 90vh;\n padding-top: var(--s-space-24);\n padding-right: var(--s-space-8);\n padding-bottom: var(--s-space-8);\n padding-left: var(--s-space-8);\n border-radius: var(--s-border-radius-l);\n background-color: var(--s-surface-overlay-default);\n text-align: center;\n box-shadow: 0.125rem 0.25rem 1rem rgba(0, 0, 0, 0.14);\n}\n\n.dialog__heading {\n margin: 0;\n margin-bottom: var(--s-space-8);\n font-size: var(--s-font-size-lg);\n font-weight: var(--s-font-weight-semibold);\n line-height: var(--s-line-height-lg);\n}\n\n.dialog__content {\n margin-bottom: var(--s-space-24);\n line-height: var(--s-line-height-base);\n\n & ::slotted(*) {\n margin: 0;\n }\n}\n\n@keyframes dialog-scale-in {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n\n@keyframes dialog-backdrop-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes dialog-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n","import {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from \"@stencil/core\";\nimport A11yDialog from \"a11y-dialog\";\nimport classnames from \"classnames\";\n\nexport type FlipDialogIntent = \"primary\" | \"critical\";\n\n/**\n * @slot slot - The dialog content\n */\n@Component({\n shadow: true,\n styleUrl: \"flip-dialog.css\",\n tag: \"flip-dialog\",\n})\nexport class FlipDialog {\n @Prop() hideLabel?: boolean;\n @Prop() intent?: FlipDialogIntent = \"primary\";\n @Prop() label!: string;\n @Prop() primaryActionLabel?: string;\n @Prop() secondaryActionLabel?: string;\n\n @Event() primaryAction: EventEmitter<MouseEvent>;\n @Event() secondaryAction: EventEmitter<MouseEvent>;\n\n @State() closing = false;\n\n private controlsContainerEl: HTMLElement;\n private dialog: A11yDialog;\n private dialogEl: HTMLDivElement;\n\n componentDidLoad() {\n this.dialog = new A11yDialog(this.dialogEl);\n\n this.dialog.on(\"show\", () => {\n this.controlsContainerEl\n .querySelector<HTMLButtonElement>(\"flip-button button\")\n ?.focus();\n });\n }\n\n disconnectedCallback() {\n this.dialog?.destroy();\n }\n\n /**\n * Open the dialog.\n */\n @Method()\n async open() {\n this.dialog.show();\n }\n\n /**\n * Close the dialog.\n */\n @Method()\n async close() {\n if (this.closing) {\n return;\n }\n\n this.closing = true;\n\n setTimeout(() => {\n this.dialog.hide();\n this.closing = false;\n }, 150);\n }\n\n onKeyDown = (event: KeyboardEvent) => {\n if (event.code === \"Escape\") {\n this.close();\n }\n };\n\n private onBackdropClick = () => {\n this.close();\n };\n\n private onPrimaryAction = (event: MouseEvent) => {\n this.primaryAction.emit(event);\n this.close();\n };\n\n private onSecondaryAction = (event: MouseEvent) => {\n this.secondaryAction.emit(event);\n this.close();\n };\n\n render() {\n const className = classnames(\"dialog\", { \"dialog--closing\": this.closing });\n\n return (\n <Host>\n <div\n aria-describedby=\"content\"\n aria-hidden=\"true\"\n aria-labelledby={this.hideLabel ? undefined : \"label\"}\n aria-label={this.hideLabel ? this.label : undefined}\n aria-modal=\"true\"\n class={className}\n onKeyDown={this.onKeyDown}\n ref={(el) => (this.dialogEl = el)}\n role=\"alertdialog\"\n >\n <div class=\"dialog__backdrop\" onClick={this.onBackdropClick}></div>\n <div class=\"dialog__body\" role=\"document\">\n {!this.hideLabel && (\n <h2 class=\"dialog__heading\" id=\"label\">\n {this.label}\n </h2>\n )}\n <div class=\"dialog__content\" id=\"content\">\n <slot></slot>\n </div>\n <flip-button-group\n class=\"dialog__controls\"\n ref={(el) => (this.controlsContainerEl = el)}\n stretch\n wrap\n >\n {this.secondaryActionLabel && (\n <flip-button\n label={this.secondaryActionLabel}\n onClick={this.onSecondaryAction}\n ></flip-button>\n )}\n {this.primaryActionLabel && (\n <flip-button\n intent={this.intent}\n label={this.primaryActionLabel}\n onClick={this.onPrimaryAction}\n variant={this.intent === \"critical\" ? \"ghost\" : \"flat\"}\n ></flip-button>\n )}\n </flip-button-group>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r,h as o,H as a}from"./p-9fe00e8a.js";import{c as i}from"./p-efffd297.js";import"./p-86bd3473.js";const t=":host{display:inline-flex}:host *{box-sizing:border-box}.avatar-group{position:relative;display:inline-grid;grid-template-rows:repeat(8, 1fr);grid-template-columns:repeat(8, 1fr)}.avatar-group ::slotted(*:first-of-type){z-index:1;display:inline-flex;border:0.25rem solid var(--flip-avatar-group-border-color);border-radius:50%;grid-column-start:1;grid-column-end:7;grid-row-start:3;grid-row-end:9}.avatar-group ::slotted(*:nth-of-type(2)){z-index:0;display:inline-flex;border:0.25rem solid var(--flip-avatar-group-border-color);border-radius:50%;grid-column-start:3;grid-column-end:9;grid-row-start:1;grid-row-end:7}.avatar-group__badge{position:absolute;z-index:2;right:0;bottom:0;display:inline-flex;width:1.5rem;height:1.5rem}";const e=class{constructor(o){r(this,o)}componentDidLoad(){this.forceBadgeProps()}forceBadgeProps(){if(!Boolean(this.badge)){return}const r=this.badgeEl.querySelector("flip-badge");r===null||r===void 0?void 0:r.setAttribute("size","m")}render(){const r=i("avatar-group",{"avatar-group--has-badge":Boolean(this.badge)});const t=i("avatar-group__badge");return o(a,null,o("div",{class:r,role:"group"},o("slot",null),this.badge&&o("span",{class:t,innerHTML:this.badge,ref:r=>this.badgeEl=r})))}};e.style=t;export{e as flip_avatar_group};
|
|
2
|
+
//# sourceMappingURL=p-a15a28d3.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/components/flip-avatar-group/flip-avatar-group.css?tag=flip-avatar-group&encapsulation=shadow","src/components/flip-avatar-group/flip-avatar-group.tsx"],"names":["flipAvatarGroupCss","FlipAvatarGroup","[object Object]","this","forceBadgeProps","Boolean","badge","badgeEl","querySelector","setAttribute","className","classnames","avatar-group--has-badge","badgeClassName","h","Host","class","role","innerHTML","ref","el"],"mappings":"yGAAA,MAAMA,EAAqB,kuBCWdC,EAAe,+BAK1BC,mBACEC,KAAKC,kBAGCF,kBACN,IAAKG,QAAQF,KAAKG,OAAQ,CACxB,OAGF,MAAMA,EAAQH,KAAKI,QAAQC,cAAc,cAEzCF,IAAK,MAALA,SAAK,OAAA,EAALA,EAAOG,aAAa,OAAQ,KAG9BP,SACE,MAAMQ,EAAYC,EAAW,eAAgB,CAC3CC,0BAA2BP,QAAQF,KAAKG,SAG1C,MAAMO,EAAiBF,EAAW,uBAElC,OACEG,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKE,MAAON,EAAWO,KAAK,SAC1BH,EAAA,OAAA,MACCX,KAAKG,OACJQ,EAAA,OAAA,CACEE,MAAOH,EACPK,UAAWf,KAAKG,MAChBa,IAAMC,GAAQjB,KAAKI,QAAUa","sourcesContent":[":host {\n display: inline-flex;\n\n & * {\n box-sizing: border-box;\n }\n}\n\n.avatar-group {\n position: relative;\n display: inline-grid;\n grid-template-rows: repeat(8, 1fr);\n grid-template-columns: repeat(8, 1fr);\n\n & ::slotted(*:first-of-type) {\n z-index: 1;\n display: inline-flex;\n border: 0.25rem solid var(--flip-avatar-group-border-color);\n border-radius: 50%;\n grid-column-start: 1;\n grid-column-end: 7;\n grid-row-start: 3;\n grid-row-end: 9;\n }\n\n & ::slotted(*:nth-of-type(2)) {\n z-index: 0;\n display: inline-flex;\n border: 0.25rem solid var(--flip-avatar-group-border-color);\n border-radius: 50%;\n grid-column-start: 3;\n grid-column-end: 9;\n grid-row-start: 1;\n grid-row-end: 7;\n }\n}\n\n.avatar-group__badge {\n position: absolute;\n z-index: 2;\n right: 0;\n bottom: 0;\n display: inline-flex;\n width: 1.5rem;\n height: 1.5rem;\n}\n","import { Component, h, Host, Prop } from \"@stencil/core\";\nimport classnames from \"classnames\";\n\n/**\n * @slot slot - Your avatar components\n */\n@Component({\n shadow: true,\n styleUrl: \"flip-avatar-group.css\",\n tag: \"flip-avatar-group\",\n})\nexport class FlipAvatarGroup {\n @Prop() badge?: string;\n\n private badgeEl: HTMLElement;\n\n componentDidLoad() {\n this.forceBadgeProps();\n }\n\n private forceBadgeProps() {\n if (!Boolean(this.badge)) {\n return;\n }\n\n const badge = this.badgeEl.querySelector(\"flip-badge\");\n\n badge?.setAttribute(\"size\", \"m\");\n }\n\n render() {\n const className = classnames(\"avatar-group\", {\n \"avatar-group--has-badge\": Boolean(this.badge),\n });\n\n const badgeClassName = classnames(\"avatar-group__badge\");\n\n return (\n <Host>\n <div class={className} role=\"group\">\n <slot></slot>\n {this.badge && (\n <span\n class={badgeClassName}\n innerHTML={this.badge}\n ref={(el) => (this.badgeEl = el)}\n ></span>\n )}\n </div>\n </Host>\n );\n }\n}\n"]}
|