@umbraco-ui/uui 2.0.0-rc.2 → 2.0.1
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/custom-elements.json +103 -1
- package/dist/_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js +9 -0
- package/dist/components/action-bar/action-bar.d.ts +0 -1
- package/dist/components/action-bar/action-bar.element.js +15 -12
- package/dist/components/action-bar/action-bar.element.js.map +1 -1
- package/dist/components/action-bar/action-bar.js +5 -5
- package/dist/components/action-bar/action-bar.js.map +1 -1
- package/dist/components/avatar/avatar.d.ts +0 -1
- package/dist/components/avatar/avatar.element.js +72 -86
- package/dist/components/avatar/avatar.element.js.map +1 -1
- package/dist/components/avatar/avatar.js +5 -5
- package/dist/components/avatar/avatar.js.map +1 -1
- package/dist/components/avatar-group/avatar-group.d.ts +0 -1
- package/dist/components/avatar-group/avatar-group.element.js +58 -68
- package/dist/components/avatar-group/avatar-group.element.js.map +1 -1
- package/dist/components/avatar-group/avatar-group.js +5 -5
- package/dist/components/avatar-group/avatar-group.js.map +1 -1
- package/dist/components/badge/badge.d.ts +0 -1
- package/dist/components/badge/badge.element.js +32 -38
- package/dist/components/badge/badge.element.js.map +1 -1
- package/dist/components/badge/badge.js +5 -5
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/boolean-input/UUIBooleanInputEvent.js +15 -13
- package/dist/components/boolean-input/UUIBooleanInputEvent.js.map +1 -1
- package/dist/components/boolean-input/boolean-input.d.ts +0 -1
- package/dist/components/boolean-input/boolean-input.element.js +114 -134
- package/dist/components/boolean-input/boolean-input.element.js.map +1 -1
- package/dist/components/boolean-input/boolean-input.js +3 -0
- package/dist/components/box/box.d.ts +0 -1
- package/dist/components/box/box.element.js +74 -77
- package/dist/components/box/box.element.js.map +1 -1
- package/dist/components/box/box.js +5 -5
- package/dist/components/box/box.js.map +1 -1
- package/dist/components/breadcrumbs/breadcrumb-item.element.js +45 -50
- package/dist/components/breadcrumbs/breadcrumb-item.element.js.map +1 -1
- package/dist/components/breadcrumbs/breadcrumbs.d.ts +0 -1
- package/dist/components/breadcrumbs/breadcrumbs.element.js +40 -47
- package/dist/components/breadcrumbs/breadcrumbs.element.js.map +1 -1
- package/dist/components/breadcrumbs/breadcrumbs.js +5 -6
- package/dist/components/breadcrumbs/breadcrumbs.js.map +1 -1
- package/dist/components/button/button.d.ts +0 -1
- package/dist/components/button/button.element.js +147 -199
- package/dist/components/button/button.element.js.map +1 -1
- package/dist/components/button/button.js +5 -5
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button-copy-text/UUICopyTextEvent.js +16 -12
- package/dist/components/button-copy-text/UUICopyTextEvent.js.map +1 -1
- package/dist/components/button-copy-text/button-copy-text.d.ts +0 -1
- package/dist/components/button-copy-text/button-copy-text.element.js +78 -93
- package/dist/components/button-copy-text/button-copy-text.element.js.map +1 -1
- package/dist/components/button-copy-text/button-copy-text.js +6 -7
- package/dist/components/button-copy-text/button-copy-text.js.map +1 -1
- package/dist/components/button-group/button-group.d.ts +0 -1
- package/dist/components/button-group/button-group.element.js +19 -14
- package/dist/components/button-group/button-group.element.js.map +1 -1
- package/dist/components/button-group/button-group.js +5 -5
- package/dist/components/button-group/button-group.js.map +1 -1
- package/dist/components/button-inline-create/UUIButtonInlineCreateEvent.js +16 -14
- package/dist/components/button-inline-create/UUIButtonInlineCreateEvent.js.map +1 -1
- package/dist/components/button-inline-create/button-inline-create.d.ts +0 -1
- package/dist/components/button-inline-create/button-inline-create.element.js +63 -88
- package/dist/components/button-inline-create/button-inline-create.element.js.map +1 -1
- package/dist/components/button-inline-create/button-inline-create.js +6 -7
- package/dist/components/button-inline-create/button-inline-create.js.map +1 -1
- package/dist/components/card/UUICardEvent.js +9 -7
- package/dist/components/card/UUICardEvent.js.map +1 -1
- package/dist/components/card/card.d.ts +0 -1
- package/dist/components/card/card.element.d.ts +7 -0
- package/dist/components/card/card.element.js +72 -69
- package/dist/components/card/card.element.js.map +1 -1
- package/dist/components/card/card.js +6 -7
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/card-block-type/card-block-type.d.ts +0 -1
- package/dist/components/card-block-type/card-block-type.element.js +55 -74
- package/dist/components/card-block-type/card-block-type.element.js.map +1 -1
- package/dist/components/card-block-type/card-block-type.js +5 -5
- package/dist/components/card-block-type/card-block-type.js.map +1 -1
- package/dist/components/card-content-node/card-content-node.d.ts +0 -1
- package/dist/components/card-content-node/card-content-node.element.d.ts +1 -0
- package/dist/components/card-content-node/card-content-node.element.js +82 -83
- package/dist/components/card-content-node/card-content-node.element.js.map +1 -1
- package/dist/components/card-content-node/card-content-node.js +5 -5
- package/dist/components/card-content-node/card-content-node.js.map +1 -1
- package/dist/components/card-media/card-media.d.ts +0 -1
- package/dist/components/card-media/card-media.element.d.ts +4 -0
- package/dist/components/card-media/card-media.element.js +103 -89
- package/dist/components/card-media/card-media.element.js.map +1 -1
- package/dist/components/card-media/card-media.js +5 -5
- package/dist/components/card-media/card-media.js.map +1 -1
- package/dist/components/card-user/card-user.d.ts +0 -1
- package/dist/components/card-user/card-user.element.js +57 -72
- package/dist/components/card-user/card-user.element.js.map +1 -1
- package/dist/components/card-user/card-user.js +5 -5
- package/dist/components/card-user/card-user.js.map +1 -1
- package/dist/components/checkbox/checkbox.d.ts +0 -1
- package/dist/components/checkbox/checkbox.element.js +41 -22
- package/dist/components/checkbox/checkbox.element.js.map +1 -1
- package/dist/components/checkbox/checkbox.js +5 -5
- package/dist/components/checkbox/checkbox.js.map +1 -1
- package/dist/components/color-area/UUIColorAreaEvent.js +15 -13
- package/dist/components/color-area/UUIColorAreaEvent.js.map +1 -1
- package/dist/components/color-area/color-area.d.ts +0 -1
- package/dist/components/color-area/color-area.element.js +137 -174
- package/dist/components/color-area/color-area.element.js.map +1 -1
- package/dist/components/color-area/color-area.js +6 -7
- package/dist/components/color-area/color-area.js.map +1 -1
- package/dist/components/color-picker/UUIColorPickerEvent.js +15 -13
- package/dist/components/color-picker/UUIColorPickerEvent.js.map +1 -1
- package/dist/components/color-picker/color-picker.d.ts +0 -1
- package/dist/components/color-picker/color-picker.element.js +293 -334
- package/dist/components/color-picker/color-picker.element.js.map +1 -1
- package/dist/components/color-picker/color-picker.js +6 -7
- package/dist/components/color-picker/color-picker.js.map +1 -1
- package/dist/components/color-slider/UUIColorSliderEvent.js +15 -13
- package/dist/components/color-slider/UUIColorSliderEvent.js.map +1 -1
- package/dist/components/color-slider/color-slider.d.ts +0 -1
- package/dist/components/color-slider/color-slider.element.js +169 -219
- package/dist/components/color-slider/color-slider.element.js.map +1 -1
- package/dist/components/color-slider/color-slider.js +6 -7
- package/dist/components/color-slider/color-slider.js.map +1 -1
- package/dist/components/color-swatch/color-swatch.d.ts +0 -1
- package/dist/components/color-swatch/color-swatch.element.d.ts +1 -1
- package/dist/components/color-swatch/color-swatch.element.js +215 -201
- package/dist/components/color-swatch/color-swatch.element.js.map +1 -1
- package/dist/components/color-swatch/color-swatch.js +5 -5
- package/dist/components/color-swatch/color-swatch.js.map +1 -1
- package/dist/components/color-swatches/UUIColorSwatchesEvent.js +15 -13
- package/dist/components/color-swatches/UUIColorSwatchesEvent.js.map +1 -1
- package/dist/components/color-swatches/color-swatches.d.ts +0 -1
- package/dist/components/color-swatches/color-swatches.element.js +115 -132
- package/dist/components/color-swatches/color-swatches.element.js.map +1 -1
- package/dist/components/color-swatches/color-swatches.js +6 -7
- package/dist/components/color-swatches/color-swatches.js.map +1 -1
- package/dist/components/combobox/UUIComboboxEvent.js +18 -14
- package/dist/components/combobox/UUIComboboxEvent.js.map +1 -1
- package/dist/components/combobox/combobox.d.ts +0 -1
- package/dist/components/combobox/combobox.element.js +321 -425
- package/dist/components/combobox/combobox.element.js.map +1 -1
- package/dist/components/combobox/combobox.js +6 -7
- package/dist/components/combobox/combobox.js.map +1 -1
- package/dist/components/combobox-list/UUIComboboxListEvent.js +18 -14
- package/dist/components/combobox-list/UUIComboboxListEvent.js.map +1 -1
- package/dist/components/combobox-list/combobox-list-option.element.js +88 -80
- package/dist/components/combobox-list/combobox-list-option.element.js.map +1 -1
- package/dist/components/combobox-list/combobox-list.d.ts +0 -1
- package/dist/components/combobox-list/combobox-list.element.js +218 -275
- package/dist/components/combobox-list/combobox-list.element.js.map +1 -1
- package/dist/components/combobox-list/combobox-list.js +6 -8
- package/dist/components/combobox-list/combobox-list.js.map +1 -1
- package/dist/components/dialog/dialog.d.ts +0 -1
- package/dist/components/dialog/dialog.element.js +19 -14
- package/dist/components/dialog/dialog.element.js.map +1 -1
- package/dist/components/dialog/dialog.js +5 -5
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/dialog-layout/dialog-layout.d.ts +0 -1
- package/dist/components/dialog-layout/dialog-layout.element.js +59 -64
- package/dist/components/dialog-layout/dialog-layout.element.js.map +1 -1
- package/dist/components/dialog-layout/dialog-layout.js +5 -5
- package/dist/components/dialog-layout/dialog-layout.js.map +1 -1
- package/dist/components/file-dropzone/UUIFileDropzoneEvent.js +18 -14
- package/dist/components/file-dropzone/UUIFileDropzoneEvent.js.map +1 -1
- package/dist/components/file-dropzone/file-dropzone.d.ts +0 -1
- package/dist/components/file-dropzone/file-dropzone.element.js +214 -257
- package/dist/components/file-dropzone/file-dropzone.element.js.map +1 -1
- package/dist/components/file-dropzone/file-dropzone.js +6 -7
- package/dist/components/file-dropzone/file-dropzone.js.map +1 -1
- package/dist/components/file-preview/UUIFileSize.js +46 -19
- package/dist/components/file-preview/UUIFileSize.js.map +1 -1
- package/dist/components/file-preview/file-preview.d.ts +0 -1
- package/dist/components/file-preview/file-preview.element.js +78 -103
- package/dist/components/file-preview/file-preview.element.js.map +1 -1
- package/dist/components/file-preview/file-preview.js +6 -5
- package/dist/components/file-preview/file-preview.js.map +1 -1
- package/dist/components/form/form.d.ts +0 -1
- package/dist/components/form/form.element.js +46 -46
- package/dist/components/form/form.element.js.map +1 -1
- package/dist/components/form/form.js +5 -5
- package/dist/components/form/form.js.map +1 -1
- package/dist/components/form-layout-item/form-layout-item.d.ts +0 -1
- package/dist/components/form-layout-item/form-layout-item.element.js +39 -45
- package/dist/components/form-layout-item/form-layout-item.element.js.map +1 -1
- package/dist/components/form-layout-item/form-layout-item.js +5 -5
- package/dist/components/form-layout-item/form-layout-item.js.map +1 -1
- package/dist/components/form-validation-message/form-validation-message.d.ts +0 -1
- package/dist/components/form-validation-message/form-validation-message.element.js +71 -89
- package/dist/components/form-validation-message/form-validation-message.element.js.map +1 -1
- package/dist/components/form-validation-message/form-validation-message.js +5 -5
- package/dist/components/form-validation-message/form-validation-message.js.map +1 -1
- package/dist/components/icon/UUIIconRequestEvent.js +21 -19
- package/dist/components/icon/UUIIconRequestEvent.js.map +1 -1
- package/dist/components/icon/icon.d.ts +0 -1
- package/dist/components/icon/icon.element.js +93 -117
- package/dist/components/icon/icon.element.js.map +1 -1
- package/dist/components/icon/icon.js +6 -7
- package/dist/components/icon/icon.js.map +1 -1
- package/dist/components/icon-registry/UUIIconHost.js +16 -17
- package/dist/components/icon-registry/UUIIconHost.js.map +1 -1
- package/dist/components/icon-registry/UUIIconRegistry.js +67 -77
- package/dist/components/icon-registry/UUIIconRegistry.js.map +1 -1
- package/dist/components/icon-registry/icon-registry.d.ts +0 -1
- package/dist/components/icon-registry/icon-registry.element.js +39 -48
- package/dist/components/icon-registry/icon-registry.element.js.map +1 -1
- package/dist/components/icon-registry/icon-registry.js +7 -6
- package/dist/components/icon-registry/icon-registry.js.map +1 -1
- package/dist/components/icon-registry-essential/UUIIconRegistryEssential.js +44 -42
- package/dist/components/icon-registry-essential/UUIIconRegistryEssential.js.map +1 -1
- package/dist/components/icon-registry-essential/icon-registry-essential.d.ts +0 -1
- package/dist/components/icon-registry-essential/icon-registry-essential.element.js +15 -9
- package/dist/components/icon-registry-essential/icon-registry-essential.element.js.map +1 -1
- package/dist/components/icon-registry-essential/icon-registry-essential.js +6 -39
- package/dist/components/icon-registry-essential/icon-registry-essential.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconAdd.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconAdd.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconAlert.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconAlert.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconAttachment.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconAttachment.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconCalendar.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconCalendar.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconCheck.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconCheck.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconClipboard.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconClipboard.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconCode.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconCode.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconColorPicker.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconColorPicker.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconCopy.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconCopy.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconDelete.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconDelete.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconDocument.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconDocument.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconDownload.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconDownload.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconDrag.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconDrag.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconEdit.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconEdit.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconFavorite.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconFavorite.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconFolder.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconFolder.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconForbidden.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconForbidden.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconInfo.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconInfo.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconLink.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconLink.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconLock.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconLock.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconPause.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconPause.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconPicture.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconPicture.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconPlay.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconPlay.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconRemove.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconRemove.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconSearch.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconSearch.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconSee.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconSee.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconSettings.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconSettings.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconSubtract.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconSubtract.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconSync.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconSync.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconUnlock.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconUnlock.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconUnsee.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconUnsee.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconWand.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconWand.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/iconWrong.js +6 -5
- package/dist/components/icon-registry-essential/svgs/iconWrong.js.map +1 -1
- package/dist/components/icon-registry-essential/svgs/index.js +34 -0
- package/dist/components/index.js +206 -0
- package/dist/components/input/UUIInputEvent.js +18 -14
- package/dist/components/input/UUIInputEvent.js.map +1 -1
- package/dist/components/input/input.d.ts +0 -1
- package/dist/components/input/input.element.js +176 -201
- package/dist/components/input/input.element.js.map +1 -1
- package/dist/components/input/input.js +6 -7
- package/dist/components/input/input.js.map +1 -1
- package/dist/components/input-file/input-file.d.ts +0 -1
- package/dist/components/input-file/input-file.element.js +137 -211
- package/dist/components/input-file/input-file.element.js.map +1 -1
- package/dist/components/input-file/input-file.js +5 -5
- package/dist/components/input-file/input-file.js.map +1 -1
- package/dist/components/input-lock/UUIInputLockEvent.js +15 -13
- package/dist/components/input-lock/UUIInputLockEvent.js.map +1 -1
- package/dist/components/input-lock/input-lock.d.ts +0 -1
- package/dist/components/input-lock/input-lock.element.js +69 -105
- package/dist/components/input-lock/input-lock.element.js.map +1 -1
- package/dist/components/input-lock/input-lock.js +6 -7
- package/dist/components/input-lock/input-lock.js.map +1 -1
- package/dist/components/input-password/input-password.d.ts +0 -1
- package/dist/components/input-password/input-password.element.js +45 -90
- package/dist/components/input-password/input-password.element.js.map +1 -1
- package/dist/components/input-password/input-password.js +5 -5
- package/dist/components/input-password/input-password.js.map +1 -1
- package/dist/components/keyboard-shortcut/key.element.js +19 -14
- package/dist/components/keyboard-shortcut/key.element.js.map +1 -1
- package/dist/components/keyboard-shortcut/keyboard-shortcut.d.ts +0 -1
- package/dist/components/keyboard-shortcut/keyboard-shortcut.element.js +19 -14
- package/dist/components/keyboard-shortcut/keyboard-shortcut.element.js.map +1 -1
- package/dist/components/keyboard-shortcut/keyboard-shortcut.js +5 -6
- package/dist/components/keyboard-shortcut/keyboard-shortcut.js.map +1 -1
- package/dist/components/label/label.d.ts +0 -1
- package/dist/components/label/label.element.js +52 -54
- package/dist/components/label/label.element.js.map +1 -1
- package/dist/components/label/label.js +5 -5
- package/dist/components/label/label.js.map +1 -1
- package/dist/components/loader/loader.d.ts +0 -1
- package/dist/components/loader/loader.element.js +18 -14
- package/dist/components/loader/loader.element.js.map +1 -1
- package/dist/components/loader/loader.js +5 -5
- package/dist/components/loader/loader.js.map +1 -1
- package/dist/components/loader-bar/loader-bar.d.ts +0 -1
- package/dist/components/loader-bar/loader-bar.element.js +55 -52
- package/dist/components/loader-bar/loader-bar.element.js.map +1 -1
- package/dist/components/loader-bar/loader-bar.js +5 -5
- package/dist/components/loader-bar/loader-bar.js.map +1 -1
- package/dist/components/loader-circle/loader-circle.d.ts +0 -1
- package/dist/components/loader-circle/loader-circle.element.js +52 -59
- package/dist/components/loader-circle/loader-circle.element.js.map +1 -1
- package/dist/components/loader-circle/loader-circle.js +5 -5
- package/dist/components/loader-circle/loader-circle.js.map +1 -1
- package/dist/components/menu-item/UUIMenuItemEvent.js +15 -9
- package/dist/components/menu-item/UUIMenuItemEvent.js.map +1 -1
- package/dist/components/menu-item/menu-item.d.ts +0 -1
- package/dist/components/menu-item/menu-item.element.js +136 -139
- package/dist/components/menu-item/menu-item.element.js.map +1 -1
- package/dist/components/menu-item/menu-item.js +6 -7
- package/dist/components/menu-item/menu-item.js.map +1 -1
- package/dist/components/modal/modal-container.js +86 -141
- package/dist/components/modal/modal-container.js.map +1 -1
- package/dist/components/modal/modal-dialog.element.js +14 -15
- package/dist/components/modal/modal-dialog.element.js.map +1 -1
- package/dist/components/modal/modal-sidebar.element.js +41 -64
- package/dist/components/modal/modal-sidebar.element.js.map +1 -1
- package/dist/components/modal/modal.d.ts +0 -1
- package/dist/components/modal/modal.element.js +89 -106
- package/dist/components/modal/modal.element.js.map +1 -1
- package/dist/components/modal/modal.js +6 -12
- package/dist/components/modal/modal.js.map +1 -1
- package/dist/components/pagination/UUIPaginationEvent.js +15 -13
- package/dist/components/pagination/UUIPaginationEvent.js.map +1 -1
- package/dist/components/pagination/pagination.d.ts +0 -1
- package/dist/components/pagination/pagination.element.js +188 -228
- package/dist/components/pagination/pagination.element.js.map +1 -1
- package/dist/components/pagination/pagination.js +6 -7
- package/dist/components/pagination/pagination.js.map +1 -1
- package/dist/components/popover-container/popover-container.d.ts +0 -1
- package/dist/components/popover-container/popover-container.element.d.ts +1 -0
- package/dist/components/popover-container/popover-container.element.js +290 -335
- package/dist/components/popover-container/popover-container.element.js.map +1 -1
- package/dist/components/popover-container/popover-container.js +5 -5
- package/dist/components/popover-container/popover-container.js.map +1 -1
- package/dist/components/progress-bar/progress-bar.d.ts +0 -1
- package/dist/components/progress-bar/progress-bar.element.js +41 -43
- package/dist/components/progress-bar/progress-bar.element.js.map +1 -1
- package/dist/components/progress-bar/progress-bar.js +5 -5
- package/dist/components/progress-bar/progress-bar.js.map +1 -1
- package/dist/components/radio/UUIRadioEvent.js +15 -13
- package/dist/components/radio/UUIRadioEvent.js.map +1 -1
- package/dist/components/radio/UUIRadioGroupEvent.js +15 -13
- package/dist/components/radio/UUIRadioGroupEvent.js.map +1 -1
- package/dist/components/radio/radio-group.element.js +224 -279
- package/dist/components/radio/radio-group.element.js.map +1 -1
- package/dist/components/radio/radio.d.ts +0 -1
- package/dist/components/radio/radio.element.js +100 -123
- package/dist/components/radio/radio.element.js.map +1 -1
- package/dist/components/radio/radio.js +7 -10
- package/dist/components/radio/radio.js.map +1 -1
- package/dist/components/range-slider/UUIRangeSliderEvent.js +18 -14
- package/dist/components/range-slider/UUIRangeSliderEvent.js.map +1 -1
- package/dist/components/range-slider/range-slider.d.ts +0 -1
- package/dist/components/range-slider/range-slider.element.js +439 -504
- package/dist/components/range-slider/range-slider.element.js.map +1 -1
- package/dist/components/range-slider/range-slider.js +6 -7
- package/dist/components/range-slider/range-slider.js.map +1 -1
- package/dist/components/ref/UUIRefEvent.js +9 -7
- package/dist/components/ref/UUIRefEvent.js.map +1 -1
- package/dist/components/ref/ref.d.ts +0 -1
- package/dist/components/ref/ref.element.js +55 -50
- package/dist/components/ref/ref.element.js.map +1 -1
- package/dist/components/ref/ref.js +6 -7
- package/dist/components/ref/ref.js.map +1 -1
- package/dist/components/ref-list/ref-list.d.ts +0 -1
- package/dist/components/ref-list/ref-list.element.js +17 -14
- package/dist/components/ref-list/ref-list.element.js.map +1 -1
- package/dist/components/ref-list/ref-list.js +5 -5
- package/dist/components/ref-list/ref-list.js.map +1 -1
- package/dist/components/ref-node/ref-node.d.ts +0 -1
- package/dist/components/ref-node/ref-node.element.js +91 -109
- package/dist/components/ref-node/ref-node.element.js.map +1 -1
- package/dist/components/ref-node/ref-node.js +5 -5
- package/dist/components/ref-node/ref-node.js.map +1 -1
- package/dist/components/ref-node-data-type/ref-node-data-type.d.ts +0 -1
- package/dist/components/ref-node-data-type/ref-node-data-type.element.js +30 -35
- package/dist/components/ref-node-data-type/ref-node-data-type.element.js.map +1 -1
- package/dist/components/ref-node-data-type/ref-node-data-type.js +5 -5
- package/dist/components/ref-node-data-type/ref-node-data-type.js.map +1 -1
- package/dist/components/ref-node-document-type/ref-node-document-type.d.ts +0 -1
- package/dist/components/ref-node-document-type/ref-node-document-type.element.js +30 -35
- package/dist/components/ref-node-document-type/ref-node-document-type.element.js.map +1 -1
- package/dist/components/ref-node-document-type/ref-node-document-type.js +5 -5
- package/dist/components/ref-node-document-type/ref-node-document-type.js.map +1 -1
- package/dist/components/ref-node-form/ref-node-form.d.ts +0 -1
- package/dist/components/ref-node-form/ref-node-form.element.js +21 -12
- package/dist/components/ref-node-form/ref-node-form.element.js.map +1 -1
- package/dist/components/ref-node-form/ref-node-form.js +5 -5
- package/dist/components/ref-node-form/ref-node-form.js.map +1 -1
- package/dist/components/ref-node-member/ref-node-member.d.ts +0 -1
- package/dist/components/ref-node-member/ref-node-member.element.js +33 -35
- package/dist/components/ref-node-member/ref-node-member.element.js.map +1 -1
- package/dist/components/ref-node-member/ref-node-member.js +5 -5
- package/dist/components/ref-node-member/ref-node-member.js.map +1 -1
- package/dist/components/ref-node-package/ref-node-package.d.ts +0 -1
- package/dist/components/ref-node-package/ref-node-package.element.js +33 -42
- package/dist/components/ref-node-package/ref-node-package.element.js.map +1 -1
- package/dist/components/ref-node-package/ref-node-package.js +5 -5
- package/dist/components/ref-node-package/ref-node-package.js.map +1 -1
- package/dist/components/ref-node-user/ref-node-user.d.ts +0 -1
- package/dist/components/ref-node-user/ref-node-user.element.js +33 -35
- package/dist/components/ref-node-user/ref-node-user.element.js.map +1 -1
- package/dist/components/ref-node-user/ref-node-user.js +5 -5
- package/dist/components/ref-node-user/ref-node-user.js.map +1 -1
- package/dist/components/responsive-container/responsive-container.d.ts +0 -1
- package/dist/components/responsive-container/responsive-container.element.js +186 -244
- package/dist/components/responsive-container/responsive-container.element.js.map +1 -1
- package/dist/components/responsive-container/responsive-container.js +5 -5
- package/dist/components/responsive-container/responsive-container.js.map +1 -1
- package/dist/components/scroll-container/scroll-container.d.ts +0 -1
- package/dist/components/scroll-container/scroll-container.element.js +35 -36
- package/dist/components/scroll-container/scroll-container.element.js.map +1 -1
- package/dist/components/scroll-container/scroll-container.js +5 -5
- package/dist/components/scroll-container/scroll-container.js.map +1 -1
- package/dist/components/select/UUISelectEvent.js +15 -13
- package/dist/components/select/UUISelectEvent.js.map +1 -1
- package/dist/components/select/select.d.ts +0 -1
- package/dist/components/select/select.element.js +134 -163
- package/dist/components/select/select.element.js.map +1 -1
- package/dist/components/select/select.js +6 -7
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/slider/UUISliderEvent.js +18 -14
- package/dist/components/slider/UUISliderEvent.js.map +1 -1
- package/dist/components/slider/native-input.styles.js +6 -5
- package/dist/components/slider/native-input.styles.js.map +1 -1
- package/dist/components/slider/slider.d.ts +0 -1
- package/dist/components/slider/slider.element.d.ts +7 -0
- package/dist/components/slider/slider.element.js +197 -227
- package/dist/components/slider/slider.element.js.map +1 -1
- package/dist/components/slider/slider.js +6 -7
- package/dist/components/slider/slider.js.map +1 -1
- package/dist/components/symbol-drag-handle/symbol-drag-handle.d.ts +0 -1
- package/dist/components/symbol-drag-handle/symbol-drag-handle.element.js +19 -16
- package/dist/components/symbol-drag-handle/symbol-drag-handle.element.js.map +1 -1
- package/dist/components/symbol-drag-handle/symbol-drag-handle.js +5 -5
- package/dist/components/symbol-drag-handle/symbol-drag-handle.js.map +1 -1
- package/dist/components/symbol-expand/symbol-expand.d.ts +0 -1
- package/dist/components/symbol-expand/symbol-expand.element.js +27 -30
- package/dist/components/symbol-expand/symbol-expand.element.js.map +1 -1
- package/dist/components/symbol-expand/symbol-expand.js +5 -5
- package/dist/components/symbol-expand/symbol-expand.js.map +1 -1
- package/dist/components/symbol-file/symbol-file.d.ts +0 -1
- package/dist/components/symbol-file/symbol-file.element.js +24 -32
- package/dist/components/symbol-file/symbol-file.element.js.map +1 -1
- package/dist/components/symbol-file/symbol-file.js +5 -5
- package/dist/components/symbol-file/symbol-file.js.map +1 -1
- package/dist/components/symbol-file-dropzone/symbol-file-dropzone.d.ts +0 -1
- package/dist/components/symbol-file-dropzone/symbol-file-dropzone.element.js +26 -30
- package/dist/components/symbol-file-dropzone/symbol-file-dropzone.element.js.map +1 -1
- package/dist/components/symbol-file-dropzone/symbol-file-dropzone.js +5 -5
- package/dist/components/symbol-file-dropzone/symbol-file-dropzone.js.map +1 -1
- package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.d.ts +0 -1
- package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.element.js +39 -95
- package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.element.js.map +1 -1
- package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.js +5 -5
- package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.js.map +1 -1
- package/dist/components/symbol-folder/symbol-folder.d.ts +0 -1
- package/dist/components/symbol-folder/symbol-folder.element.js +17 -14
- package/dist/components/symbol-folder/symbol-folder.element.js.map +1 -1
- package/dist/components/symbol-folder/symbol-folder.js +5 -5
- package/dist/components/symbol-folder/symbol-folder.js.map +1 -1
- package/dist/components/symbol-lock/symbol-lock.d.ts +0 -1
- package/dist/components/symbol-lock/symbol-lock.element.js +26 -30
- package/dist/components/symbol-lock/symbol-lock.element.js.map +1 -1
- package/dist/components/symbol-lock/symbol-lock.js +5 -5
- package/dist/components/symbol-lock/symbol-lock.js.map +1 -1
- package/dist/components/symbol-more/symbol-more.d.ts +0 -1
- package/dist/components/symbol-more/symbol-more.element.js +17 -14
- package/dist/components/symbol-more/symbol-more.element.js.map +1 -1
- package/dist/components/symbol-more/symbol-more.js +5 -5
- package/dist/components/symbol-more/symbol-more.js.map +1 -1
- package/dist/components/symbol-sort/symbol-sort.d.ts +0 -1
- package/dist/components/symbol-sort/symbol-sort.element.js +29 -31
- package/dist/components/symbol-sort/symbol-sort.element.js.map +1 -1
- package/dist/components/symbol-sort/symbol-sort.js +5 -5
- package/dist/components/symbol-sort/symbol-sort.js.map +1 -1
- package/dist/components/table/table-cell.element.js +65 -71
- package/dist/components/table/table-cell.element.js.map +1 -1
- package/dist/components/table/table-column.element.js +14 -10
- package/dist/components/table/table-column.element.js.map +1 -1
- package/dist/components/table/table-head-cell.element.js +19 -16
- package/dist/components/table/table-head-cell.element.js.map +1 -1
- package/dist/components/table/table-head.element.js +23 -18
- package/dist/components/table/table-head.element.js.map +1 -1
- package/dist/components/table/table-row.element.js +41 -52
- package/dist/components/table/table-row.element.js.map +1 -1
- package/dist/components/table/table.d.ts +0 -1
- package/dist/components/table/table.element.js +31 -20
- package/dist/components/table/table.element.js.map +1 -1
- package/dist/components/table/table.js +5 -10
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/tabs/UUITabEvent.js +6 -6
- package/dist/components/tabs/UUITabEvent.js.map +1 -1
- package/dist/components/tabs/UUITabGroupEvent.js +6 -6
- package/dist/components/tabs/UUITabGroupEvent.js.map +1 -1
- package/dist/components/tabs/tab-group.element.js +188 -251
- package/dist/components/tabs/tab-group.element.js.map +1 -1
- package/dist/components/tabs/tab.element.js +66 -56
- package/dist/components/tabs/tab.element.js.map +1 -1
- package/dist/components/tabs/tabs.d.ts +0 -1
- package/dist/components/tabs/tabs.js +7 -6
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/components/tag/tag.d.ts +0 -1
- package/dist/components/tag/tag.element.js +32 -34
- package/dist/components/tag/tag.element.js.map +1 -1
- package/dist/components/tag/tag.js +5 -5
- package/dist/components/tag/tag.js.map +1 -1
- package/dist/components/textarea/UUITextareaEvent.js +18 -14
- package/dist/components/textarea/UUITextareaEvent.js.map +1 -1
- package/dist/components/textarea/textarea.d.ts +0 -1
- package/dist/components/textarea/textarea.element.d.ts +2 -0
- package/dist/components/textarea/textarea.element.js +153 -180
- package/dist/components/textarea/textarea.element.js.map +1 -1
- package/dist/components/textarea/textarea.js +6 -7
- package/dist/components/textarea/textarea.js.map +1 -1
- package/dist/components/toast-notification/UUIToastNotificationEvent.js +18 -10
- package/dist/components/toast-notification/UUIToastNotificationEvent.js.map +1 -1
- package/dist/components/toast-notification/toast-notification.d.ts +0 -1
- package/dist/components/toast-notification/toast-notification.element.js +155 -224
- package/dist/components/toast-notification/toast-notification.element.js.map +1 -1
- package/dist/components/toast-notification/toast-notification.js +6 -7
- package/dist/components/toast-notification/toast-notification.js.map +1 -1
- package/dist/components/toast-notification-container/toast-notification-container.d.ts +0 -1
- package/dist/components/toast-notification-container/toast-notification-container.element.js +98 -122
- package/dist/components/toast-notification-container/toast-notification-container.element.js.map +1 -1
- package/dist/components/toast-notification-container/toast-notification-container.js +6 -9
- package/dist/components/toast-notification-container/toast-notification-container.js.map +1 -1
- package/dist/components/toast-notification-layout/toast-notification-layout.d.ts +0 -1
- package/dist/components/toast-notification-layout/toast-notification-layout.element.js +33 -39
- package/dist/components/toast-notification-layout/toast-notification-layout.element.js.map +1 -1
- package/dist/components/toast-notification-layout/toast-notification-layout.js +6 -9
- package/dist/components/toast-notification-layout/toast-notification-layout.js.map +1 -1
- package/dist/components/toggle/toggle.d.ts +0 -1
- package/dist/components/toggle/toggle.element.js +43 -54
- package/dist/components/toggle/toggle.element.js.map +1 -1
- package/dist/components/toggle/toggle.js +5 -5
- package/dist/components/toggle/toggle.js.map +1 -1
- package/dist/components/visually-hidden/visually-hidden.d.ts +0 -1
- package/dist/components/visually-hidden/visually-hidden.element.js +17 -14
- package/dist/components/visually-hidden/visually-hidden.element.js.map +1 -1
- package/dist/components/visually-hidden/visually-hidden.js +5 -5
- package/dist/components/visually-hidden/visually-hidden.js.map +1 -1
- package/dist/index.js +115 -359
- package/dist/internal/animations/uui-blink.js +7 -7
- package/dist/internal/animations/uui-blink.js.map +1 -1
- package/dist/internal/animations/uui-pulse.js +7 -9
- package/dist/internal/animations/uui-pulse.js.map +1 -1
- package/dist/internal/animations/uui-shake.js +7 -9
- package/dist/internal/animations/uui-shake.js.map +1 -1
- package/dist/internal/events/UUIEvent.js +13 -9
- package/dist/internal/events/UUIEvent.js.map +1 -1
- package/dist/internal/events/UUIFormControlEvent.d.ts +2 -2
- package/dist/internal/events/UUIFormControlEvent.js +18 -14
- package/dist/internal/events/UUIFormControlEvent.js.map +1 -1
- package/dist/internal/events/UUISelectableEvent.js +19 -15
- package/dist/internal/events/UUISelectableEvent.js.map +1 -1
- package/dist/internal/mixins/ActiveMixin.js +24 -24
- package/dist/internal/mixins/ActiveMixin.js.map +1 -1
- package/dist/internal/mixins/FormControlMixin.d.ts +3 -3
- package/dist/internal/mixins/FormControlMixin.js +276 -339
- package/dist/internal/mixins/FormControlMixin.js.map +1 -1
- package/dist/internal/mixins/FormControlWithBasicsMixin.d.ts +19 -3
- package/dist/internal/mixins/FormControlWithBasicsMixin.js +54 -60
- package/dist/internal/mixins/FormControlWithBasicsMixin.js.map +1 -1
- package/dist/internal/mixins/LabelMixin.js +54 -57
- package/dist/internal/mixins/LabelMixin.js.map +1 -1
- package/dist/internal/mixins/PopoverTargetMixin.js +43 -47
- package/dist/internal/mixins/PopoverTargetMixin.js.map +1 -1
- package/dist/internal/mixins/SelectOnlyMixin.js +39 -33
- package/dist/internal/mixins/SelectOnlyMixin.js.map +1 -1
- package/dist/internal/mixins/SelectableMixin.js +109 -121
- package/dist/internal/mixins/SelectableMixin.js.map +1 -1
- package/dist/internal/registration/index.js +17 -20
- package/dist/internal/registration/index.js.map +1 -1
- package/dist/internal/types/InterfaceColor.js +11 -10
- package/dist/internal/types/InterfaceColor.js.map +1 -1
- package/dist/internal/types/InterfaceHeading.js +12 -11
- package/dist/internal/types/InterfaceHeading.js.map +1 -1
- package/dist/internal/types/InterfaceLook.js +11 -10
- package/dist/internal/types/InterfaceLook.js.map +1 -1
- package/dist/internal/utils/Timer.js +56 -61
- package/dist/internal/utils/Timer.js.map +1 -1
- package/dist/internal/utils/color.js +105 -74
- package/dist/internal/utils/color.js.map +1 -1
- package/dist/internal/utils/drag.js +27 -36
- package/dist/internal/utils/drag.js.map +1 -1
- package/dist/internal/utils/findAncestorByAttributeValue.js +22 -19
- package/dist/internal/utils/findAncestorByAttributeValue.js.map +1 -1
- package/dist/internal/utils/math.js +23 -13
- package/dist/internal/utils/math.js.map +1 -1
- package/dist/internal/utils/slotHasContent.js +6 -5
- package/dist/internal/utils/slotHasContent.js.map +1 -1
- package/dist/internal/version.js +10 -16
- package/dist/internal/version.js.map +1 -1
- package/dist/package.json.js +6 -5
- package/dist/package.json.js.map +1 -1
- package/dist/styles/uui-font.css +1 -1
- package/dist/styles/uui-text.css +1 -1
- package/dist/styles/uui-text.css.js +6 -5
- package/dist/styles/uui-text.css.js.map +1 -1
- package/dist/styles/uui-text.styles.js +7 -6
- package/dist/styles/uui-text.styles.js.map +1 -1
- package/dist/themes/dark.css +1 -1
- package/dist/themes/high-contrast.css +1 -1
- package/dist/themes/light.css +1 -1
- package/package.json +26 -25
- package/vscode.html-custom-data.json +36 -7
- package/dist/index.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-container.element.js","sources":["../../../src/components/popover-container/popover-container.element.ts"],"sourcesContent":["import { findAncestorByAttributeValue } from '../../internal/utils/index.js';\nimport { css, html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport '../scroll-container/scroll-container.js';\n\nexport type PopoverContainerPlacement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end';\n\n/**\n * @element uui-popover-container\n * @attr popover - Indicates that the element is a popover container\n */\nexport class UUIPopoverContainerElement extends LitElement {\n /**\n * Set the distance between popover container element and target element.\n * @type {number}\n * @attr margin\n * @default 0\n */\n @property({ type: Number })\n margin = 0;\n\n /**\n * Read-only attribute to check if the popover is open\n * @type {boolean}\n * @readonly\n * @attr open\n * @default false\n */\n @property({ type: Boolean })\n get open() {\n return this._open;\n }\n\n /**\n * Define the placement of the popover container.\n * @attr placement\n * @default 'bottom-start'\n */\n @property({ type: String, reflect: true })\n get placement(): PopoverContainerPlacement {\n return this._placement;\n }\n set placement(newValue: PopoverContainerPlacement) {\n this._placement = newValue;\n this._actualPlacement = newValue;\n this.#initUpdate();\n }\n\n @state()\n _placement: PopoverContainerPlacement = 'bottom-start';\n\n @state()\n _open: boolean = false;\n\n @state()\n _actualPlacement: PopoverContainerPlacement = this._placement;\n\n #targetElement: HTMLElement | null = null;\n #scrollParents: Element[] = [];\n #sizeObserver: ResizeObserver | null = null;\n #size: { width: number; height: number } = { width: 0, height: 0 };\n\n constructor() {\n super();\n\n this.addEventListener('beforetoggle', this.#onBeforeToggle, {\n passive: true,\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute('popover')) {\n this.setAttribute('popover', '');\n }\n\n if (!this.#sizeObserver) {\n this.#sizeObserver = new ResizeObserver(entries => {\n const element = entries[0]; // should be only one\n const width = element.contentRect.width;\n const height = element.contentRect.height;\n\n if (width === this.#size.width && height === this.#size.height) {\n return; // no change\n }\n\n this.#size = { width, height };\n this.#initUpdate();\n });\n\n // start listening for size changes\n this.#sizeObserver.observe(this);\n }\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#stopScrollListener();\n this.#sizeObserver?.disconnect();\n this.#sizeObserver = null;\n }\n\n readonly #onBeforeToggle = (event: any) => {\n this._open = event.newState === 'open';\n\n this.#targetElement = findAncestorByAttributeValue(\n this,\n 'popovertarget',\n this.id,\n );\n\n // Dispatch a custom event that can be listened to by the popover target.\n // Mostly used for UUIButton.\n this.#targetElement?.dispatchEvent(\n new CustomEvent('uui-popover-before-toggle', {\n bubbles: false,\n composed: false,\n detail: { oldState: event.oldState, newState: event.newState },\n }),\n );\n\n if (this._open) {\n this.#calculateScrollParents();\n\n this.#startScrollListener();\n\n requestAnimationFrame(() => {\n this.#initUpdate();\n });\n } else {\n this.#stopScrollListener();\n this.style.removeProperty('--_available-height');\n }\n };\n\n readonly #initUpdate = () => {\n if (!this._open) return;\n\n this._actualPlacement = this._placement;\n this.style.opacity = '0';\n\n // 3 iterations makes the popover flip back to the initial position if theres no space for it on either side.\n this.#updatePosition(3);\n };\n\n readonly #updatePosition = (iteration: number) => {\n this.#updatePadding();\n\n // Iterations makes sure that we don't overflow the stack.\n // That could happen if the is no space for the popover on either side, which without iterations, would make it flip back and forth until the stack overflows\n iteration--;\n if (this.#targetElement === null) return;\n\n const targetRect = this.#targetElement.getBoundingClientRect();\n const popoverRect = this.getBoundingClientRect();\n\n let { top, left } = this.#calculateAlignedPosition(targetRect, popoverRect);\n const result = this.#clampAndFlip(\n top,\n left,\n targetRect,\n popoverRect,\n iteration,\n );\n\n if (result === null) return; // flipped and recursed\n\n top = result.top;\n left = result.left;\n\n // Detect if the popover is completely outside the screen on any side\n const screenWidth = window.innerWidth;\n const screenHeight = window.innerHeight;\n const isCompletelyOutsideScreen =\n top + popoverRect.height < 0 ||\n top > screenHeight ||\n left + popoverRect.width < 0 ||\n left > screenWidth;\n\n if (isCompletelyOutsideScreen) {\n this.hidePopover();\n return;\n }\n\n // Constrain the slot height to the available space in the popover's growth direction.\n const isTopPlacement = this._actualPlacement.startsWith('top');\n const isBottomPlacement = this._actualPlacement.startsWith('bottom');\n let availableHeight: number;\n if (isTopPlacement) {\n availableHeight = targetRect.top - 2 * this.margin;\n } else if (isBottomPlacement) {\n // margin once for the popover's own padding, once for a safe edge buffer\n availableHeight =\n screenHeight - (targetRect.top + targetRect.height) - 2 * this.margin;\n } else {\n availableHeight = screenHeight - targetRect.top - this.margin;\n }\n this.style.setProperty(\n '--_available-height',\n `${Math.max(availableHeight, 0)}px`,\n );\n\n // Set the popover's position\n this.style.transform = `translate(${left}px, ${top}px)`;\n this.style.opacity = '1';\n };\n\n #calculateAlignedPosition(targetRect: DOMRect, popoverRect: DOMRect) {\n const isStart = this._actualPlacement.includes('-start');\n const isEnd = this._actualPlacement.includes('-end');\n\n // Alignment along the cross-axis\n const align = (pos: number, targetSize: number, popoverSize: number) => {\n if (isStart) return pos;\n if (isEnd) return pos + targetSize - popoverSize;\n return pos + targetSize / 2 - popoverSize / 2;\n };\n\n const side = this._actualPlacement.split('-')[0];\n\n // For top/bottom: top is determined by placement, left by alignment\n // For left/right: left is determined by placement, top by alignment\n const positions: Record<string, { top: number; left: number }> = {\n bottom: {\n top: targetRect.top + targetRect.height,\n left: align(targetRect.left, targetRect.width, popoverRect.width),\n },\n top: {\n top: targetRect.top - popoverRect.height,\n left: align(targetRect.left, targetRect.width, popoverRect.width),\n },\n left: {\n top: align(targetRect.top, targetRect.height, popoverRect.height),\n left: targetRect.left - popoverRect.width,\n },\n right: {\n top: align(targetRect.top, targetRect.height, popoverRect.height),\n left: targetRect.left + targetRect.width,\n },\n };\n\n return positions[side] ?? { top: 0, left: 0 };\n }\n\n #clampAndFlip(\n top: number,\n left: number,\n targetRect: DOMRect,\n popoverRect: DOMRect,\n iteration: number,\n ): { top: number; left: number } | null {\n const screenWidth = window.innerWidth;\n const screenHeight = window.innerHeight;\n const side = this._actualPlacement.split('-')[0];\n const isVertical = side === 'top' || side === 'bottom';\n\n // Vertical clamping\n const topTargetVsScreenTop = Math.min(\n 0,\n targetRect.top + targetRect.height,\n );\n const topTargetVsScreenBottom = Math.max(\n Math.min(top, screenHeight - popoverRect.height),\n targetRect.top - popoverRect.height,\n );\n const topClamped = Math.max(topTargetVsScreenTop, topTargetVsScreenBottom);\n\n if (topClamped !== top && isVertical && iteration > 0) {\n this.#flipPlacement();\n this.#updatePosition(iteration);\n return null;\n }\n\n // Horizontal clamping\n const leftTargetVsScreenLeft = Math.min(\n 0,\n targetRect.left + targetRect.width,\n );\n const leftTargetVsScreenRight = Math.max(\n Math.min(left, screenWidth - popoverRect.width),\n targetRect.left - popoverRect.width,\n );\n const leftClamped = Math.max(\n leftTargetVsScreenLeft,\n leftTargetVsScreenRight,\n );\n\n if (leftClamped !== left && !isVertical && iteration > 0) {\n this.#flipPlacement();\n this.#updatePosition(iteration);\n return null;\n }\n\n return { top: topClamped, left: leftClamped };\n }\n\n readonly #updatePadding = () => {\n const oppositeSides: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n\n // find the side excluding start/end\n let side = this._actualPlacement.split('-')[0];\n // find the opposite side\n side = oppositeSides[side] || side;\n // capitalize the side\n side = side.charAt(0).toUpperCase() + side.slice(1);\n\n const marginSide = `margin${side}`;\n this.style.margin = '0';\n (this.style as any)[marginSide] = `${this.margin}px`;\n };\n\n #flipPlacement() {\n const [direction, position] = this._actualPlacement.split('-');\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n const oppositeDirection = opposites[direction] ?? direction;\n this._actualPlacement =\n `${oppositeDirection}-${position}` as PopoverContainerPlacement;\n }\n\n #startScrollListener() {\n this.#scrollParents.forEach(el => {\n el.addEventListener('scroll', this.#initUpdate, { passive: true });\n });\n document.addEventListener('scroll', this.#initUpdate, { passive: true });\n }\n #stopScrollListener() {\n this.#scrollParents.forEach(el => {\n el.removeEventListener('scroll', this.#initUpdate);\n });\n document.removeEventListener('scroll', this.#initUpdate);\n }\n\n /**\n * @internal\n */\n _getScrollParents() {\n return this.#scrollParents;\n }\n\n #calculateScrollParents(): void {\n // Clear previous scroll parents to avoid duplicates\n this.#scrollParents = [];\n\n if (!this.#targetElement) return;\n\n let style = getComputedStyle(this.#targetElement);\n if (style.position === 'fixed') {\n return;\n }\n\n const includeHidden = false;\n let excludeStaticParent = style.position === 'absolute';\n const overflowRegex = includeHidden\n ? /(auto|scroll|hidden)/\n : /(auto|scroll)/;\n\n let el: HTMLElement | undefined | null = this.#targetElement;\n while (el) {\n style = getComputedStyle(el);\n\n if (excludeStaticParent && style.position === 'static') {\n el = this.#getAncestorElement(el);\n continue;\n }\n\n if (style.position !== 'static') {\n excludeStaticParent = style.position === 'absolute';\n }\n\n if (\n overflowRegex.test(style.overflow + style.overflowY + style.overflowX)\n ) {\n this.#scrollParents.push(el);\n }\n if (style.position === 'fixed') {\n return;\n }\n\n el = this.#getAncestorElement(el);\n }\n this.#scrollParents.push(document.body);\n }\n\n #getAncestorElement(el: HTMLElement | null): HTMLElement | null {\n if (el?.assignedSlot) {\n return el.assignedSlot;\n }\n if (el?.parentElement) {\n return el.parentElement;\n }\n\n // If we had no parentElement, then check for shadow roots:\n return (el?.getRootNode() as any)?.host;\n }\n\n render() {\n return html`<uui-scroll-container><slot></slot></uui-scroll-container>`;\n }\n\n static override readonly styles = [\n css`\n :host {\n margin: 0;\n width: fit-content;\n height: fit-content;\n border: none;\n padding: 0;\n background-color: none;\n background: none;\n color: var(--uui-color-text);\n box-shadow: var(--uui-shadow-depth-4);\n border-radius: var(--uui-border-radius);\n }\n\n uui-scroll-container {\n max-height: var(--_available-height, none);\n }\n `,\n ];\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"popover-container.element.js","names":["#initUpdate","#targetElement","#calculateScrollParents","#startScrollListener","#stopScrollListener","#updatePosition","#updatePadding","#calculateAlignedPosition","#clampAndFlip","#onBeforeToggle","#sizeObserver","#size","#flipPlacement","#scrollParents","#getAncestorElement"],"sources":["../../../src/components/popover-container/popover-container.element.ts"],"sourcesContent":["import { findAncestorByAttributeValue } from '../../internal/utils/index.js';\nimport { css, html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport '../scroll-container/scroll-container.js';\n\nexport type PopoverContainerPlacement =\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'right'\n | 'right-start'\n | 'right-end'\n | 'left'\n | 'left-start'\n | 'left-end';\n\n/**\n * @element uui-popover-container\n * @attr popover - Indicates that the element is a popover container\n */\nexport class UUIPopoverContainerElement extends LitElement {\n /**\n * Set the distance between popover container element and target element.\n * @type {number}\n * @attr margin\n * @default 0\n */\n @property({ type: Number })\n margin = 0;\n\n /**\n * Read-only attribute to check if the popover is open\n * @type {boolean}\n * @readonly\n * @attr open\n * @default false\n */\n @property({ type: Boolean })\n get open() {\n return this._open;\n }\n\n /**\n * Define the placement of the popover container.\n * @attr placement\n * @default 'bottom-start'\n */\n @property({ type: String, reflect: true })\n get placement(): PopoverContainerPlacement {\n return this._placement;\n }\n set placement(newValue: PopoverContainerPlacement) {\n this._placement = newValue;\n this._actualPlacement = newValue;\n this.#initUpdate();\n }\n\n @property({ type: Boolean, reflect: true, attribute: 'no-scroll' })\n noScroll = false;\n\n @state()\n _placement: PopoverContainerPlacement = 'bottom-start';\n\n @state()\n _open: boolean = false;\n\n @state()\n _actualPlacement: PopoverContainerPlacement = this._placement;\n\n #targetElement: HTMLElement | null = null;\n #scrollParents: Element[] = [];\n #sizeObserver: ResizeObserver | null = null;\n #size: { width: number; height: number } = { width: 0, height: 0 };\n\n constructor() {\n super();\n\n this.addEventListener('beforetoggle', this.#onBeforeToggle, {\n passive: true,\n });\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n if (!this.hasAttribute('popover')) {\n this.setAttribute('popover', '');\n }\n\n if (!this.#sizeObserver) {\n this.#sizeObserver = new ResizeObserver(entries => {\n const element = entries[0]; // should be only one\n const width = element.contentRect.width;\n const height = element.contentRect.height;\n\n if (width === this.#size.width && height === this.#size.height) {\n return; // no change\n }\n\n this.#size = { width, height };\n this.#initUpdate();\n });\n\n // start listening for size changes\n this.#sizeObserver.observe(this);\n }\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback();\n this.#stopScrollListener();\n this.#sizeObserver?.disconnect();\n this.#sizeObserver = null;\n }\n\n readonly #onBeforeToggle = (event: any) => {\n this._open = event.newState === 'open';\n\n this.#targetElement = findAncestorByAttributeValue(\n this,\n 'popovertarget',\n this.id,\n );\n\n // Dispatch a custom event that can be listened to by the popover target.\n // Mostly used for UUIButton.\n this.#targetElement?.dispatchEvent(\n new CustomEvent('uui-popover-before-toggle', {\n bubbles: false,\n composed: false,\n detail: { oldState: event.oldState, newState: event.newState },\n }),\n );\n\n if (this._open) {\n this.#calculateScrollParents();\n\n this.#startScrollListener();\n\n requestAnimationFrame(() => {\n this.#initUpdate();\n });\n } else {\n this.#stopScrollListener();\n this.style.removeProperty('--_available-height');\n }\n };\n\n readonly #initUpdate = () => {\n if (!this._open) return;\n\n this._actualPlacement = this._placement;\n this.style.opacity = '0';\n\n // 3 iterations makes the popover flip back to the initial position if theres no space for it on either side.\n this.#updatePosition(3);\n };\n\n readonly #updatePosition = (iteration: number) => {\n this.#updatePadding();\n\n // Iterations makes sure that we don't overflow the stack.\n // That could happen if the is no space for the popover on either side, which without iterations, would make it flip back and forth until the stack overflows\n iteration--;\n if (this.#targetElement === null) return;\n\n const targetRect = this.#targetElement.getBoundingClientRect();\n const popoverRect = this.getBoundingClientRect();\n\n let { top, left } = this.#calculateAlignedPosition(targetRect, popoverRect);\n const result = this.#clampAndFlip(\n top,\n left,\n targetRect,\n popoverRect,\n iteration,\n );\n\n if (result === null) return; // flipped and recursed\n\n top = result.top;\n left = result.left;\n\n // Detect if the popover is completely outside the screen on any side\n const screenWidth = window.innerWidth;\n const screenHeight = window.innerHeight;\n const isCompletelyOutsideScreen =\n top + popoverRect.height < 0 ||\n top > screenHeight ||\n left + popoverRect.width < 0 ||\n left > screenWidth;\n\n if (isCompletelyOutsideScreen) {\n this.hidePopover();\n return;\n }\n\n // Constrain the slot height to the available space in the popover's growth direction.\n const isTopPlacement = this._actualPlacement.startsWith('top');\n const isBottomPlacement = this._actualPlacement.startsWith('bottom');\n let availableHeight: number;\n if (isTopPlacement) {\n availableHeight = targetRect.top - 2 * this.margin;\n } else if (isBottomPlacement) {\n // margin once for the popover's own padding, once for a safe edge buffer\n availableHeight =\n screenHeight - (targetRect.top + targetRect.height) - 2 * this.margin;\n } else {\n availableHeight = screenHeight - targetRect.top - this.margin;\n }\n this.style.setProperty(\n '--_available-height',\n `${Math.max(availableHeight, 0)}px`,\n );\n\n // Set the popover's position\n this.style.transform = `translate(${left}px, ${top}px)`;\n this.style.opacity = '1';\n };\n\n #calculateAlignedPosition(targetRect: DOMRect, popoverRect: DOMRect) {\n const isStart = this._actualPlacement.includes('-start');\n const isEnd = this._actualPlacement.includes('-end');\n\n // Alignment along the cross-axis\n const align = (pos: number, targetSize: number, popoverSize: number) => {\n if (isStart) return pos;\n if (isEnd) return pos + targetSize - popoverSize;\n return pos + targetSize / 2 - popoverSize / 2;\n };\n\n const side = this._actualPlacement.split('-')[0];\n\n // For top/bottom: top is determined by placement, left by alignment\n // For left/right: left is determined by placement, top by alignment\n const positions: Record<string, { top: number; left: number }> = {\n bottom: {\n top: targetRect.top + targetRect.height,\n left: align(targetRect.left, targetRect.width, popoverRect.width),\n },\n top: {\n top: targetRect.top - popoverRect.height,\n left: align(targetRect.left, targetRect.width, popoverRect.width),\n },\n left: {\n top: align(targetRect.top, targetRect.height, popoverRect.height),\n left: targetRect.left - popoverRect.width,\n },\n right: {\n top: align(targetRect.top, targetRect.height, popoverRect.height),\n left: targetRect.left + targetRect.width,\n },\n };\n\n return positions[side] ?? { top: 0, left: 0 };\n }\n\n #clampAndFlip(\n top: number,\n left: number,\n targetRect: DOMRect,\n popoverRect: DOMRect,\n iteration: number,\n ): { top: number; left: number } | null {\n const screenWidth = window.innerWidth;\n const screenHeight = window.innerHeight;\n const side = this._actualPlacement.split('-')[0];\n const isVertical = side === 'top' || side === 'bottom';\n\n // Vertical clamping\n const topTargetVsScreenTop = Math.min(\n 0,\n targetRect.top + targetRect.height,\n );\n const topTargetVsScreenBottom = Math.max(\n Math.min(top, screenHeight - popoverRect.height),\n targetRect.top - popoverRect.height,\n );\n const topClamped = Math.max(topTargetVsScreenTop, topTargetVsScreenBottom);\n\n if (topClamped !== top && isVertical && iteration > 0) {\n this.#flipPlacement();\n this.#updatePosition(iteration);\n return null;\n }\n\n // Horizontal clamping\n const leftTargetVsScreenLeft = Math.min(\n 0,\n targetRect.left + targetRect.width,\n );\n const leftTargetVsScreenRight = Math.max(\n Math.min(left, screenWidth - popoverRect.width),\n targetRect.left - popoverRect.width,\n );\n const leftClamped = Math.max(\n leftTargetVsScreenLeft,\n leftTargetVsScreenRight,\n );\n\n if (leftClamped !== left && !isVertical && iteration > 0) {\n this.#flipPlacement();\n this.#updatePosition(iteration);\n return null;\n }\n\n return { top: topClamped, left: leftClamped };\n }\n\n readonly #updatePadding = () => {\n const oppositeSides: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n\n // find the side excluding start/end\n let side = this._actualPlacement.split('-')[0];\n // find the opposite side\n side = oppositeSides[side] || side;\n // capitalize the side\n side = side.charAt(0).toUpperCase() + side.slice(1);\n\n const marginSide = `margin${side}`;\n this.style.margin = '0';\n (this.style as any)[marginSide] = `${this.margin}px`;\n };\n\n #flipPlacement() {\n const [direction, position] = this._actualPlacement.split('-');\n const opposites: Record<string, string> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n };\n const oppositeDirection = opposites[direction] ?? direction;\n this._actualPlacement =\n `${oppositeDirection}-${position}` as PopoverContainerPlacement;\n }\n\n #startScrollListener() {\n this.#scrollParents.forEach(el => {\n el.addEventListener('scroll', this.#initUpdate, { passive: true });\n });\n document.addEventListener('scroll', this.#initUpdate, { passive: true });\n }\n #stopScrollListener() {\n this.#scrollParents.forEach(el => {\n el.removeEventListener('scroll', this.#initUpdate);\n });\n document.removeEventListener('scroll', this.#initUpdate);\n }\n\n /**\n * @internal\n */\n _getScrollParents() {\n return this.#scrollParents;\n }\n\n #calculateScrollParents(): void {\n // Clear previous scroll parents to avoid duplicates\n this.#scrollParents = [];\n\n if (!this.#targetElement) return;\n\n let style = getComputedStyle(this.#targetElement);\n if (style.position === 'fixed') {\n return;\n }\n\n const includeHidden = false;\n let excludeStaticParent = style.position === 'absolute';\n const overflowRegex = includeHidden\n ? /(auto|scroll|hidden)/\n : /(auto|scroll)/;\n\n let el: HTMLElement | undefined | null = this.#targetElement;\n while (el) {\n style = getComputedStyle(el);\n\n if (excludeStaticParent && style.position === 'static') {\n el = this.#getAncestorElement(el);\n continue;\n }\n\n if (style.position !== 'static') {\n excludeStaticParent = style.position === 'absolute';\n }\n\n if (\n overflowRegex.test(style.overflow + style.overflowY + style.overflowX)\n ) {\n this.#scrollParents.push(el);\n }\n if (style.position === 'fixed') {\n return;\n }\n\n el = this.#getAncestorElement(el);\n }\n this.#scrollParents.push(document.body);\n }\n\n #getAncestorElement(el: HTMLElement | null): HTMLElement | null {\n if (el?.assignedSlot) {\n return el.assignedSlot;\n }\n if (el?.parentElement) {\n return el.parentElement;\n }\n\n // If we had no parentElement, then check for shadow roots:\n return (el?.getRootNode() as any)?.host;\n }\n\n render() {\n if (this.noScroll) {\n return html`<slot></slot>`;\n }\n return html`<uui-scroll-container><slot></slot></uui-scroll-container>`;\n }\n\n static override readonly styles = [\n css`\n :host {\n margin: 0;\n width: fit-content;\n height: fit-content;\n border: none;\n padding: 0;\n background-color: none;\n background: none;\n color: var(--uui-color-text);\n box-shadow: var(--uui-shadow-depth-4);\n border-radius: var(--uui-border-radius);\n }\n :host([no-scroll]) {\n overflow: visible;\n }\n\n uui-scroll-container {\n max-height: var(--_available-height, none);\n }\n `,\n ];\n}\n"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { defineElement } from "../../internal/registration/index.js";
|
|
2
2
|
import { UUIPopoverContainerElement } from "./popover-container.element.js";
|
|
3
|
+
//#region src/components/popover-container/popover-container.ts
|
|
3
4
|
defineElement("uui-popover-container", UUIPopoverContainerElement);
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
//# sourceMappingURL=popover-container.js.map
|
|
5
|
+
//#endregion
|
|
6
|
+
export { UUIPopoverContainerElement };
|
|
7
|
+
|
|
8
|
+
//# sourceMappingURL=popover-container.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popover-container.js","sources":["../../../src/components/popover-container/popover-container.ts"],"sourcesContent":["import { defineElement } from '../../internal/registration/index.js';\nimport { UUIPopoverContainerElement } from './popover-container.element.js';\n\ndefineElement('uui-popover-container', UUIPopoverContainerElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'uui-popover-container': UUIPopoverContainerElement;\n }\n}\n\nexport * from './popover-container.element.js';\
|
|
1
|
+
{"version":3,"file":"popover-container.js","names":[],"sources":["../../../src/components/popover-container/popover-container.ts"],"sourcesContent":["import { defineElement } from '../../internal/registration/index.js';\nimport { UUIPopoverContainerElement } from './popover-container.element.js';\n\ndefineElement('uui-popover-container', UUIPopoverContainerElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'uui-popover-container': UUIPopoverContainerElement;\n }\n}\n\nexport * from './popover-container.element.js';\n"],"mappings":";;;AAGA,cAAc,yBAAyB,0BAA0B"}
|
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
import
|
|
1
|
+
import __decorate from "../../_virtual/_@oxc-project_runtime@0.138.0/helpers/esm/decorate.js";
|
|
2
|
+
import { LitElement, css, html } from "lit";
|
|
2
3
|
import { property } from "lit/decorators.js";
|
|
3
4
|
import { styleMap } from "lit/directives/style-map.js";
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
5
|
+
//#region src/components/progress-bar/progress-bar.element.ts
|
|
6
|
+
var clamp = (num, min, max) => Math.min(Math.max(num, min), max);
|
|
7
|
+
/**
|
|
8
|
+
* @element uui-progress-bar
|
|
9
|
+
*/
|
|
10
|
+
var UUIProgressBarElement = class extends LitElement {
|
|
11
|
+
constructor(..._args) {
|
|
12
|
+
super(..._args);
|
|
13
|
+
this._progress = 0;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Set this to a number between 0 and 100 to reflect the progress of some operation.
|
|
17
|
+
* @type {number}
|
|
18
|
+
* @attr
|
|
19
|
+
* @default 0
|
|
20
|
+
*/
|
|
21
|
+
get progress() {
|
|
22
|
+
return this._progress;
|
|
23
|
+
}
|
|
24
|
+
set progress(newVal) {
|
|
25
|
+
const oldVal = this._progress;
|
|
26
|
+
this._progress = clamp(newVal, 0, 100);
|
|
27
|
+
this.requestUpdate("progress", oldVal);
|
|
28
|
+
}
|
|
29
|
+
_getProgressStyle() {
|
|
30
|
+
return { width: `${this._progress}%` };
|
|
31
|
+
}
|
|
32
|
+
render() {
|
|
33
|
+
return html`
|
|
33
34
|
<div id="bar" style=${styleMap(this._getProgressStyle())}></div>
|
|
34
35
|
`;
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
css`
|
|
36
|
+
}
|
|
37
|
+
static {
|
|
38
|
+
this.styles = [css`
|
|
39
39
|
:host {
|
|
40
40
|
position: relative;
|
|
41
41
|
display: inline-block;
|
|
@@ -53,13 +53,11 @@ _UUIProgressBarElement.styles = [
|
|
|
53
53
|
border-radius: 2px;
|
|
54
54
|
width: 0%;
|
|
55
55
|
}
|
|
56
|
-
`
|
|
57
|
-
|
|
58
|
-
let UUIProgressBarElement = _UUIProgressBarElement;
|
|
59
|
-
__decorateClass([
|
|
60
|
-
property({ type: Number })
|
|
61
|
-
], UUIProgressBarElement.prototype, "progress");
|
|
62
|
-
export {
|
|
63
|
-
UUIProgressBarElement
|
|
56
|
+
`];
|
|
57
|
+
}
|
|
64
58
|
};
|
|
65
|
-
|
|
59
|
+
__decorate([property({ type: Number })], UUIProgressBarElement.prototype, "progress", null);
|
|
60
|
+
//#endregion
|
|
61
|
+
export { UUIProgressBarElement };
|
|
62
|
+
|
|
63
|
+
//# sourceMappingURL=progress-bar.element.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress-bar.element.js","sources":["../../../src/components/progress-bar/progress-bar.element.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nconst clamp = (num: number, min: number, max: number) =>\n Math.min(Math.max(num, min), max);\n\n/**\n * @element uui-progress-bar\n */\nexport class UUIProgressBarElement extends LitElement {\n private _progress = 0;\n /**\n * Set this to a number between 0 and 100 to reflect the progress of some operation.\n * @type {number}\n * @attr\n * @default 0\n */\n @property({ type: Number })\n get progress() {\n return this._progress;\n }\n\n set progress(newVal) {\n const oldVal = this._progress;\n this._progress = clamp(newVal, 0, 100);\n this.requestUpdate('progress', oldVal);\n }\n\n private _getProgressStyle() {\n return { width: `${this._progress}%` };\n }\n\n render() {\n return html`\n <div id=\"bar\" style=${styleMap(this._getProgressStyle())}></div>\n `;\n }\n\n static override readonly styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n width: 100%;\n height: 3px;\n overflow: clip;\n background: var(--uui-color-surface-alt);\n border-radius: 2px;\n }\n\n #bar {\n transition: width 250ms ease;\n background: var(--uui-color-positive);\n height: 100%;\n border-radius: 2px;\n width: 0%;\n }\n `,\n ];\n}\n"],"
|
|
1
|
+
{"version":3,"file":"progress-bar.element.js","names":[],"sources":["../../../src/components/progress-bar/progress-bar.element.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nconst clamp = (num: number, min: number, max: number) =>\n Math.min(Math.max(num, min), max);\n\n/**\n * @element uui-progress-bar\n */\nexport class UUIProgressBarElement extends LitElement {\n private _progress = 0;\n /**\n * Set this to a number between 0 and 100 to reflect the progress of some operation.\n * @type {number}\n * @attr\n * @default 0\n */\n @property({ type: Number })\n get progress() {\n return this._progress;\n }\n\n set progress(newVal) {\n const oldVal = this._progress;\n this._progress = clamp(newVal, 0, 100);\n this.requestUpdate('progress', oldVal);\n }\n\n private _getProgressStyle() {\n return { width: `${this._progress}%` };\n }\n\n render() {\n return html`\n <div id=\"bar\" style=${styleMap(this._getProgressStyle())}></div>\n `;\n }\n\n static override readonly styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n width: 100%;\n height: 3px;\n overflow: clip;\n background: var(--uui-color-surface-alt);\n border-radius: 2px;\n }\n\n #bar {\n transition: width 250ms ease;\n background: var(--uui-color-positive);\n height: 100%;\n border-radius: 2px;\n width: 0%;\n }\n `,\n ];\n}\n"],"mappings":";;;;;AAIA,IAAM,SAAS,KAAa,KAAa,QACvC,KAAK,IAAI,KAAK,IAAI,KAAK,GAAG,GAAG,GAAG;;;;AAKlC,IAAa,wBAAb,cAA2C,WAAW;;;mBAChC;;;;;;;;CAOpB,IACI,WAAW;EACb,OAAO,KAAK;CACd;CAEA,IAAI,SAAS,QAAQ;EACnB,MAAM,SAAS,KAAK;EACpB,KAAK,YAAY,MAAM,QAAQ,GAAG,GAAG;EACrC,KAAK,cAAc,YAAY,MAAM;CACvC;CAEA,oBAA4B;EAC1B,OAAO,EAAE,OAAO,GAAG,KAAK,UAAU,GAAG;CACvC;CAEA,SAAS;EACP,OAAO,IAAI;4BACa,SAAS,KAAK,kBAAkB,CAAC,EAAE;;CAE7D;;gBAEkC,CAChC,GAAG;;;;;;;;;;;;;;;;;;KAmBL;;AACF;YA1CG,SAAS,EAAE,MAAM,OAAO,CAAC,CAAA,GAAA,sBAAA,WAAA,YAAA,IAAA"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { defineElement } from "../../internal/registration/index.js";
|
|
2
2
|
import { UUIProgressBarElement } from "./progress-bar.element.js";
|
|
3
|
+
//#region src/components/progress-bar/progress-bar.ts
|
|
3
4
|
defineElement("uui-progress-bar", UUIProgressBarElement);
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
//# sourceMappingURL=progress-bar.js.map
|
|
5
|
+
//#endregion
|
|
6
|
+
export { UUIProgressBarElement };
|
|
7
|
+
|
|
8
|
+
//# sourceMappingURL=progress-bar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"progress-bar.js","sources":["../../../src/components/progress-bar/progress-bar.ts"],"sourcesContent":["import { defineElement } from '../../internal/registration/index.js';\nimport { UUIProgressBarElement } from './progress-bar.element.js';\n\ndefineElement('uui-progress-bar', UUIProgressBarElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'uui-progress-bar': UUIProgressBarElement;\n }\n}\n\nexport * from './progress-bar.element.js';\
|
|
1
|
+
{"version":3,"file":"progress-bar.js","names":[],"sources":["../../../src/components/progress-bar/progress-bar.ts"],"sourcesContent":["import { defineElement } from '../../internal/registration/index.js';\nimport { UUIProgressBarElement } from './progress-bar.element.js';\n\ndefineElement('uui-progress-bar', UUIProgressBarElement);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'uui-progress-bar': UUIProgressBarElement;\n }\n}\n\nexport * from './progress-bar.element.js';\n"],"mappings":";;;AAGA,cAAc,oBAAoB,qBAAqB"}
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
import { UUIEvent } from "../../internal/events/UUIEvent.js";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
2
|
+
//#region src/components/radio/UUIRadioEvent.ts
|
|
3
|
+
var UUIRadioEvent = class extends UUIEvent {
|
|
4
|
+
static {
|
|
5
|
+
this.CHANGE = "change";
|
|
6
|
+
}
|
|
7
|
+
constructor(evName, eventInit = {}) {
|
|
8
|
+
super(evName, {
|
|
9
|
+
bubbles: true,
|
|
10
|
+
...eventInit
|
|
11
|
+
});
|
|
12
|
+
}
|
|
9
13
|
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
};
|
|
15
|
-
//# sourceMappingURL=UUIRadioEvent.js.map
|
|
14
|
+
//#endregion
|
|
15
|
+
export { UUIRadioEvent };
|
|
16
|
+
|
|
17
|
+
//# sourceMappingURL=UUIRadioEvent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UUIRadioEvent.js","sources":["../../../src/components/radio/UUIRadioEvent.ts"],"sourcesContent":["import { UUIEvent } from '../../internal/events/index.js';\nimport type { UUIRadioElement } from './radio.element.js';\n\nexport class UUIRadioEvent extends UUIEvent<{}, UUIRadioElement> {\n public static readonly CHANGE = 'change';\n\n constructor(evName: string, eventInit: any = {}) {\n super(evName, {\n bubbles: true,\n ...eventInit,\n });\n }\n}\n"],"
|
|
1
|
+
{"version":3,"file":"UUIRadioEvent.js","names":[],"sources":["../../../src/components/radio/UUIRadioEvent.ts"],"sourcesContent":["import { UUIEvent } from '../../internal/events/index.js';\nimport type { UUIRadioElement } from './radio.element.js';\n\nexport class UUIRadioEvent extends UUIEvent<{}, UUIRadioElement> {\n public static readonly CHANGE = 'change';\n\n constructor(evName: string, eventInit: any = {}) {\n super(evName, {\n bubbles: true,\n ...eventInit,\n });\n }\n}\n"],"mappings":";;AAGA,IAAa,gBAAb,cAAmC,SAA8B;;gBAC/B;;CAEhC,YAAY,QAAgB,YAAiB,CAAC,GAAG;EAC/C,MAAM,QAAQ;GACZ,SAAS;GACT,GAAG;EACL,CAAC;CACH;AACF"}
|
|
@@ -1,15 +1,17 @@
|
|
|
1
1
|
import { UUIEvent } from "../../internal/events/UUIEvent.js";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
2
|
+
//#region src/components/radio/UUIRadioGroupEvent.ts
|
|
3
|
+
var UUIRadioGroupEvent = class extends UUIEvent {
|
|
4
|
+
static {
|
|
5
|
+
this.CHANGE = "change";
|
|
6
|
+
}
|
|
7
|
+
constructor(evName, eventInit = {}) {
|
|
8
|
+
super(evName, {
|
|
9
|
+
bubbles: true,
|
|
10
|
+
...eventInit
|
|
11
|
+
});
|
|
12
|
+
}
|
|
9
13
|
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
};
|
|
15
|
-
//# sourceMappingURL=UUIRadioGroupEvent.js.map
|
|
14
|
+
//#endregion
|
|
15
|
+
export { UUIRadioGroupEvent };
|
|
16
|
+
|
|
17
|
+
//# sourceMappingURL=UUIRadioGroupEvent.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UUIRadioGroupEvent.js","sources":["../../../src/components/radio/UUIRadioGroupEvent.ts"],"sourcesContent":["import { UUIEvent } from '../../internal/events/index.js';\nimport type { UUIRadioGroupElement } from './radio-group.element.js';\n\nexport class UUIRadioGroupEvent extends UUIEvent<{}, UUIRadioGroupElement> {\n public static readonly CHANGE = 'change';\n\n constructor(evName: string, eventInit: any = {}) {\n super(evName, {\n bubbles: true,\n ...eventInit,\n });\n }\n}\n"],"
|
|
1
|
+
{"version":3,"file":"UUIRadioGroupEvent.js","names":[],"sources":["../../../src/components/radio/UUIRadioGroupEvent.ts"],"sourcesContent":["import { UUIEvent } from '../../internal/events/index.js';\nimport type { UUIRadioGroupElement } from './radio-group.element.js';\n\nexport class UUIRadioGroupEvent extends UUIEvent<{}, UUIRadioGroupElement> {\n public static readonly CHANGE = 'change';\n\n constructor(evName: string, eventInit: any = {}) {\n super(evName, {\n bubbles: true,\n ...eventInit,\n });\n }\n}\n"],"mappings":";;AAGA,IAAa,qBAAb,cAAwC,SAAmC;;gBACzC;;CAEhC,YAAY,QAAgB,YAAiB,CAAC,GAAG;EAC/C,MAAM,QAAQ;GACZ,SAAS;GACT,GAAG;EACL,CAAC;CACH;AACF"}
|