vue-tippy 6.0.0-alpha.56 → 6.0.0-alpha.59
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/vue-tippy.cjs +75 -74
- package/dist/vue-tippy.d.ts +1053 -459
- package/dist/vue-tippy.esm-browser.js +76 -75
- package/dist/vue-tippy.iife.js +75 -74
- package/dist/vue-tippy.iife.prod.js +2 -2
- package/dist/vue-tippy.mjs +76 -75
- package/dist/vue-tippy.prod.cjs +75 -74
- package/package.json +4 -4
- package/src/components/Tippy.ts +79 -80
- package/src/composables/useTippyComponent.ts +6 -6
- package/src/types/index.ts +2 -1
package/dist/vue-tippy.cjs
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
|
-
* vue-tippy v6.0.0-alpha.
|
2
|
+
* vue-tippy v6.0.0-alpha.59
|
3
3
|
* (c) 2022
|
4
4
|
* @license MIT
|
5
5
|
*/
|
@@ -4470,7 +4470,7 @@ function useTippyComponent(opts = {}, children) {
|
|
4470
4470
|
instance,
|
4471
4471
|
TippyComponent: vue.h(TippyComponent, {
|
4472
4472
|
...opts,
|
4473
|
-
onVnodeMounted: vnode => {
|
4473
|
+
onVnodeMounted: (vnode) => {
|
4474
4474
|
//@ts-ignore
|
4475
4475
|
instance.value = vnode.component.ctx;
|
4476
4476
|
},
|
@@ -4504,58 +4504,69 @@ function useSingleton(instances, optionalProps) {
|
|
4504
4504
|
};
|
4505
4505
|
}
|
4506
4506
|
|
4507
|
-
// const pluginProps = [
|
4508
|
-
// 'animateFill',
|
4509
|
-
// 'followCursor',
|
4510
|
-
// 'inlinePositioning',
|
4511
|
-
// 'sticky',
|
4512
|
-
// ]
|
4513
|
-
const booleanProps = [
|
4514
|
-
'a11y',
|
4515
|
-
'allowHTML',
|
4516
|
-
'arrow',
|
4517
|
-
'flip',
|
4518
|
-
'flipOnUpdate',
|
4519
|
-
'hideOnClick',
|
4520
|
-
'ignoreAttributes',
|
4521
|
-
'inertia',
|
4522
|
-
'interactive',
|
4523
|
-
'lazy',
|
4524
|
-
'multiple',
|
4525
|
-
'showOnInit',
|
4526
|
-
'touch',
|
4527
|
-
'touchHold',
|
4528
|
-
];
|
4529
|
-
let props = {};
|
4530
|
-
Object.keys(tippy.defaultProps).forEach((prop) => {
|
4531
|
-
if (booleanProps.includes(prop)) {
|
4532
|
-
props[prop] = {
|
4533
|
-
type: prop === 'arrow' ? [String, Boolean, ...typeof Element !== 'undefined' ? [SVGElement, DocumentFragment] : [Function]] : Boolean,
|
4534
|
-
default: function () {
|
4535
|
-
return tippy.defaultProps[prop];
|
4536
|
-
},
|
4537
|
-
};
|
4538
|
-
}
|
4539
|
-
else {
|
4540
|
-
props[prop] = {
|
4541
|
-
default: function () {
|
4542
|
-
return tippy.defaultProps[prop];
|
4543
|
-
},
|
4544
|
-
};
|
4545
|
-
}
|
4546
|
-
});
|
4547
|
-
props['to'] = {};
|
4548
|
-
props['tag'] = {
|
4549
|
-
default: 'span'
|
4550
|
-
};
|
4551
|
-
props['contentTag'] = {
|
4552
|
-
default: 'span'
|
4553
|
-
};
|
4554
|
-
props['contentClass'] = {
|
4555
|
-
default: null
|
4556
|
-
};
|
4557
4507
|
const TippyComponent = vue.defineComponent({
|
4558
|
-
props
|
4508
|
+
props: {
|
4509
|
+
to: {
|
4510
|
+
type: [String, Element],
|
4511
|
+
},
|
4512
|
+
tag: {
|
4513
|
+
type: String,
|
4514
|
+
default: 'span'
|
4515
|
+
},
|
4516
|
+
contentTag: {
|
4517
|
+
type: String,
|
4518
|
+
default: 'span'
|
4519
|
+
},
|
4520
|
+
contentClass: {
|
4521
|
+
type: String,
|
4522
|
+
default: null
|
4523
|
+
},
|
4524
|
+
appendTo: { default: () => tippy.defaultProps['appendTo'] },
|
4525
|
+
aria: { default: () => tippy.defaultProps['aria'] },
|
4526
|
+
delay: { default: () => tippy.defaultProps['delay'] },
|
4527
|
+
duration: { default: () => tippy.defaultProps['duration'] },
|
4528
|
+
getReferenceClientRect: { default: () => tippy.defaultProps['getReferenceClientRect'] },
|
4529
|
+
hideOnClick: { default: () => tippy.defaultProps['hideOnClick'] },
|
4530
|
+
ignoreAttributes: { default: () => tippy.defaultProps['ignoreAttributes'] },
|
4531
|
+
interactive: { default: () => tippy.defaultProps['interactive'] },
|
4532
|
+
interactiveBorder: { default: () => tippy.defaultProps['interactiveBorder'] },
|
4533
|
+
interactiveDebounce: { default: () => tippy.defaultProps['interactiveDebounce'] },
|
4534
|
+
moveTransition: { default: () => tippy.defaultProps['moveTransition'] },
|
4535
|
+
offset: { default: () => tippy.defaultProps['offset'] },
|
4536
|
+
onAfterUpdate: { default: () => tippy.defaultProps['onAfterUpdate'] },
|
4537
|
+
onBeforeUpdate: { default: () => tippy.defaultProps['onBeforeUpdate'] },
|
4538
|
+
onCreate: { default: () => tippy.defaultProps['onCreate'] },
|
4539
|
+
onDestroy: { default: () => tippy.defaultProps['onDestroy'] },
|
4540
|
+
onHidden: { default: () => tippy.defaultProps['onHidden'] },
|
4541
|
+
onHide: { default: () => tippy.defaultProps['onHide'] },
|
4542
|
+
onMount: { default: () => tippy.defaultProps['onMount'] },
|
4543
|
+
onShow: { default: () => tippy.defaultProps['onShow'] },
|
4544
|
+
onShown: { default: () => tippy.defaultProps['onShown'] },
|
4545
|
+
onTrigger: { default: () => tippy.defaultProps['onTrigger'] },
|
4546
|
+
onUntrigger: { default: () => tippy.defaultProps['onUntrigger'] },
|
4547
|
+
onClickOutside: { default: () => tippy.defaultProps['onClickOutside'] },
|
4548
|
+
placement: { default: () => tippy.defaultProps['placement'] },
|
4549
|
+
plugins: { default: () => tippy.defaultProps['plugins'] },
|
4550
|
+
popperOptions: { default: () => tippy.defaultProps['popperOptions'] },
|
4551
|
+
render: { default: () => tippy.defaultProps['render'] },
|
4552
|
+
showOnCreate: { default: () => tippy.defaultProps['showOnCreate'] },
|
4553
|
+
touch: { default: () => tippy.defaultProps['touch'] },
|
4554
|
+
trigger: { default: () => tippy.defaultProps['trigger'] },
|
4555
|
+
triggerTarget: { default: () => tippy.defaultProps['triggerTarget'] },
|
4556
|
+
animateFill: { default: () => tippy.defaultProps['animateFill'] },
|
4557
|
+
followCursor: { default: () => tippy.defaultProps['followCursor'] },
|
4558
|
+
inlinePositioning: { default: () => tippy.defaultProps['inlinePositioning'] },
|
4559
|
+
sticky: { default: () => tippy.defaultProps['sticky'] },
|
4560
|
+
allowHTML: { default: () => tippy.defaultProps['allowHTML'] },
|
4561
|
+
animation: { default: () => tippy.defaultProps['animation'] },
|
4562
|
+
arrow: { default: () => tippy.defaultProps['arrow'] },
|
4563
|
+
content: { default: () => tippy.defaultProps['content'] },
|
4564
|
+
inertia: { default: () => tippy.defaultProps['inertia'] },
|
4565
|
+
maxWidth: { default: () => tippy.defaultProps['maxWidth'] },
|
4566
|
+
role: { default: () => tippy.defaultProps['role'] },
|
4567
|
+
theme: { default: () => tippy.defaultProps['theme'] },
|
4568
|
+
zIndex: { default: () => tippy.defaultProps['zIndex'] }
|
4569
|
+
},
|
4559
4570
|
emits: ['state'],
|
4560
4571
|
setup(props, { slots, emit, expose }) {
|
4561
4572
|
const elem = vue.ref();
|
@@ -4591,43 +4602,33 @@ const TippyComponent = vue.defineComponent({
|
|
4591
4602
|
vue.watch(tippy.state, () => {
|
4592
4603
|
emit('state', vue.unref(tippy.state));
|
4593
4604
|
}, { immediate: true, deep: true });
|
4594
|
-
vue.watch(props, () => {
|
4605
|
+
vue.watch(() => props, () => {
|
4595
4606
|
tippy.setProps(getOptions());
|
4596
4607
|
if (slots.content)
|
4597
4608
|
tippy.setContent(() => contentElem.value);
|
4598
4609
|
});
|
4599
|
-
let exposed = {
|
4610
|
+
let exposed = vue.reactive({
|
4600
4611
|
elem,
|
4601
4612
|
contentElem,
|
4602
4613
|
mounted,
|
4603
4614
|
...tippy
|
4604
|
-
};
|
4615
|
+
});
|
4605
4616
|
expose(exposed);
|
4606
4617
|
return () => {
|
4607
|
-
|
4608
|
-
elem: elem.value,
|
4609
|
-
contentElem: contentElem.value,
|
4610
|
-
mounted: mounted.value,
|
4611
|
-
...Object.keys(tippy).reduce((acc, key) => {
|
4612
|
-
//@ts-ignore
|
4613
|
-
acc[key] = vue.unref(tippy[key]);
|
4614
|
-
return acc;
|
4615
|
-
}, {})
|
4616
|
-
};
|
4617
|
-
const slot = slots.default ? slots.default(exposedUnref) : [];
|
4618
|
+
const slot = slots.default ? slots.default(exposed) : [];
|
4618
4619
|
return vue.h(props.tag, { ref: elem, 'data-v-tippy': '' }, slots.content ? [
|
4619
4620
|
slot,
|
4620
4621
|
vue.h(props.contentTag, {
|
4621
4622
|
ref: contentElem,
|
4622
4623
|
style: { display: mounted.value ? 'inherit' : 'none' },
|
4623
4624
|
class: props.contentClass
|
4624
|
-
}, slots.content(
|
4625
|
+
}, slots.content(exposed)),
|
4625
4626
|
] : slot);
|
4626
4627
|
};
|
4627
4628
|
},
|
4628
4629
|
});
|
4629
4630
|
|
4630
|
-
const booleanProps
|
4631
|
+
const booleanProps = [
|
4631
4632
|
'a11y',
|
4632
4633
|
'allowHTML',
|
4633
4634
|
'arrow',
|
@@ -4643,10 +4644,10 @@ const booleanProps$1 = [
|
|
4643
4644
|
'touch',
|
4644
4645
|
'touchHold',
|
4645
4646
|
];
|
4646
|
-
let props
|
4647
|
+
let props = {};
|
4647
4648
|
Object.keys(tippy.defaultProps).forEach((prop) => {
|
4648
|
-
if (booleanProps
|
4649
|
-
props
|
4649
|
+
if (booleanProps.includes(prop)) {
|
4650
|
+
props[prop] = {
|
4650
4651
|
type: Boolean,
|
4651
4652
|
default: function () {
|
4652
4653
|
return tippy.defaultProps[prop];
|
@@ -4654,7 +4655,7 @@ Object.keys(tippy.defaultProps).forEach((prop) => {
|
|
4654
4655
|
};
|
4655
4656
|
}
|
4656
4657
|
else {
|
4657
|
-
props
|
4658
|
+
props[prop] = {
|
4658
4659
|
default: function () {
|
4659
4660
|
return tippy.defaultProps[prop];
|
4660
4661
|
},
|
@@ -4662,7 +4663,7 @@ Object.keys(tippy.defaultProps).forEach((prop) => {
|
|
4662
4663
|
}
|
4663
4664
|
});
|
4664
4665
|
const TippySingleton = vue.defineComponent({
|
4665
|
-
props
|
4666
|
+
props,
|
4666
4667
|
setup(props) {
|
4667
4668
|
const instances = vue.ref([]);
|
4668
4669
|
const { singleton } = useSingleton(instances, props);
|