@empathyco/x-components 6.0.0-alpha.70 → 6.0.0-alpha.72
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/CHANGELOG.md +18 -0
- package/design-system/deprecated-full-theme.css +660 -660
- package/docs/API-reference/api/x-components.baseteleport.md +15 -14
- package/docs/API-reference/components/common/x-components.base-teleport.md +5 -5
- package/js/components/base-teleport.vue.js +3 -2
- package/js/components/base-teleport.vue.js.map +1 -1
- package/js/components/base-teleport.vue2.js +32 -27
- package/js/components/base-teleport.vue2.js.map +1 -1
- package/js/components/base-teleport.vue3.js +1 -1
- package/js/x-modules/related-prompts/components/related-prompt.vue.js +8 -7
- package/js/x-modules/related-prompts/components/related-prompt.vue.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompt.vue2.js.map +1 -1
- package/js/x-modules/related-prompts/components/related-prompt.vue3.js +1 -1
- package/package.json +2 -2
- package/report/x-components.api.json +40 -22
- package/report/x-components.api.md +15 -14
- package/types/components/base-teleport.vue.d.ts +36 -14
- package/types/components/base-teleport.vue.d.ts.map +1 -1
|
@@ -9,33 +9,34 @@
|
|
|
9
9
|
```typescript
|
|
10
10
|
_default: import("vue").DefineComponent<{
|
|
11
11
|
target: {
|
|
12
|
-
type:
|
|
12
|
+
type: PropType<string | Element>;
|
|
13
13
|
required: true;
|
|
14
14
|
};
|
|
15
|
-
|
|
15
|
+
position: {
|
|
16
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
17
|
+
default: string;
|
|
18
|
+
};
|
|
19
|
+
disabled: {
|
|
16
20
|
type: BooleanConstructor;
|
|
17
21
|
default: boolean;
|
|
18
22
|
};
|
|
19
|
-
position: {
|
|
20
|
-
type: NumberConstructor;
|
|
21
|
-
required: false;
|
|
22
|
-
};
|
|
23
23
|
}, {
|
|
24
|
-
|
|
24
|
+
teleportHost: HTMLDivElement;
|
|
25
25
|
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
26
26
|
target: {
|
|
27
|
-
type:
|
|
27
|
+
type: PropType<string | Element>;
|
|
28
28
|
required: true;
|
|
29
29
|
};
|
|
30
|
-
|
|
30
|
+
position: {
|
|
31
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
32
|
+
default: string;
|
|
33
|
+
};
|
|
34
|
+
disabled: {
|
|
31
35
|
type: BooleanConstructor;
|
|
32
36
|
default: boolean;
|
|
33
37
|
};
|
|
34
|
-
position: {
|
|
35
|
-
type: NumberConstructor;
|
|
36
|
-
required: false;
|
|
37
|
-
};
|
|
38
38
|
}>>, {
|
|
39
|
-
|
|
39
|
+
position: "beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild";
|
|
40
|
+
disabled: boolean;
|
|
40
41
|
}, {}>
|
|
41
42
|
```
|
|
@@ -8,11 +8,11 @@ title: BaseTeleport
|
|
|
8
8
|
|
|
9
9
|
## Props
|
|
10
10
|
|
|
11
|
-
| Name
|
|
12
|
-
|
|
|
13
|
-
| <code>target</code>
|
|
14
|
-
| <code>
|
|
15
|
-
| <code>
|
|
11
|
+
| Name | Description | Type | Default |
|
|
12
|
+
| --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------ | ------------------------ |
|
|
13
|
+
| <code>target</code> | The element or css selector to which the component will be teleported. | <code>string \| Element</code> | <code></code> |
|
|
14
|
+
| <code>position</code> | The position relative to the target<br />- `beforebegin`: Before the target element.<br />- `afterbegin`: Inside the target element, before its first child.<br />- `beforeend`: Inside the target element, after its last child.<br />- `afterend`: After the target element.<br />- `onlychild`: Adds it as child and hides all other children of the target element. | <code>string</code> | <code>'onlychild'</code> |
|
|
15
|
+
| <code>disabled</code> | If disabled, the slot content will not be teleported | <code>boolean</code> | <code>false</code> |
|
|
16
16
|
|
|
17
17
|
## Slots
|
|
18
18
|
|
|
@@ -5,10 +5,11 @@ import _export_sfc from '../_virtual/_plugin-vue_export-helper.js';
|
|
|
5
5
|
|
|
6
6
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
7
7
|
return openBlock(), createBlock(Teleport, {
|
|
8
|
-
to:
|
|
8
|
+
to: _ctx.teleportHost,
|
|
9
|
+
disabled: _ctx.disabled
|
|
9
10
|
}, [
|
|
10
11
|
renderSlot(_ctx.$slots, "default")
|
|
11
|
-
], 8, ["to"]);
|
|
12
|
+
], 8, ["to", "disabled"]);
|
|
12
13
|
}
|
|
13
14
|
var baseTeleport = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
|
14
15
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-teleport.vue.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport :to=\"
|
|
1
|
+
{"version":3,"file":"base-teleport.vue.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport :to=\"teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { defineComponent, watchEffect } from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Element] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const teleportHost = document.createElement('div')\n\n watchEffect(() => {\n if (props.disabled) {\n teleportHost.remove()\n return\n }\n teleportHost.className = `x-base-teleport x-base-teleport--${props.position}`\n const targetElement =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (!targetElement) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.insertAdjacentElement(position, teleportHost)\n })\n\n return { teleportHost }\n },\n})\n</script>\n\n<style lang=\"css\">\n:has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) {\n display: none;\n}\n</style>\n"],"names":["teleportHost","_openBlock","_createBlock","_Teleport"],"mappings":";;;;;SACiBA,WAAY,CAAA,IAAA,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAAG,EAAA,OAAAC,SAAA,EAAQ,EAAAC,WAAA,CAAAC,QAAA,EAAA;AAAA,IAAA,EAAA,EAAA,IAAA,CAAA,YAAA;IACpC,QAAa,EAAA,IAAA,CAAA,QAAA;AAAA,GAAA,EAAA;;;;;;;;"}
|
|
@@ -1,43 +1,48 @@
|
|
|
1
|
-
import { defineComponent,
|
|
1
|
+
import { defineComponent, watchEffect } from 'vue';
|
|
2
2
|
|
|
3
3
|
var _sfc_main = defineComponent({
|
|
4
4
|
name: 'BaseTeleport',
|
|
5
5
|
props: {
|
|
6
|
+
/** The element or css selector to which the component will be teleported. */
|
|
6
7
|
target: {
|
|
7
|
-
type: String,
|
|
8
|
+
type: [String, Element],
|
|
8
9
|
required: true,
|
|
9
10
|
},
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
11
|
+
/**
|
|
12
|
+
* The position relative to the target
|
|
13
|
+
* - `beforebegin`: Before the target element.
|
|
14
|
+
* - `afterbegin`: Inside the target element, before its first child.
|
|
15
|
+
* - `beforeend`: Inside the target element, after its last child.
|
|
16
|
+
* - `afterend`: After the target element.
|
|
17
|
+
* - `onlychild`: Adds it as child and hides all other children of the target element.
|
|
18
|
+
*/
|
|
14
19
|
position: {
|
|
15
|
-
type:
|
|
16
|
-
|
|
20
|
+
type: String,
|
|
21
|
+
default: 'onlychild',
|
|
22
|
+
},
|
|
23
|
+
/** If disabled, the slot content will not be teleported */
|
|
24
|
+
disabled: {
|
|
25
|
+
type: Boolean,
|
|
26
|
+
default: false,
|
|
17
27
|
},
|
|
18
28
|
},
|
|
19
29
|
setup(props) {
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
newTeleportElement.classList.add('x-base-teleport');
|
|
26
|
-
if (props.hideSiblings) {
|
|
27
|
-
newTeleportElement.classList.add('x-base-teleport--hide-siblings');
|
|
28
|
-
}
|
|
29
|
-
const children = parentElement.children;
|
|
30
|
-
const position = props.position ?? -1;
|
|
31
|
-
if (position >= children.length || position === -1) {
|
|
32
|
-
parentElement.appendChild(newTeleportElement);
|
|
30
|
+
const teleportHost = document.createElement('div');
|
|
31
|
+
watchEffect(() => {
|
|
32
|
+
if (props.disabled) {
|
|
33
|
+
teleportHost.remove();
|
|
34
|
+
return;
|
|
33
35
|
}
|
|
34
|
-
|
|
35
|
-
|
|
36
|
+
teleportHost.className = `x-base-teleport x-base-teleport--${props.position}`;
|
|
37
|
+
const targetElement = typeof props.target === 'string' ? document.querySelector(props.target) : props.target;
|
|
38
|
+
if (!targetElement) {
|
|
39
|
+
console.warn(`BaseTeleport: Target element "${props.target}" not found.`);
|
|
40
|
+
return;
|
|
36
41
|
}
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
};
|
|
42
|
+
const position = props.position === 'onlychild' ? 'beforeend' : props.position;
|
|
43
|
+
targetElement.insertAdjacentElement(position, teleportHost);
|
|
44
|
+
});
|
|
45
|
+
return { teleportHost };
|
|
41
46
|
},
|
|
42
47
|
});
|
|
43
48
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-teleport.vue2.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport :to=\"
|
|
1
|
+
{"version":3,"file":"base-teleport.vue2.js","sources":["../../../src/components/base-teleport.vue"],"sourcesContent":["<template>\n <Teleport :to=\"teleportHost\" :disabled>\n <slot></slot>\n </Teleport>\n</template>\n\n<script lang=\"ts\">\nimport type { PropType } from 'vue'\nimport { defineComponent, watchEffect } from 'vue'\n\nexport default defineComponent({\n name: 'BaseTeleport',\n props: {\n /** The element or css selector to which the component will be teleported. */\n target: {\n type: [String, Element] as PropType<string | Element>,\n required: true,\n },\n /**\n * The position relative to the target\n * - `beforebegin`: Before the target element.\n * - `afterbegin`: Inside the target element, before its first child.\n * - `beforeend`: Inside the target element, after its last child.\n * - `afterend`: After the target element.\n * - `onlychild`: Adds it as child and hides all other children of the target element.\n */\n position: {\n type: String as PropType<\n 'beforebegin' | 'afterbegin' | 'beforeend' | 'afterend' | 'onlychild'\n >,\n default: 'onlychild',\n },\n /** If disabled, the slot content will not be teleported */\n disabled: {\n type: Boolean,\n default: false,\n },\n },\n setup(props) {\n const teleportHost = document.createElement('div')\n\n watchEffect(() => {\n if (props.disabled) {\n teleportHost.remove()\n return\n }\n teleportHost.className = `x-base-teleport x-base-teleport--${props.position}`\n const targetElement =\n typeof props.target === 'string' ? document.querySelector(props.target) : props.target\n if (!targetElement) {\n console.warn(`BaseTeleport: Target element \"${props.target}\" not found.`)\n return\n }\n const position = props.position === 'onlychild' ? 'beforeend' : props.position\n targetElement.insertAdjacentElement(position, teleportHost)\n })\n\n return { teleportHost }\n },\n})\n</script>\n\n<style lang=\"css\">\n:has(> .x-base-teleport--onlychild) > *:not(.x-base-teleport) {\n display: none;\n}\n</style>\n"],"names":[],"mappings":";;AAUA,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,KAAK,EAAE;;AAEL,QAAA,MAAM,EAAE;AACN,YAAA,IAAI,EAAE,CAAC,MAAM,EAAE,OAAO,CAA+B;AACrD,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACD;;;;;;;AAOE;AACF,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAE,MAEL;AACD,YAAA,OAAO,EAAE,WAAW;AACrB,SAAA;;AAED,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAK;AACf,SAAA;AACF,KAAA;AACD,IAAA,KAAK,CAAC,KAAK,EAAA;QACT,MAAM,YAAW,GAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAA,CAAA;QAEjD,WAAW,CAAC,MAAM;YAChB,IAAI,KAAK,CAAC,QAAQ,EAAE;gBAClB,YAAY,CAAC,MAAM,EAAC,CAAA;gBACpB,OAAK;AACP,aAAA;YACA,YAAY,CAAC,SAAU,GAAE,CAAA,iCAAA,EAAoC,KAAK,CAAC,QAAQ,EAAC,CAAA;YAC5E,MAAM,aAAc,GAClB,OAAO,KAAK,CAAC,MAAO,KAAI,QAAO,GAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAA,GAAI,KAAK,CAAC,MAAK,CAAA;YACvF,IAAI,CAAC,aAAa,EAAE;gBAClB,OAAO,CAAC,IAAI,CAAC,CAAA,8BAAA,EAAiC,KAAK,CAAC,MAAM,CAAc,YAAA,CAAA,CAAA,CAAA;gBACxE,OAAK;AACP,aAAA;AACA,YAAA,MAAM,QAAO,GAAI,KAAK,CAAC,QAAS,KAAI,WAAU,GAAI,WAAY,GAAE,KAAK,CAAC,QAAO,CAAA;AAC7E,YAAA,aAAa,CAAC,qBAAqB,CAAC,QAAQ,EAAE,YAAY,CAAA,CAAA;AAC5D,SAAC,CAAA,CAAA;QAED,OAAO,EAAE,YAAa,EAAA,CAAA;KACvB;AACF,CAAA,CAAA;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import injectCss from '../../tools/inject-css.js';
|
|
2
2
|
|
|
3
|
-
var css = ":has(>.x-base-teleport--
|
|
3
|
+
var css = ":has(>.x-base-teleport--onlychild)>:not(.x-base-teleport){display:none}";
|
|
4
4
|
injectCss(css);
|
|
5
5
|
|
|
6
6
|
export { css, css as default };
|
|
@@ -1,24 +1,25 @@
|
|
|
1
1
|
import _sfc_main from './related-prompt.vue2.js';
|
|
2
|
-
import { resolveDirective, openBlock, createElementBlock, renderSlot, withDirectives, createElementVNode, createBlock, resolveDynamicComponent } from 'vue';
|
|
2
|
+
import { resolveDirective, openBlock, createElementBlock, renderSlot, withDirectives, createElementVNode, normalizeClass, createBlock, resolveDynamicComponent } from 'vue';
|
|
3
3
|
import './related-prompt.vue3.js';
|
|
4
4
|
import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.js';
|
|
5
5
|
|
|
6
|
-
const _hoisted_1 = { class: "x-related-prompt
|
|
7
|
-
const _hoisted_2 = { class: "x-text-left x-grow" };
|
|
6
|
+
const _hoisted_1 = { class: "x-related-prompt" };
|
|
8
7
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
9
8
|
const _directive_typing = resolveDirective("typing");
|
|
10
9
|
return openBlock(), createElementBlock("button", _hoisted_1, [
|
|
11
10
|
renderSlot(_ctx.$slots, "related-prompt-extra-content", { relatedPrompt: _ctx.relatedPrompt }),
|
|
12
11
|
withDirectives(createElementVNode(
|
|
13
12
|
"span",
|
|
14
|
-
|
|
13
|
+
{
|
|
14
|
+
class: normalizeClass(["x-related-prompt-text", { "x-related-prompt-text--selected": _ctx.selected }])
|
|
15
|
+
},
|
|
15
16
|
null,
|
|
16
|
-
|
|
17
|
-
/*
|
|
17
|
+
2
|
|
18
|
+
/* CLASS */
|
|
18
19
|
), [
|
|
19
20
|
[_directive_typing, { text: _ctx.relatedPrompt.suggestionText, speed: 50 }]
|
|
20
21
|
]),
|
|
21
|
-
(openBlock(), createBlock(resolveDynamicComponent(_ctx.selected ? "CrossTinyIcon" : "PlusIcon"), { class: "x-
|
|
22
|
+
(openBlock(), createBlock(resolveDynamicComponent(_ctx.selected ? "CrossTinyIcon" : "PlusIcon"), { class: "x-related-prompt-icon" }))
|
|
22
23
|
]);
|
|
23
24
|
}
|
|
24
25
|
var RelatedPrompt = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-prompt.vue.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n <button class=\"x-related-prompt
|
|
1
|
+
{"version":3,"file":"related-prompt.vue.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n <button class=\"x-related-prompt\">\n <slot name=\"related-prompt-extra-content\" :related-prompt=\"relatedPrompt\" />\n <span\n v-typing=\"{ text: relatedPrompt.suggestionText, speed: 50 }\"\n class=\"x-related-prompt-text\"\n :class=\"{ 'x-related-prompt-text--selected': selected }\"\n />\n <component :is=\"selected ? 'CrossTinyIcon' : 'PlusIcon'\" class=\"x-related-prompt-icon\" />\n </button>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedPrompt } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport CrossTinyIcon from '../../../components/icons/cross-tiny.vue'\nimport PlusIcon from '../../../components/icons/plus.vue'\nimport { typing } from '../../../directives/typing'\n\n/**\n * This component shows a suggested related prompt.\n */\nexport default defineComponent({\n name: 'RelatedPrompt',\n directives: {\n typing,\n },\n components: {\n CrossTinyIcon,\n PlusIcon,\n },\n props: {\n relatedPrompt: {\n type: Object as PropType<RelatedPrompt>,\n required: true,\n },\n selected: {\n type: Boolean,\n default: false,\n },\n },\n})\n</script>\n\n<style lang=\"css\">\n.x-related-prompt {\n display: flex;\n align-items: center;\n justify-content: space-between;\n text-align: start;\n padding: 8px;\n gap: 8px;\n height: 100%;\n width: 100%;\n}\n\n.x-related-prompt-text {\n text-align: left;\n flex-grow: 1;\n}\n\n.x-related-prompt-text.x-related-prompt-text--selected {\n text-align: center;\n}\n\n.x-related-prompt-icon {\n height: 24px;\n flex-shrink: 0;\n align-self: start;\n}\n</style>\n"],"names":["_resolveDirective","_createElementBlock","_renderSlot","selected"],"mappings":";;;;;;;AACE,EAAA,MAAA,iBAAA,GAAAA,gBAAA,CAQS,QART,CAAA,CAAA;oBAMI,EAAAC,kBAAA,CAAA,QAAA,EAAA,UAAA,EAAA;AAAA,IAAAC,UAAA,CAPN,6CAKmC,EACgBC,aAAAA,EAAAA,IAAAA,CAAAA,aAAAA,EAAAA,CAAAA;AAAAA,IAAAA,cAAAA,CAAAA,kBAAAA;;;wDAFb,EAAc,iCAAA,EAAA,IAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAA,OAAA;;;;;AAIhD,MAAA,CAAA,iBAAA,EAAA,EAAA,IAAA,EARJ,mCAQoBA,KAAQ,EAAA,EAAA,EAAA,CAAA;AAAA,KAAA,CAAA;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"related-prompt.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n <button class=\"x-related-prompt
|
|
1
|
+
{"version":3,"file":"related-prompt.vue2.js","sources":["../../../../../src/x-modules/related-prompts/components/related-prompt.vue"],"sourcesContent":["<template>\n <button class=\"x-related-prompt\">\n <slot name=\"related-prompt-extra-content\" :related-prompt=\"relatedPrompt\" />\n <span\n v-typing=\"{ text: relatedPrompt.suggestionText, speed: 50 }\"\n class=\"x-related-prompt-text\"\n :class=\"{ 'x-related-prompt-text--selected': selected }\"\n />\n <component :is=\"selected ? 'CrossTinyIcon' : 'PlusIcon'\" class=\"x-related-prompt-icon\" />\n </button>\n</template>\n\n<script lang=\"ts\">\nimport type { RelatedPrompt } from '@empathyco/x-types'\nimport type { PropType } from 'vue'\nimport { defineComponent } from 'vue'\nimport CrossTinyIcon from '../../../components/icons/cross-tiny.vue'\nimport PlusIcon from '../../../components/icons/plus.vue'\nimport { typing } from '../../../directives/typing'\n\n/**\n * This component shows a suggested related prompt.\n */\nexport default defineComponent({\n name: 'RelatedPrompt',\n directives: {\n typing,\n },\n components: {\n CrossTinyIcon,\n PlusIcon,\n },\n props: {\n relatedPrompt: {\n type: Object as PropType<RelatedPrompt>,\n required: true,\n },\n selected: {\n type: Boolean,\n default: false,\n },\n },\n})\n</script>\n\n<style lang=\"css\">\n.x-related-prompt {\n display: flex;\n align-items: center;\n justify-content: space-between;\n text-align: start;\n padding: 8px;\n gap: 8px;\n height: 100%;\n width: 100%;\n}\n\n.x-related-prompt-text {\n text-align: left;\n flex-grow: 1;\n}\n\n.x-related-prompt-text.x-related-prompt-text--selected {\n text-align: center;\n}\n\n.x-related-prompt-icon {\n height: 24px;\n flex-shrink: 0;\n align-self: start;\n}\n</style>\n"],"names":[],"mappings":";;;;;AAoBA;;AAEE;AACF,gBAAe,eAAe,CAAC;AAC7B,IAAA,IAAI,EAAE,eAAe;AACrB,IAAA,UAAU,EAAE;QACV,MAAM;AACP,KAAA;AACD,IAAA,UAAU,EAAE;QACV,aAAa;QACb,QAAQ;AACT,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,aAAa,EAAE;AACb,YAAA,IAAI,EAAE,MAAiC;AACvC,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,OAAO,EAAE,KAAK;AACf,SAAA;AACF,KAAA;AACF,CAAA,CAAA;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import injectCss from '../../../../tools/inject-css.js';
|
|
2
2
|
|
|
3
|
-
var css = "[dir=ltr] .x-related-prompt{text-align:left}[dir=rtl] .x-related-prompt{text-align:right}.x-related-prompt{align-items:center;display:flex;height:100%;justify-content:space-between;padding:8px;width:100%}.x-related-prompt-icon{align-self:start}";
|
|
3
|
+
var css = "[dir=ltr] .x-related-prompt{text-align:left}[dir=rtl] .x-related-prompt{text-align:right}.x-related-prompt{align-items:center;display:flex;gap:8px;height:100%;justify-content:space-between;padding:8px;width:100%}.x-related-prompt-text{flex-grow:1;text-align:left}.x-related-prompt-text.x-related-prompt-text--selected{text-align:center}.x-related-prompt-icon{align-self:start;flex-shrink:0;height:24px}";
|
|
4
4
|
injectCss(css);
|
|
5
5
|
|
|
6
6
|
export { css, css as default };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@empathyco/x-components",
|
|
3
|
-
"version": "6.0.0-alpha.
|
|
3
|
+
"version": "6.0.0-alpha.72",
|
|
4
4
|
"description": "Empathy X Components",
|
|
5
5
|
"author": "Empathy Systems Corporation S.L.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -142,5 +142,5 @@
|
|
|
142
142
|
"access": "public",
|
|
143
143
|
"directory": "dist"
|
|
144
144
|
},
|
|
145
|
-
"gitHead": "
|
|
145
|
+
"gitHead": "5ab432ce69a84c93cc56e7eca9eaa12ff77b5621"
|
|
146
146
|
}
|
|
@@ -9994,39 +9994,48 @@
|
|
|
9994
9994
|
},
|
|
9995
9995
|
{
|
|
9996
9996
|
"kind": "Reference",
|
|
9997
|
-
"text": "
|
|
9998
|
-
"canonicalReference": "!
|
|
9997
|
+
"text": "PropType",
|
|
9998
|
+
"canonicalReference": "@vue/runtime-core!PropType:type"
|
|
9999
9999
|
},
|
|
10000
10000
|
{
|
|
10001
10001
|
"kind": "Content",
|
|
10002
|
-
"text": "
|
|
10002
|
+
"text": "<string | "
|
|
10003
10003
|
},
|
|
10004
10004
|
{
|
|
10005
10005
|
"kind": "Reference",
|
|
10006
|
-
"text": "
|
|
10007
|
-
"canonicalReference": "!
|
|
10006
|
+
"text": "Element",
|
|
10007
|
+
"canonicalReference": "!Element:interface"
|
|
10008
10008
|
},
|
|
10009
10009
|
{
|
|
10010
10010
|
"kind": "Content",
|
|
10011
|
-
"text": "
|
|
10011
|
+
"text": ">;\n required: true;\n };\n position: {\n type: "
|
|
10012
10012
|
},
|
|
10013
10013
|
{
|
|
10014
10014
|
"kind": "Reference",
|
|
10015
|
-
"text": "
|
|
10016
|
-
"canonicalReference": "!
|
|
10015
|
+
"text": "PropType",
|
|
10016
|
+
"canonicalReference": "@vue/runtime-core!PropType:type"
|
|
10017
10017
|
},
|
|
10018
10018
|
{
|
|
10019
10019
|
"kind": "Content",
|
|
10020
|
-
"text": "
|
|
10020
|
+
"text": "<\"beforebegin\" | \"afterbegin\" | \"beforeend\" | \"afterend\" | \"onlychild\">;\n default: string;\n };\n disabled: {\n type: "
|
|
10021
10021
|
},
|
|
10022
10022
|
{
|
|
10023
10023
|
"kind": "Reference",
|
|
10024
|
-
"text": "
|
|
10025
|
-
"canonicalReference": "
|
|
10024
|
+
"text": "BooleanConstructor",
|
|
10025
|
+
"canonicalReference": "!BooleanConstructor:interface"
|
|
10026
10026
|
},
|
|
10027
10027
|
{
|
|
10028
10028
|
"kind": "Content",
|
|
10029
|
-
"text": "
|
|
10029
|
+
"text": ";\n default: boolean;\n };\n}, {\n teleportHost: "
|
|
10030
|
+
},
|
|
10031
|
+
{
|
|
10032
|
+
"kind": "Reference",
|
|
10033
|
+
"text": "HTMLDivElement",
|
|
10034
|
+
"canonicalReference": "!HTMLDivElement:interface"
|
|
10035
|
+
},
|
|
10036
|
+
{
|
|
10037
|
+
"kind": "Content",
|
|
10038
|
+
"text": ";\n}, unknown, {}, {}, import(\"vue\")."
|
|
10030
10039
|
},
|
|
10031
10040
|
{
|
|
10032
10041
|
"kind": "Reference",
|
|
@@ -10075,30 +10084,39 @@
|
|
|
10075
10084
|
},
|
|
10076
10085
|
{
|
|
10077
10086
|
"kind": "Reference",
|
|
10078
|
-
"text": "
|
|
10079
|
-
"canonicalReference": "!
|
|
10087
|
+
"text": "PropType",
|
|
10088
|
+
"canonicalReference": "@vue/runtime-core!PropType:type"
|
|
10080
10089
|
},
|
|
10081
10090
|
{
|
|
10082
10091
|
"kind": "Content",
|
|
10083
|
-
"text": "
|
|
10092
|
+
"text": "<string | "
|
|
10084
10093
|
},
|
|
10085
10094
|
{
|
|
10086
10095
|
"kind": "Reference",
|
|
10087
|
-
"text": "
|
|
10088
|
-
"canonicalReference": "!
|
|
10096
|
+
"text": "Element",
|
|
10097
|
+
"canonicalReference": "!Element:interface"
|
|
10089
10098
|
},
|
|
10090
10099
|
{
|
|
10091
10100
|
"kind": "Content",
|
|
10092
|
-
"text": "
|
|
10101
|
+
"text": ">;\n required: true;\n };\n position: {\n type: "
|
|
10093
10102
|
},
|
|
10094
10103
|
{
|
|
10095
10104
|
"kind": "Reference",
|
|
10096
|
-
"text": "
|
|
10097
|
-
"canonicalReference": "!
|
|
10105
|
+
"text": "PropType",
|
|
10106
|
+
"canonicalReference": "@vue/runtime-core!PropType:type"
|
|
10107
|
+
},
|
|
10108
|
+
{
|
|
10109
|
+
"kind": "Content",
|
|
10110
|
+
"text": "<\"beforebegin\" | \"afterbegin\" | \"beforeend\" | \"afterend\" | \"onlychild\">;\n default: string;\n };\n disabled: {\n type: "
|
|
10111
|
+
},
|
|
10112
|
+
{
|
|
10113
|
+
"kind": "Reference",
|
|
10114
|
+
"text": "BooleanConstructor",
|
|
10115
|
+
"canonicalReference": "!BooleanConstructor:interface"
|
|
10098
10116
|
},
|
|
10099
10117
|
{
|
|
10100
10118
|
"kind": "Content",
|
|
10101
|
-
"text": ";\n
|
|
10119
|
+
"text": ";\n default: boolean;\n };\n}>>, {\n position: \"beforebegin\" | \"afterbegin\" | \"beforeend\" | \"afterend\" | \"onlychild\";\n disabled: boolean;\n}, {}>"
|
|
10102
10120
|
}
|
|
10103
10121
|
],
|
|
10104
10122
|
"fileUrlPath": "dist/types/components/base-teleport.vue.d.ts",
|
|
@@ -10107,7 +10125,7 @@
|
|
|
10107
10125
|
"name": "BaseTeleport",
|
|
10108
10126
|
"variableTypeTokenRange": {
|
|
10109
10127
|
"startIndex": 1,
|
|
10110
|
-
"endIndex":
|
|
10128
|
+
"endIndex": 32
|
|
10111
10129
|
}
|
|
10112
10130
|
},
|
|
10113
10131
|
{
|
|
@@ -1477,34 +1477,35 @@ allowTabDeselect: boolean;
|
|
|
1477
1477
|
// @public (undocumented)
|
|
1478
1478
|
export const BaseTeleport: DefineComponent< {
|
|
1479
1479
|
target: {
|
|
1480
|
-
type:
|
|
1480
|
+
type: PropType<string | Element>;
|
|
1481
1481
|
required: true;
|
|
1482
1482
|
};
|
|
1483
|
-
|
|
1483
|
+
position: {
|
|
1484
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
1485
|
+
default: string;
|
|
1486
|
+
};
|
|
1487
|
+
disabled: {
|
|
1484
1488
|
type: BooleanConstructor;
|
|
1485
1489
|
default: boolean;
|
|
1486
1490
|
};
|
|
1487
|
-
position: {
|
|
1488
|
-
type: NumberConstructor;
|
|
1489
|
-
required: false;
|
|
1490
|
-
};
|
|
1491
1491
|
}, {
|
|
1492
|
-
|
|
1492
|
+
teleportHost: HTMLDivElement;
|
|
1493
1493
|
}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes< {
|
|
1494
1494
|
target: {
|
|
1495
|
-
type:
|
|
1495
|
+
type: PropType<string | Element>;
|
|
1496
1496
|
required: true;
|
|
1497
1497
|
};
|
|
1498
|
-
|
|
1498
|
+
position: {
|
|
1499
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
1500
|
+
default: string;
|
|
1501
|
+
};
|
|
1502
|
+
disabled: {
|
|
1499
1503
|
type: BooleanConstructor;
|
|
1500
1504
|
default: boolean;
|
|
1501
1505
|
};
|
|
1502
|
-
position: {
|
|
1503
|
-
type: NumberConstructor;
|
|
1504
|
-
required: false;
|
|
1505
|
-
};
|
|
1506
1506
|
}>>, {
|
|
1507
|
-
|
|
1507
|
+
position: "beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild";
|
|
1508
|
+
disabled: boolean;
|
|
1508
1509
|
}, {}>;
|
|
1509
1510
|
|
|
1510
1511
|
// @public
|
|
@@ -1,33 +1,55 @@
|
|
|
1
|
+
import type { PropType } from 'vue';
|
|
1
2
|
declare const _default: import("vue").DefineComponent<{
|
|
3
|
+
/** The element or css selector to which the component will be teleported. */
|
|
2
4
|
target: {
|
|
3
|
-
type:
|
|
5
|
+
type: PropType<string | Element>;
|
|
4
6
|
required: true;
|
|
5
7
|
};
|
|
6
|
-
|
|
8
|
+
/**
|
|
9
|
+
* The position relative to the target
|
|
10
|
+
* - `beforebegin`: Before the target element.
|
|
11
|
+
* - `afterbegin`: Inside the target element, before its first child.
|
|
12
|
+
* - `beforeend`: Inside the target element, after its last child.
|
|
13
|
+
* - `afterend`: After the target element.
|
|
14
|
+
* - `onlychild`: Adds it as child and hides all other children of the target element.
|
|
15
|
+
*/
|
|
16
|
+
position: {
|
|
17
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
18
|
+
default: string;
|
|
19
|
+
};
|
|
20
|
+
/** If disabled, the slot content will not be teleported */
|
|
21
|
+
disabled: {
|
|
7
22
|
type: BooleanConstructor;
|
|
8
23
|
default: boolean;
|
|
9
24
|
};
|
|
10
|
-
position: {
|
|
11
|
-
type: NumberConstructor;
|
|
12
|
-
required: false;
|
|
13
|
-
};
|
|
14
25
|
}, {
|
|
15
|
-
|
|
26
|
+
teleportHost: HTMLDivElement;
|
|
16
27
|
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
28
|
+
/** The element or css selector to which the component will be teleported. */
|
|
17
29
|
target: {
|
|
18
|
-
type:
|
|
30
|
+
type: PropType<string | Element>;
|
|
19
31
|
required: true;
|
|
20
32
|
};
|
|
21
|
-
|
|
33
|
+
/**
|
|
34
|
+
* The position relative to the target
|
|
35
|
+
* - `beforebegin`: Before the target element.
|
|
36
|
+
* - `afterbegin`: Inside the target element, before its first child.
|
|
37
|
+
* - `beforeend`: Inside the target element, after its last child.
|
|
38
|
+
* - `afterend`: After the target element.
|
|
39
|
+
* - `onlychild`: Adds it as child and hides all other children of the target element.
|
|
40
|
+
*/
|
|
41
|
+
position: {
|
|
42
|
+
type: PropType<"beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild">;
|
|
43
|
+
default: string;
|
|
44
|
+
};
|
|
45
|
+
/** If disabled, the slot content will not be teleported */
|
|
46
|
+
disabled: {
|
|
22
47
|
type: BooleanConstructor;
|
|
23
48
|
default: boolean;
|
|
24
49
|
};
|
|
25
|
-
position: {
|
|
26
|
-
type: NumberConstructor;
|
|
27
|
-
required: false;
|
|
28
|
-
};
|
|
29
50
|
}>>, {
|
|
30
|
-
|
|
51
|
+
position: "beforebegin" | "afterbegin" | "beforeend" | "afterend" | "onlychild";
|
|
52
|
+
disabled: boolean;
|
|
31
53
|
}, {}>;
|
|
32
54
|
export default _default;
|
|
33
55
|
//# sourceMappingURL=base-teleport.vue?vue&type=script&lang.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-teleport.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../src/components/base-teleport.vue?vue&type=script&lang.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"base-teleport.vue?vue&type=script&lang.d.ts","sourceRoot":"","sources":["../../../src/components/base-teleport.vue?vue&type=script&lang.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAA;;IAM/B,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;IAnB3D,6EAA6E;;;;;IAK7E;;;;;;;OAOG;;;;;IAOH,2DAA2D;;;;;;;;;AAtB/D,wBAiDE"}
|