@festo-ui/angular 3.1.0 → 3.2.1-pre-20220624.2
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/README.md +5 -1
- package/css/bundle.css +1 -0
- package/css/image-gallery.css +1 -0
- package/css/popover.css +1 -0
- package/esm2020/festo-ui-angular.mjs +5 -0
- package/esm2020/index.mjs +20 -0
- package/esm2020/lib/components/accordion/accordion-header/accordion-header.component.mjs +11 -0
- package/esm2020/lib/components/accordion/accordion-item/accordion-item-body/accordion-item-body.component.mjs +15 -0
- package/esm2020/lib/components/accordion/accordion-item/accordion-item-header/accordion-item-header.component.mjs +28 -0
- package/esm2020/lib/components/accordion/accordion-item/accordion-item.component.mjs +143 -0
- package/esm2020/lib/components/accordion/accordion.component.mjs +59 -0
- package/esm2020/lib/components/accordion/index.mjs +6 -0
- package/esm2020/lib/components/breadcrumb/breadcrumb.component.mjs +23 -0
- package/esm2020/lib/components/buttons/button/button.component.mjs +41 -0
- package/esm2020/lib/components/buttons/link-button/link-button.component.mjs +33 -0
- package/esm2020/lib/components/chips/chip/chip.component.mjs +37 -0
- package/esm2020/lib/components/chips/chip-container/chip-container.component.mjs +16 -0
- package/esm2020/lib/components/click-outside.directive.mjs +28 -0
- package/esm2020/lib/components/components.module.mjs +223 -0
- package/esm2020/lib/components/image-gallery/image-gallery.component.mjs +58 -0
- package/esm2020/lib/components/image-gallery/image-gallery.module.mjs +21 -0
- package/esm2020/lib/components/loading-indicator/loading-indicator.component.mjs +16 -0
- package/esm2020/lib/components/mobile-flyout/mobile-flyout-item/mobile-flyout-item.component.mjs +38 -0
- package/esm2020/lib/components/mobile-flyout/mobile-flyout-page/mobile-flyout-page.component.mjs +64 -0
- package/esm2020/lib/components/mobile-flyout/mobile-flyout.component.mjs +68 -0
- package/esm2020/lib/components/modals/alert/alert.component.mjs +52 -0
- package/esm2020/lib/components/modals/confirm/confirm.component.mjs +53 -0
- package/esm2020/lib/components/modals/custom-modal/custom-modal.component.mjs +70 -0
- package/esm2020/lib/components/modals/index.mjs +2 -0
- package/esm2020/lib/components/modals/modal.service.mjs +121 -0
- package/esm2020/lib/components/modals/modals.module.mjs +31 -0
- package/esm2020/lib/components/modals/prompt/prompt.component.mjs +102 -0
- package/esm2020/lib/components/pagination/pagination.component.mjs +55 -0
- package/esm2020/lib/components/popovers/legend/legend.component.mjs +42 -0
- package/esm2020/lib/components/popovers/legend/legend.directive.mjs +31 -0
- package/esm2020/lib/components/popovers/popover/popover.component.mjs +31 -0
- package/esm2020/lib/components/popovers/popover-content/popover-content.component.mjs +82 -0
- package/esm2020/lib/components/popovers/popover-content/popover-content.directive.mjs +39 -0
- package/esm2020/lib/components/popovers/popover-menu/popover-menu.component.mjs +68 -0
- package/esm2020/lib/components/popovers/popover-ref.mjs +25 -0
- package/esm2020/lib/components/popovers/popover.defaults.mjs +60 -0
- package/esm2020/lib/components/popovers/popover.models.mjs +23 -0
- package/esm2020/lib/components/popovers/popover.service.mjs +123 -0
- package/esm2020/lib/components/popovers/tooltip/tooltip.directive.mjs +100 -0
- package/esm2020/lib/components/progress/progress.component.mjs +20 -0
- package/esm2020/lib/components/scroll/index.mjs +2 -0
- package/esm2020/lib/components/scroll/scrollable.directive.mjs +72 -0
- package/esm2020/lib/components/search-input/safe-html.pipe.mjs +21 -0
- package/esm2020/lib/components/search-input/search-input.component.mjs +172 -0
- package/esm2020/lib/components/snackbar/snackbar-container.component.mjs +21 -0
- package/esm2020/lib/components/snackbar/snackbar-container.directive.mjs +83 -0
- package/esm2020/lib/components/snackbar/snackbar.component.mjs +79 -0
- package/esm2020/lib/components/snackbar/snackbar.models.mjs +2 -0
- package/esm2020/lib/components/snackbar/snackbar.module.mjs +26 -0
- package/esm2020/lib/components/snackbar/snackbar.service.mjs +23 -0
- package/esm2020/lib/components/stepper-horizontal/step-horizontal/step-horizontal.component.mjs +19 -0
- package/esm2020/lib/components/stepper-horizontal/stepper-horizontal.component.mjs +51 -0
- package/esm2020/lib/components/stepper-vertical/step-vertical/step-vertical.component.mjs +56 -0
- package/esm2020/lib/components/stepper-vertical/stepper-vertical.component.mjs +54 -0
- package/esm2020/lib/components/table-header-cell/table-header-cell.directive.mjs +58 -0
- package/esm2020/lib/components/tabs/tab-pane/tab-pane.component.mjs +31 -0
- package/esm2020/lib/components/tabs/tabs.component.mjs +353 -0
- package/esm2020/lib/content/content.module.mjs +20 -0
- package/esm2020/lib/content/icon/icon.component.mjs +17 -0
- package/esm2020/lib/festo-angular.module.mjs +65 -0
- package/esm2020/lib/forms/checkbox/checkbox.component.mjs +149 -0
- package/esm2020/lib/forms/color-indicator/color-indicator.component.mjs +68 -0
- package/esm2020/lib/forms/color-picker/color-helper.mjs +121 -0
- package/esm2020/lib/forms/color-picker/color-picker.component.mjs +273 -0
- package/esm2020/lib/forms/container-host.mjs +27 -0
- package/esm2020/lib/forms/date-picker/date-picker.component.mjs +199 -0
- package/esm2020/lib/forms/date-range-picker/date-range-picker.component.mjs +224 -0
- package/esm2020/lib/forms/forms.module.mjs +146 -0
- package/esm2020/lib/forms/radio/radio.component.mjs +346 -0
- package/esm2020/lib/forms/segment/segment-control/segment-control.component.mjs +57 -0
- package/esm2020/lib/forms/segment/segment.component.mjs +109 -0
- package/esm2020/lib/forms/select/chip-text.pipe.mjs +34 -0
- package/esm2020/lib/forms/select/select-option/select-option.component.mjs +22 -0
- package/esm2020/lib/forms/select/select.component.mjs +257 -0
- package/esm2020/lib/forms/slider/slider.component.mjs +110 -0
- package/esm2020/lib/forms/switch/switch.component.mjs +120 -0
- package/esm2020/lib/forms/text-area/text-area.component.mjs +180 -0
- package/esm2020/lib/forms/text-editor/text-editor.component.mjs +286 -0
- package/esm2020/lib/forms/text-input/text-input.component.mjs +183 -0
- package/esm2020/lib/forms/time-picker/time-picker-dropdown/time-picker-dropdown.component.mjs +89 -0
- package/esm2020/lib/forms/time-picker/time-picker.component.mjs +188 -0
- package/esm2020/lib/forms/unique-selection-dispatcher.mjs +39 -0
- package/esm2020/lib/forms/value-accessor-base.mjs +41 -0
- package/esm2020/lib/layout/layout.module.mjs +18 -0
- package/esm2020/lib/wrappers/flatpickr/flatpickr.component.mjs +59 -0
- package/fesm2015/festo-ui-angular.mjs +6172 -0
- package/fesm2015/festo-ui-angular.mjs.map +1 -0
- package/fesm2020/festo-ui-angular.mjs +6154 -0
- package/fesm2020/festo-ui-angular.mjs.map +1 -0
- package/index.d.ts +1 -0
- package/lib/components/accordion/accordion-header/accordion-header.component.d.ts +5 -0
- package/lib/components/accordion/accordion-item/accordion-item-body/accordion-item-body.component.d.ts +6 -0
- package/lib/components/accordion/accordion-item/accordion-item-header/accordion-item-header.component.d.ts +15 -0
- package/lib/components/accordion/accordion-item/accordion-item.component.d.ts +34 -0
- package/lib/components/accordion/accordion.component.d.ts +24 -0
- package/lib/components/accordion/index.d.ts +5 -0
- package/lib/components/components.module.d.ts +40 -20
- package/lib/components/image-gallery/image-gallery.component.d.ts +33 -0
- package/lib/components/image-gallery/image-gallery.module.d.ts +10 -0
- package/lib/components/mobile-flyout/mobile-flyout-item/mobile-flyout-item.component.d.ts +15 -0
- package/lib/components/mobile-flyout/mobile-flyout-page/mobile-flyout-page.component.d.ts +19 -0
- package/lib/components/mobile-flyout/mobile-flyout.component.d.ts +17 -0
- package/lib/components/modals/confirm/confirm.component.d.ts +1 -3
- package/lib/components/modals/custom-modal/custom-modal.component.d.ts +21 -0
- package/lib/components/modals/modal.service.d.ts +2 -0
- package/lib/components/modals/modals.module.d.ts +8 -5
- package/lib/components/popovers/tooltip/tooltip.directive.d.ts +5 -3
- package/lib/components/search-input/safe-html.pipe.d.ts +10 -0
- package/lib/components/search-input/search-input.component.d.ts +22 -5
- package/lib/components/stepper-horizontal/step-horizontal/step-horizontal.component.d.ts +7 -0
- package/lib/components/stepper-horizontal/stepper-horizontal.component.d.ts +14 -0
- package/lib/components/stepper-vertical/step-vertical/step-vertical.component.d.ts +18 -0
- package/lib/components/stepper-vertical/stepper-vertical.component.d.ts +14 -0
- package/lib/festo-angular.module.d.ts +2 -1
- package/package.json +41 -19
- package/scss/base/components/accordion/accordion-header/accordion-header.component.scss +12 -0
- package/scss/base/components/accordion/accordion-item/accordion-item-body/accordion-item-body.component.scss +109 -0
- package/scss/base/components/accordion/accordion-item/accordion-item-header/accordion-item-header.component.scss +9 -0
- package/scss/base/components/accordion/accordion-item/accordion-item.component.scss +71 -0
- package/scss/base/components/accordion/accordion.component.scss +6 -0
- package/scss/base/components/breadcrumb/breadcrumb.component.scss +0 -1
- package/scss/base/components/buttons/button/button.component.scss +5 -3
- package/scss/base/components/image-gallery/image-gallery.component.scss +0 -0
- package/scss/base/components/image-gallery/styles.scss +5 -0
- package/scss/base/components/modals/prompt/prompt.component.scss +0 -1
- package/scss/base/components/popovers/legend/legend.component.scss +2 -2
- package/scss/base/components/popovers/popover/styles.scss +2 -3
- package/scss/base/components/popovers/popover-content/popover-content.component.scss +1 -1
- package/scss/base/components/scroll/scroll-story-helper.scss +1 -3
- package/scss/base/components/search-input/search-input.component.scss +4 -0
- package/scss/base/components/snackbar/snackbar.component.scss +1 -1
- package/scss/base/components/stepper-horizontal/step-horizontal/step-horizontal.component.scss +23 -0
- package/scss/base/components/stepper-vertical/step-vertical/step-vertical.component.scss +6 -0
- package/scss/base/forms/color-indicator/color-indicator.component.scss +1 -1
- package/scss/base/forms/color-picker/color-picker.component.scss +15 -15
- package/scss/base/forms/date-picker/date-picker.component.scss +1 -1
- package/scss/base/forms/date-range-picker/date-range-picker.component.scss +1 -1
- package/scss/base/forms/text-area/text-area.component.scss +4 -4
- package/scss/base/forms/text-editor/text-editor.component.scss +8 -10
- package/scss/base/forms/time-picker/time-picker-dropdown/time-picker-dropdown.component.scss +1 -1
- package/bundles/festo-ui-angular.umd.js +0 -6429
- package/bundles/festo-ui-angular.umd.js.map +0 -1
- package/esm2015/festo-ui-angular.js +0 -5
- package/esm2015/festo-ui-angular.js.map +0 -1
- package/esm2015/index.js +0 -18
- package/esm2015/index.js.map +0 -1
- package/esm2015/lib/components/breadcrumb/breadcrumb.component.js +0 -27
- package/esm2015/lib/components/breadcrumb/breadcrumb.component.js.map +0 -1
- package/esm2015/lib/components/buttons/button/button.component.js +0 -46
- package/esm2015/lib/components/buttons/button/button.component.js.map +0 -1
- package/esm2015/lib/components/buttons/link-button/link-button.component.js +0 -38
- package/esm2015/lib/components/buttons/link-button/link-button.component.js.map +0 -1
- package/esm2015/lib/components/chips/chip/chip.component.js +0 -42
- package/esm2015/lib/components/chips/chip/chip.component.js.map +0 -1
- package/esm2015/lib/components/chips/chip-container/chip-container.component.js +0 -21
- package/esm2015/lib/components/chips/chip-container/chip-container.component.js.map +0 -1
- package/esm2015/lib/components/click-outside.directive.js +0 -28
- package/esm2015/lib/components/click-outside.directive.js.map +0 -1
- package/esm2015/lib/components/components.module.js +0 -155
- package/esm2015/lib/components/components.module.js.map +0 -1
- package/esm2015/lib/components/loading-indicator/loading-indicator.component.js +0 -21
- package/esm2015/lib/components/loading-indicator/loading-indicator.component.js.map +0 -1
- package/esm2015/lib/components/modals/alert/alert.component.js +0 -57
- package/esm2015/lib/components/modals/alert/alert.component.js.map +0 -1
- package/esm2015/lib/components/modals/confirm/confirm.component.js +0 -73
- package/esm2015/lib/components/modals/confirm/confirm.component.js.map +0 -1
- package/esm2015/lib/components/modals/index.js +0 -2
- package/esm2015/lib/components/modals/index.js.map +0 -1
- package/esm2015/lib/components/modals/modal.service.js +0 -91
- package/esm2015/lib/components/modals/modal.service.js.map +0 -1
- package/esm2015/lib/components/modals/modals.module.js +0 -28
- package/esm2015/lib/components/modals/modals.module.js.map +0 -1
- package/esm2015/lib/components/modals/prompt/prompt.component.js +0 -110
- package/esm2015/lib/components/modals/prompt/prompt.component.js.map +0 -1
- package/esm2015/lib/components/pagination/pagination.component.js +0 -60
- package/esm2015/lib/components/pagination/pagination.component.js.map +0 -1
- package/esm2015/lib/components/popovers/legend/legend.component.js +0 -46
- package/esm2015/lib/components/popovers/legend/legend.component.js.map +0 -1
- package/esm2015/lib/components/popovers/legend/legend.directive.js +0 -31
- package/esm2015/lib/components/popovers/legend/legend.directive.js.map +0 -1
- package/esm2015/lib/components/popovers/popover/popover.component.js +0 -35
- package/esm2015/lib/components/popovers/popover/popover.component.js.map +0 -1
- package/esm2015/lib/components/popovers/popover-content/popover-content.component.js +0 -86
- package/esm2015/lib/components/popovers/popover-content/popover-content.component.js.map +0 -1
- package/esm2015/lib/components/popovers/popover-content/popover-content.directive.js +0 -39
- package/esm2015/lib/components/popovers/popover-content/popover-content.directive.js.map +0 -1
- package/esm2015/lib/components/popovers/popover-menu/popover-menu.component.js +0 -72
- package/esm2015/lib/components/popovers/popover-menu/popover-menu.component.js.map +0 -1
- package/esm2015/lib/components/popovers/popover-ref.js +0 -25
- package/esm2015/lib/components/popovers/popover-ref.js.map +0 -1
- package/esm2015/lib/components/popovers/popover.defaults.js +0 -60
- package/esm2015/lib/components/popovers/popover.defaults.js.map +0 -1
- package/esm2015/lib/components/popovers/popover.models.js +0 -23
- package/esm2015/lib/components/popovers/popover.models.js.map +0 -1
- package/esm2015/lib/components/popovers/popover.service.js +0 -117
- package/esm2015/lib/components/popovers/popover.service.js.map +0 -1
- package/esm2015/lib/components/popovers/tooltip/tooltip.directive.js +0 -96
- package/esm2015/lib/components/popovers/tooltip/tooltip.directive.js.map +0 -1
- package/esm2015/lib/components/progress/progress.component.js +0 -23
- package/esm2015/lib/components/progress/progress.component.js.map +0 -1
- package/esm2015/lib/components/scroll/index.js +0 -2
- package/esm2015/lib/components/scroll/index.js.map +0 -1
- package/esm2015/lib/components/scroll/scrollable.directive.js +0 -73
- package/esm2015/lib/components/scroll/scrollable.directive.js.map +0 -1
- package/esm2015/lib/components/search-input/search-input.component.js +0 -155
- package/esm2015/lib/components/search-input/search-input.component.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar-container.component.js +0 -26
- package/esm2015/lib/components/snackbar/snackbar-container.component.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar-container.directive.js +0 -83
- package/esm2015/lib/components/snackbar/snackbar-container.directive.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar.component.js +0 -85
- package/esm2015/lib/components/snackbar/snackbar.component.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar.models.js +0 -2
- package/esm2015/lib/components/snackbar/snackbar.models.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar.module.js +0 -26
- package/esm2015/lib/components/snackbar/snackbar.module.js.map +0 -1
- package/esm2015/lib/components/snackbar/snackbar.service.js +0 -23
- package/esm2015/lib/components/snackbar/snackbar.service.js.map +0 -1
- package/esm2015/lib/components/stepper/stepper.component.js +0 -28
- package/esm2015/lib/components/stepper/stepper.component.js.map +0 -1
- package/esm2015/lib/components/table-header-cell/table-header-cell.directive.js +0 -58
- package/esm2015/lib/components/table-header-cell/table-header-cell.directive.js.map +0 -1
- package/esm2015/lib/components/tabs/tab-pane/tab-pane.component.js +0 -35
- package/esm2015/lib/components/tabs/tab-pane/tab-pane.component.js.map +0 -1
- package/esm2015/lib/components/tabs/tabs.component.js +0 -362
- package/esm2015/lib/components/tabs/tabs.component.js.map +0 -1
- package/esm2015/lib/content/content.module.js +0 -24
- package/esm2015/lib/content/content.module.js.map +0 -1
- package/esm2015/lib/content/icon/icon.component.js +0 -23
- package/esm2015/lib/content/icon/icon.component.js.map +0 -1
- package/esm2015/lib/festo-angular.module.js +0 -58
- package/esm2015/lib/festo-angular.module.js.map +0 -1
- package/esm2015/lib/forms/checkbox/checkbox.component.js +0 -156
- package/esm2015/lib/forms/checkbox/checkbox.component.js.map +0 -1
- package/esm2015/lib/forms/color-indicator/color-indicator.component.js +0 -72
- package/esm2015/lib/forms/color-indicator/color-indicator.component.js.map +0 -1
- package/esm2015/lib/forms/color-picker/color-helper.js +0 -121
- package/esm2015/lib/forms/color-picker/color-helper.js.map +0 -1
- package/esm2015/lib/forms/color-picker/color-picker.component.js +0 -280
- package/esm2015/lib/forms/color-picker/color-picker.component.js.map +0 -1
- package/esm2015/lib/forms/container-host.js +0 -27
- package/esm2015/lib/forms/container-host.js.map +0 -1
- package/esm2015/lib/forms/date-picker/date-picker.component.js +0 -205
- package/esm2015/lib/forms/date-picker/date-picker.component.js.map +0 -1
- package/esm2015/lib/forms/date-range-picker/date-range-picker.component.js +0 -230
- package/esm2015/lib/forms/date-range-picker/date-range-picker.component.js.map +0 -1
- package/esm2015/lib/forms/forms.module.js +0 -146
- package/esm2015/lib/forms/forms.module.js.map +0 -1
- package/esm2015/lib/forms/radio/radio.component.js +0 -353
- package/esm2015/lib/forms/radio/radio.component.js.map +0 -1
- package/esm2015/lib/forms/segment/segment-control/segment-control.component.js +0 -58
- package/esm2015/lib/forms/segment/segment-control/segment-control.component.js.map +0 -1
- package/esm2015/lib/forms/segment/segment.component.js +0 -116
- package/esm2015/lib/forms/segment/segment.component.js.map +0 -1
- package/esm2015/lib/forms/select/chip-text.pipe.js +0 -34
- package/esm2015/lib/forms/select/chip-text.pipe.js.map +0 -1
- package/esm2015/lib/forms/select/select-option/select-option.component.js +0 -29
- package/esm2015/lib/forms/select/select-option/select-option.component.js.map +0 -1
- package/esm2015/lib/forms/select/select.component.js +0 -265
- package/esm2015/lib/forms/select/select.component.js.map +0 -1
- package/esm2015/lib/forms/slider/slider.component.js +0 -116
- package/esm2015/lib/forms/slider/slider.component.js.map +0 -1
- package/esm2015/lib/forms/switch/switch.component.js +0 -127
- package/esm2015/lib/forms/switch/switch.component.js.map +0 -1
- package/esm2015/lib/forms/text-area/text-area.component.js +0 -186
- package/esm2015/lib/forms/text-area/text-area.component.js.map +0 -1
- package/esm2015/lib/forms/text-editor/text-editor.component.js +0 -294
- package/esm2015/lib/forms/text-editor/text-editor.component.js.map +0 -1
- package/esm2015/lib/forms/text-input/text-input.component.js +0 -189
- package/esm2015/lib/forms/text-input/text-input.component.js.map +0 -1
- package/esm2015/lib/forms/time-picker/time-picker-dropdown/time-picker-dropdown.component.js +0 -103
- package/esm2015/lib/forms/time-picker/time-picker-dropdown/time-picker-dropdown.component.js.map +0 -1
- package/esm2015/lib/forms/time-picker/time-picker.component.js +0 -194
- package/esm2015/lib/forms/time-picker/time-picker.component.js.map +0 -1
- package/esm2015/lib/forms/unique-selection-dispatcher.js +0 -39
- package/esm2015/lib/forms/unique-selection-dispatcher.js.map +0 -1
- package/esm2015/lib/forms/value-accessor-base.js +0 -41
- package/esm2015/lib/forms/value-accessor-base.js.map +0 -1
- package/esm2015/lib/layout/layout.module.js +0 -18
- package/esm2015/lib/layout/layout.module.js.map +0 -1
- package/esm2015/lib/wrappers/flatpickr/flatpickr.component.js +0 -63
- package/esm2015/lib/wrappers/flatpickr/flatpickr.component.js.map +0 -1
- package/fesm2015/festo-ui-angular.js +0 -5596
- package/fesm2015/festo-ui-angular.js.map +0 -1
- package/lib/components/stepper/stepper.component.d.ts +0 -30
- package/scss/base/components/stepper/stepper.component.scss +0 -118
- package/scss/styles.scss +0 -2056
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
import { Component, Input, forwardRef, ViewChild, ElementRef, ViewEncapsulation } from '@angular/core';
|
|
2
|
-
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
3
|
-
import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
import * as i1 from "@angular/common";
|
|
6
|
-
/**
|
|
7
|
-
* A custom form element for text inputs.
|
|
8
|
-
*/
|
|
9
|
-
export class TextAreaComponent {
|
|
10
|
-
constructor() {
|
|
11
|
-
this.innerReadonly = false;
|
|
12
|
-
this.innerDisabled = false;
|
|
13
|
-
this.innerRequired = false;
|
|
14
|
-
this.innerRows = 3;
|
|
15
|
-
}
|
|
16
|
-
get readonly() {
|
|
17
|
-
return this.innerReadonly;
|
|
18
|
-
}
|
|
19
|
-
set readonly(value) {
|
|
20
|
-
this.innerReadonly = coerceBooleanProperty(value);
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* When true the control's disabled attribute is set
|
|
24
|
-
* and it gets addeed the .disabled css class.
|
|
25
|
-
*/
|
|
26
|
-
get disabled() {
|
|
27
|
-
return this.innerDisabled;
|
|
28
|
-
}
|
|
29
|
-
set disabled(value) {
|
|
30
|
-
this.innerDisabled = coerceBooleanProperty(value);
|
|
31
|
-
if (this.focused) {
|
|
32
|
-
this.focused = false;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
/**
|
|
36
|
-
* The getter for value.
|
|
37
|
-
*/
|
|
38
|
-
get value() {
|
|
39
|
-
return this.innerValue;
|
|
40
|
-
}
|
|
41
|
-
/**
|
|
42
|
-
* The setter for value.
|
|
43
|
-
*/
|
|
44
|
-
set value(value) {
|
|
45
|
-
if (value != null) {
|
|
46
|
-
value = '' + value;
|
|
47
|
-
}
|
|
48
|
-
this.innerValue = value;
|
|
49
|
-
this.focused = !!value;
|
|
50
|
-
if (this.onChange != null) {
|
|
51
|
-
this.onChange(value);
|
|
52
|
-
}
|
|
53
|
-
if (this.onTouched != null) {
|
|
54
|
-
this.onTouched();
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
get required() {
|
|
58
|
-
return this.innerRequired;
|
|
59
|
-
}
|
|
60
|
-
set required(value) {
|
|
61
|
-
this.innerRequired = coerceBooleanProperty(value);
|
|
62
|
-
}
|
|
63
|
-
/**
|
|
64
|
-
* the height is managed by classes. the last one is "fwe-row-10"
|
|
65
|
-
*/
|
|
66
|
-
get rows() {
|
|
67
|
-
return this.innerRows;
|
|
68
|
-
}
|
|
69
|
-
set rows(value) {
|
|
70
|
-
const v = coerceNumberProperty(value);
|
|
71
|
-
this.innerRows = v > 10 ? 10 : v;
|
|
72
|
-
}
|
|
73
|
-
/**
|
|
74
|
-
* Called on component initialisation.
|
|
75
|
-
*/
|
|
76
|
-
ngOnInit() {
|
|
77
|
-
this.onBlur();
|
|
78
|
-
}
|
|
79
|
-
/**
|
|
80
|
-
* Writes the value.
|
|
81
|
-
* @param value The value.
|
|
82
|
-
*/
|
|
83
|
-
writeValue(value) {
|
|
84
|
-
if (value != null) {
|
|
85
|
-
value = '' + value;
|
|
86
|
-
}
|
|
87
|
-
this.innerValue = value;
|
|
88
|
-
this.focused = !!value;
|
|
89
|
-
}
|
|
90
|
-
/**
|
|
91
|
-
* Registers a function to onChange.
|
|
92
|
-
* @param fn The registered function.
|
|
93
|
-
*/
|
|
94
|
-
registerOnChange(fn) {
|
|
95
|
-
this.onChange = fn;
|
|
96
|
-
}
|
|
97
|
-
/**
|
|
98
|
-
* Registers a function to onTouched.
|
|
99
|
-
* @param fn The registered function.
|
|
100
|
-
*/
|
|
101
|
-
registerOnTouched(fn) {
|
|
102
|
-
this.onTouched = fn;
|
|
103
|
-
}
|
|
104
|
-
/**
|
|
105
|
-
* Called when the text input is in focus.
|
|
106
|
-
*/
|
|
107
|
-
onFocus() {
|
|
108
|
-
this.focused = true;
|
|
109
|
-
}
|
|
110
|
-
onInput(event) {
|
|
111
|
-
this.value = event.target.value;
|
|
112
|
-
// The height is adjusted to the content on "rows = 0"
|
|
113
|
-
if (this.rows === 0) {
|
|
114
|
-
const textarea = this.inputElement.nativeElement;
|
|
115
|
-
textarea.style.height = '1px'; // trigger calculation of the textarea.scrollHeight
|
|
116
|
-
textarea.style.height = 25 + textarea.scrollHeight + 'px';
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
/**
|
|
120
|
-
* Called when the text input blurs.
|
|
121
|
-
*/
|
|
122
|
-
onBlur() {
|
|
123
|
-
if (this.focused) {
|
|
124
|
-
this.focused = false;
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
/**
|
|
128
|
-
* Sets the disabled state.
|
|
129
|
-
* @param isDisabled When true the control is disabled
|
|
130
|
-
*/
|
|
131
|
-
setDisabledState(isDisabled) {
|
|
132
|
-
this.disabled = isDisabled;
|
|
133
|
-
}
|
|
134
|
-
}
|
|
135
|
-
TextAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.0", ngImport: i0, type: TextAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
136
|
-
TextAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.0", type: TextAreaComponent, selector: "fng-text-area", inputs: { label: "label", readonly: "readonly", placeholder: "placeholder", tabindex: "tabindex", name: "name", disabled: "disabled", value: "value", required: "required", error: "error", hint: "hint", rows: "rows", maxlength: "maxlength" }, providers: [
|
|
137
|
-
{
|
|
138
|
-
provide: NG_VALUE_ACCESSOR,
|
|
139
|
-
useExisting: forwardRef(() => TextAreaComponent),
|
|
140
|
-
multi: true
|
|
141
|
-
}
|
|
142
|
-
], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<label class=\"fwe-input-text\">\n <textarea #inputElement\n [class]=\"'fwe-row-' + rows\"\n [disabled]=\"disabled\"\n [required]=\"required === true || null\"\n [attr.readonly]=\"readonly === true || null\"\n [attr.placeholder]=\"placeholder || null\"\n [attr.name]=\"name || null\"\n [attr.tabindex]=\"tabindex\"\n [class.fng-has-value]=\"value != null && value !== ''\"\n autocomplete=\"off\"\n (focus)=\"onFocus()\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\">{{value}}</textarea>\n <span class=\"fwe-input-text-label\">{{label}}</span>\n <span *ngIf=\"hint\" class=\"fwe-input-text-info\">{{hint}}</span>\n <span *ngIf=\"error\" class=\"fwe-input-text-invalid\">{{error}}</span>\n <span *ngIf=\"maxlength > 0 && value != null\" class=\"fwe-input-text-count\">{{value.length}} / {{maxlength}}</span>\n</label>\n\n\n", styles: ["fng-text-area.ng-invalid label.fwe-input-text textarea{border-bottom:1px solid var(--fwe-red)!important;box-shadow:none;outline:none}fng-text-area.ng-invalid label.fwe-input-text textarea:focus{border-bottom:1px solid var(--fwe-red)!important}fng-text-area.ng-invalid label.fwe-input-text textarea:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-area.ng-invalid label.fwe-input-text textarea:disabled~.fwe-input-text-label,fng-text-area.ng-invalid label.fwe-input-text textarea:disabled~.fwe-input-text-invalid,fng-text-area.ng-invalid label.fwe-input-text textarea:disabled~.fwe-input-text-info{color:var(--fwe-text-disabled)}fng-text-area.ng-invalid label.fwe-input-text .fwe-input-text-info{display:none!important}fng-text-area.ng-invalid label.fwe-input-text .fwe-input-text-invalid{display:block!important}label.fwe-input-text .fwe-input-text-count{display:block;line-height:1.5;position:absolute;right:0px;bottom:0px;color:var(--fwe-text-disabled);font-size:12px}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
143
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.0", ngImport: i0, type: TextAreaComponent, decorators: [{
|
|
144
|
-
type: Component,
|
|
145
|
-
args: [{
|
|
146
|
-
selector: 'fng-text-area',
|
|
147
|
-
templateUrl: './text-area.component.html',
|
|
148
|
-
styleUrls: ['./text-area.component.scss'],
|
|
149
|
-
providers: [
|
|
150
|
-
{
|
|
151
|
-
provide: NG_VALUE_ACCESSOR,
|
|
152
|
-
useExisting: forwardRef(() => TextAreaComponent),
|
|
153
|
-
multi: true
|
|
154
|
-
}
|
|
155
|
-
],
|
|
156
|
-
encapsulation: ViewEncapsulation.None
|
|
157
|
-
}]
|
|
158
|
-
}], propDecorators: { label: [{
|
|
159
|
-
type: Input
|
|
160
|
-
}], readonly: [{
|
|
161
|
-
type: Input
|
|
162
|
-
}], placeholder: [{
|
|
163
|
-
type: Input
|
|
164
|
-
}], tabindex: [{
|
|
165
|
-
type: Input
|
|
166
|
-
}], name: [{
|
|
167
|
-
type: Input
|
|
168
|
-
}], disabled: [{
|
|
169
|
-
type: Input
|
|
170
|
-
}], value: [{
|
|
171
|
-
type: Input
|
|
172
|
-
}], required: [{
|
|
173
|
-
type: Input
|
|
174
|
-
}], error: [{
|
|
175
|
-
type: Input
|
|
176
|
-
}], hint: [{
|
|
177
|
-
type: Input
|
|
178
|
-
}], rows: [{
|
|
179
|
-
type: Input
|
|
180
|
-
}], maxlength: [{
|
|
181
|
-
type: Input
|
|
182
|
-
}], inputElement: [{
|
|
183
|
-
type: ViewChild,
|
|
184
|
-
args: ['inputElement']
|
|
185
|
-
}] } });
|
|
186
|
-
//# sourceMappingURL=text-area.component.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"text-area.component.js","sourceRoot":"","sources":["../../../../../../../libs/angular/src/lib/forms/text-area/text-area.component.ts","../../../../../../../libs/angular/src/lib/forms/text-area/text-area.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAU,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAC/G,OAAO,EAAwB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;;;AAEpF;;GAEG;AAcH,MAAM,OAAO,iBAAiB;IAb9B;QA0BU,kBAAa,GAAG,KAAK,CAAC;QAqBpB,kBAAa,GAAG,KAAK,CAAC;QAuCtB,kBAAa,GAAG,KAAK,CAAC;QAuBtB,cAAS,GAAG,CAAC,CAAC;KA0FzB;IApLC,IACI,QAAQ;QACV,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IACD,IAAI,QAAQ,CAAC,KAAc;QACzB,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAOD;;;OAGG;IACH,IACI,QAAQ;QACV,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IACD,IAAI,QAAQ,CAAC,KAAc;QACzB,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;QAElD,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;SACtB;IACH,CAAC;IAQD;;OAEG;IACH,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,UAAU,CAAC;IACzB,CAAC;IAED;;OAEG;IACH,IACI,KAAK,CAAC,KAAa;QACrB,IAAI,KAAK,IAAI,IAAI,EAAE;YACjB,KAAK,GAAG,EAAE,GAAG,KAAK,CAAC;SACpB;QACD,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,KAAK,CAAC;QACvB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;SACtB;QACD,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,EAAE;YAC1B,IAAI,CAAC,SAAS,EAAE,CAAC;SAClB;IACH,CAAC;IAED,IACI,QAAQ;QACV,OAAO,IAAI,CAAC,aAAa,CAAC;IAC5B,CAAC;IACD,IAAI,QAAQ,CAAC,KAAc;QACzB,IAAI,CAAC,aAAa,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;IACpD,CAAC;IAaD;;OAEG;IACH,IACI,IAAI;QACN,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IACD,IAAI,IAAI,CAAC,KAAa;QACpB,MAAM,CAAC,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;QACtC,IAAI,CAAC,SAAS,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IACnC,CAAC;IAsBD;;OAEG;IACH,QAAQ;QACN,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED;;;OAGG;IACH,UAAU,CAAC,KAAa;QACtB,IAAI,KAAK,IAAI,IAAI,EAAE;YACjB,KAAK,GAAG,EAAE,GAAG,KAAK,CAAC;SACpB;QACD,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,KAAK,CAAC;IACzB,CAAC;IAED;;;OAGG;IACH,gBAAgB,CAAC,EAAO;QACtB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;IACrB,CAAC;IAED;;;OAGG;IACH,iBAAiB,CAAC,EAAO;QACvB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;IACtB,CAAC;IAED;;OAEG;IACH,OAAO;QACL,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACtB,CAAC;IAED,OAAO,CAAC,KAAU;QAChB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAEhC,sDAAsD;QACtD,IAAI,IAAI,CAAC,IAAI,KAAK,CAAC,EAAE;YACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC;YACjD,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,mDAAmD;YAClF,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,GAAG,QAAQ,CAAC,YAAY,GAAG,IAAI,CAAC;SAC3D;IACH,CAAC;IAED;;OAEG;IACH,MAAM;QACJ,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;SACtB;IACH,CAAC;IAED;;;OAGG;IACH,gBAAgB,CAAC,UAAmB;QAClC,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;IAC7B,CAAC;;8GAzLU,iBAAiB;kGAAjB,iBAAiB,0RATjB;QACT;YACE,OAAO,EAAE,iBAAiB;YAC1B,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,iBAAiB,CAAC;YAChD,KAAK,EAAE,IAAI;SACZ;KACF,wICjBH,k6BAqBA;2FDDa,iBAAiB;kBAb7B,SAAS;mBAAC;oBACT,QAAQ,EAAE,eAAe;oBACzB,WAAW,EAAE,4BAA4B;oBACzC,SAAS,EAAE,CAAC,4BAA4B,CAAC;oBACzC,SAAS,EAAE;wBACT;4BACE,OAAO,EAAE,iBAAiB;4BAC1B,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,kBAAkB,CAAC;4BAChD,KAAK,EAAE,IAAI;yBACZ;qBACF;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;iBACtC;8BAKU,KAAK;sBAAb,KAAK;gBAGF,QAAQ;sBADX,KAAK;gBASG,WAAW;sBAAnB,KAAK;gBACG,QAAQ;sBAAhB,KAAK;gBACG,IAAI;sBAAZ,KAAK;gBAOF,QAAQ;sBADX,KAAK;gBA6BF,KAAK;sBADR,KAAK;gBAgBF,QAAQ;sBADX,KAAK;gBAYG,KAAK;sBAAb,KAAK;gBAKG,IAAI;sBAAZ,KAAK;gBAMF,IAAI;sBADP,KAAK;gBAUG,SAAS;sBAAjB,KAAK;gBAEqB,YAAY;sBAAtC,SAAS;uBAAC,cAAc","sourcesContent":["import { Component, OnInit, Input, forwardRef, ViewChild, ElementRef, ViewEncapsulation } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';\n\n/**\n * A custom form element for text inputs.\n */\n@Component({\n selector: 'fng-text-area',\n templateUrl: './text-area.component.html',\n styleUrls: ['./text-area.component.scss'],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => TextAreaComponent),\n multi: true\n }\n ],\n encapsulation: ViewEncapsulation.None\n})\nexport class TextAreaComponent implements OnInit, ControlValueAccessor {\n /**\n * The text input label.\n */\n @Input() label: string;\n\n @Input()\n get readonly(): boolean {\n return this.innerReadonly;\n }\n set readonly(value: boolean) {\n this.innerReadonly = coerceBooleanProperty(value);\n }\n private innerReadonly = false;\n\n @Input() placeholder: string;\n @Input() tabindex: number;\n @Input() name: string;\n\n /**\n * When true the control's disabled attribute is set\n * and it gets addeed the .disabled css class.\n */\n @Input()\n get disabled(): boolean {\n return this.innerDisabled;\n }\n set disabled(value: boolean) {\n this.innerDisabled = coerceBooleanProperty(value);\n\n if (this.focused) {\n this.focused = false;\n }\n }\n protected innerDisabled = false;\n\n /**\n * The inner value.\n */\n innerValue: string;\n\n /**\n * The getter for value.\n */\n get value(): string {\n return this.innerValue;\n }\n\n /**\n * The setter for value.\n */\n @Input()\n set value(value: string) {\n if (value != null) {\n value = '' + value;\n }\n this.innerValue = value;\n this.focused = !!value;\n if (this.onChange != null) {\n this.onChange(value);\n }\n if (this.onTouched != null) {\n this.onTouched();\n }\n }\n\n @Input()\n get required(): boolean {\n return this.innerRequired;\n }\n set required(value: boolean) {\n this.innerRequired = coerceBooleanProperty(value);\n }\n protected innerRequired = false;\n\n /**\n * Error description when invalid.\n */\n @Input() error: string;\n\n /**\n * Hint description when valid.\n */\n @Input() hint: string;\n\n /**\n * the height is managed by classes. the last one is \"fwe-row-10\"\n */\n @Input()\n get rows(): number {\n return this.innerRows;\n }\n set rows(value: number) {\n const v = coerceNumberProperty(value);\n this.innerRows = v > 10 ? 10 : v;\n }\n protected innerRows = 3;\n\n @Input() maxlength: number;\n\n @ViewChild('inputElement') inputElement: ElementRef;\n\n /**\n * When true the text input has focus.\n */\n focused: boolean;\n\n /**\n * Triggered on change.\n */\n onChange: (value: string) => void;\n\n /**\n * Triggered on touch.\n */\n onTouched: () => void;\n\n /**\n * Called on component initialisation.\n */\n ngOnInit(): void {\n this.onBlur();\n }\n\n /**\n * Writes the value.\n * @param value The value.\n */\n writeValue(value: string): void {\n if (value != null) {\n value = '' + value;\n }\n this.innerValue = value;\n this.focused = !!value;\n }\n\n /**\n * Registers a function to onChange.\n * @param fn The registered function.\n */\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n /**\n * Registers a function to onTouched.\n * @param fn The registered function.\n */\n registerOnTouched(fn: any): void {\n this.onTouched = fn;\n }\n\n /**\n * Called when the text input is in focus.\n */\n onFocus() {\n this.focused = true;\n }\n\n onInput(event: any) {\n this.value = event.target.value;\n\n // The height is adjusted to the content on \"rows = 0\"\n if (this.rows === 0) {\n const textarea = this.inputElement.nativeElement;\n textarea.style.height = '1px'; // trigger calculation of the textarea.scrollHeight\n textarea.style.height = 25 + textarea.scrollHeight + 'px';\n }\n }\n\n /**\n * Called when the text input blurs.\n */\n onBlur() {\n if (this.focused) {\n this.focused = false;\n }\n }\n\n /**\n * Sets the disabled state.\n * @param isDisabled When true the control is disabled\n */\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n }\n}\n","<label class=\"fwe-input-text\">\n <textarea #inputElement\n [class]=\"'fwe-row-' + rows\"\n [disabled]=\"disabled\"\n [required]=\"required === true || null\"\n [attr.readonly]=\"readonly === true || null\"\n [attr.placeholder]=\"placeholder || null\"\n [attr.name]=\"name || null\"\n [attr.tabindex]=\"tabindex\"\n [class.fng-has-value]=\"value != null && value !== ''\"\n autocomplete=\"off\"\n (focus)=\"onFocus()\"\n (input)=\"onInput($event)\"\n (blur)=\"onBlur()\">{{value}}</textarea>\n <span class=\"fwe-input-text-label\">{{label}}</span>\n <span *ngIf=\"hint\" class=\"fwe-input-text-info\">{{hint}}</span>\n <span *ngIf=\"error\" class=\"fwe-input-text-invalid\">{{error}}</span>\n <span *ngIf=\"maxlength > 0 && value != null\" class=\"fwe-input-text-count\">{{value.length}} / {{maxlength}}</span>\n</label>\n\n\n"]}
|
|
@@ -1,294 +0,0 @@
|
|
|
1
|
-
import { Component, ViewEncapsulation, Input, SecurityContext, ElementRef, Renderer2, EventEmitter, Output, forwardRef, ViewChild } from '@angular/core';
|
|
2
|
-
import QuillType from 'quill';
|
|
3
|
-
import { DomSanitizer } from '@angular/platform-browser';
|
|
4
|
-
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
5
|
-
import { ValueAccessorBaseDirective } from '../value-accessor-base';
|
|
6
|
-
import * as i0 from "@angular/core";
|
|
7
|
-
import * as i1 from "@angular/platform-browser";
|
|
8
|
-
import * as i2 from "@angular/forms";
|
|
9
|
-
import * as i3 from "@angular/common";
|
|
10
|
-
export class TextEditorComponent extends ValueAccessorBaseDirective {
|
|
11
|
-
constructor(elementRef, renderer, domSanitizer) {
|
|
12
|
-
super();
|
|
13
|
-
this.elementRef = elementRef;
|
|
14
|
-
this.renderer = renderer;
|
|
15
|
-
this.domSanitizer = domSanitizer;
|
|
16
|
-
this.defaultConfig = {
|
|
17
|
-
toolbar: {
|
|
18
|
-
bold: true,
|
|
19
|
-
italic: true,
|
|
20
|
-
underline: true,
|
|
21
|
-
alignCenter: true,
|
|
22
|
-
alignRight: true,
|
|
23
|
-
bulletList: true,
|
|
24
|
-
orderedList: true,
|
|
25
|
-
image: true,
|
|
26
|
-
link: true
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
this.fngChange = new EventEmitter();
|
|
30
|
-
this.change = new EventEmitter();
|
|
31
|
-
this.config = this.defaultConfig;
|
|
32
|
-
// needed to access editor content
|
|
33
|
-
this.valueGetter = (editorElement) => {
|
|
34
|
-
let html = editorElement.querySelector('.ql-editor').innerHTML;
|
|
35
|
-
if (html === '<p><br></p>' || html === '<div><br></div>') {
|
|
36
|
-
html = null;
|
|
37
|
-
}
|
|
38
|
-
return html;
|
|
39
|
-
};
|
|
40
|
-
// needed to access editor content
|
|
41
|
-
this.valueSetter = (quillEditor, value) => {
|
|
42
|
-
value = this.domSanitizer.sanitize(SecurityContext.HTML, value);
|
|
43
|
-
value = this.handleWhitespace(value);
|
|
44
|
-
return quillEditor.clipboard.convert(value);
|
|
45
|
-
};
|
|
46
|
-
}
|
|
47
|
-
set value(value) {
|
|
48
|
-
if (this.innerValue !== value) {
|
|
49
|
-
this.innerValue = value;
|
|
50
|
-
this.changed.forEach(f => {
|
|
51
|
-
this.fngChange.emit(this.innerValue);
|
|
52
|
-
this.change.emit(this.innerValue);
|
|
53
|
-
return f(value);
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
get value() {
|
|
58
|
-
return this.innerValue;
|
|
59
|
-
}
|
|
60
|
-
ngOnInit() {
|
|
61
|
-
this.id = (Math.random() * Date.now()).toString().replace('.', '-');
|
|
62
|
-
}
|
|
63
|
-
ngAfterViewInit() {
|
|
64
|
-
this.editorElem = this.elementRef.nativeElement.querySelector(`#editor-${this.id}`);
|
|
65
|
-
this.quillEditor = new QuillType(this.editorElem, {
|
|
66
|
-
modules: Object.assign({ toolbar: `#editor-toolbar-${this.id}` }, this.modules),
|
|
67
|
-
theme: 'snow',
|
|
68
|
-
scrollingContainer: `#editor-container-${this.id}`
|
|
69
|
-
});
|
|
70
|
-
this.setEditorLabel();
|
|
71
|
-
this.addWhitespaceMatcher();
|
|
72
|
-
this.addImageMatcher();
|
|
73
|
-
if (this.innerValue) {
|
|
74
|
-
const content = this.valueSetter(this.quillEditor, this.innerValue);
|
|
75
|
-
this.quillEditor.setContents(content, 'silent');
|
|
76
|
-
this.quillEditor.getModule('history').clear();
|
|
77
|
-
}
|
|
78
|
-
this.handle();
|
|
79
|
-
this.quillEditor.on('text-change', () => {
|
|
80
|
-
this.value = this.valueGetter(this.editorElem);
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
ngOnChanges(changes) {
|
|
84
|
-
var _a, _b;
|
|
85
|
-
if (((_a = changes === null || changes === void 0 ? void 0 : changes.config) === null || _a === void 0 ? void 0 : _a.currentValue) != null) {
|
|
86
|
-
this.config = { toolbar: Object.assign(Object.assign({}, this.defaultConfig.toolbar), (_b = changes.config.currentValue) === null || _b === void 0 ? void 0 : _b.toolbar) };
|
|
87
|
-
}
|
|
88
|
-
if (!this.quillEditor) {
|
|
89
|
-
return;
|
|
90
|
-
}
|
|
91
|
-
this.handle();
|
|
92
|
-
}
|
|
93
|
-
writeValue(value) {
|
|
94
|
-
if (value === null || value === '') {
|
|
95
|
-
return;
|
|
96
|
-
}
|
|
97
|
-
this.innerValue = value;
|
|
98
|
-
if (!this.quillEditor) {
|
|
99
|
-
return;
|
|
100
|
-
}
|
|
101
|
-
const content = this.valueSetter(this.quillEditor, value);
|
|
102
|
-
this.quillEditor.setContents(content);
|
|
103
|
-
}
|
|
104
|
-
setDisabledState(isDisabled = this.disabled) {
|
|
105
|
-
this.disabled = isDisabled;
|
|
106
|
-
if (this.quillEditor) {
|
|
107
|
-
if (isDisabled) {
|
|
108
|
-
this.quillEditor.disable();
|
|
109
|
-
this.renderer.setAttribute(this.elementRef.nativeElement, 'disabled', 'disabled');
|
|
110
|
-
}
|
|
111
|
-
else {
|
|
112
|
-
if (!this.readOnly) {
|
|
113
|
-
this.quillEditor.enable();
|
|
114
|
-
}
|
|
115
|
-
this.renderer.removeAttribute(this.elementRef.nativeElement, 'disabled');
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
setReadOnlyState() {
|
|
120
|
-
this.quillEditor.enable(!this.readOnly);
|
|
121
|
-
}
|
|
122
|
-
delegate(event, action) {
|
|
123
|
-
let btn = null;
|
|
124
|
-
switch (action) {
|
|
125
|
-
case 'bold':
|
|
126
|
-
btn = this.btnBold.nativeElement;
|
|
127
|
-
btn.click();
|
|
128
|
-
break;
|
|
129
|
-
case 'italic':
|
|
130
|
-
btn = this.btnItalic.nativeElement;
|
|
131
|
-
btn.click();
|
|
132
|
-
break;
|
|
133
|
-
case 'underline':
|
|
134
|
-
btn = this.btnUnderline.nativeElement;
|
|
135
|
-
btn.click();
|
|
136
|
-
break;
|
|
137
|
-
case 'align-center':
|
|
138
|
-
btn = this.btnAlignCenter.nativeElement;
|
|
139
|
-
btn.click();
|
|
140
|
-
break;
|
|
141
|
-
case 'align-right':
|
|
142
|
-
btn = this.btnAlignRight.nativeElement;
|
|
143
|
-
btn.click();
|
|
144
|
-
break;
|
|
145
|
-
case 'link':
|
|
146
|
-
btn = this.btnLink.nativeElement;
|
|
147
|
-
btn.click();
|
|
148
|
-
break;
|
|
149
|
-
case 'ul':
|
|
150
|
-
btn = this.btnUl.nativeElement;
|
|
151
|
-
btn.click();
|
|
152
|
-
break;
|
|
153
|
-
case 'ol':
|
|
154
|
-
btn = this.btnOl.nativeElement;
|
|
155
|
-
btn.click();
|
|
156
|
-
break;
|
|
157
|
-
case 'image':
|
|
158
|
-
btn = this.btnImage.nativeElement;
|
|
159
|
-
btn.click();
|
|
160
|
-
break;
|
|
161
|
-
default:
|
|
162
|
-
break;
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
currentLength() {
|
|
166
|
-
var _a;
|
|
167
|
-
return (_a = this.value) === null || _a === void 0 ? void 0 : _a.length;
|
|
168
|
-
}
|
|
169
|
-
hideDivider(name) {
|
|
170
|
-
const linkOrImage = this.config.toolbar.image || this.config.toolbar.link;
|
|
171
|
-
const lists = this.config.toolbar.bulletList || this.config.toolbar.orderedList;
|
|
172
|
-
const typos = this.config.toolbar.bold || this.config.toolbar.italic || this.config.toolbar.underline;
|
|
173
|
-
const textAlign = this.config.toolbar.alignCenter || this.config.toolbar.alignRight;
|
|
174
|
-
switch (name) {
|
|
175
|
-
case 'typo':
|
|
176
|
-
return !typos || (!textAlign && !linkOrImage && !lists);
|
|
177
|
-
case 'text-align':
|
|
178
|
-
return !textAlign || (!linkOrImage && !lists);
|
|
179
|
-
case 'lists':
|
|
180
|
-
return !lists || !linkOrImage;
|
|
181
|
-
case 'image':
|
|
182
|
-
return !this.config.toolbar.image || !this.config.toolbar.link;
|
|
183
|
-
default:
|
|
184
|
-
break;
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
setEditorLabel() {
|
|
188
|
-
const editorDiv = this.elementRef.nativeElement.querySelector('.ql-editor');
|
|
189
|
-
this.renderer.setAttribute(editorDiv, 'role', 'textbox');
|
|
190
|
-
this.renderer.setAttribute(editorDiv, 'aria-labelledby', `editor-label-${this.id}`);
|
|
191
|
-
this.renderer.setAttribute(editorDiv, 'aria-multiline', 'true');
|
|
192
|
-
}
|
|
193
|
-
handle() {
|
|
194
|
-
this.setReadOnlyState();
|
|
195
|
-
this.setDisabledState();
|
|
196
|
-
}
|
|
197
|
-
addWhitespaceMatcher() {
|
|
198
|
-
// set up a matcher that replaces placeholder ###tab### with \t in delta again
|
|
199
|
-
this.quillEditor.clipboard.addMatcher('p', (_node, delta) => {
|
|
200
|
-
let str = JSON.stringify(delta);
|
|
201
|
-
str = str.replace(/###tab###/g, '\\t');
|
|
202
|
-
delta = JSON.parse(str);
|
|
203
|
-
return delta;
|
|
204
|
-
});
|
|
205
|
-
}
|
|
206
|
-
addImageMatcher() {
|
|
207
|
-
// set up a matcher that does allow/disallow to paste images corresponding to config settings
|
|
208
|
-
this.quillEditor.clipboard.addMatcher('img', (_node, delta) => {
|
|
209
|
-
// allowed, passthru delta
|
|
210
|
-
if (this.config.toolbar.image === true) {
|
|
211
|
-
return delta;
|
|
212
|
-
}
|
|
213
|
-
// not allowed, remove image by setting up a new delta
|
|
214
|
-
const Delta = QuillType.import('quill-delta');
|
|
215
|
-
return new Delta().insert('');
|
|
216
|
-
});
|
|
217
|
-
}
|
|
218
|
-
handleWhitespace(value) {
|
|
219
|
-
// set a placeholder for tab entity to avoid that quill removes it
|
|
220
|
-
return value.replace(/	/gi, '###tab###');
|
|
221
|
-
}
|
|
222
|
-
}
|
|
223
|
-
TextEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.0", ngImport: i0, type: TextEditorComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
224
|
-
TextEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.0", type: TextEditorComponent, selector: "fng-text-editor", inputs: { config: "config", modules: "modules", label: "label", readOnly: "readOnly", maxLength: "maxLength", error: "error", hint: "hint", value: "value" }, outputs: { fngChange: "fngChange", change: "change" }, providers: [
|
|
225
|
-
{
|
|
226
|
-
provide: NG_VALUE_ACCESSOR,
|
|
227
|
-
useExisting: forwardRef(() => TextEditorComponent),
|
|
228
|
-
multi: true
|
|
229
|
-
}
|
|
230
|
-
], viewQueries: [{ propertyName: "btnBold", first: true, predicate: ["btnBold"], descendants: true }, { propertyName: "btnItalic", first: true, predicate: ["btnItalic"], descendants: true }, { propertyName: "btnUnderline", first: true, predicate: ["btnUnderline"], descendants: true }, { propertyName: "btnAlignCenter", first: true, predicate: ["btnAlignCenter"], descendants: true }, { propertyName: "btnAlignRight", first: true, predicate: ["btnAlignRight"], descendants: true }, { propertyName: "btnLink", first: true, predicate: ["btnLink"], descendants: true }, { propertyName: "btnUl", first: true, predicate: ["btnUl"], descendants: true }, { propertyName: "btnOl", first: true, predicate: ["btnOl"], descendants: true }, { propertyName: "btnImage", first: true, predicate: ["btnImage"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label class=\"fwe-input-text\" [class.fwe-disabled]=\"disabled\">\n <div class=\"fng-editor-toolbar\" [id]=\"'editor-toolbar-' + id\">\n <span class=\"ql-formats fwe-d-none\">\n <select class=\"ql-size\" aria-hidden=\"true\">\n <option value=\"small\"></option>\n <option selected></option>\n <option value=\"large\"></option>\n <option value=\"huge\"></option>\n </select>\n </span>\n <span class=\"ql-formats fng-editor-toolbar-buttons-container fwe-mr-3\">\n <ng-container *ngIf=\"config?.toolbar?.bold\">\n <button type=\"button\" #btnBold class=\"ql-bold fwe-d-none action-bold\" aria-hidden=\"true\"></button>\n <button\n type=\"button\"\n class=\"fwe-btn fng-button\"\n [class.fwe-mr-3]=\"config?.toolbar?.underline || config?.toolbar?.italic\"\n (click)=\"delegate($event, 'bold')\"\n [disabled]=\"disabled\"\n >\n <div class=\"fng-button-text fng-text-bold\">B</div>\n </button>\n </ng-container>\n <ng-container *ngIf=\"config?.toolbar?.italic\">\n <button type=\"button\" #btnItalic class=\"ql-italic fwe-d-none action-italic\" aria-hidden=\"true\"></button>\n <button\n type=\"button\"\n class=\"fwe-btn fng-button\"\n [class.fwe-mr-3]=\"config?.toolbar?.underline\"\n (click)=\"delegate($event, 'italic')\"\n [disabled]=\"disabled\"\n >\n <div class=\"fng-button-text fng-text-italic\">I</div>\n </button>\n </ng-container>\n <ng-container *ngIf=\"config?.toolbar?.underline\">\n <button type=\"button\" #btnUnderline class=\"ql-underline fwe-d-none action-underline\" aria-hidden=\"true\"></button>\n <button type=\"button\" class=\"fwe-btn fng-button\" (click)=\"delegate($event, 'underline')\" [disabled]=\"disabled\">\n <div class=\"fng-button-text fng-text-underline\">U</div>\n </button>\n </ng-container>\n\n <div *ngIf=\"!hideDivider('typo')\" class=\"fng-divider-y fwe-mx-4\"></div>\n\n <ng-container *ngIf=\"config?.toolbar?.alignCenter\">\n <button\n type=\"button\"\n #btnAlignCenter\n class=\"ql-align fwe-d-none action-align-center\"\n aria-hidden=\"true\"\n value=\"center\"\n ></button>\n <button\n type=\"button\"\n class=\"fwe-btn fng-btn-toolbar-list fng-button\"\n [class.fwe-mr-3]=\"config?.toolbar?.alignRight\"\n (click)=\"delegate($event, 'align-center')\"\n [disabled]=\"disabled\"\n >\n <i class=\"fwe-icon fwe-icon-toolbar-list fng-icon-text-align-center fwe-pr-0\" [class.fng-gray]=\"disabled\"></i>\n </button>\n </ng-container>\n\n <ng-container *ngIf=\"config?.toolbar?.alignRight\">\n <button type=\"button\" #btnAlignRight class=\"ql-align fwe-d-none action-align-right\" aria-hidden=\"true\" value=\"right\"></button>\n <button\n type=\"button\"\n class=\"fwe-btn fng-btn-toolbar-list fng-button\"\n (click)=\"delegate($event, 'align-right')\"\n [disabled]=\"disabled\"\n >\n <i class=\"fwe-icon fwe-icon-toolbar-list fng-icon-text-align-right fwe-pr-0\" [class.fng-gray]=\"disabled\"></i>\n </button>\n </ng-container>\n\n <div *ngIf=\"!hideDivider('text-align')\" class=\"fng-divider-y fwe-mx-4\"></div>\n\n <ng-container *ngIf=\"config?.toolbar?.bulletList\">\n <button type=\"button\" #btnUl class=\"ql-list fwe-d-none action-ul\" aria-hidden=\"true\" value=\"bullet\"></button>\n <button\n type=\"button\"\n class=\"fwe-btn fng-btn-toolbar-list fng-button\"\n [class.fwe-mr-3]=\"config?.toolbar?.orderedList\"\n (click)=\"delegate($event, 'ul')\"\n [disabled]=\"disabled\"\n >\n <i class=\"fwe-icon fwe-icon-toolbar-list fwe-icon-list-list-view fwe-pr-0\"></i>\n </button>\n </ng-container>\n <ng-container *ngIf=\"config?.toolbar?.orderedList\">\n <button type=\"button\" #btnOl class=\"ql-list fwe-d-none action-ol\" aria-hidden=\"true\" value=\"ordered\"></button>\n <button type=\"button\" class=\"fwe-btn fng-btn-toolbar-list fng-button\" (click)=\"delegate($event, 'ol')\" [disabled]=\"disabled\">\n <i class=\"fwe-icon fwe-icon-toolbar-list fwe-icon-enumeration fwe-pr-0\"></i>\n </button>\n </ng-container>\n\n <div *ngIf=\"!hideDivider('lists')\" class=\"fng-divider-y fwe-mx-4\"></div>\n\n <ng-container *ngIf=\"config?.toolbar?.image\">\n <button type=\"button\" class=\"fwe-btn fng-btn-toolbar-list fng-button\" (click)=\"delegate($event, 'image')\" [disabled]=\"disabled\">\n <i class=\"fwe-icon fwe-icon-toolbar-list fwe-icon-image-image fwe-pr-0\"></i>\n </button>\n <button type=\"button\" #btnImage class=\"ql-image fwe-d-none\" aria-hidden=\"true\"></button>\n </ng-container>\n\n <div *ngIf=\"!hideDivider('image')\" class=\"fng-divider-y fwe-mx-4\"></div>\n\n <ng-container *ngIf=\"config?.toolbar?.link\">\n <button type=\"button\" class=\"fwe-btn fng-btn-toolbar-list fng-button\" (click)=\"delegate($event, 'link')\" [disabled]=\"disabled\">\n <i class=\"fwe-icon fwe-icon-toolbar-list fwe-icon-file-link fwe-pr-0\"></i>\n </button>\n <button type=\"button\" #btnLink class=\"ql-link fwe-d-none\" aria-hidden=\"true\"></button>\n </ng-container>\n </span>\n </div>\n <div class=\"fng-editor-container\" [id]=\"'editor-container-' + id\">\n <div class=\"fng-editor\" [id]=\"'editor-' + id\"></div>\n </div>\n <span class=\"fwe-input-text-label\" [id]=\"'editor-label-' + id\">{{ label }}</span>\n <span *ngIf=\"hint\" class=\"fng-text-editor-info\">{{ hint }}</span>\n <span *ngIf=\"error\" class=\"fng-text-editor-invalid\">{{ error }}</span>\n <span *ngIf=\"maxLength > 0 && value != null\" class=\"fwe-input-text-count\">{{ currentLength() }} / {{ maxLength }}</span>\n</label>\n", styles: ["@charset \"UTF-8\";.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}.ql-container.ql-disabled .ql-tooltip{visibility:hidden}.ql-container.ql-disabled .ql-editor ul[data-checked]>li:before{pointer-events:none}.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}.ql-clipboard p{margin:0;padding:0}.ql-editor{box-sizing:border-box;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;-o-tab-size:4;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}.ql-editor>*{cursor:text}.ql-editor p,.ql-editor ol,.ql-editor ul,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0;counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol,.ql-editor ul{padding-left:1.5em}.ql-editor ol>li,.ql-editor ul>li{list-style-type:none}.ql-editor ul>li:before{content:\"\\2022\"}.ql-editor ul[data-checked=true],.ql-editor ul[data-checked=false]{pointer-events:none}.ql-editor ul[data-checked=true]>li *,.ql-editor ul[data-checked=false]>li *{pointer-events:all}.ql-editor ul[data-checked=true]>li:before,.ql-editor ul[data-checked=false]>li:before{color:#777;cursor:pointer;pointer-events:all}.ql-editor ul[data-checked=true]>li:before{content:\"\\2611\"}.ql-editor ul[data-checked=false]>li:before{content:\"\\2610\"}.ql-editor li:before{display:inline-block;white-space:nowrap;width:1.2em}.ql-editor li:not(.ql-direction-rtl):before{margin-left:-1.5em;margin-right:.3em;text-align:right}.ql-editor li.ql-direction-rtl:before{margin-left:.3em;margin-right:-1.5em}.ql-editor ol li:not(.ql-direction-rtl),.ql-editor ul li:not(.ql-direction-rtl){padding-left:1.5em}.ql-editor ol li.ql-direction-rtl,.ql-editor ul li.ql-direction-rtl{padding-right:1.5em}.ql-editor ol li{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;counter-increment:list-0}.ql-editor ol li:before{content:counter(list-0,decimal) \". \"}.ql-editor ol li.ql-indent-1{counter-increment:list-1}.ql-editor ol li.ql-indent-1:before{content:counter(list-1,lower-alpha) \". \"}.ql-editor ol li.ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-2{counter-increment:list-2}.ql-editor ol li.ql-indent-2:before{content:counter(list-2,lower-roman) \". \"}.ql-editor ol li.ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-3{counter-increment:list-3}.ql-editor ol li.ql-indent-3:before{content:counter(list-3,decimal) \". \"}.ql-editor ol li.ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-4{counter-increment:list-4}.ql-editor ol li.ql-indent-4:before{content:counter(list-4,lower-alpha) \". \"}.ql-editor ol li.ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-5{counter-increment:list-5}.ql-editor ol li.ql-indent-5:before{content:counter(list-5,lower-roman) \". \"}.ql-editor ol li.ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}.ql-editor ol li.ql-indent-6{counter-increment:list-6}.ql-editor ol li.ql-indent-6:before{content:counter(list-6,decimal) \". \"}.ql-editor ol li.ql-indent-6{counter-reset:list-7 list-8 list-9}.ql-editor ol li.ql-indent-7{counter-increment:list-7}.ql-editor ol li.ql-indent-7:before{content:counter(list-7,lower-alpha) \". \"}.ql-editor ol li.ql-indent-7{counter-reset:list-8 list-9}.ql-editor ol li.ql-indent-8{counter-increment:list-8}.ql-editor ol li.ql-indent-8:before{content:counter(list-8,lower-roman) \". \"}.ql-editor ol li.ql-indent-8{counter-reset:list-9}.ql-editor ol li.ql-indent-9{counter-increment:list-9}.ql-editor ol li.ql-indent-9:before{content:counter(list-9,decimal) \". \"}.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}.ql-editor .ql-video{display:block;max-width:100%}.ql-editor .ql-video.ql-align-center{margin:0 auto}.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}.ql-editor .ql-bg-black{background-color:#000}.ql-editor .ql-bg-red{background-color:#e60000}.ql-editor .ql-bg-orange{background-color:#f90}.ql-editor .ql-bg-yellow{background-color:#ff0}.ql-editor .ql-bg-green{background-color:#008a00}.ql-editor .ql-bg-blue{background-color:#06c}.ql-editor .ql-bg-purple{background-color:#93f}.ql-editor .ql-color-white{color:#fff}.ql-editor .ql-color-red{color:#e60000}.ql-editor .ql-color-orange{color:#f90}.ql-editor .ql-color-yellow{color:#ff0}.ql-editor .ql-color-green{color:#008a00}.ql-editor .ql-color-blue{color:#06c}.ql-editor .ql-color-purple{color:#93f}.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}.ql-editor .ql-size-small{font-size:.75em}.ql-editor .ql-size-large{font-size:1.5em}.ql-editor .ql-size-huge{font-size:2.5em}.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}.ql-editor .ql-align-center{text-align:center}.ql-editor .ql-align-justify{text-align:justify}.ql-editor .ql-align-right{text-align:right}.ql-editor.ql-blank:before{color:#0009;content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:\"\";display:table}.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media (pointer: coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}.ql-snow{box-sizing:border-box}.ql-snow *{box-sizing:border-box}.ql-snow .ql-hidden{display:none}.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}.ql-snow .ql-formats{display:inline-block;vertical-align:middle}.ql-snow .ql-formats:after{clear:both;content:\"\";display:table}.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}.ql-snow .ql-empty{fill:none}.ql-snow .ql-even{fill-rule:evenodd}.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}.ql-snow .ql-transparent{opacity:.4}.ql-snow .ql-direction svg:last-child{display:none}.ql-snow .ql-direction.ql-active svg:last-child{display:inline}.ql-snow .ql-direction.ql-active svg:first-child{display:none}.ql-snow .ql-editor h1{font-size:2em}.ql-snow .ql-editor h2{font-size:1.5em}.ql-snow .ql-editor h3{font-size:1.17em}.ql-snow .ql-editor h4{font-size:1em}.ql-snow .ql-editor h5{font-size:.83em}.ql-snow .ql-editor h6{font-size:.67em}.ql-snow .ql-editor a{text-decoration:underline}.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}.ql-snow .ql-editor code,.ql-snow .ql-editor pre{background-color:#f0f0f0;border-radius:3px}.ql-snow .ql-editor pre{white-space:pre-wrap;margin-bottom:5px;margin-top:5px;padding:5px 10px}.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}.ql-snow .ql-editor pre.ql-syntax{background-color:#23241f;color:#f8f8f2;overflow:visible}.ql-snow .ql-editor img{max-width:100%}.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}.ql-snow .ql-picker-label:before{display:inline-block;line-height:22px}.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=\"\"]):before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=\"\"]):before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=\"\"]):before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=\"\"]):before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=\"\"]):before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=\"\"]):before{content:attr(data-label)}.ql-snow .ql-picker.ql-header{width:98px}.ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before{content:\"Normal\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{content:\"Heading 1\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{content:\"Heading 2\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{content:\"Heading 3\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{content:\"Heading 4\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{content:\"Heading 5\"}.ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{content:\"Heading 6\"}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{font-size:2em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{font-size:1.5em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{font-size:1.17em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{font-size:1em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{font-size:.83em}.ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{font-size:.67em}.ql-snow .ql-picker.ql-font{width:108px}.ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before{content:\"Sans Serif\"}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:\"Serif\"}.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:\"Monospace\"}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}.ql-snow .ql-picker.ql-size{width:98px}.ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before{content:\"Normal\"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:\"Small\"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:\"Large\"}.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:\"Huge\"}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:\"Helvetica Neue\",\"Helvetica\",\"Arial\",sans-serif;padding:8px}.ql-toolbar.ql-snow .ql-formats{margin-right:15px}.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:#0003 0 2px 8px}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}.ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0px}.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}.ql-snow .ql-tooltip:before{content:\"Visit URL:\";line-height:26px;margin-right:8px}.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}.ql-snow .ql-tooltip a.ql-action:after{border-right:1px solid #ccc;content:\"Edit\";margin-left:16px;padding-right:8px}.ql-snow .ql-tooltip a.ql-remove:before{content:\"Remove\";margin-left:8px}.ql-snow .ql-tooltip a{line-height:26px}.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}.ql-snow .ql-tooltip.ql-editing a.ql-action:after{border-right:0px;content:\"Save\";padding-right:0}.ql-snow .ql-tooltip[data-mode=link]:before{content:\"Enter link:\"}.ql-snow .ql-tooltip[data-mode=formula]:before{content:\"Enter formula:\"}.ql-snow .ql-tooltip[data-mode=video]:before{content:\"Enter video:\"}.ql-snow a{color:#06c}.ql-container.ql-snow{border:1px solid #ccc}fng-text-editor .fng-divider-y{display:inline-flex;flex:0 0 1px;height:24px;width:1px;background-color:var(--fwe-gray-400)}fng-text-editor .fng-editor{min-height:100%}fng-text-editor .fng-editor-container{order:2;height:160px;min-height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--fwe-control-scrollbar) var(--fwe-gray-100);margin-top:8px;padding-bottom:4px;border-bottom:var(--fwe-gray-400) solid 1px}fng-text-editor .fng-editor-container::-webkit-scrollbar{width:12px}fng-text-editor .fng-editor-container::-webkit-scrollbar-track{background:transparent}fng-text-editor .fng-editor-container::-webkit-scrollbar-thumb{overflow:visible;background-color:var(--fwe-control-scrollbar);border:3px solid rgba(242,243,245,0);-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:6px}fng-text-editor .fng-editor-container:hover{border-bottom:var(--fwe-hero) solid 1px}fng-text-editor .fng-editor-container[contenteditable=true]{outline:none}fng-text-editor .fng-editor-container[contenteditable=true]:focus{border-bottom:var(--fwe-hero) solid 1px}fng-text-editor label.fwe-input-text{line-height:24px}fng-text-editor label.fwe-input-text .fwe-input-text-count{display:inline-block;line-height:1.5;position:absolute;right:0;bottom:0;z-index:1;color:var(--fwe-text-disabled);font-size:12px}fng-text-editor label.fwe-input-text .fwe-input-text-label{order:-1}fng-text-editor label.fwe-input-text .fng-text-editor-info{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:1.5;position:absolute;left:0;top:unset;bottom:0;z-index:2;color:var(--fwe-text-disabled);font-size:12px}fng-text-editor label.fwe-input-text.fwe-disabled{color:var(--fwe-text-disabled)}fng-text-editor label.fwe-input-text.fwe-disabled .fwe-input-text-label{color:var(--fwe-text-disabled)}fng-text-editor label.fwe-input-text.fwe-disabled .fng-editor-container{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-editor label.fwe-input-text.fwe-disabled .fng-editor-container:hover{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-editor label.fwe-input-text.fwe-disabled .fng-divider-y{background-color:var(--fwe-text-disabled)}fng-text-editor .fng-text-editor-invalid{display:none;line-height:1.5;position:absolute;left:0;bottom:0;z-index:2;color:var(--fwe-red);font-size:12px}fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor{box-shadow:none;outline:none}fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fwe-input-text-label,fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fng-text-editor-invalid,fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fng-text-editor-info{color:var(--fwe-text-disabled)}fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fwe-input-text-label:after,fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fng-text-editor-invalid:after,fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor:disabled~.fng-text-editor-info:after{color:var(--fwe-text-disabled)}fng-text-editor.ng-dirty.ng-invalid label.fwe-input-text .fng-editor-container{border-bottom:1px solid var(--fwe-red)}fng-text-editor.ng-dirty.ng-invalid .fng-text-editor-info{display:none!important}fng-text-editor.ng-dirty.ng-invalid .fng-text-editor-invalid{display:block!important}fng-text-editor .fng-text-bold{font-weight:700}fng-text-editor .fng-text-italic{font-style:italic}fng-text-editor .fng-text-underline{text-decoration:underline}fng-text-editor .fng-icon-text-align-center{width:12px;height:10px;background:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"10\" fill=\"rgb(51, 51, 51)\" viewBox=\"0 0 12 10\"><path d=\"M2,3H14V5H2Z\" transform=\"translate(-2 -3)\"/><path d=\"M5,7h6V9H5Z\" transform=\"translate(-2 -3)\"/><path d=\"M2,11H14v2H2Z\" transform=\"translate(-2 -3)\"/></svg>')}fng-text-editor .fng-icon-text-align-center.fng-gray{background:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"10\" fill=\"rgb(185, 186, 187)\" viewBox=\"0 0 12 10\"><path d=\"M2,3H14V5H2Z\" transform=\"translate(-2 -3)\"/><path d=\"M5,7h6V9H5Z\" transform=\"translate(-2 -3)\"/><path d=\"M2,11H14v2H2Z\" transform=\"translate(-2 -3)\"/></svg>')}fng-text-editor .fng-icon-text-align-right{width:12px;height:10px;background:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"10\" fill=\"rgb(51, 51, 51)\" viewBox=\"0 0 12 10\"><path d=\"M2,3H14V5H2Z\" transform=\"translate(-2 -3)\"/><path d=\"M8,7h6V9H8Z\" transform=\"translate(-2 -3)\"/><path d=\"M2,11H14v2H2Z\" transform=\"translate(-2 -3)\"/></svg>')}fng-text-editor .fng-icon-text-align-right.fng-gray{background:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"10\" fill=\"rgb(185, 186, 187)\" viewBox=\"0 0 12 10\"><path d=\"M2,3H14V5H2Z\" transform=\"translate(-2 -3)\"/><path d=\"M8,7h6V9H8Z\" transform=\"translate(-2 -3)\"/><path d=\"M2,11H14v2H2Z\" transform=\"translate(-2 -3)\"/></svg>')}fng-text-editor .ql-tooltip{z-index:var(--fwe-z-index-tooltip)}fng-text-editor .ql-editor{font-family:\"MetaPro\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";font-size:16px;padding:0;min-height:72px;overflow-x:hidden}fng-text-editor .ql-editor p::-moz-selection,fng-text-editor .ql-editor strong::-moz-selection,fng-text-editor .ql-editor em::-moz-selection,fng-text-editor .ql-editor u::-moz-selection,fng-text-editor .ql-editor ul::-moz-selection,fng-text-editor .ql-editor ol::-moz-selection,fng-text-editor .ql-editor li::-moz-selection,fng-text-editor .ql-editor a::-moz-selection{background:var(--fwe-icon-hero-light)}fng-text-editor .ql-editor p::selection,fng-text-editor .ql-editor strong::selection,fng-text-editor .ql-editor em::selection,fng-text-editor .ql-editor u::selection,fng-text-editor .ql-editor ul::selection,fng-text-editor .ql-editor ol::selection,fng-text-editor .ql-editor li::selection,fng-text-editor .ql-editor a::selection{background:var(--fwe-icon-hero-light)}fng-text-editor .ql-container.ql-snow{border:0;background-color:var(--fwe-white)}fng-text-editor .ql-container.ql-snow .ql-tooltip{transform:translate(160px,12px);color:var(--fwe-black);box-shadow:-1px 1px 4px -1px #3333;border:1px solid var(--fwe-gray-200)}fng-text-editor .ql-container.ql-snow .ql-tooltip input{border:1px solid var(--fwe-gray-200)}fng-text-editor .ql-container.ql-snow .ql-tooltip input::-moz-selection{background:var(--fwe-icon-hero-light)}fng-text-editor .ql-container.ql-snow .ql-tooltip input::selection{background:var(--fwe-icon-hero-light)}fng-text-editor .ql-container.ql-snow a{color:var(--fwe-caerul)}fng-text-editor .ql-toolbar.ql-snow{border:0;padding:4px 0;border-bottom:1px solid var(--fwe-gray-400)}fng-text-editor .ql-toolbar.ql-snow .ql-formats.fng-editor-toolbar-buttons-container{display:flex;align-items:center;flex-wrap:wrap}fng-text-editor .ql-toolbar.ql-snow button{line-height:normal;box-sizing:border-box;display:inline-flex;text-align:center;padding:0 8px;height:32px;min-height:unset;color:var(--fwe-black);background:none;border-radius:4px;cursor:pointer;border:none;width:unset;max-width:24px;justify-content:center;align-items:center;float:unset}@media (hover: hover) and (pointer: fine){fng-text-editor .ql-toolbar.ql-snow button:hover{background-color:var(--fwe-control-dark);color:var(--fwe-black)}}fng-text-editor .ql-toolbar.ql-snow button:active{background-color:var(--fwe-control-darker)}fng-text-editor .ql-toolbar.ql-snow button.ql-active+button{background-color:var(--fwe-control)}fng-text-editor .ql-toolbar.ql-snow button.fng-btn-toolbar-list{padding:0 6px}fng-text-editor .ql-toolbar.ql-snow button.fng-button i{pointer-events:none}fng-text-editor .ql-toolbar.ql-snow button.fng-button div{pointer-events:none}fng-text-editor .ql-toolbar .fng-button-text{min-width:12px;line-height:16px}fng-text-editor label.fwe-input-text.fwe-disabled .ql-toolbar{pointer-events:none}fng-text-editor label.fwe-input-text.fwe-disabled .ql-toolbar button{color:var(--fwe-text-disabled)}\n"], directives: [{ type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
231
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.0", ngImport: i0, type: TextEditorComponent, decorators: [{
|
|
232
|
-
type: Component,
|
|
233
|
-
args: [{
|
|
234
|
-
selector: 'fng-text-editor',
|
|
235
|
-
templateUrl: './text-editor.component.html',
|
|
236
|
-
styleUrls: ['./text-editor.component.scss'],
|
|
237
|
-
encapsulation: ViewEncapsulation.None,
|
|
238
|
-
providers: [
|
|
239
|
-
{
|
|
240
|
-
provide: NG_VALUE_ACCESSOR,
|
|
241
|
-
useExisting: forwardRef(() => TextEditorComponent),
|
|
242
|
-
multi: true
|
|
243
|
-
}
|
|
244
|
-
]
|
|
245
|
-
}]
|
|
246
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.DomSanitizer }]; }, propDecorators: { btnBold: [{
|
|
247
|
-
type: ViewChild,
|
|
248
|
-
args: ['btnBold']
|
|
249
|
-
}], btnItalic: [{
|
|
250
|
-
type: ViewChild,
|
|
251
|
-
args: ['btnItalic']
|
|
252
|
-
}], btnUnderline: [{
|
|
253
|
-
type: ViewChild,
|
|
254
|
-
args: ['btnUnderline']
|
|
255
|
-
}], btnAlignCenter: [{
|
|
256
|
-
type: ViewChild,
|
|
257
|
-
args: ['btnAlignCenter']
|
|
258
|
-
}], btnAlignRight: [{
|
|
259
|
-
type: ViewChild,
|
|
260
|
-
args: ['btnAlignRight']
|
|
261
|
-
}], btnLink: [{
|
|
262
|
-
type: ViewChild,
|
|
263
|
-
args: ['btnLink']
|
|
264
|
-
}], btnUl: [{
|
|
265
|
-
type: ViewChild,
|
|
266
|
-
args: ['btnUl']
|
|
267
|
-
}], btnOl: [{
|
|
268
|
-
type: ViewChild,
|
|
269
|
-
args: ['btnOl']
|
|
270
|
-
}], btnImage: [{
|
|
271
|
-
type: ViewChild,
|
|
272
|
-
args: ['btnImage']
|
|
273
|
-
}], fngChange: [{
|
|
274
|
-
type: Output
|
|
275
|
-
}], change: [{
|
|
276
|
-
type: Output
|
|
277
|
-
}], config: [{
|
|
278
|
-
type: Input
|
|
279
|
-
}], modules: [{
|
|
280
|
-
type: Input
|
|
281
|
-
}], label: [{
|
|
282
|
-
type: Input
|
|
283
|
-
}], readOnly: [{
|
|
284
|
-
type: Input
|
|
285
|
-
}], maxLength: [{
|
|
286
|
-
type: Input
|
|
287
|
-
}], error: [{
|
|
288
|
-
type: Input
|
|
289
|
-
}], hint: [{
|
|
290
|
-
type: Input
|
|
291
|
-
}], value: [{
|
|
292
|
-
type: Input
|
|
293
|
-
}] } });
|
|
294
|
-
//# sourceMappingURL=text-editor.component.js.map
|