primevue 3.32.0 → 3.32.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/accordion/Accordion.d.ts +2 -2
- package/accordiontab/AccordionTab.d.ts +4 -3
- package/autocomplete/AutoComplete.d.ts +17 -7
- package/autocomplete/AutoComplete.vue +2 -2
- package/autocomplete/autocomplete.cjs.js +3 -2
- package/autocomplete/autocomplete.cjs.min.js +1 -1
- package/autocomplete/autocomplete.esm.js +3 -2
- package/autocomplete/autocomplete.esm.min.js +1 -1
- package/autocomplete/autocomplete.js +3 -2
- package/autocomplete/autocomplete.min.js +1 -1
- package/avatar/Avatar.d.ts +2 -2
- package/avatargroup/AvatarGroup.d.ts +2 -2
- package/badge/Badge.d.ts +2 -2
- package/badgedirective/BadgeDirective.d.ts +2 -1
- package/basecomponent/BaseComponent.vue +67 -12
- package/basecomponent/basecomponent.cjs.js +76 -22
- package/basecomponent/basecomponent.cjs.min.js +1 -1
- package/basecomponent/basecomponent.esm.js +76 -22
- package/basecomponent/basecomponent.esm.min.js +1 -1
- package/basecomponent/basecomponent.js +76 -22
- package/basecomponent/basecomponent.min.js +1 -1
- package/basedirective/basedirective.cjs.js +47 -7
- package/basedirective/basedirective.cjs.min.js +1 -1
- package/basedirective/basedirective.esm.js +47 -7
- package/basedirective/basedirective.esm.min.js +1 -1
- package/basedirective/basedirective.js +47 -7
- package/basedirective/basedirective.min.js +1 -1
- package/baseicon/BaseIcon.vue +44 -32
- package/baseicon/baseicon.cjs.js +19 -30
- package/baseicon/baseicon.cjs.min.js +1 -1
- package/baseicon/baseicon.esm.js +19 -30
- package/baseicon/baseicon.esm.min.js +1 -1
- package/baseicon/baseicon.js +20 -32
- package/baseicon/baseicon.min.js +1 -1
- package/blockui/BlockUI.d.ts +2 -2
- package/breadcrumb/Breadcrumb.d.ts +2 -2
- package/button/Button.d.ts +2 -2
- package/button/Button.vue +2 -2
- package/button/button.cjs.js +2 -2
- package/button/button.cjs.min.js +1 -1
- package/button/button.esm.js +2 -2
- package/button/button.esm.min.js +1 -1
- package/button/button.js +2 -2
- package/button/button.min.js +1 -1
- package/calendar/Calendar.d.ts +30 -6
- package/calendar/Calendar.vue +9 -8
- package/calendar/calendar.cjs.js +19 -10
- package/calendar/calendar.cjs.min.js +1 -1
- package/calendar/calendar.esm.js +19 -10
- package/calendar/calendar.esm.min.js +1 -1
- package/calendar/calendar.js +19 -10
- package/calendar/calendar.min.js +1 -1
- package/card/Card.d.ts +2 -2
- package/carousel/Carousel.d.ts +2 -2
- package/carousel/Carousel.vue +2 -1
- package/carousel/carousel.cjs.js +4 -3
- package/carousel/carousel.cjs.min.js +1 -1
- package/carousel/carousel.esm.js +4 -3
- package/carousel/carousel.esm.min.js +1 -1
- package/carousel/carousel.js +4 -3
- package/carousel/carousel.min.js +1 -1
- package/cascadeselect/CascadeSelect.d.ts +2 -2
- package/chart/Chart.d.ts +2 -2
- package/checkbox/Checkbox.d.ts +2 -2
- package/chip/Chip.d.ts +6 -4
- package/chips/Chips.d.ts +13 -4
- package/chips/Chips.vue +1 -1
- package/chips/chips.cjs.js +1 -0
- package/chips/chips.cjs.min.js +1 -1
- package/chips/chips.esm.js +1 -0
- package/chips/chips.esm.min.js +1 -1
- package/chips/chips.js +1 -0
- package/chips/chips.min.js +1 -1
- package/colorpicker/ColorPicker.d.ts +2 -2
- package/colorpicker/ColorPicker.vue +1 -40
- package/colorpicker/colorpicker.cjs.js +8 -47
- package/colorpicker/colorpicker.cjs.min.js +1 -1
- package/colorpicker/colorpicker.esm.js +8 -47
- package/colorpicker/colorpicker.esm.min.js +1 -1
- package/colorpicker/colorpicker.js +8 -47
- package/colorpicker/colorpicker.min.js +1 -1
- package/column/Column.d.ts +13 -10
- package/columngroup/ColumnGroup.d.ts +2 -2
- package/config/PrimeVue.d.ts +2 -2
- package/confirmdialog/ConfirmDialog.d.ts +3 -2
- package/confirmpopup/ConfirmPopup.d.ts +3 -2
- package/contextmenu/ContextMenu.d.ts +3 -2
- package/core/core.js +551 -489
- package/core/core.min.js +10 -10
- package/datatable/BodyCell.vue +2 -0
- package/datatable/DataTable.d.ts +4 -2
- package/datatable/DataTable.vue +45 -15
- package/datatable/TableBody.vue +1 -1
- package/datatable/datatable.cjs.js +119 -74
- package/datatable/datatable.cjs.min.js +1 -1
- package/datatable/datatable.esm.js +119 -74
- package/datatable/datatable.esm.min.js +1 -1
- package/datatable/datatable.js +119 -74
- package/datatable/datatable.min.js +1 -1
- package/dataview/DataView.d.ts +2 -2
- package/dataview/DataView.vue +2 -1
- package/dataview/dataview.cjs.js +4 -3
- package/dataview/dataview.cjs.min.js +1 -1
- package/dataview/dataview.esm.js +4 -3
- package/dataview/dataview.esm.min.js +1 -1
- package/dataview/dataview.js +4 -3
- package/dataview/dataview.min.js +1 -1
- package/dataviewlayoutoptions/DataViewLayoutOptions.d.ts +2 -2
- package/deferredcontent/DeferredContent.d.ts +2 -2
- package/dialog/Dialog.d.ts +13 -3
- package/dialog/Dialog.vue +10 -7
- package/dialog/dialog.cjs.js +13 -7
- package/dialog/dialog.cjs.min.js +1 -1
- package/dialog/dialog.esm.js +14 -8
- package/dialog/dialog.esm.min.js +1 -1
- package/dialog/dialog.js +13 -7
- package/dialog/dialog.min.js +1 -1
- package/divider/Divider.d.ts +2 -2
- package/dock/Dock.d.ts +2 -2
- package/dropdown/Dropdown.d.ts +21 -10
- package/dropdown/Dropdown.vue +9 -0
- package/dropdown/dropdown.cjs.js +8 -0
- package/dropdown/dropdown.cjs.min.js +1 -1
- package/dropdown/dropdown.esm.js +8 -0
- package/dropdown/dropdown.esm.min.js +1 -1
- package/dropdown/dropdown.js +8 -0
- package/dropdown/dropdown.min.js +1 -1
- package/editor/BaseEditor.vue +8 -6
- package/editor/Editor.d.ts +2 -2
- package/editor/editor.cjs.js +8 -6
- package/editor/editor.cjs.min.js +1 -1
- package/editor/editor.esm.js +8 -6
- package/editor/editor.esm.min.js +1 -1
- package/editor/editor.js +8 -6
- package/editor/editor.min.js +1 -1
- package/fieldset/Fieldset.d.ts +2 -2
- package/fileupload/FileUpload.d.ts +12 -7
- package/fileupload/FileUpload.vue +4 -0
- package/fileupload/fileupload.cjs.js +4 -0
- package/fileupload/fileupload.cjs.min.js +1 -1
- package/fileupload/fileupload.esm.js +4 -0
- package/fileupload/fileupload.esm.min.js +1 -1
- package/fileupload/fileupload.js +5 -2
- package/fileupload/fileupload.min.js +1 -1
- package/focustrap/FocusTrap.d.ts +2 -1
- package/galleria/Galleria.d.ts +2 -2
- package/galleria/GalleriaItem.vue +2 -2
- package/galleria/GalleriaThumbnails.vue +5 -1
- package/galleria/galleria.cjs.js +16 -7
- package/galleria/galleria.cjs.min.js +1 -1
- package/galleria/galleria.esm.js +16 -7
- package/galleria/galleria.esm.min.js +1 -1
- package/galleria/galleria.js +16 -7
- package/galleria/galleria.min.js +1 -1
- package/image/Image.d.ts +6 -4
- package/image/Image.vue +8 -6
- package/image/image.cjs.js +18 -5
- package/image/image.cjs.min.js +1 -1
- package/image/image.esm.js +19 -6
- package/image/image.esm.min.js +1 -1
- package/image/image.js +18 -5
- package/image/image.min.js +1 -1
- package/inlinemessage/InlineMessage.d.ts +2 -2
- package/inplace/Inplace.d.ts +2 -2
- package/inputmask/InputMask.d.ts +2 -2
- package/inputnumber/InputNumber.d.ts +2 -2
- package/inputnumber/InputNumber.vue +1 -0
- package/inputnumber/inputnumber.cjs.js +1 -0
- package/inputnumber/inputnumber.cjs.min.js +1 -1
- package/inputnumber/inputnumber.esm.js +1 -0
- package/inputnumber/inputnumber.esm.min.js +1 -1
- package/inputnumber/inputnumber.js +1 -0
- package/inputnumber/inputnumber.min.js +1 -1
- package/inputswitch/InputSwitch.d.ts +2 -2
- package/inputtext/InputText.d.ts +2 -2
- package/knob/Knob.d.ts +2 -2
- package/listbox/Listbox.d.ts +11 -5
- package/megamenu/MegaMenu.d.ts +3 -2
- package/menu/Menu.d.ts +2 -2
- package/menubar/Menubar.d.ts +3 -2
- package/message/BaseMessage.vue +5 -0
- package/message/Message.d.ts +4 -2
- package/message/message.cjs.js +1 -1
- package/message/message.cjs.min.js +1 -1
- package/message/message.esm.js +1 -1
- package/message/message.esm.min.js +1 -1
- package/message/message.js +1 -1
- package/message/message.min.js +1 -1
- package/multiselect/MultiSelect.d.ts +16 -6
- package/multiselect/MultiSelect.vue +1 -1
- package/multiselect/multiselect.cjs.js +1 -0
- package/multiselect/multiselect.cjs.min.js +1 -1
- package/multiselect/multiselect.esm.js +1 -0
- package/multiselect/multiselect.esm.min.js +1 -1
- package/multiselect/multiselect.js +1 -0
- package/multiselect/multiselect.min.js +1 -1
- package/orderlist/OrderList.d.ts +2 -2
- package/organizationchart/OrganizationChart.d.ts +2 -2
- package/overlaypanel/OverlayPanel.d.ts +2 -2
- package/package.json +9 -4
- package/paginator/Paginator.d.ts +2 -2
- package/panel/Panel.d.ts +3 -2
- package/panelmenu/PanelMenu.d.ts +3 -2
- package/passthrough/index.cjs.js +16 -60
- package/passthrough/index.cjs.min.js +1 -1
- package/passthrough/index.d.ts +0 -9
- package/passthrough/index.esm.js +16 -60
- package/passthrough/index.esm.min.js +1 -1
- package/passthrough/index.js +18 -59
- package/passthrough/index.min.js +1 -1
- package/passthrough/tailwind/index.cjs.js +365 -359
- package/passthrough/tailwind/index.cjs.min.js +1 -1
- package/passthrough/tailwind/index.d.ts +1 -2
- package/passthrough/tailwind/index.esm.js +365 -359
- package/passthrough/tailwind/index.esm.min.js +1 -1
- package/passthrough/tailwind/index.js +365 -359
- package/passthrough/tailwind/index.min.js +1 -1
- package/password/Password.d.ts +6 -4
- package/password/Password.vue +1 -0
- package/password/password.cjs.js +2 -1
- package/password/password.cjs.min.js +1 -1
- package/password/password.esm.js +2 -1
- package/password/password.esm.min.js +1 -1
- package/password/password.js +2 -1
- package/password/password.min.js +1 -1
- package/picklist/PickList.d.ts +2 -2
- package/picklist/PickList.vue +9 -7
- package/picklist/picklist.cjs.js +27 -9
- package/picklist/picklist.cjs.min.js +1 -1
- package/picklist/picklist.esm.js +27 -9
- package/picklist/picklist.esm.min.js +1 -1
- package/picklist/picklist.js +27 -9
- package/picklist/picklist.min.js +1 -1
- package/progressbar/ProgressBar.d.ts +2 -2
- package/progressspinner/ProgressSpinner.d.ts +2 -2
- package/radiobutton/RadioButton.d.ts +2 -2
- package/rating/Rating.d.ts +3 -2
- package/resources/themes/arya-blue/theme.css +4 -4
- package/resources/themes/arya-green/theme.css +4 -4
- package/resources/themes/arya-orange/theme.css +4 -4
- package/resources/themes/arya-purple/theme.css +4 -4
- package/resources/themes/bootstrap4-dark-blue/theme.css +8 -11
- package/resources/themes/bootstrap4-dark-purple/theme.css +8 -11
- package/resources/themes/bootstrap4-light-blue/theme.css +8 -11
- package/resources/themes/bootstrap4-light-purple/theme.css +8 -11
- package/resources/themes/fluent-light/theme.css +4 -4
- package/resources/themes/lara-dark-blue/theme.css +4 -4
- package/resources/themes/lara-dark-indigo/theme.css +4 -4
- package/resources/themes/lara-dark-purple/theme.css +4 -4
- package/resources/themes/lara-dark-teal/theme.css +4 -4
- package/resources/themes/lara-light-blue/theme.css +4 -4
- package/resources/themes/lara-light-indigo/theme.css +4 -4
- package/resources/themes/lara-light-purple/theme.css +4 -4
- package/resources/themes/lara-light-teal/theme.css +4 -4
- package/resources/themes/luna-amber/theme.css +4 -4
- package/resources/themes/luna-blue/theme.css +4 -4
- package/resources/themes/luna-green/theme.css +4 -4
- package/resources/themes/luna-pink/theme.css +4 -4
- package/resources/themes/md-dark-deeppurple/theme.css +4 -4
- package/resources/themes/md-dark-indigo/theme.css +4 -4
- package/resources/themes/md-light-deeppurple/theme.css +4 -4
- package/resources/themes/md-light-indigo/theme.css +4 -4
- package/resources/themes/mdc-dark-deeppurple/theme.css +4 -4
- package/resources/themes/mdc-dark-indigo/theme.css +4 -4
- package/resources/themes/mdc-light-deeppurple/theme.css +4 -4
- package/resources/themes/mdc-light-indigo/theme.css +4 -4
- package/resources/themes/mira/theme.css +4 -4
- package/resources/themes/nano/theme.css +4 -4
- package/resources/themes/nova/theme.css +4 -4
- package/resources/themes/nova-accent/theme.css +4 -4
- package/resources/themes/nova-alt/theme.css +4 -4
- package/resources/themes/nova-vue/theme.css +4 -4
- package/resources/themes/rhea/theme.css +4 -4
- package/resources/themes/saga-blue/theme.css +4 -4
- package/resources/themes/saga-green/theme.css +4 -4
- package/resources/themes/saga-orange/theme.css +4 -4
- package/resources/themes/saga-purple/theme.css +4 -4
- package/resources/themes/soho-dark/theme.css +4 -4
- package/resources/themes/soho-light/theme.css +4 -4
- package/resources/themes/tailwind-light/theme.css +4 -4
- package/resources/themes/vela-blue/theme.css +4 -4
- package/resources/themes/vela-green/theme.css +4 -4
- package/resources/themes/vela-orange/theme.css +4 -4
- package/resources/themes/vela-purple/theme.css +4 -4
- package/resources/themes/viva-dark/theme.css +4 -4
- package/resources/themes/viva-light/theme.css +4 -4
- package/ripple/Ripple.d.ts +2 -1
- package/scrollpanel/ScrollPanel.d.ts +2 -2
- package/scrolltop/ScrollTop.d.ts +2 -2
- package/selectbutton/SelectButton.d.ts +6 -2
- package/selectbutton/SelectButton.vue +2 -1
- package/selectbutton/selectbutton.cjs.js +2 -1
- package/selectbutton/selectbutton.cjs.min.js +1 -1
- package/selectbutton/selectbutton.esm.js +2 -1
- package/selectbutton/selectbutton.esm.min.js +1 -1
- package/selectbutton/selectbutton.js +2 -1
- package/selectbutton/selectbutton.min.js +1 -1
- package/sidebar/Sidebar.d.ts +10 -4
- package/sidebar/Sidebar.vue +2 -2
- package/sidebar/sidebar.cjs.js +4 -2
- package/sidebar/sidebar.cjs.min.js +1 -1
- package/sidebar/sidebar.esm.js +5 -3
- package/sidebar/sidebar.esm.min.js +1 -1
- package/sidebar/sidebar.js +4 -2
- package/sidebar/sidebar.min.js +1 -1
- package/skeleton/Skeleton.d.ts +2 -2
- package/slider/Slider.d.ts +2 -2
- package/speeddial/SpeedDial.d.ts +9 -7
- package/speeddial/SpeedDial.vue +1 -1
- package/speeddial/speeddial.cjs.js +1 -1
- package/speeddial/speeddial.cjs.min.js +1 -1
- package/speeddial/speeddial.esm.js +1 -1
- package/speeddial/speeddial.esm.min.js +1 -1
- package/speeddial/speeddial.js +1 -1
- package/speeddial/speeddial.min.js +1 -1
- package/splitbutton/SplitButton.d.ts +4 -2
- package/splitter/Splitter.d.ts +2 -2
- package/splitterpanel/SplitterPanel.d.ts +2 -2
- package/steps/Steps.d.ts +2 -2
- package/styleclass/StyleClass.d.ts +2 -1
- package/tabmenu/TabMenu.d.ts +2 -2
- package/tabpanel/TabPanel.d.ts +2 -2
- package/tabview/TabView.d.ts +2 -2
- package/tag/Tag.d.ts +2 -2
- package/terminal/Terminal.d.ts +2 -2
- package/textarea/Textarea.d.ts +2 -2
- package/tieredmenu/TieredMenu.d.ts +3 -2
- package/timeline/Timeline.d.ts +2 -2
- package/toast/BaseToast.vue +2 -0
- package/toast/Toast.d.ts +16 -4
- package/toast/toast.cjs.js +1 -1
- package/toast/toast.cjs.min.js +1 -1
- package/toast/toast.esm.js +1 -1
- package/toast/toast.esm.min.js +1 -1
- package/toast/toast.js +1 -1
- package/toast/toast.min.js +1 -1
- package/togglebutton/ToggleButton.d.ts +3 -2
- package/toolbar/Toolbar.d.ts +2 -2
- package/tooltip/Tooltip.d.ts +2 -1
- package/tree/Tree.d.ts +6 -2
- package/treeselect/TreeSelect.d.ts +3 -2
- package/treetable/TreeTable.d.ts +3 -2
- package/treetable/TreeTable.vue +4 -2
- package/treetable/treetable.cjs.js +6 -5
- package/treetable/treetable.cjs.min.js +1 -1
- package/treetable/treetable.esm.js +6 -5
- package/treetable/treetable.esm.min.js +1 -1
- package/treetable/treetable.js +6 -5
- package/treetable/treetable.min.js +1 -1
- package/tristatecheckbox/TriStateCheckbox.d.ts +5 -2
- package/ts-helpers.d.ts +2 -0
- package/virtualscroller/VirtualScroller.d.ts +8 -6
- package/web-types.json +1 -1
package/chips/chips.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
this.primevue=this.primevue||{},this.primevue.chips=function(e,n,t,o,i){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=r(e),a=r(t),u=o.useStyle("\n.p-chips {\n display: inline-flex;\n}\n\n.p-chips-multiple-container {\n margin: 0;\n padding: 0;\n list-style-type: none;\n cursor: text;\n overflow: hidden;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.p-chips-token {\n cursor: default;\n display: inline-flex;\n align-items: center;\n flex: 0 0 auto;\n}\n\n.p-chips-input-token {\n flex: 1 1 auto;\n display: inline-flex;\n}\n\n.p-chips-token-icon {\n cursor: pointer;\n}\n\n.p-chips-input-token input {\n border: 0 none;\n outline: 0 none;\n background-color: transparent;\n margin: 0;\n padding: 0;\n box-shadow: none;\n border-radius: 0;\n width: 100%;\n}\n\n.p-fluid .p-chips {\n display: flex;\n}\n",{name:"chips",manual:!0});function s(e){return f(e)||d(e)||p(e)||c()}function c(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function p(e,n){if(e){if("string"==typeof e)return m(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?m(e,n):void 0}}function d(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function f(e){if(Array.isArray(e))return m(e)}function m(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,o=new Array(n);t<n;t++)o[t]=e[t];return o}var h={name:"Chips",extends:{name:"BaseChips",extends:a.default,props:{modelValue:{type:Array,default:null},max:{type:Number,default:null},separator:{type:[String,Object],default:null},addOnBlur:{type:Boolean,default:null},allowDuplicate:{type:Boolean,default:!0},placeholder:{type:String,default:null},disabled:{type:Boolean,default:!1},inputId:{type:String,default:null},inputClass:{type:[String,Object],default:null},inputStyle:{type:Object,default:null},inputProps:{type:null,default:null},removeTokenIcon:{type:String,default:void 0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},css:{classes:{root:function(e){var n=e.instance,t=e.props;return["p-chips p-component p-inputwrapper",{"p-disabled":t.disabled,"p-focus":n.focused,"p-inputwrapper-filled":t.modelValue&&t.modelValue.length||n.inputValue&&n.inputValue.length,"p-inputwrapper-focus":n.focused}]},container:"p-inputtext p-chips-multiple-container",token:function(e){return["p-chips-token",{"p-focus":e.state.focusedIndex===e.index}]},label:"p-chips-token-label",removeTokenIcon:"p-chips-token-icon",inputToken:"p-chips-input-token"},loadStyle:u.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","add","remove","focus","blur"],data:function(){return{id:n.UniqueComponentId(),inputValue:null,focused:!1,focusedIndex:null}},methods:{onWrapperClick:function(){this.$refs.input.focus()},onInput:function(e){this.inputValue=e.target.value,this.focusedIndex=null},onFocus:function(e){this.focused=!0,this.focusedIndex=null,this.$emit("focus",e)},onBlur:function(e){this.focused=!1,this.focusedIndex=null,this.addOnBlur&&this.addItem(e,e.target.value,!1),this.$emit("blur",e)},onKeyDown:function(e){var n=e.target.value;switch(e.code){case"Backspace":0===n.length&&this.modelValue&&this.modelValue.length>0&&this.removeItem(e,null!==this.focusedIndex?this.focusedIndex:this.modelValue.length-1);break;case"Enter":n&&n.trim().length&&!this.maxedOut&&this.addItem(e,n,!0);break;case"ArrowLeft":0===n.length&&this.modelValue&&this.modelValue.length>0&&this.$refs.container.focus();break;case"ArrowRight":e.stopPropagation();break;default:this.separator&&(this.separator===e.key||e.key.match(this.separator))&&this.addItem(e,n,!0)}},onPaste:function(e){var n=this;if(this.separator){var t=(e.clipboardData||window.clipboardData).getData("Text");if(t){var o=this.modelValue||[],i=t.split(this.separator);i=i.filter((function(e){return n.allowDuplicate||-1===o.indexOf(e)})),o=[].concat(s(o),s(i)),this.updateModel(e,o,!0)}}},onContainerFocus:function(){this.focused=!0},onContainerBlur:function(){this.focusedIndex=-1,this.focused=!1},onContainerKeyDown:function(e){switch(e.code){case"ArrowLeft":this.onArrowLeftKeyOn(e);break;case"ArrowRight":this.onArrowRightKeyOn(e);break;case"Backspace":this.onBackspaceKeyOn(e)}},onArrowLeftKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex=null===this.focusedIndex?this.modelValue.length-1:this.focusedIndex-1,this.focusedIndex<0&&(this.focusedIndex=0))},onArrowRightKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex===this.modelValue.length-1?(this.focusedIndex=null,this.$refs.input.focus()):this.focusedIndex++)},onBackspaceKeyOn:function(e){null!==this.focusedIndex&&this.removeItem(e,this.focusedIndex)},updateModel:function(e,n,t){var o=this;this.$emit("update:modelValue",n),this.$emit("add",{originalEvent:e,value:n}),this.$refs.input.value="",this.inputValue="",setTimeout((function(){o.maxedOut&&(o.focused=!1)}),0),t&&e.preventDefault()},addItem:function(e,n,t){if(n&&n.trim().length){var o=this.modelValue?s(this.modelValue):[];(this.allowDuplicate||-1===o.indexOf(n))&&(o.push(n),this.updateModel(e,o,t))}},removeItem:function(e,n){if(!this.disabled){var t=s(this.modelValue),o=t.splice(n,1);this.focusedIndex=null,this.$refs.input.focus(),this.$emit("update:modelValue",t),this.$emit("remove",{originalEvent:e,value:o})}}},computed:{maxedOut:function(){return this.max&&this.modelValue&&this.max===this.modelValue.length},focusedOptionId:function(){return null!==this.focusedIndex?"".concat(this.id,"_chips_item_").concat(this.focusedIndex):null}},components:{TimesCircleIcon:l.default}};function y(e){return y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},y(e)}function b(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);n&&(o=o.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,o)}return t}function v(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?b(Object(t),!0).forEach((function(n){g(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):b(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function g(e,n,t){return(n=x(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function x(e){var n=I(e,"string");return"symbol"===y(n)?n:String(n)}function I(e,n){if("object"!==y(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var o=t.call(e,n||"default");if("object"!==y(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}var k=["aria-labelledby","aria-label","aria-activedescendant"],w=["id","aria-label","aria-setsize","aria-posinset","data-p-focused"],O=["id","disabled","placeholder"];return h.render=function(e,n,t,o,r,l){return i.openBlock(),i.createElementBlock("div",i.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"chips"}),[i.createElementVNode("ul",i.mergeProps({ref:"container",class:e.cx("container"),tabindex:"-1",role:"listbox","aria-orientation":"horizontal","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-activedescendant":r.focused?l.focusedOptionId:void 0,onClick:n[5]||(n[5]=function(e){return l.onWrapperClick()}),onFocus:n[6]||(n[6]=function(){return l.onContainerFocus&&l.onContainerFocus.apply(l,arguments)}),onBlur:n[7]||(n[7]=function(){return l.onContainerBlur&&l.onContainerBlur.apply(l,arguments)}),onKeydown:n[8]||(n[8]=function(){return l.onContainerKeyDown&&l.onContainerKeyDown.apply(l,arguments)})},e.ptm("container")),[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(e.modelValue,(function(n,t){return i.openBlock(),i.createElementBlock("li",i.mergeProps({key:"".concat(t,"_").concat(n),id:r.id+"_chips_item_"+t,role:"option",class:e.cx("token",{index:t}),"aria-label":n,"aria-selected":!0,"aria-setsize":e.modelValue.length,"aria-posinset":t+1},e.ptm("token"),{"data-p-focused":r.focusedIndex===t}),[i.renderSlot(e.$slots,"chip",{class:i.normalizeClass(e.cx("label")),value:n},(function(){return[i.createElementVNode("span",i.mergeProps({class:e.cx("label")},e.ptm("label")),i.toDisplayString(n),17)]})),i.renderSlot(e.$slots,"removetokenicon",{class:i.normalizeClass(e.cx("removeTokenIcon")),onClick:function(e){return l.removeItem(e,t)}},(function(){return[(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.removeTokenIcon?"span":"TimesCircleIcon"),i.mergeProps({class:[e.cx("removeTokenIcon"),e.removeTokenIcon],onClick:function(e){return l.removeItem(e,t)},"aria-hidden":"true"},e.ptm("removeTokenIcon")),null,16,["class","onClick"]))]}))],16,w)})),128)),i.createElementVNode("li",i.mergeProps({class:e.cx("inputToken"),role:"option"},e.ptm("inputToken")),[i.createElementVNode("input",i.mergeProps({ref:"input",id:e.inputId,type:"text",class:e.inputClass,style:e.inputStyle,disabled:e.disabled||l.maxedOut,placeholder:e.placeholder,onFocus:n[0]||(n[0]=function(e){return l.onFocus(e)}),onBlur:n[1]||(n[1]=function(e){return l.onBlur(e)}),onInput:n[2]||(n[2]=function(){return l.onInput&&l.onInput.apply(l,arguments)}),onKeydown:n[3]||(n[3]=function(e){return l.onKeyDown(e)}),onPaste:n[4]||(n[4]=function(e){return l.onPaste(e)})},v(v({},e.inputProps),e.ptm("input"))),null,16,O)],16)],16,k)],16)},h}(primevue.icons.timescircle,primevue.utils,primevue.basecomponent,primevue.usestyle,Vue);
|
|
1
|
+
this.primevue=this.primevue||{},this.primevue.chips=function(e,n,t,o,i){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=r(e),a=r(t),u=o.useStyle("\n.p-chips {\n display: inline-flex;\n}\n\n.p-chips-multiple-container {\n margin: 0;\n padding: 0;\n list-style-type: none;\n cursor: text;\n overflow: hidden;\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.p-chips-token {\n cursor: default;\n display: inline-flex;\n align-items: center;\n flex: 0 0 auto;\n}\n\n.p-chips-input-token {\n flex: 1 1 auto;\n display: inline-flex;\n}\n\n.p-chips-token-icon {\n cursor: pointer;\n}\n\n.p-chips-input-token input {\n border: 0 none;\n outline: 0 none;\n background-color: transparent;\n margin: 0;\n padding: 0;\n box-shadow: none;\n border-radius: 0;\n width: 100%;\n}\n\n.p-fluid .p-chips {\n display: flex;\n}\n",{name:"chips",manual:!0});function s(e){return f(e)||d(e)||p(e)||c()}function c(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function p(e,n){if(e){if("string"==typeof e)return m(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?m(e,n):void 0}}function d(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function f(e){if(Array.isArray(e))return m(e)}function m(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,o=new Array(n);t<n;t++)o[t]=e[t];return o}var h={name:"Chips",extends:{name:"BaseChips",extends:a.default,props:{modelValue:{type:Array,default:null},max:{type:Number,default:null},separator:{type:[String,Object],default:null},addOnBlur:{type:Boolean,default:null},allowDuplicate:{type:Boolean,default:!0},placeholder:{type:String,default:null},disabled:{type:Boolean,default:!1},inputId:{type:String,default:null},inputClass:{type:[String,Object],default:null},inputStyle:{type:Object,default:null},inputProps:{type:null,default:null},removeTokenIcon:{type:String,default:void 0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},css:{classes:{root:function(e){var n=e.instance,t=e.props;return["p-chips p-component p-inputwrapper",{"p-disabled":t.disabled,"p-focus":n.focused,"p-inputwrapper-filled":t.modelValue&&t.modelValue.length||n.inputValue&&n.inputValue.length,"p-inputwrapper-focus":n.focused}]},container:"p-inputtext p-chips-multiple-container",token:function(e){return["p-chips-token",{"p-focus":e.state.focusedIndex===e.index}]},label:"p-chips-token-label",removeTokenIcon:"p-chips-token-icon",inputToken:"p-chips-input-token"},loadStyle:u.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","add","remove","focus","blur"],data:function(){return{id:n.UniqueComponentId(),inputValue:null,focused:!1,focusedIndex:null}},methods:{onWrapperClick:function(){this.$refs.input.focus()},onInput:function(e){this.inputValue=e.target.value,this.focusedIndex=null},onFocus:function(e){this.focused=!0,this.focusedIndex=null,this.$emit("focus",e)},onBlur:function(e){this.focused=!1,this.focusedIndex=null,this.addOnBlur&&this.addItem(e,e.target.value,!1),this.$emit("blur",e)},onKeyDown:function(e){var n=e.target.value;switch(e.code){case"Backspace":0===n.length&&this.modelValue&&this.modelValue.length>0&&this.removeItem(e,null!==this.focusedIndex?this.focusedIndex:this.modelValue.length-1);break;case"Enter":n&&n.trim().length&&!this.maxedOut&&this.addItem(e,n,!0);break;case"ArrowLeft":0===n.length&&this.modelValue&&this.modelValue.length>0&&this.$refs.container.focus();break;case"ArrowRight":e.stopPropagation();break;default:this.separator&&(this.separator===e.key||e.key.match(this.separator))&&this.addItem(e,n,!0)}},onPaste:function(e){var n=this;if(this.separator){var t=(e.clipboardData||window.clipboardData).getData("Text");if(t){var o=this.modelValue||[],i=t.split(this.separator);i=i.filter((function(e){return n.allowDuplicate||-1===o.indexOf(e)})),o=[].concat(s(o),s(i)),this.updateModel(e,o,!0)}}},onContainerFocus:function(){this.focused=!0},onContainerBlur:function(){this.focusedIndex=-1,this.focused=!1},onContainerKeyDown:function(e){switch(e.code){case"ArrowLeft":this.onArrowLeftKeyOn(e);break;case"ArrowRight":this.onArrowRightKeyOn(e);break;case"Backspace":this.onBackspaceKeyOn(e)}},onArrowLeftKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex=null===this.focusedIndex?this.modelValue.length-1:this.focusedIndex-1,this.focusedIndex<0&&(this.focusedIndex=0))},onArrowRightKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex===this.modelValue.length-1?(this.focusedIndex=null,this.$refs.input.focus()):this.focusedIndex++)},onBackspaceKeyOn:function(e){null!==this.focusedIndex&&this.removeItem(e,this.focusedIndex)},updateModel:function(e,n,t){var o=this;this.$emit("update:modelValue",n),this.$emit("add",{originalEvent:e,value:n}),this.$refs.input.value="",this.inputValue="",setTimeout((function(){o.maxedOut&&(o.focused=!1)}),0),t&&e.preventDefault()},addItem:function(e,n,t){if(n&&n.trim().length){var o=this.modelValue?s(this.modelValue):[];(this.allowDuplicate||-1===o.indexOf(n))&&(o.push(n),this.updateModel(e,o,t))}},removeItem:function(e,n){if(!this.disabled){var t=s(this.modelValue),o=t.splice(n,1);this.focusedIndex=null,this.$refs.input.focus(),this.$emit("update:modelValue",t),this.$emit("remove",{originalEvent:e,value:o})}}},computed:{maxedOut:function(){return this.max&&this.modelValue&&this.max===this.modelValue.length},focusedOptionId:function(){return null!==this.focusedIndex?"".concat(this.id,"_chips_item_").concat(this.focusedIndex):null}},components:{TimesCircleIcon:l.default}};function y(e){return y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},y(e)}function b(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);n&&(o=o.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,o)}return t}function v(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?b(Object(t),!0).forEach((function(n){g(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):b(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function g(e,n,t){return(n=x(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function x(e){var n=I(e,"string");return"symbol"===y(n)?n:String(n)}function I(e,n){if("object"!==y(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var o=t.call(e,n||"default");if("object"!==y(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}var k=["aria-labelledby","aria-label","aria-activedescendant"],w=["id","aria-label","aria-setsize","aria-posinset","data-p-focused"],O=["id","disabled","placeholder"];return h.render=function(e,n,t,o,r,l){return i.openBlock(),i.createElementBlock("div",i.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"chips"}),[i.createElementVNode("ul",i.mergeProps({ref:"container",class:e.cx("container"),tabindex:"-1",role:"listbox","aria-orientation":"horizontal","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-activedescendant":r.focused?l.focusedOptionId:void 0,onClick:n[5]||(n[5]=function(e){return l.onWrapperClick()}),onFocus:n[6]||(n[6]=function(){return l.onContainerFocus&&l.onContainerFocus.apply(l,arguments)}),onBlur:n[7]||(n[7]=function(){return l.onContainerBlur&&l.onContainerBlur.apply(l,arguments)}),onKeydown:n[8]||(n[8]=function(){return l.onContainerKeyDown&&l.onContainerKeyDown.apply(l,arguments)})},e.ptm("container")),[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(e.modelValue,(function(n,t){return i.openBlock(),i.createElementBlock("li",i.mergeProps({key:"".concat(t,"_").concat(n),id:r.id+"_chips_item_"+t,role:"option",class:e.cx("token",{index:t}),"aria-label":n,"aria-selected":!0,"aria-setsize":e.modelValue.length,"aria-posinset":t+1},e.ptm("token"),{"data-p-focused":r.focusedIndex===t}),[i.renderSlot(e.$slots,"chip",{class:i.normalizeClass(e.cx("label")),value:n},(function(){return[i.createElementVNode("span",i.mergeProps({class:e.cx("label")},e.ptm("label")),i.toDisplayString(n),17)]})),i.renderSlot(e.$slots,"removetokenicon",{class:i.normalizeClass(e.cx("removeTokenIcon")),index:t,onClick:function(e){return l.removeItem(e,t)}},(function(){return[(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.removeTokenIcon?"span":"TimesCircleIcon"),i.mergeProps({class:[e.cx("removeTokenIcon"),e.removeTokenIcon],onClick:function(e){return l.removeItem(e,t)},"aria-hidden":"true"},e.ptm("removeTokenIcon")),null,16,["class","onClick"]))]}))],16,w)})),128)),i.createElementVNode("li",i.mergeProps({class:e.cx("inputToken"),role:"option"},e.ptm("inputToken")),[i.createElementVNode("input",i.mergeProps({ref:"input",id:e.inputId,type:"text",class:e.inputClass,style:e.inputStyle,disabled:e.disabled||l.maxedOut,placeholder:e.placeholder,onFocus:n[0]||(n[0]=function(e){return l.onFocus(e)}),onBlur:n[1]||(n[1]=function(e){return l.onBlur(e)}),onInput:n[2]||(n[2]=function(){return l.onInput&&l.onInput.apply(l,arguments)}),onKeydown:n[3]||(n[3]=function(e){return l.onKeyDown(e)}),onPaste:n[4]||(n[4]=function(e){return l.onPaste(e)})},v(v({},e.inputProps),e.ptm("input"))),null,16,O)],16)],16,k)],16)},h}(primevue.icons.timescircle,primevue.utils,primevue.basecomponent,primevue.usestyle,Vue);
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
*/
|
|
10
10
|
import { TransitionProps } from 'vue';
|
|
11
11
|
import { ComponentHooks } from '../basecomponent';
|
|
12
|
-
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
|
|
12
|
+
import { ClassComponent, GlobalComponentConstructor, PTOptions } from '../ts-helpers';
|
|
13
13
|
|
|
14
14
|
export declare type ColorPickerPassThroughOptionType = ColorPickerPassThroughAttributes | ((options: ColorPickerPassThroughMethodOptions) => ColorPickerPassThroughAttributes | string) | string | null | undefined;
|
|
15
15
|
|
|
@@ -164,7 +164,7 @@ export interface ColorPickerProps {
|
|
|
164
164
|
* Used to pass attributes to DOM elements inside the component.
|
|
165
165
|
* @type {ColorPickerPassThroughOptions}
|
|
166
166
|
*/
|
|
167
|
-
pt?: ColorPickerPassThroughOptions
|
|
167
|
+
pt?: PTOptions<ColorPickerPassThroughOptions>;
|
|
168
168
|
/**
|
|
169
169
|
* When enabled, it removes component related styles in the core.
|
|
170
170
|
* @defaultValue false
|
|
@@ -30,45 +30,6 @@ export default {
|
|
|
30
30
|
name: 'ColorPicker',
|
|
31
31
|
extends: BaseColorPicker,
|
|
32
32
|
emits: ['update:modelValue', 'change', 'show', 'hide'],
|
|
33
|
-
props: {
|
|
34
|
-
modelValue: {
|
|
35
|
-
type: null,
|
|
36
|
-
default: null
|
|
37
|
-
},
|
|
38
|
-
defaultColor: {
|
|
39
|
-
type: null,
|
|
40
|
-
default: 'ff0000'
|
|
41
|
-
},
|
|
42
|
-
inline: {
|
|
43
|
-
type: Boolean,
|
|
44
|
-
default: false
|
|
45
|
-
},
|
|
46
|
-
format: {
|
|
47
|
-
type: String,
|
|
48
|
-
default: 'hex'
|
|
49
|
-
},
|
|
50
|
-
disabled: {
|
|
51
|
-
type: Boolean,
|
|
52
|
-
default: false
|
|
53
|
-
},
|
|
54
|
-
tabindex: {
|
|
55
|
-
type: String,
|
|
56
|
-
default: null
|
|
57
|
-
},
|
|
58
|
-
autoZIndex: {
|
|
59
|
-
type: Boolean,
|
|
60
|
-
default: true
|
|
61
|
-
},
|
|
62
|
-
baseZIndex: {
|
|
63
|
-
type: Number,
|
|
64
|
-
default: 0
|
|
65
|
-
},
|
|
66
|
-
appendTo: {
|
|
67
|
-
type: String,
|
|
68
|
-
default: 'body'
|
|
69
|
-
},
|
|
70
|
-
panelClass: null
|
|
71
|
-
},
|
|
72
33
|
data() {
|
|
73
34
|
return {
|
|
74
35
|
overlayVisible: false
|
|
@@ -384,7 +345,7 @@ export default {
|
|
|
384
345
|
this.bindResizeListener();
|
|
385
346
|
|
|
386
347
|
if (this.autoZIndex) {
|
|
387
|
-
ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
|
|
348
|
+
ZIndexUtils.set('overlay', el, this.baseZIndex, this.$primevue.config.zIndex.overlay);
|
|
388
349
|
}
|
|
389
350
|
|
|
390
351
|
this.$emit('show');
|
|
@@ -106,45 +106,6 @@ var script = {
|
|
|
106
106
|
name: 'ColorPicker',
|
|
107
107
|
"extends": script$1,
|
|
108
108
|
emits: ['update:modelValue', 'change', 'show', 'hide'],
|
|
109
|
-
props: {
|
|
110
|
-
modelValue: {
|
|
111
|
-
type: null,
|
|
112
|
-
"default": null
|
|
113
|
-
},
|
|
114
|
-
defaultColor: {
|
|
115
|
-
type: null,
|
|
116
|
-
"default": 'ff0000'
|
|
117
|
-
},
|
|
118
|
-
inline: {
|
|
119
|
-
type: Boolean,
|
|
120
|
-
"default": false
|
|
121
|
-
},
|
|
122
|
-
format: {
|
|
123
|
-
type: String,
|
|
124
|
-
"default": 'hex'
|
|
125
|
-
},
|
|
126
|
-
disabled: {
|
|
127
|
-
type: Boolean,
|
|
128
|
-
"default": false
|
|
129
|
-
},
|
|
130
|
-
tabindex: {
|
|
131
|
-
type: String,
|
|
132
|
-
"default": null
|
|
133
|
-
},
|
|
134
|
-
autoZIndex: {
|
|
135
|
-
type: Boolean,
|
|
136
|
-
"default": true
|
|
137
|
-
},
|
|
138
|
-
baseZIndex: {
|
|
139
|
-
type: Number,
|
|
140
|
-
"default": 0
|
|
141
|
-
},
|
|
142
|
-
appendTo: {
|
|
143
|
-
type: String,
|
|
144
|
-
"default": 'body'
|
|
145
|
-
},
|
|
146
|
-
panelClass: null
|
|
147
|
-
},
|
|
148
109
|
data: function data() {
|
|
149
110
|
return {
|
|
150
111
|
overlayVisible: false
|
|
@@ -433,7 +394,7 @@ var script = {
|
|
|
433
394
|
this.bindScrollListener();
|
|
434
395
|
this.bindResizeListener();
|
|
435
396
|
if (this.autoZIndex) {
|
|
436
|
-
utils.ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
|
|
397
|
+
utils.ZIndexUtils.set('overlay', el, this.baseZIndex, this.$primevue.config.zIndex.overlay);
|
|
437
398
|
}
|
|
438
399
|
this.$emit('show');
|
|
439
400
|
},
|
|
@@ -644,14 +605,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
644
605
|
return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
645
606
|
ref: "container",
|
|
646
607
|
"class": _ctx.cx('root')
|
|
647
|
-
}, _ctx.ptm('root')), [
|
|
608
|
+
}, _ctx.ptm('root')), [!_ctx.inline ? (vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
|
|
648
609
|
key: 0,
|
|
649
610
|
ref: "input",
|
|
650
611
|
type: "text",
|
|
651
612
|
"class": _ctx.cx('input'),
|
|
652
613
|
readonly: "readonly",
|
|
653
|
-
tabindex:
|
|
654
|
-
disabled:
|
|
614
|
+
tabindex: _ctx.tabindex,
|
|
615
|
+
disabled: _ctx.disabled,
|
|
655
616
|
onClick: _cache[0] || (_cache[0] = function () {
|
|
656
617
|
return $options.onInputClick && $options.onInputClick.apply($options, arguments);
|
|
657
618
|
}),
|
|
@@ -659,8 +620,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
659
620
|
return $options.onInputKeydown && $options.onInputKeydown.apply($options, arguments);
|
|
660
621
|
})
|
|
661
622
|
}, _ctx.ptm('input')), null, 16, _hoisted_1)) : vue.createCommentVNode("", true), vue.createVNode(_component_Portal, {
|
|
662
|
-
appendTo:
|
|
663
|
-
disabled:
|
|
623
|
+
appendTo: _ctx.appendTo,
|
|
624
|
+
disabled: _ctx.inline
|
|
664
625
|
}, {
|
|
665
626
|
"default": vue.withCtx(function () {
|
|
666
627
|
return [vue.createVNode(vue.Transition, vue.mergeProps({
|
|
@@ -670,10 +631,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
670
631
|
onAfterLeave: $options.onOverlayAfterLeave
|
|
671
632
|
}, _ctx.ptm('transition')), {
|
|
672
633
|
"default": vue.withCtx(function () {
|
|
673
|
-
return [(
|
|
634
|
+
return [(_ctx.inline ? true : $data.overlayVisible) ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
674
635
|
key: 0,
|
|
675
636
|
ref: $options.pickerRef,
|
|
676
|
-
"class": [_ctx.cx('panel'),
|
|
637
|
+
"class": [_ctx.cx('panel'), _ctx.panelClass],
|
|
677
638
|
onClick: _cache[10] || (_cache[10] = function () {
|
|
678
639
|
return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
|
|
679
640
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("primevue/overlayeventbus"),t=require("primevue/portal"),n=require("primevue/utils"),i=require("primevue/basecomponent"),o=require("primevue/usestyle"),r=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=l(e),a=l(t),u=l(i),c=o.useStyle("\n.p-colorpicker-panel .p-colorpicker-color {\n background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)\n}\n\n.p-colorpicker-panel .p-colorpicker-hue {\n background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)\n}\n",{name:"colorpicker",manual:!0}),d={name:"ColorPicker",extends:{name:"BaseColorPicker",extends:u.default,props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},css:{classes:{root:function(e){return["p-colorpicker p-component",{"p-colorpicker-overlay":!e.props.inline}]},input:function(e){return["p-colorpicker-preview p-inputtext",{"p-disabled":e.props.disabled}]},panel:function(e){var t=e.instance,n=e.props;return["p-colorpicker-panel",{"p-colorpicker-overlay-panel":!n.inline,"p-disabled":n.disabled,"p-input-filled":"filled"===t.$primevue.config.inputStyle,"p-ripple-disabled":!1===t.$primevue.config.ripple}]},content:"p-colorpicker-content",selector:"p-colorpicker-color-selector",color:"p-colorpicker-color",colorHandle:"p-colorpicker-color-handle",hue:"p-colorpicker-hue",hueHandle:"p-colorpicker-hue-handle"},loadStyle:c.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","change","show","hide"],props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},data:function(){return{overlayVisible:!1}},hsbValue:null,outsideClickListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,scrollHandler:null,resizeListener:null,hueDragging:null,colorDragging:null,selfUpdate:null,picker:null,colorSelector:null,colorHandle:null,hueView:null,hueHandle:null,watch:{modelValue:{immediate:!0,handler:function(e){this.hsbValue=this.toHSB(e),this.selfUpdate?this.selfUpdate=!1:this.updateUI()}}},beforeUnmount:function(){this.unbindOutsideClickListener(),this.unbindDragListeners(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.picker&&this.autoZIndex&&n.ZIndexUtils.clear(this.picker),this.clearRefs()},mounted:function(){this.updateUI()},methods:{pickColor:function(e){var t=this.colorSelector.getBoundingClientRect(),n=t.top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0),i=t.left+document.body.scrollLeft,o=Math.floor(100*Math.max(0,Math.min(150,(e.pageX||e.changedTouches[0].pageX)-i))/150),r=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150);this.hsbValue=this.validateHSB({h:this.hsbValue.h,s:o,b:r}),this.selfUpdate=!0,this.updateColorHandle(),this.updateInput(),this.updateModel(),this.$emit("change",{event:e,value:this.modelValue})},pickHue:function(e){var t=this.hueView.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);this.hsbValue=this.validateHSB({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150),s:100,b:100}),this.selfUpdate=!0,this.updateColorSelector(),this.updateHue(),this.updateModel(),this.updateInput(),this.$emit("change",{event:e,value:this.modelValue})},updateModel:function(){switch(this.format){case"hex":this.$emit("update:modelValue",this.HSBtoHEX(this.hsbValue));break;case"rgb":this.$emit("update:modelValue",this.HSBtoRGB(this.hsbValue));break;case"hsb":this.$emit("update:modelValue",this.hsbValue)}},updateColorSelector:function(){if(this.colorSelector){var e=this.validateHSB({h:this.hsbValue.h,s:100,b:100});this.colorSelector.style.backgroundColor="#"+this.HSBtoHEX(e)}},updateColorHandle:function(){this.colorHandle&&(this.colorHandle.style.left=Math.floor(150*this.hsbValue.s/100)+"px",this.colorHandle.style.top=Math.floor(150*(100-this.hsbValue.b)/100)+"px")},updateHue:function(){this.hueHandle&&(this.hueHandle.style.top=Math.floor(150-150*this.hsbValue.h/360)+"px")},updateInput:function(){this.$refs.input&&(this.$refs.input.style.backgroundColor="#"+this.HSBtoHEX(this.hsbValue))},updateUI:function(){this.updateHue(),this.updateColorHandle(),this.updateInput(),this.updateColorSelector()},validateHSB:function(e){return{h:Math.min(360,Math.max(0,e.h)),s:Math.min(100,Math.max(0,e.s)),b:Math.min(100,Math.max(0,e.b))}},validateRGB:function(e){return{r:Math.min(255,Math.max(0,e.r)),g:Math.min(255,Math.max(0,e.g)),b:Math.min(255,Math.max(0,e.b))}},validateHEX:function(e){var t=6-e.length;if(t>0){for(var n=[],i=0;i<t;i++)n.push("0");n.push(e),e=n.join("")}return e},HEXtoRGB:function(e){var t=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:t>>16,g:(65280&t)>>8,b:255&t}},HEXtoHSB:function(e){return this.RGBtoHSB(this.HEXtoRGB(e))},RGBtoHSB:function(e){var t={h:0,s:0,b:0},n=Math.min(e.r,e.g,e.b),i=Math.max(e.r,e.g,e.b),o=i-n;return t.b=i,t.s=0!==i?255*o/i:0,t.h=0!==t.s?e.r===i?(e.g-e.b)/o:e.g===i?2+(e.b-e.r)/o:4+(e.r-e.g)/o:-1,t.h*=60,t.h<0&&(t.h+=360),t.s*=100/255,t.b*=100/255,t},HSBtoRGB:function(e){var t={r:null,g:null,b:null},n=Math.round(e.h),i=Math.round(255*e.s/100),o=Math.round(255*e.b/100);if(0===i)t={r:o,g:o,b:o};else{var r=o,l=(255-i)*o/255,s=n%60*(r-l)/60;360===n&&(n=0),n<60?(t.r=r,t.b=l,t.g=l+s):n<120?(t.g=r,t.b=l,t.r=r-s):n<180?(t.g=r,t.r=l,t.b=l+s):n<240?(t.b=r,t.r=l,t.g=r-s):n<300?(t.b=r,t.g=l,t.r=l+s):n<360?(t.r=r,t.g=l,t.b=r-s):(t.r=0,t.g=0,t.b=0)}return{r:Math.round(t.r),g:Math.round(t.g),b:Math.round(t.b)}},RGBtoHEX:function(e){var t=[e.r.toString(16),e.g.toString(16),e.b.toString(16)];for(var n in t)1===t[n].length&&(t[n]="0"+t[n]);return t.join("")},HSBtoHEX:function(e){return this.RGBtoHEX(this.HSBtoRGB(e))},toHSB:function(e){var t;if(e)switch(this.format){case"hex":t=this.HEXtoHSB(e);break;case"rgb":t=this.RGBtoHSB(e);break;case"hsb":t=e}else t=this.HEXtoHSB(this.defaultColor);return t},onOverlayEnter:function(e){this.updateUI(),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.autoZIndex&&n.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay),this.$emit("show")},onOverlayLeave:function(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.clearRefs(),this.$emit("hide")},onOverlayAfterLeave:function(e){this.autoZIndex&&n.ZIndexUtils.clear(e)},alignOverlay:function(){"self"===this.appendTo?n.DomHandler.relativePosition(this.picker,this.$refs.input):n.DomHandler.absolutePosition(this.picker,this.$refs.input)},onInputClick:function(){this.disabled||(this.overlayVisible=!this.overlayVisible)},onInputKeydown:function(e){switch(e.code){case"Space":this.overlayVisible=!this.overlayVisible,e.preventDefault();break;case"Escape":case"Tab":this.overlayVisible=!1}},onColorMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onColorDragStart(e))},onColorDragStart:function(e){this.disabled||(this.colorDragging=!0,this.pickColor(e),this.$el.setAttribute("p-colorpicker-dragging","true"),!this.isUnstyled&&n.DomHandler.addClass(this.$el,"p-colorpicker-dragging"),e.preventDefault())},onDrag:function(e){this.colorDragging&&(this.pickColor(e),e.preventDefault()),this.hueDragging&&(this.pickHue(e),e.preventDefault())},onDragEnd:function(){this.colorDragging=!1,this.hueDragging=!1,this.$el.setAttribute("p-colorpicker-dragging","false"),!this.isUnstyled&&n.DomHandler.removeClass(this.$el,"p-colorpicker-dragging"),this.unbindDragListeners()},onHueMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onHueDragStart(e))},onHueDragStart:function(e){this.disabled||(this.hueDragging=!0,this.pickHue(e),!this.isUnstyled&&n.DomHandler.addClass(this.$el,"p-colorpicker-dragging"))},isInputClicked:function(e){return this.$refs.input&&this.$refs.input.isSameNode(e.target)},bindDragListeners:function(){this.bindDocumentMouseMoveListener(),this.bindDocumentMouseUpListener()},unbindDragListeners:function(){this.unbindDocumentMouseMoveListener(),this.unbindDocumentMouseUpListener()},bindOutsideClickListener:function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.overlayVisible&&e.picker&&!e.picker.contains(t.target)&&!e.isInputClicked(t)&&(e.overlayVisible=!1)},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener:function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener:function(){var e=this;this.scrollHandler||(this.scrollHandler=new n.ConnectedOverlayScrollHandler(this.$refs.container,(function(){e.overlayVisible&&(e.overlayVisible=!1)}))),this.scrollHandler.bindScrollListener()},unbindScrollListener:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&!n.DomHandler.isTouchDevice()&&(e.overlayVisible=!1)},window.addEventListener("resize",this.resizeListener))},unbindResizeListener:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},bindDocumentMouseMoveListener:function(){this.documentMouseMoveListener||(this.documentMouseMoveListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.documentMouseMoveListener))},unbindDocumentMouseMoveListener:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null)},bindDocumentMouseUpListener:function(){this.documentMouseUpListener||(this.documentMouseUpListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseUpListener:function(){this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},pickerRef:function(e){this.picker=e},colorSelectorRef:function(e){this.colorSelector=e},colorHandleRef:function(e){this.colorHandle=e},hueViewRef:function(e){this.hueView=e},hueHandleRef:function(e){this.hueHandle=e},clearRefs:function(){this.picker=null,this.colorSelector=null,this.colorHandle=null,this.hueView=null,this.hueHandle=null},onOverlayClick:function(e){s.default.emit("overlay-click",{originalEvent:e,target:this.$el})}},components:{Portal:a.default}},p=["tabindex","disabled"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.p-colorpicker {\n display: inline-block;\n}\n.p-colorpicker-dragging {\n cursor: pointer;\n}\n.p-colorpicker-overlay {\n position: relative;\n}\n.p-colorpicker-panel {\n position: relative;\n width: 193px;\n height: 166px;\n}\n.p-colorpicker-overlay-panel {\n position: absolute;\n top: 0;\n left: 0;\n}\n.p-colorpicker-preview {\n cursor: pointer;\n}\n.p-colorpicker-panel .p-colorpicker-content {\n position: relative;\n}\n.p-colorpicker-panel .p-colorpicker-color-selector {\n width: 150px;\n height: 150px;\n top: 8px;\n left: 8px;\n position: absolute;\n}\n.p-colorpicker-panel .p-colorpicker-color {\n width: 150px;\n height: 150px;\n}\n.p-colorpicker-panel .p-colorpicker-color-handle {\n position: absolute;\n top: 0px;\n left: 150px;\n border-radius: 100%;\n width: 10px;\n height: 10px;\n border-width: 1px;\n border-style: solid;\n margin: -5px 0 0 -5px;\n cursor: pointer;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue {\n width: 17px;\n height: 150px;\n top: 8px;\n left: 167px;\n position: absolute;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue-handle {\n position: absolute;\n top: 150px;\n left: 0px;\n width: 21px;\n margin-left: -2px;\n margin-top: -5px;\n height: 10px;\n border-width: 2px;\n border-style: solid;\n opacity: 0.85;\n cursor: pointer;\n}\n"),d.render=function(e,t,n,i,o,l){var s=r.resolveComponent("Portal");return r.openBlock(),r.createElementBlock("div",r.mergeProps({ref:"container",class:e.cx("root")},e.ptm("root")),[n.inline?r.createCommentVNode("",!0):(r.openBlock(),r.createElementBlock("input",r.mergeProps({key:0,ref:"input",type:"text",class:e.cx("input"),readonly:"readonly",tabindex:n.tabindex,disabled:n.disabled,onClick:t[0]||(t[0]=function(){return l.onInputClick&&l.onInputClick.apply(l,arguments)}),onKeydown:t[1]||(t[1]=function(){return l.onInputKeydown&&l.onInputKeydown.apply(l,arguments)})},e.ptm("input")),null,16,p)),r.createVNode(s,{appendTo:n.appendTo,disabled:n.inline},{default:r.withCtx((function(){return[r.createVNode(r.Transition,r.mergeProps({name:"p-connected-overlay",onEnter:l.onOverlayEnter,onLeave:l.onOverlayLeave,onAfterLeave:l.onOverlayAfterLeave},e.ptm("transition")),{default:r.withCtx((function(){return[n.inline||o.overlayVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:l.pickerRef,class:[e.cx("panel"),n.panelClass],onClick:t[10]||(t[10]=function(){return l.onOverlayClick&&l.onOverlayClick.apply(l,arguments)})},e.ptm("panel")),[r.createElementVNode("div",r.mergeProps({class:e.cx("panel")},e.ptm("content")),[r.createElementVNode("div",r.mergeProps({ref:l.colorSelectorRef,class:e.cx("selector"),onMousedown:t[2]||(t[2]=function(e){return l.onColorMousedown(e)}),onTouchstart:t[3]||(t[3]=function(e){return l.onColorDragStart(e)}),onTouchmove:t[4]||(t[4]=function(e){return l.onDrag(e)}),onTouchend:t[5]||(t[5]=function(e){return l.onDragEnd()})},e.ptm("selector")),[r.createElementVNode("div",r.mergeProps({class:e.cx("color")},e.ptm("color")),[r.createElementVNode("div",r.mergeProps({ref:l.colorHandleRef,class:e.cx("colorHandle")},e.ptm("colorHandle")),null,16)],16)],16),r.createElementVNode("div",r.mergeProps({ref:l.hueViewRef,class:e.cx("hue"),onMousedown:t[6]||(t[6]=function(e){return l.onHueMousedown(e)}),onTouchstart:t[7]||(t[7]=function(e){return l.onHueDragStart(e)}),onTouchmove:t[8]||(t[8]=function(e){return l.onDrag(e)}),onTouchend:t[9]||(t[9]=function(e){return l.onDragEnd()})},e.ptm("hue")),[r.createElementVNode("div",r.mergeProps({ref:l.hueHandleRef,class:e.cx("hueHandle")},e.ptm("hueHandle")),null,16)],16)],16)],16)):r.createCommentVNode("",!0)]})),_:1},16,["onEnter","onLeave","onAfterLeave"])]})),_:1},8,["appendTo","disabled"])],16)},module.exports=d;
|
|
1
|
+
"use strict";var e=require("primevue/overlayeventbus"),t=require("primevue/portal"),n=require("primevue/utils"),i=require("primevue/basecomponent"),o=require("primevue/usestyle"),r=require("vue");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=l(e),a=l(t),u=l(i),c=o.useStyle("\n.p-colorpicker-panel .p-colorpicker-color {\n background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)\n}\n\n.p-colorpicker-panel .p-colorpicker-hue {\n background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)\n}\n",{name:"colorpicker",manual:!0}),d={name:"ColorPicker",extends:{name:"BaseColorPicker",extends:u.default,props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},css:{classes:{root:function(e){return["p-colorpicker p-component",{"p-colorpicker-overlay":!e.props.inline}]},input:function(e){return["p-colorpicker-preview p-inputtext",{"p-disabled":e.props.disabled}]},panel:function(e){var t=e.instance,n=e.props;return["p-colorpicker-panel",{"p-colorpicker-overlay-panel":!n.inline,"p-disabled":n.disabled,"p-input-filled":"filled"===t.$primevue.config.inputStyle,"p-ripple-disabled":!1===t.$primevue.config.ripple}]},content:"p-colorpicker-content",selector:"p-colorpicker-color-selector",color:"p-colorpicker-color",colorHandle:"p-colorpicker-color-handle",hue:"p-colorpicker-hue",hueHandle:"p-colorpicker-hue-handle"},loadStyle:c.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","change","show","hide"],data:function(){return{overlayVisible:!1}},hsbValue:null,outsideClickListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,scrollHandler:null,resizeListener:null,hueDragging:null,colorDragging:null,selfUpdate:null,picker:null,colorSelector:null,colorHandle:null,hueView:null,hueHandle:null,watch:{modelValue:{immediate:!0,handler:function(e){this.hsbValue=this.toHSB(e),this.selfUpdate?this.selfUpdate=!1:this.updateUI()}}},beforeUnmount:function(){this.unbindOutsideClickListener(),this.unbindDragListeners(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.picker&&this.autoZIndex&&n.ZIndexUtils.clear(this.picker),this.clearRefs()},mounted:function(){this.updateUI()},methods:{pickColor:function(e){var t=this.colorSelector.getBoundingClientRect(),n=t.top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0),i=t.left+document.body.scrollLeft,o=Math.floor(100*Math.max(0,Math.min(150,(e.pageX||e.changedTouches[0].pageX)-i))/150),r=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150);this.hsbValue=this.validateHSB({h:this.hsbValue.h,s:o,b:r}),this.selfUpdate=!0,this.updateColorHandle(),this.updateInput(),this.updateModel(),this.$emit("change",{event:e,value:this.modelValue})},pickHue:function(e){var t=this.hueView.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);this.hsbValue=this.validateHSB({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150),s:100,b:100}),this.selfUpdate=!0,this.updateColorSelector(),this.updateHue(),this.updateModel(),this.updateInput(),this.$emit("change",{event:e,value:this.modelValue})},updateModel:function(){switch(this.format){case"hex":this.$emit("update:modelValue",this.HSBtoHEX(this.hsbValue));break;case"rgb":this.$emit("update:modelValue",this.HSBtoRGB(this.hsbValue));break;case"hsb":this.$emit("update:modelValue",this.hsbValue)}},updateColorSelector:function(){if(this.colorSelector){var e=this.validateHSB({h:this.hsbValue.h,s:100,b:100});this.colorSelector.style.backgroundColor="#"+this.HSBtoHEX(e)}},updateColorHandle:function(){this.colorHandle&&(this.colorHandle.style.left=Math.floor(150*this.hsbValue.s/100)+"px",this.colorHandle.style.top=Math.floor(150*(100-this.hsbValue.b)/100)+"px")},updateHue:function(){this.hueHandle&&(this.hueHandle.style.top=Math.floor(150-150*this.hsbValue.h/360)+"px")},updateInput:function(){this.$refs.input&&(this.$refs.input.style.backgroundColor="#"+this.HSBtoHEX(this.hsbValue))},updateUI:function(){this.updateHue(),this.updateColorHandle(),this.updateInput(),this.updateColorSelector()},validateHSB:function(e){return{h:Math.min(360,Math.max(0,e.h)),s:Math.min(100,Math.max(0,e.s)),b:Math.min(100,Math.max(0,e.b))}},validateRGB:function(e){return{r:Math.min(255,Math.max(0,e.r)),g:Math.min(255,Math.max(0,e.g)),b:Math.min(255,Math.max(0,e.b))}},validateHEX:function(e){var t=6-e.length;if(t>0){for(var n=[],i=0;i<t;i++)n.push("0");n.push(e),e=n.join("")}return e},HEXtoRGB:function(e){var t=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:t>>16,g:(65280&t)>>8,b:255&t}},HEXtoHSB:function(e){return this.RGBtoHSB(this.HEXtoRGB(e))},RGBtoHSB:function(e){var t={h:0,s:0,b:0},n=Math.min(e.r,e.g,e.b),i=Math.max(e.r,e.g,e.b),o=i-n;return t.b=i,t.s=0!==i?255*o/i:0,t.h=0!==t.s?e.r===i?(e.g-e.b)/o:e.g===i?2+(e.b-e.r)/o:4+(e.r-e.g)/o:-1,t.h*=60,t.h<0&&(t.h+=360),t.s*=100/255,t.b*=100/255,t},HSBtoRGB:function(e){var t={r:null,g:null,b:null},n=Math.round(e.h),i=Math.round(255*e.s/100),o=Math.round(255*e.b/100);if(0===i)t={r:o,g:o,b:o};else{var r=o,l=(255-i)*o/255,s=n%60*(r-l)/60;360===n&&(n=0),n<60?(t.r=r,t.b=l,t.g=l+s):n<120?(t.g=r,t.b=l,t.r=r-s):n<180?(t.g=r,t.r=l,t.b=l+s):n<240?(t.b=r,t.r=l,t.g=r-s):n<300?(t.b=r,t.g=l,t.r=l+s):n<360?(t.r=r,t.g=l,t.b=r-s):(t.r=0,t.g=0,t.b=0)}return{r:Math.round(t.r),g:Math.round(t.g),b:Math.round(t.b)}},RGBtoHEX:function(e){var t=[e.r.toString(16),e.g.toString(16),e.b.toString(16)];for(var n in t)1===t[n].length&&(t[n]="0"+t[n]);return t.join("")},HSBtoHEX:function(e){return this.RGBtoHEX(this.HSBtoRGB(e))},toHSB:function(e){var t;if(e)switch(this.format){case"hex":t=this.HEXtoHSB(e);break;case"rgb":t=this.RGBtoHSB(e);break;case"hsb":t=e}else t=this.HEXtoHSB(this.defaultColor);return t},onOverlayEnter:function(e){this.updateUI(),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.autoZIndex&&n.ZIndexUtils.set("overlay",e,this.baseZIndex,this.$primevue.config.zIndex.overlay),this.$emit("show")},onOverlayLeave:function(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.clearRefs(),this.$emit("hide")},onOverlayAfterLeave:function(e){this.autoZIndex&&n.ZIndexUtils.clear(e)},alignOverlay:function(){"self"===this.appendTo?n.DomHandler.relativePosition(this.picker,this.$refs.input):n.DomHandler.absolutePosition(this.picker,this.$refs.input)},onInputClick:function(){this.disabled||(this.overlayVisible=!this.overlayVisible)},onInputKeydown:function(e){switch(e.code){case"Space":this.overlayVisible=!this.overlayVisible,e.preventDefault();break;case"Escape":case"Tab":this.overlayVisible=!1}},onColorMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onColorDragStart(e))},onColorDragStart:function(e){this.disabled||(this.colorDragging=!0,this.pickColor(e),this.$el.setAttribute("p-colorpicker-dragging","true"),!this.isUnstyled&&n.DomHandler.addClass(this.$el,"p-colorpicker-dragging"),e.preventDefault())},onDrag:function(e){this.colorDragging&&(this.pickColor(e),e.preventDefault()),this.hueDragging&&(this.pickHue(e),e.preventDefault())},onDragEnd:function(){this.colorDragging=!1,this.hueDragging=!1,this.$el.setAttribute("p-colorpicker-dragging","false"),!this.isUnstyled&&n.DomHandler.removeClass(this.$el,"p-colorpicker-dragging"),this.unbindDragListeners()},onHueMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onHueDragStart(e))},onHueDragStart:function(e){this.disabled||(this.hueDragging=!0,this.pickHue(e),!this.isUnstyled&&n.DomHandler.addClass(this.$el,"p-colorpicker-dragging"))},isInputClicked:function(e){return this.$refs.input&&this.$refs.input.isSameNode(e.target)},bindDragListeners:function(){this.bindDocumentMouseMoveListener(),this.bindDocumentMouseUpListener()},unbindDragListeners:function(){this.unbindDocumentMouseMoveListener(),this.unbindDocumentMouseUpListener()},bindOutsideClickListener:function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.overlayVisible&&e.picker&&!e.picker.contains(t.target)&&!e.isInputClicked(t)&&(e.overlayVisible=!1)},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener:function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener:function(){var e=this;this.scrollHandler||(this.scrollHandler=new n.ConnectedOverlayScrollHandler(this.$refs.container,(function(){e.overlayVisible&&(e.overlayVisible=!1)}))),this.scrollHandler.bindScrollListener()},unbindScrollListener:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&!n.DomHandler.isTouchDevice()&&(e.overlayVisible=!1)},window.addEventListener("resize",this.resizeListener))},unbindResizeListener:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},bindDocumentMouseMoveListener:function(){this.documentMouseMoveListener||(this.documentMouseMoveListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.documentMouseMoveListener))},unbindDocumentMouseMoveListener:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null)},bindDocumentMouseUpListener:function(){this.documentMouseUpListener||(this.documentMouseUpListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseUpListener:function(){this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},pickerRef:function(e){this.picker=e},colorSelectorRef:function(e){this.colorSelector=e},colorHandleRef:function(e){this.colorHandle=e},hueViewRef:function(e){this.hueView=e},hueHandleRef:function(e){this.hueHandle=e},clearRefs:function(){this.picker=null,this.colorSelector=null,this.colorHandle=null,this.hueView=null,this.hueHandle=null},onOverlayClick:function(e){s.default.emit("overlay-click",{originalEvent:e,target:this.$el})}},components:{Portal:a.default}},p=["tabindex","disabled"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.p-colorpicker {\n display: inline-block;\n}\n.p-colorpicker-dragging {\n cursor: pointer;\n}\n.p-colorpicker-overlay {\n position: relative;\n}\n.p-colorpicker-panel {\n position: relative;\n width: 193px;\n height: 166px;\n}\n.p-colorpicker-overlay-panel {\n position: absolute;\n top: 0;\n left: 0;\n}\n.p-colorpicker-preview {\n cursor: pointer;\n}\n.p-colorpicker-panel .p-colorpicker-content {\n position: relative;\n}\n.p-colorpicker-panel .p-colorpicker-color-selector {\n width: 150px;\n height: 150px;\n top: 8px;\n left: 8px;\n position: absolute;\n}\n.p-colorpicker-panel .p-colorpicker-color {\n width: 150px;\n height: 150px;\n}\n.p-colorpicker-panel .p-colorpicker-color-handle {\n position: absolute;\n top: 0px;\n left: 150px;\n border-radius: 100%;\n width: 10px;\n height: 10px;\n border-width: 1px;\n border-style: solid;\n margin: -5px 0 0 -5px;\n cursor: pointer;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue {\n width: 17px;\n height: 150px;\n top: 8px;\n left: 167px;\n position: absolute;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue-handle {\n position: absolute;\n top: 150px;\n left: 0px;\n width: 21px;\n margin-left: -2px;\n margin-top: -5px;\n height: 10px;\n border-width: 2px;\n border-style: solid;\n opacity: 0.85;\n cursor: pointer;\n}\n"),d.render=function(e,t,n,i,o,l){var s=r.resolveComponent("Portal");return r.openBlock(),r.createElementBlock("div",r.mergeProps({ref:"container",class:e.cx("root")},e.ptm("root")),[e.inline?r.createCommentVNode("",!0):(r.openBlock(),r.createElementBlock("input",r.mergeProps({key:0,ref:"input",type:"text",class:e.cx("input"),readonly:"readonly",tabindex:e.tabindex,disabled:e.disabled,onClick:t[0]||(t[0]=function(){return l.onInputClick&&l.onInputClick.apply(l,arguments)}),onKeydown:t[1]||(t[1]=function(){return l.onInputKeydown&&l.onInputKeydown.apply(l,arguments)})},e.ptm("input")),null,16,p)),r.createVNode(s,{appendTo:e.appendTo,disabled:e.inline},{default:r.withCtx((function(){return[r.createVNode(r.Transition,r.mergeProps({name:"p-connected-overlay",onEnter:l.onOverlayEnter,onLeave:l.onOverlayLeave,onAfterLeave:l.onOverlayAfterLeave},e.ptm("transition")),{default:r.withCtx((function(){return[e.inline||o.overlayVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:l.pickerRef,class:[e.cx("panel"),e.panelClass],onClick:t[10]||(t[10]=function(){return l.onOverlayClick&&l.onOverlayClick.apply(l,arguments)})},e.ptm("panel")),[r.createElementVNode("div",r.mergeProps({class:e.cx("panel")},e.ptm("content")),[r.createElementVNode("div",r.mergeProps({ref:l.colorSelectorRef,class:e.cx("selector"),onMousedown:t[2]||(t[2]=function(e){return l.onColorMousedown(e)}),onTouchstart:t[3]||(t[3]=function(e){return l.onColorDragStart(e)}),onTouchmove:t[4]||(t[4]=function(e){return l.onDrag(e)}),onTouchend:t[5]||(t[5]=function(e){return l.onDragEnd()})},e.ptm("selector")),[r.createElementVNode("div",r.mergeProps({class:e.cx("color")},e.ptm("color")),[r.createElementVNode("div",r.mergeProps({ref:l.colorHandleRef,class:e.cx("colorHandle")},e.ptm("colorHandle")),null,16)],16)],16),r.createElementVNode("div",r.mergeProps({ref:l.hueViewRef,class:e.cx("hue"),onMousedown:t[6]||(t[6]=function(e){return l.onHueMousedown(e)}),onTouchstart:t[7]||(t[7]=function(e){return l.onHueDragStart(e)}),onTouchmove:t[8]||(t[8]=function(e){return l.onDrag(e)}),onTouchend:t[9]||(t[9]=function(e){return l.onDragEnd()})},e.ptm("hue")),[r.createElementVNode("div",r.mergeProps({ref:l.hueHandleRef,class:e.cx("hueHandle")},e.ptm("hueHandle")),null,16)],16)],16)],16)):r.createCommentVNode("",!0)]})),_:1},16,["onEnter","onLeave","onAfterLeave"])]})),_:1},8,["appendTo","disabled"])],16)},module.exports=d;
|
|
@@ -98,45 +98,6 @@ var script = {
|
|
|
98
98
|
name: 'ColorPicker',
|
|
99
99
|
"extends": script$1,
|
|
100
100
|
emits: ['update:modelValue', 'change', 'show', 'hide'],
|
|
101
|
-
props: {
|
|
102
|
-
modelValue: {
|
|
103
|
-
type: null,
|
|
104
|
-
"default": null
|
|
105
|
-
},
|
|
106
|
-
defaultColor: {
|
|
107
|
-
type: null,
|
|
108
|
-
"default": 'ff0000'
|
|
109
|
-
},
|
|
110
|
-
inline: {
|
|
111
|
-
type: Boolean,
|
|
112
|
-
"default": false
|
|
113
|
-
},
|
|
114
|
-
format: {
|
|
115
|
-
type: String,
|
|
116
|
-
"default": 'hex'
|
|
117
|
-
},
|
|
118
|
-
disabled: {
|
|
119
|
-
type: Boolean,
|
|
120
|
-
"default": false
|
|
121
|
-
},
|
|
122
|
-
tabindex: {
|
|
123
|
-
type: String,
|
|
124
|
-
"default": null
|
|
125
|
-
},
|
|
126
|
-
autoZIndex: {
|
|
127
|
-
type: Boolean,
|
|
128
|
-
"default": true
|
|
129
|
-
},
|
|
130
|
-
baseZIndex: {
|
|
131
|
-
type: Number,
|
|
132
|
-
"default": 0
|
|
133
|
-
},
|
|
134
|
-
appendTo: {
|
|
135
|
-
type: String,
|
|
136
|
-
"default": 'body'
|
|
137
|
-
},
|
|
138
|
-
panelClass: null
|
|
139
|
-
},
|
|
140
101
|
data: function data() {
|
|
141
102
|
return {
|
|
142
103
|
overlayVisible: false
|
|
@@ -425,7 +386,7 @@ var script = {
|
|
|
425
386
|
this.bindScrollListener();
|
|
426
387
|
this.bindResizeListener();
|
|
427
388
|
if (this.autoZIndex) {
|
|
428
|
-
ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
|
|
389
|
+
ZIndexUtils.set('overlay', el, this.baseZIndex, this.$primevue.config.zIndex.overlay);
|
|
429
390
|
}
|
|
430
391
|
this.$emit('show');
|
|
431
392
|
},
|
|
@@ -636,14 +597,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
636
597
|
return openBlock(), createElementBlock("div", mergeProps({
|
|
637
598
|
ref: "container",
|
|
638
599
|
"class": _ctx.cx('root')
|
|
639
|
-
}, _ctx.ptm('root')), [
|
|
600
|
+
}, _ctx.ptm('root')), [!_ctx.inline ? (openBlock(), createElementBlock("input", mergeProps({
|
|
640
601
|
key: 0,
|
|
641
602
|
ref: "input",
|
|
642
603
|
type: "text",
|
|
643
604
|
"class": _ctx.cx('input'),
|
|
644
605
|
readonly: "readonly",
|
|
645
|
-
tabindex:
|
|
646
|
-
disabled:
|
|
606
|
+
tabindex: _ctx.tabindex,
|
|
607
|
+
disabled: _ctx.disabled,
|
|
647
608
|
onClick: _cache[0] || (_cache[0] = function () {
|
|
648
609
|
return $options.onInputClick && $options.onInputClick.apply($options, arguments);
|
|
649
610
|
}),
|
|
@@ -651,8 +612,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
651
612
|
return $options.onInputKeydown && $options.onInputKeydown.apply($options, arguments);
|
|
652
613
|
})
|
|
653
614
|
}, _ctx.ptm('input')), null, 16, _hoisted_1)) : createCommentVNode("", true), createVNode(_component_Portal, {
|
|
654
|
-
appendTo:
|
|
655
|
-
disabled:
|
|
615
|
+
appendTo: _ctx.appendTo,
|
|
616
|
+
disabled: _ctx.inline
|
|
656
617
|
}, {
|
|
657
618
|
"default": withCtx(function () {
|
|
658
619
|
return [createVNode(Transition, mergeProps({
|
|
@@ -662,10 +623,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
|
662
623
|
onAfterLeave: $options.onOverlayAfterLeave
|
|
663
624
|
}, _ctx.ptm('transition')), {
|
|
664
625
|
"default": withCtx(function () {
|
|
665
|
-
return [(
|
|
626
|
+
return [(_ctx.inline ? true : $data.overlayVisible) ? (openBlock(), createElementBlock("div", mergeProps({
|
|
666
627
|
key: 0,
|
|
667
628
|
ref: $options.pickerRef,
|
|
668
|
-
"class": [_ctx.cx('panel'),
|
|
629
|
+
"class": [_ctx.cx('panel'), _ctx.panelClass],
|
|
669
630
|
onClick: _cache[10] || (_cache[10] = function () {
|
|
670
631
|
return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
|
|
671
632
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"primevue/overlayeventbus";import t from"primevue/portal";import{ZIndexUtils as n,DomHandler as i,ConnectedOverlayScrollHandler as o}from"primevue/utils";import r from"primevue/basecomponent";import{useStyle as l}from"primevue/usestyle";import{resolveComponent as s,openBlock as a,createElementBlock as u,mergeProps as c,createCommentVNode as d,createVNode as p,withCtx as h,Transition as f,createElementVNode as b}from"vue";var m=l("\n.p-colorpicker-panel .p-colorpicker-color {\n background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)\n}\n\n.p-colorpicker-panel .p-colorpicker-hue {\n background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)\n}\n",{name:"colorpicker",manual:!0}),g={name:"ColorPicker",extends:{name:"BaseColorPicker",extends:r,props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},css:{classes:{root:function(e){return["p-colorpicker p-component",{"p-colorpicker-overlay":!e.props.inline}]},input:function(e){return["p-colorpicker-preview p-inputtext",{"p-disabled":e.props.disabled}]},panel:function(e){var t=e.instance,n=e.props;return["p-colorpicker-panel",{"p-colorpicker-overlay-panel":!n.inline,"p-disabled":n.disabled,"p-input-filled":"filled"===t.$primevue.config.inputStyle,"p-ripple-disabled":!1===t.$primevue.config.ripple}]},content:"p-colorpicker-content",selector:"p-colorpicker-color-selector",color:"p-colorpicker-color",colorHandle:"p-colorpicker-color-handle",hue:"p-colorpicker-hue",hueHandle:"p-colorpicker-hue-handle"},loadStyle:m.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","change","show","hide"],props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},data:function(){return{overlayVisible:!1}},hsbValue:null,outsideClickListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,scrollHandler:null,resizeListener:null,hueDragging:null,colorDragging:null,selfUpdate:null,picker:null,colorSelector:null,colorHandle:null,hueView:null,hueHandle:null,watch:{modelValue:{immediate:!0,handler:function(e){this.hsbValue=this.toHSB(e),this.selfUpdate?this.selfUpdate=!1:this.updateUI()}}},beforeUnmount:function(){this.unbindOutsideClickListener(),this.unbindDragListeners(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.picker&&this.autoZIndex&&n.clear(this.picker),this.clearRefs()},mounted:function(){this.updateUI()},methods:{pickColor:function(e){var t=this.colorSelector.getBoundingClientRect(),n=t.top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0),i=t.left+document.body.scrollLeft,o=Math.floor(100*Math.max(0,Math.min(150,(e.pageX||e.changedTouches[0].pageX)-i))/150),r=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150);this.hsbValue=this.validateHSB({h:this.hsbValue.h,s:o,b:r}),this.selfUpdate=!0,this.updateColorHandle(),this.updateInput(),this.updateModel(),this.$emit("change",{event:e,value:this.modelValue})},pickHue:function(e){var t=this.hueView.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);this.hsbValue=this.validateHSB({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150),s:100,b:100}),this.selfUpdate=!0,this.updateColorSelector(),this.updateHue(),this.updateModel(),this.updateInput(),this.$emit("change",{event:e,value:this.modelValue})},updateModel:function(){switch(this.format){case"hex":this.$emit("update:modelValue",this.HSBtoHEX(this.hsbValue));break;case"rgb":this.$emit("update:modelValue",this.HSBtoRGB(this.hsbValue));break;case"hsb":this.$emit("update:modelValue",this.hsbValue)}},updateColorSelector:function(){if(this.colorSelector){var e=this.validateHSB({h:this.hsbValue.h,s:100,b:100});this.colorSelector.style.backgroundColor="#"+this.HSBtoHEX(e)}},updateColorHandle:function(){this.colorHandle&&(this.colorHandle.style.left=Math.floor(150*this.hsbValue.s/100)+"px",this.colorHandle.style.top=Math.floor(150*(100-this.hsbValue.b)/100)+"px")},updateHue:function(){this.hueHandle&&(this.hueHandle.style.top=Math.floor(150-150*this.hsbValue.h/360)+"px")},updateInput:function(){this.$refs.input&&(this.$refs.input.style.backgroundColor="#"+this.HSBtoHEX(this.hsbValue))},updateUI:function(){this.updateHue(),this.updateColorHandle(),this.updateInput(),this.updateColorSelector()},validateHSB:function(e){return{h:Math.min(360,Math.max(0,e.h)),s:Math.min(100,Math.max(0,e.s)),b:Math.min(100,Math.max(0,e.b))}},validateRGB:function(e){return{r:Math.min(255,Math.max(0,e.r)),g:Math.min(255,Math.max(0,e.g)),b:Math.min(255,Math.max(0,e.b))}},validateHEX:function(e){var t=6-e.length;if(t>0){for(var n=[],i=0;i<t;i++)n.push("0");n.push(e),e=n.join("")}return e},HEXtoRGB:function(e){var t=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:t>>16,g:(65280&t)>>8,b:255&t}},HEXtoHSB:function(e){return this.RGBtoHSB(this.HEXtoRGB(e))},RGBtoHSB:function(e){var t={h:0,s:0,b:0},n=Math.min(e.r,e.g,e.b),i=Math.max(e.r,e.g,e.b),o=i-n;return t.b=i,t.s=0!==i?255*o/i:0,t.h=0!==t.s?e.r===i?(e.g-e.b)/o:e.g===i?2+(e.b-e.r)/o:4+(e.r-e.g)/o:-1,t.h*=60,t.h<0&&(t.h+=360),t.s*=100/255,t.b*=100/255,t},HSBtoRGB:function(e){var t={r:null,g:null,b:null},n=Math.round(e.h),i=Math.round(255*e.s/100),o=Math.round(255*e.b/100);if(0===i)t={r:o,g:o,b:o};else{var r=o,l=(255-i)*o/255,s=n%60*(r-l)/60;360===n&&(n=0),n<60?(t.r=r,t.b=l,t.g=l+s):n<120?(t.g=r,t.b=l,t.r=r-s):n<180?(t.g=r,t.r=l,t.b=l+s):n<240?(t.b=r,t.r=l,t.g=r-s):n<300?(t.b=r,t.g=l,t.r=l+s):n<360?(t.r=r,t.g=l,t.b=r-s):(t.r=0,t.g=0,t.b=0)}return{r:Math.round(t.r),g:Math.round(t.g),b:Math.round(t.b)}},RGBtoHEX:function(e){var t=[e.r.toString(16),e.g.toString(16),e.b.toString(16)];for(var n in t)1===t[n].length&&(t[n]="0"+t[n]);return t.join("")},HSBtoHEX:function(e){return this.RGBtoHEX(this.HSBtoRGB(e))},toHSB:function(e){var t;if(e)switch(this.format){case"hex":t=this.HEXtoHSB(e);break;case"rgb":t=this.RGBtoHSB(e);break;case"hsb":t=e}else t=this.HEXtoHSB(this.defaultColor);return t},onOverlayEnter:function(e){this.updateUI(),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.autoZIndex&&n.set("overlay",e,this.$primevue.config.zIndex.overlay),this.$emit("show")},onOverlayLeave:function(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.clearRefs(),this.$emit("hide")},onOverlayAfterLeave:function(e){this.autoZIndex&&n.clear(e)},alignOverlay:function(){"self"===this.appendTo?i.relativePosition(this.picker,this.$refs.input):i.absolutePosition(this.picker,this.$refs.input)},onInputClick:function(){this.disabled||(this.overlayVisible=!this.overlayVisible)},onInputKeydown:function(e){switch(e.code){case"Space":this.overlayVisible=!this.overlayVisible,e.preventDefault();break;case"Escape":case"Tab":this.overlayVisible=!1}},onColorMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onColorDragStart(e))},onColorDragStart:function(e){this.disabled||(this.colorDragging=!0,this.pickColor(e),this.$el.setAttribute("p-colorpicker-dragging","true"),!this.isUnstyled&&i.addClass(this.$el,"p-colorpicker-dragging"),e.preventDefault())},onDrag:function(e){this.colorDragging&&(this.pickColor(e),e.preventDefault()),this.hueDragging&&(this.pickHue(e),e.preventDefault())},onDragEnd:function(){this.colorDragging=!1,this.hueDragging=!1,this.$el.setAttribute("p-colorpicker-dragging","false"),!this.isUnstyled&&i.removeClass(this.$el,"p-colorpicker-dragging"),this.unbindDragListeners()},onHueMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onHueDragStart(e))},onHueDragStart:function(e){this.disabled||(this.hueDragging=!0,this.pickHue(e),!this.isUnstyled&&i.addClass(this.$el,"p-colorpicker-dragging"))},isInputClicked:function(e){return this.$refs.input&&this.$refs.input.isSameNode(e.target)},bindDragListeners:function(){this.bindDocumentMouseMoveListener(),this.bindDocumentMouseUpListener()},unbindDragListeners:function(){this.unbindDocumentMouseMoveListener(),this.unbindDocumentMouseUpListener()},bindOutsideClickListener:function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.overlayVisible&&e.picker&&!e.picker.contains(t.target)&&!e.isInputClicked(t)&&(e.overlayVisible=!1)},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener:function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener:function(){var e=this;this.scrollHandler||(this.scrollHandler=new o(this.$refs.container,(function(){e.overlayVisible&&(e.overlayVisible=!1)}))),this.scrollHandler.bindScrollListener()},unbindScrollListener:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&!i.isTouchDevice()&&(e.overlayVisible=!1)},window.addEventListener("resize",this.resizeListener))},unbindResizeListener:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},bindDocumentMouseMoveListener:function(){this.documentMouseMoveListener||(this.documentMouseMoveListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.documentMouseMoveListener))},unbindDocumentMouseMoveListener:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null)},bindDocumentMouseUpListener:function(){this.documentMouseUpListener||(this.documentMouseUpListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseUpListener:function(){this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},pickerRef:function(e){this.picker=e},colorSelectorRef:function(e){this.colorSelector=e},colorHandleRef:function(e){this.colorHandle=e},hueViewRef:function(e){this.hueView=e},hueHandleRef:function(e){this.hueHandle=e},clearRefs:function(){this.picker=null,this.colorSelector=null,this.colorHandle=null,this.hueView=null,this.hueHandle=null},onOverlayClick:function(t){e.emit("overlay-click",{originalEvent:t,target:this.$el})}},components:{Portal:t}},v=["tabindex","disabled"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.p-colorpicker {\n display: inline-block;\n}\n.p-colorpicker-dragging {\n cursor: pointer;\n}\n.p-colorpicker-overlay {\n position: relative;\n}\n.p-colorpicker-panel {\n position: relative;\n width: 193px;\n height: 166px;\n}\n.p-colorpicker-overlay-panel {\n position: absolute;\n top: 0;\n left: 0;\n}\n.p-colorpicker-preview {\n cursor: pointer;\n}\n.p-colorpicker-panel .p-colorpicker-content {\n position: relative;\n}\n.p-colorpicker-panel .p-colorpicker-color-selector {\n width: 150px;\n height: 150px;\n top: 8px;\n left: 8px;\n position: absolute;\n}\n.p-colorpicker-panel .p-colorpicker-color {\n width: 150px;\n height: 150px;\n}\n.p-colorpicker-panel .p-colorpicker-color-handle {\n position: absolute;\n top: 0px;\n left: 150px;\n border-radius: 100%;\n width: 10px;\n height: 10px;\n border-width: 1px;\n border-style: solid;\n margin: -5px 0 0 -5px;\n cursor: pointer;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue {\n width: 17px;\n height: 150px;\n top: 8px;\n left: 167px;\n position: absolute;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue-handle {\n position: absolute;\n top: 150px;\n left: 0px;\n width: 21px;\n margin-left: -2px;\n margin-top: -5px;\n height: 10px;\n border-width: 2px;\n border-style: solid;\n opacity: 0.85;\n cursor: pointer;\n}\n"),g.render=function(e,t,n,i,o,r){var l=s("Portal");return a(),u("div",c({ref:"container",class:e.cx("root")},e.ptm("root")),[n.inline?d("",!0):(a(),u("input",c({key:0,ref:"input",type:"text",class:e.cx("input"),readonly:"readonly",tabindex:n.tabindex,disabled:n.disabled,onClick:t[0]||(t[0]=function(){return r.onInputClick&&r.onInputClick.apply(r,arguments)}),onKeydown:t[1]||(t[1]=function(){return r.onInputKeydown&&r.onInputKeydown.apply(r,arguments)})},e.ptm("input")),null,16,v)),p(l,{appendTo:n.appendTo,disabled:n.inline},{default:h((function(){return[p(f,c({name:"p-connected-overlay",onEnter:r.onOverlayEnter,onLeave:r.onOverlayLeave,onAfterLeave:r.onOverlayAfterLeave},e.ptm("transition")),{default:h((function(){return[n.inline||o.overlayVisible?(a(),u("div",c({key:0,ref:r.pickerRef,class:[e.cx("panel"),n.panelClass],onClick:t[10]||(t[10]=function(){return r.onOverlayClick&&r.onOverlayClick.apply(r,arguments)})},e.ptm("panel")),[b("div",c({class:e.cx("panel")},e.ptm("content")),[b("div",c({ref:r.colorSelectorRef,class:e.cx("selector"),onMousedown:t[2]||(t[2]=function(e){return r.onColorMousedown(e)}),onTouchstart:t[3]||(t[3]=function(e){return r.onColorDragStart(e)}),onTouchmove:t[4]||(t[4]=function(e){return r.onDrag(e)}),onTouchend:t[5]||(t[5]=function(e){return r.onDragEnd()})},e.ptm("selector")),[b("div",c({class:e.cx("color")},e.ptm("color")),[b("div",c({ref:r.colorHandleRef,class:e.cx("colorHandle")},e.ptm("colorHandle")),null,16)],16)],16),b("div",c({ref:r.hueViewRef,class:e.cx("hue"),onMousedown:t[6]||(t[6]=function(e){return r.onHueMousedown(e)}),onTouchstart:t[7]||(t[7]=function(e){return r.onHueDragStart(e)}),onTouchmove:t[8]||(t[8]=function(e){return r.onDrag(e)}),onTouchend:t[9]||(t[9]=function(e){return r.onDragEnd()})},e.ptm("hue")),[b("div",c({ref:r.hueHandleRef,class:e.cx("hueHandle")},e.ptm("hueHandle")),null,16)],16)],16)],16)):d("",!0)]})),_:1},16,["onEnter","onLeave","onAfterLeave"])]})),_:1},8,["appendTo","disabled"])],16)};export{g as default};
|
|
1
|
+
import e from"primevue/overlayeventbus";import t from"primevue/portal";import{ZIndexUtils as n,DomHandler as i,ConnectedOverlayScrollHandler as o}from"primevue/utils";import r from"primevue/basecomponent";import{useStyle as s}from"primevue/usestyle";import{resolveComponent as l,openBlock as a,createElementBlock as u,mergeProps as c,createCommentVNode as d,createVNode as p,withCtx as h,Transition as f,createElementVNode as b}from"vue";var m=s("\n.p-colorpicker-panel .p-colorpicker-color {\n background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)\n}\n\n.p-colorpicker-panel .p-colorpicker-hue {\n background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)\n}\n",{name:"colorpicker",manual:!0}),g={name:"ColorPicker",extends:{name:"BaseColorPicker",extends:r,props:{modelValue:{type:null,default:null},defaultColor:{type:null,default:"ff0000"},inline:{type:Boolean,default:!1},format:{type:String,default:"hex"},disabled:{type:Boolean,default:!1},tabindex:{type:String,default:null},autoZIndex:{type:Boolean,default:!0},baseZIndex:{type:Number,default:0},appendTo:{type:String,default:"body"},panelClass:null},css:{classes:{root:function(e){return["p-colorpicker p-component",{"p-colorpicker-overlay":!e.props.inline}]},input:function(e){return["p-colorpicker-preview p-inputtext",{"p-disabled":e.props.disabled}]},panel:function(e){var t=e.instance,n=e.props;return["p-colorpicker-panel",{"p-colorpicker-overlay-panel":!n.inline,"p-disabled":n.disabled,"p-input-filled":"filled"===t.$primevue.config.inputStyle,"p-ripple-disabled":!1===t.$primevue.config.ripple}]},content:"p-colorpicker-content",selector:"p-colorpicker-color-selector",color:"p-colorpicker-color",colorHandle:"p-colorpicker-color-handle",hue:"p-colorpicker-hue",hueHandle:"p-colorpicker-hue-handle"},loadStyle:m.load},provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","change","show","hide"],data:function(){return{overlayVisible:!1}},hsbValue:null,outsideClickListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,scrollHandler:null,resizeListener:null,hueDragging:null,colorDragging:null,selfUpdate:null,picker:null,colorSelector:null,colorHandle:null,hueView:null,hueHandle:null,watch:{modelValue:{immediate:!0,handler:function(e){this.hsbValue=this.toHSB(e),this.selfUpdate?this.selfUpdate=!1:this.updateUI()}}},beforeUnmount:function(){this.unbindOutsideClickListener(),this.unbindDragListeners(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.picker&&this.autoZIndex&&n.clear(this.picker),this.clearRefs()},mounted:function(){this.updateUI()},methods:{pickColor:function(e){var t=this.colorSelector.getBoundingClientRect(),n=t.top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0),i=t.left+document.body.scrollLeft,o=Math.floor(100*Math.max(0,Math.min(150,(e.pageX||e.changedTouches[0].pageX)-i))/150),r=Math.floor(100*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-n)))/150);this.hsbValue=this.validateHSB({h:this.hsbValue.h,s:o,b:r}),this.selfUpdate=!0,this.updateColorHandle(),this.updateInput(),this.updateModel(),this.$emit("change",{event:e,value:this.modelValue})},pickHue:function(e){var t=this.hueView.getBoundingClientRect().top+(window.pageYOffset||document.documentElement.scrollTop||document.body.scrollTop||0);this.hsbValue=this.validateHSB({h:Math.floor(360*(150-Math.max(0,Math.min(150,(e.pageY||e.changedTouches[0].pageY)-t)))/150),s:100,b:100}),this.selfUpdate=!0,this.updateColorSelector(),this.updateHue(),this.updateModel(),this.updateInput(),this.$emit("change",{event:e,value:this.modelValue})},updateModel:function(){switch(this.format){case"hex":this.$emit("update:modelValue",this.HSBtoHEX(this.hsbValue));break;case"rgb":this.$emit("update:modelValue",this.HSBtoRGB(this.hsbValue));break;case"hsb":this.$emit("update:modelValue",this.hsbValue)}},updateColorSelector:function(){if(this.colorSelector){var e=this.validateHSB({h:this.hsbValue.h,s:100,b:100});this.colorSelector.style.backgroundColor="#"+this.HSBtoHEX(e)}},updateColorHandle:function(){this.colorHandle&&(this.colorHandle.style.left=Math.floor(150*this.hsbValue.s/100)+"px",this.colorHandle.style.top=Math.floor(150*(100-this.hsbValue.b)/100)+"px")},updateHue:function(){this.hueHandle&&(this.hueHandle.style.top=Math.floor(150-150*this.hsbValue.h/360)+"px")},updateInput:function(){this.$refs.input&&(this.$refs.input.style.backgroundColor="#"+this.HSBtoHEX(this.hsbValue))},updateUI:function(){this.updateHue(),this.updateColorHandle(),this.updateInput(),this.updateColorSelector()},validateHSB:function(e){return{h:Math.min(360,Math.max(0,e.h)),s:Math.min(100,Math.max(0,e.s)),b:Math.min(100,Math.max(0,e.b))}},validateRGB:function(e){return{r:Math.min(255,Math.max(0,e.r)),g:Math.min(255,Math.max(0,e.g)),b:Math.min(255,Math.max(0,e.b))}},validateHEX:function(e){var t=6-e.length;if(t>0){for(var n=[],i=0;i<t;i++)n.push("0");n.push(e),e=n.join("")}return e},HEXtoRGB:function(e){var t=parseInt(e.indexOf("#")>-1?e.substring(1):e,16);return{r:t>>16,g:(65280&t)>>8,b:255&t}},HEXtoHSB:function(e){return this.RGBtoHSB(this.HEXtoRGB(e))},RGBtoHSB:function(e){var t={h:0,s:0,b:0},n=Math.min(e.r,e.g,e.b),i=Math.max(e.r,e.g,e.b),o=i-n;return t.b=i,t.s=0!==i?255*o/i:0,t.h=0!==t.s?e.r===i?(e.g-e.b)/o:e.g===i?2+(e.b-e.r)/o:4+(e.r-e.g)/o:-1,t.h*=60,t.h<0&&(t.h+=360),t.s*=100/255,t.b*=100/255,t},HSBtoRGB:function(e){var t={r:null,g:null,b:null},n=Math.round(e.h),i=Math.round(255*e.s/100),o=Math.round(255*e.b/100);if(0===i)t={r:o,g:o,b:o};else{var r=o,s=(255-i)*o/255,l=n%60*(r-s)/60;360===n&&(n=0),n<60?(t.r=r,t.b=s,t.g=s+l):n<120?(t.g=r,t.b=s,t.r=r-l):n<180?(t.g=r,t.r=s,t.b=s+l):n<240?(t.b=r,t.r=s,t.g=r-l):n<300?(t.b=r,t.g=s,t.r=s+l):n<360?(t.r=r,t.g=s,t.b=r-l):(t.r=0,t.g=0,t.b=0)}return{r:Math.round(t.r),g:Math.round(t.g),b:Math.round(t.b)}},RGBtoHEX:function(e){var t=[e.r.toString(16),e.g.toString(16),e.b.toString(16)];for(var n in t)1===t[n].length&&(t[n]="0"+t[n]);return t.join("")},HSBtoHEX:function(e){return this.RGBtoHEX(this.HSBtoRGB(e))},toHSB:function(e){var t;if(e)switch(this.format){case"hex":t=this.HEXtoHSB(e);break;case"rgb":t=this.RGBtoHSB(e);break;case"hsb":t=e}else t=this.HEXtoHSB(this.defaultColor);return t},onOverlayEnter:function(e){this.updateUI(),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.autoZIndex&&n.set("overlay",e,this.baseZIndex,this.$primevue.config.zIndex.overlay),this.$emit("show")},onOverlayLeave:function(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.clearRefs(),this.$emit("hide")},onOverlayAfterLeave:function(e){this.autoZIndex&&n.clear(e)},alignOverlay:function(){"self"===this.appendTo?i.relativePosition(this.picker,this.$refs.input):i.absolutePosition(this.picker,this.$refs.input)},onInputClick:function(){this.disabled||(this.overlayVisible=!this.overlayVisible)},onInputKeydown:function(e){switch(e.code){case"Space":this.overlayVisible=!this.overlayVisible,e.preventDefault();break;case"Escape":case"Tab":this.overlayVisible=!1}},onColorMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onColorDragStart(e))},onColorDragStart:function(e){this.disabled||(this.colorDragging=!0,this.pickColor(e),this.$el.setAttribute("p-colorpicker-dragging","true"),!this.isUnstyled&&i.addClass(this.$el,"p-colorpicker-dragging"),e.preventDefault())},onDrag:function(e){this.colorDragging&&(this.pickColor(e),e.preventDefault()),this.hueDragging&&(this.pickHue(e),e.preventDefault())},onDragEnd:function(){this.colorDragging=!1,this.hueDragging=!1,this.$el.setAttribute("p-colorpicker-dragging","false"),!this.isUnstyled&&i.removeClass(this.$el,"p-colorpicker-dragging"),this.unbindDragListeners()},onHueMousedown:function(e){this.disabled||(this.bindDragListeners(),this.onHueDragStart(e))},onHueDragStart:function(e){this.disabled||(this.hueDragging=!0,this.pickHue(e),!this.isUnstyled&&i.addClass(this.$el,"p-colorpicker-dragging"))},isInputClicked:function(e){return this.$refs.input&&this.$refs.input.isSameNode(e.target)},bindDragListeners:function(){this.bindDocumentMouseMoveListener(),this.bindDocumentMouseUpListener()},unbindDragListeners:function(){this.unbindDocumentMouseMoveListener(),this.unbindDocumentMouseUpListener()},bindOutsideClickListener:function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.overlayVisible&&e.picker&&!e.picker.contains(t.target)&&!e.isInputClicked(t)&&(e.overlayVisible=!1)},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener:function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener:function(){var e=this;this.scrollHandler||(this.scrollHandler=new o(this.$refs.container,(function(){e.overlayVisible&&(e.overlayVisible=!1)}))),this.scrollHandler.bindScrollListener()},unbindScrollListener:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.overlayVisible&&!i.isTouchDevice()&&(e.overlayVisible=!1)},window.addEventListener("resize",this.resizeListener))},unbindResizeListener:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},bindDocumentMouseMoveListener:function(){this.documentMouseMoveListener||(this.documentMouseMoveListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.documentMouseMoveListener))},unbindDocumentMouseMoveListener:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null)},bindDocumentMouseUpListener:function(){this.documentMouseUpListener||(this.documentMouseUpListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseUpListener:function(){this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},pickerRef:function(e){this.picker=e},colorSelectorRef:function(e){this.colorSelector=e},colorHandleRef:function(e){this.colorHandle=e},hueViewRef:function(e){this.hueView=e},hueHandleRef:function(e){this.hueHandle=e},clearRefs:function(){this.picker=null,this.colorSelector=null,this.colorHandle=null,this.hueView=null,this.hueHandle=null},onOverlayClick:function(t){e.emit("overlay-click",{originalEvent:t,target:this.$el})}},components:{Portal:t}},v=["tabindex","disabled"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.p-colorpicker {\n display: inline-block;\n}\n.p-colorpicker-dragging {\n cursor: pointer;\n}\n.p-colorpicker-overlay {\n position: relative;\n}\n.p-colorpicker-panel {\n position: relative;\n width: 193px;\n height: 166px;\n}\n.p-colorpicker-overlay-panel {\n position: absolute;\n top: 0;\n left: 0;\n}\n.p-colorpicker-preview {\n cursor: pointer;\n}\n.p-colorpicker-panel .p-colorpicker-content {\n position: relative;\n}\n.p-colorpicker-panel .p-colorpicker-color-selector {\n width: 150px;\n height: 150px;\n top: 8px;\n left: 8px;\n position: absolute;\n}\n.p-colorpicker-panel .p-colorpicker-color {\n width: 150px;\n height: 150px;\n}\n.p-colorpicker-panel .p-colorpicker-color-handle {\n position: absolute;\n top: 0px;\n left: 150px;\n border-radius: 100%;\n width: 10px;\n height: 10px;\n border-width: 1px;\n border-style: solid;\n margin: -5px 0 0 -5px;\n cursor: pointer;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue {\n width: 17px;\n height: 150px;\n top: 8px;\n left: 167px;\n position: absolute;\n opacity: 0.85;\n}\n.p-colorpicker-panel .p-colorpicker-hue-handle {\n position: absolute;\n top: 150px;\n left: 0px;\n width: 21px;\n margin-left: -2px;\n margin-top: -5px;\n height: 10px;\n border-width: 2px;\n border-style: solid;\n opacity: 0.85;\n cursor: pointer;\n}\n"),g.render=function(e,t,n,i,o,r){var s=l("Portal");return a(),u("div",c({ref:"container",class:e.cx("root")},e.ptm("root")),[e.inline?d("",!0):(a(),u("input",c({key:0,ref:"input",type:"text",class:e.cx("input"),readonly:"readonly",tabindex:e.tabindex,disabled:e.disabled,onClick:t[0]||(t[0]=function(){return r.onInputClick&&r.onInputClick.apply(r,arguments)}),onKeydown:t[1]||(t[1]=function(){return r.onInputKeydown&&r.onInputKeydown.apply(r,arguments)})},e.ptm("input")),null,16,v)),p(s,{appendTo:e.appendTo,disabled:e.inline},{default:h((function(){return[p(f,c({name:"p-connected-overlay",onEnter:r.onOverlayEnter,onLeave:r.onOverlayLeave,onAfterLeave:r.onOverlayAfterLeave},e.ptm("transition")),{default:h((function(){return[e.inline||o.overlayVisible?(a(),u("div",c({key:0,ref:r.pickerRef,class:[e.cx("panel"),e.panelClass],onClick:t[10]||(t[10]=function(){return r.onOverlayClick&&r.onOverlayClick.apply(r,arguments)})},e.ptm("panel")),[b("div",c({class:e.cx("panel")},e.ptm("content")),[b("div",c({ref:r.colorSelectorRef,class:e.cx("selector"),onMousedown:t[2]||(t[2]=function(e){return r.onColorMousedown(e)}),onTouchstart:t[3]||(t[3]=function(e){return r.onColorDragStart(e)}),onTouchmove:t[4]||(t[4]=function(e){return r.onDrag(e)}),onTouchend:t[5]||(t[5]=function(e){return r.onDragEnd()})},e.ptm("selector")),[b("div",c({class:e.cx("color")},e.ptm("color")),[b("div",c({ref:r.colorHandleRef,class:e.cx("colorHandle")},e.ptm("colorHandle")),null,16)],16)],16),b("div",c({ref:r.hueViewRef,class:e.cx("hue"),onMousedown:t[6]||(t[6]=function(e){return r.onHueMousedown(e)}),onTouchstart:t[7]||(t[7]=function(e){return r.onHueDragStart(e)}),onTouchmove:t[8]||(t[8]=function(e){return r.onDrag(e)}),onTouchend:t[9]||(t[9]=function(e){return r.onDragEnd()})},e.ptm("hue")),[b("div",c({ref:r.hueHandleRef,class:e.cx("hueHandle")},e.ptm("hueHandle")),null,16)],16)],16)],16)):d("",!0)]})),_:1},16,["onEnter","onLeave","onAfterLeave"])]})),_:1},8,["appendTo","disabled"])],16)};export{g as default};
|
|
@@ -101,45 +101,6 @@ this.primevue.colorpicker = (function (OverlayEventBus, Portal, utils, BaseCompo
|
|
|
101
101
|
name: 'ColorPicker',
|
|
102
102
|
"extends": script$1,
|
|
103
103
|
emits: ['update:modelValue', 'change', 'show', 'hide'],
|
|
104
|
-
props: {
|
|
105
|
-
modelValue: {
|
|
106
|
-
type: null,
|
|
107
|
-
"default": null
|
|
108
|
-
},
|
|
109
|
-
defaultColor: {
|
|
110
|
-
type: null,
|
|
111
|
-
"default": 'ff0000'
|
|
112
|
-
},
|
|
113
|
-
inline: {
|
|
114
|
-
type: Boolean,
|
|
115
|
-
"default": false
|
|
116
|
-
},
|
|
117
|
-
format: {
|
|
118
|
-
type: String,
|
|
119
|
-
"default": 'hex'
|
|
120
|
-
},
|
|
121
|
-
disabled: {
|
|
122
|
-
type: Boolean,
|
|
123
|
-
"default": false
|
|
124
|
-
},
|
|
125
|
-
tabindex: {
|
|
126
|
-
type: String,
|
|
127
|
-
"default": null
|
|
128
|
-
},
|
|
129
|
-
autoZIndex: {
|
|
130
|
-
type: Boolean,
|
|
131
|
-
"default": true
|
|
132
|
-
},
|
|
133
|
-
baseZIndex: {
|
|
134
|
-
type: Number,
|
|
135
|
-
"default": 0
|
|
136
|
-
},
|
|
137
|
-
appendTo: {
|
|
138
|
-
type: String,
|
|
139
|
-
"default": 'body'
|
|
140
|
-
},
|
|
141
|
-
panelClass: null
|
|
142
|
-
},
|
|
143
104
|
data: function data() {
|
|
144
105
|
return {
|
|
145
106
|
overlayVisible: false
|
|
@@ -428,7 +389,7 @@ this.primevue.colorpicker = (function (OverlayEventBus, Portal, utils, BaseCompo
|
|
|
428
389
|
this.bindScrollListener();
|
|
429
390
|
this.bindResizeListener();
|
|
430
391
|
if (this.autoZIndex) {
|
|
431
|
-
utils.ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
|
|
392
|
+
utils.ZIndexUtils.set('overlay', el, this.baseZIndex, this.$primevue.config.zIndex.overlay);
|
|
432
393
|
}
|
|
433
394
|
this.$emit('show');
|
|
434
395
|
},
|
|
@@ -639,14 +600,14 @@ this.primevue.colorpicker = (function (OverlayEventBus, Portal, utils, BaseCompo
|
|
|
639
600
|
return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
640
601
|
ref: "container",
|
|
641
602
|
"class": _ctx.cx('root')
|
|
642
|
-
}, _ctx.ptm('root')), [
|
|
603
|
+
}, _ctx.ptm('root')), [!_ctx.inline ? (vue.openBlock(), vue.createElementBlock("input", vue.mergeProps({
|
|
643
604
|
key: 0,
|
|
644
605
|
ref: "input",
|
|
645
606
|
type: "text",
|
|
646
607
|
"class": _ctx.cx('input'),
|
|
647
608
|
readonly: "readonly",
|
|
648
|
-
tabindex:
|
|
649
|
-
disabled:
|
|
609
|
+
tabindex: _ctx.tabindex,
|
|
610
|
+
disabled: _ctx.disabled,
|
|
650
611
|
onClick: _cache[0] || (_cache[0] = function () {
|
|
651
612
|
return $options.onInputClick && $options.onInputClick.apply($options, arguments);
|
|
652
613
|
}),
|
|
@@ -654,8 +615,8 @@ this.primevue.colorpicker = (function (OverlayEventBus, Portal, utils, BaseCompo
|
|
|
654
615
|
return $options.onInputKeydown && $options.onInputKeydown.apply($options, arguments);
|
|
655
616
|
})
|
|
656
617
|
}, _ctx.ptm('input')), null, 16, _hoisted_1)) : vue.createCommentVNode("", true), vue.createVNode(_component_Portal, {
|
|
657
|
-
appendTo:
|
|
658
|
-
disabled:
|
|
618
|
+
appendTo: _ctx.appendTo,
|
|
619
|
+
disabled: _ctx.inline
|
|
659
620
|
}, {
|
|
660
621
|
"default": vue.withCtx(function () {
|
|
661
622
|
return [vue.createVNode(vue.Transition, vue.mergeProps({
|
|
@@ -665,10 +626,10 @@ this.primevue.colorpicker = (function (OverlayEventBus, Portal, utils, BaseCompo
|
|
|
665
626
|
onAfterLeave: $options.onOverlayAfterLeave
|
|
666
627
|
}, _ctx.ptm('transition')), {
|
|
667
628
|
"default": vue.withCtx(function () {
|
|
668
|
-
return [(
|
|
629
|
+
return [(_ctx.inline ? true : $data.overlayVisible) ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
|
|
669
630
|
key: 0,
|
|
670
631
|
ref: $options.pickerRef,
|
|
671
|
-
"class": [_ctx.cx('panel'),
|
|
632
|
+
"class": [_ctx.cx('panel'), _ctx.panelClass],
|
|
672
633
|
onClick: _cache[10] || (_cache[10] = function () {
|
|
673
634
|
return $options.onOverlayClick && $options.onOverlayClick.apply($options, arguments);
|
|
674
635
|
})
|