@nmorph/nmorph-ui-kit 3.0.8 → 3.0.10
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/dist/components/basic/nmorph-button/NmorphButton.css +1 -1
- package/dist/components/data/nmorph-empty/NmorphEmpty.css +1 -1
- package/dist/components/data/nmorph-image/NmorphImage.vue2.js +13 -14
- package/dist/components/data/nmorph-media-tile/NmorphMediaTile.vue.js +28 -25
- package/dist/components/data/nmorph-table/NmorphTable.css +1 -1
- package/dist/components/feedback/nmorph-guide/NmorphGuide.vue2.js +48 -46
- package/dist/components/feedback/nmorph-guide/NmorphGuideStep.css +1 -1
- package/dist/components/feedback/nmorph-guide/NmorphGuideStep.vue.js +79 -72
- package/dist/components/form/nmorph-color-picker/NmorphColorPicker.css +1 -1
- package/dist/components/form/nmorph-color-picker/NmorphColorPicker.vue.js +5 -5
- package/dist/components/form/nmorph-time-picker/NmorphTimePicker.css +1 -1
- package/dist/components/form/nmorph-time-picker/NmorphTimePicker.vue.js +66 -64
- package/dist/components/navigation/nmorph-tabs/NmorphTabs.css +1 -1
- package/dist/emoji/index.d.ts +1 -1
- package/dist/emoji/index.js +1 -1
- package/dist/emoji/locales/en.d.ts +4 -0
- package/dist/emoji/locales/en.js +1 -1
- package/dist/emoji/locales/ru.d.ts +4 -0
- package/dist/emoji/locales/ru.js +1 -1
- package/dist/emoji/locales/zh.d.ts +4 -0
- package/dist/emoji/locales/zh.js +1 -1
- package/dist/index.es.js +2 -2
- package/dist/index.umd.js +28 -28
- package/dist/locales/en.js +0 -1
- package/dist/locales/ru.js +0 -1
- package/dist/locales/zh.js +0 -1
- package/dist/outside-hooks/use-nmorph-theme.js +1 -1
- package/dist/package.json.js +1 -1
- package/dist/plugin.js +1 -1
- package/dist/src/components/basic/index.d.ts +2 -0
- package/dist/src/components/data/index.d.ts +13 -0
- package/dist/src/{emoji → components/data/nmorph-emoji-picker/emoji}/base.d.ts +1 -1
- package/dist/src/components/data/nmorph-image/NmorphImage.vue.d.ts +0 -1
- package/dist/src/components/data/nmorph-image/types.d.ts +0 -2
- package/dist/src/components/feedback/index.d.ts +3 -0
- package/dist/src/components/feedback/nmorph-drawer/NmorphDrawer.vue.d.ts +2 -1
- package/dist/src/components/feedback/nmorph-guide/NmorphGuide.vue.d.ts +1 -0
- package/dist/src/components/feedback/nmorph-guide/types.d.ts +2 -0
- package/dist/src/components/form/index.d.ts +14 -0
- package/dist/src/components/form/nmorph-slider/NmorphSlider.vue.d.ts +1 -1
- package/dist/src/components/navigation/index.d.ts +4 -0
- package/dist/src/components/others/index.d.ts +1 -0
- package/dist/src/main.d.ts +1 -1
- package/dist/src/plugin.d.ts +1 -1
- package/dist/style.css +1 -1
- package/package.json +14 -25
- /package/dist/{emoji → components/data/nmorph-emoji-picker/emoji}/base.js +0 -0
- /package/dist/outside-utils/{index.js → nmorph-log.js} +0 -0
- /package/dist/src/{emoji → components/data/nmorph-emoji-picker/emoji}/index.d.ts +0 -0
- /package/dist/src/{emoji → components/data/nmorph-emoji-picker/emoji}/locales/en.d.ts +0 -0
- /package/dist/src/{emoji → components/data/nmorph-emoji-picker/emoji}/locales/ru.d.ts +0 -0
- /package/dist/src/{emoji → components/data/nmorph-emoji-picker/emoji}/locales/zh.d.ts +0 -0
- /package/dist/src/outside-utils/{index.d.ts → nmorph-log.d.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
.nmorph-button{display:inline-block;width:auto;height:auto;min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph--basic-component,.nmorph-button.nmorph--thin-component,.nmorph-button.nmorph--thick-component{height:auto}.nmorph-button.nmorph--fill{width:100%}.nmorph-button .nmorph-button__content{display:flex;gap:var(--indentation-02);justify-content:center;align-items:center;box-sizing:border-box;width:100%;height:auto;min-height:var(--nmorph-private-control-height);padding:var(--
|
|
1
|
+
.nmorph-button{--nmorph-private-button-padding-y: max(var(--indentation-01), calc(var(--nmorph-private-control-height) * .1));display:inline-block;width:auto;height:auto;min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph--basic-component,.nmorph-button.nmorph--thin-component,.nmorph-button.nmorph--extra-thin-component,.nmorph-button.nmorph--thick-component{height:auto}.nmorph-button.nmorph--fill{width:100%}.nmorph-button .nmorph-button__content{display:flex;gap:var(--indentation-02);justify-content:center;align-items:center;box-sizing:border-box;width:100%;height:auto;min-height:var(--nmorph-private-control-height);padding:var(--nmorph-private-button-padding-y) var(--indentation-04);color:var(--nmorph-private-button-color, var(--nmorph-text-color));line-height:var(--nmorph-private-control-line-height, var(--line-height-regular));background:var(--nmorph-main-color);border:none;border-radius:var(--default-border-radius);box-shadow:var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color),calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color);cursor:pointer}.nmorph-button .nmorph-button__content span{color:var(--nmorph-private-button-color, var(--nmorph-text-color));--nmorph-private-icon-color: var(--nmorph-private-button-color, var(--nmorph-text-color))}.nmorph-button .nmorph-button__label{display:inline-block;min-width:0;line-height:var(--line-height-regular);white-space:normal;text-align:center;overflow-wrap:anywhere;transform:translateY(var(--nmorph-private-control-text-offset-y))}.nmorph-button .nmorph-button__content>.nmorph-icon{flex-shrink:0;--nmorph-private-icon-color: var(--nmorph-private-button-color, var(--nmorph-text-color))}.nmorph-button .nmorph-button__content:disabled{pointer-events:none}.nmorph-button .nmorph-button__content[loading=true]{cursor:default}.nmorph-button.nmorph-button--ripple .nmorph-button__content{position:relative;overflow:hidden}.nmorph-button.nmorph-button--ripple .nmorph-button__content:after{position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle,var(--nmorph-main-color) 10%,transparent 10.01%);background-repeat:no-repeat;background-position:50%;transform:scale(10);opacity:0;transition:transform .3s,opacity 1s;content:""}.nmorph-button.nmorph-button--ripple .nmorph-button__content:active:after{transform:scale(0);opacity:.3;transition:0s}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-white-color);background:var(--nmorph-accent-color);box-shadow:none}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-white-color)}.nmorph-button.nmorph-button--accent-bg-on-hover .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-white-color)}.nmorph-button.nmorph-button--active .nmorph-button__content{color:var(--nmorph-focus-text-color);background:var(--nmorph-accent-color);box-shadow:var(--nmorph-shadow-inset)}.nmorph-button.nmorph-button--active .nmorph-button__content span,.nmorph-button.nmorph-button--active .nmorph-button__content .nmorph-icon{color:var(--nmorph-focus-text-color);--nmorph-private-icon-color: var(--nmorph-focus-text-color)}.nmorph-button.nmorph-button--danger .nmorph-button__content{color:var(--nmorph-error-text-color);--nmorph-private-button-color: var(--nmorph-error-text-color)}.nmorph-button.nmorph-button--round .nmorph-button__content{border-radius:var(--border-radius-200)}.nmorph-button.nmorph-button--circle{width:var(--nmorph-private-control-height);height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph-button--circle .nmorph-button__content{height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height);border-radius:var(--border-radius-circular)}.nmorph-button.nmorph-button--plain{padding:var(--indentation-00)}.nmorph-button.nmorph-button--plain .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-accent-color);background:transparent;border-color:var(--nmorph-accent-color);box-shadow:none}.nmorph-button.nmorph-button--plain.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover{color:var(--nmorph-private-button-hover-color);border-color:var(--nmorph-private-button-hover-color)}.nmorph-button.nmorph-button--plain .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-accent-color)}.nmorph-button.nmorph-button--plain.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover span{color:var(--nmorph-private-button-hover-color);--nmorph-private-icon-color: var(--nmorph-private-button-hover-color)}.nmorph-button.nmorph-button--plain .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-accent-color)}.nmorph-button.nmorph-button--plain.nmorph-button--custom-color .nmorph-button__content:not(:disabled,[loading=true]):hover .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-private-button-hover-color)}.nmorph-button.nmorph-button--plain .nmorph-button__content{color:var(--nmorph-private-button-color, var(--nmorph-private-button-plain-color, var(--nmorph-text-color)));background:transparent;border:var(--nmorph-plain-border);border-color:var(--nmorph-private-button-color, var(--nmorph-private-button-plain-color, var(--nmorph-text-color)));box-shadow:none}.nmorph-button.nmorph-button--plain .nmorph-button__content span{color:var(--nmorph-private-button-color, var(--nmorph-private-button-plain-color, var(--nmorph-text-color)));--nmorph-private-icon-color: var( --nmorph-private-button-color, var(--nmorph-private-button-plain-color, var(--nmorph-text-color)) )}.nmorph-button.nmorph-button--plain .nmorph-button__content .nmorph-icon{--nmorph-private-icon-color: var( --nmorph-private-button-color, var(--nmorph-private-button-plain-color, var(--nmorph-text-color)) )}.nmorph-button.nmorph-button--plain.nmorph-button--borderless .nmorph-button__content,.nmorph-button.nmorph-button--plain.nmorph-button--borderless .nmorph-button__content:not(:disabled,[loading=true]):hover{border:none}.nmorph-button.nmorph-button--square{width:var(--nmorph-private-control-height);height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph-button--square .nmorph-button__content{height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph-button--icon-only{width:var(--nmorph-private-control-height);height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height)}.nmorph-button.nmorph-button--icon-only .nmorph-button__content{height:var(--nmorph-private-control-height);min-height:var(--nmorph-private-control-height);padding:0;line-height:0}.nmorph-button.nmorph-button--disabled{cursor:not-allowed;opacity:.6}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nmorph-empty{display:flex;flex-direction:column;gap:8px;justify-content:center;align-items:center;box-sizing:border-box;width:100%;min-height:var(--nmorph-private-empty-min-height);padding:var(--nmorph-private-empty-padding);color:var(--nmorph-text-color);text-align:center;border-radius:var(--default-border-radius)}.nmorph-empty .nmorph-empty__icon{display:flex;justify-content:center;align-items:center;width:var(--nmorph-private-empty-icon-size);height:var(--nmorph-private-empty-icon-size);color:var(--nmorph-semi-contrast-text-color)}.nmorph-empty .nmorph-empty__icon .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-semi-contrast-text-color)}.nmorph-empty .nmorph-empty__title{max-width:100%;font-weight:var(--nmorph-typography-title-font-weight);font-size:var(--nmorph-typography-title-font-size);line-height:var(--nmorph-typography-title-line-height);overflow-wrap:anywhere}.nmorph-empty .nmorph-empty__description{max-width:min(420px,100%);color:var(--nmorph-semi-contrast-text-color);font-weight:var(--nmorph-typography-body-font-weight);font-size:var(--nmorph-typography-body-font-size);line-height:var(--nmorph-typography-body-line-height);overflow-wrap:anywhere}.nmorph-empty .nmorph-empty__action{display:flex;justify-content:center;max-width:100%;margin-top:4px}.nmorph-empty.nmorph-empty--nmorph{background:var(--nmorph-main-color)}.nmorph-empty.nmorph-empty--nmorph.nmorph--shadow-inset{box-shadow:var(--nmorph-shadow-inset)}.nmorph-empty.nmorph-empty--nmorph.nmorph--shadow-outset{box-shadow:var(--nmorph-shadow-outset)}.nmorph-empty.nmorph-empty--plain{
|
|
1
|
+
.nmorph-empty{display:flex;flex-direction:column;gap:8px;justify-content:center;align-items:center;box-sizing:border-box;width:100%;min-height:var(--nmorph-private-empty-min-height);padding:var(--nmorph-private-empty-padding);color:var(--nmorph-text-color);text-align:center;border-radius:var(--default-border-radius)}.nmorph-empty .nmorph-empty__icon{display:flex;justify-content:center;align-items:center;width:var(--nmorph-private-empty-icon-size);height:var(--nmorph-private-empty-icon-size);color:var(--nmorph-semi-contrast-text-color)}.nmorph-empty .nmorph-empty__icon .nmorph-icon{--nmorph-private-icon-color: var(--nmorph-semi-contrast-text-color)}.nmorph-empty .nmorph-empty__title{max-width:100%;font-weight:var(--nmorph-typography-title-font-weight);font-size:var(--nmorph-typography-title-font-size);line-height:var(--nmorph-typography-title-line-height);overflow-wrap:anywhere}.nmorph-empty .nmorph-empty__description{max-width:min(420px,100%);color:var(--nmorph-semi-contrast-text-color);font-weight:var(--nmorph-typography-body-font-weight);font-size:var(--nmorph-typography-body-font-size);line-height:var(--nmorph-typography-body-line-height);overflow-wrap:anywhere}.nmorph-empty .nmorph-empty__action{display:flex;justify-content:center;max-width:100%;margin-top:4px}.nmorph-empty.nmorph-empty--nmorph{background:var(--nmorph-main-color)}.nmorph-empty.nmorph-empty--nmorph.nmorph--shadow-inset{box-shadow:var(--nmorph-shadow-inset)}.nmorph-empty.nmorph-empty--nmorph.nmorph--shadow-outset{box-shadow:var(--nmorph-shadow-outset)}.nmorph-empty.nmorph-empty--plain{background:color-mix(in srgb,var(--nmorph-overlay-color) 42%,transparent)}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import './NmorphImage.css';
|
|
2
2
|
import { defineComponent as S, computed as t, ref as s } from "vue";
|
|
3
|
-
import { useModifiers as
|
|
4
|
-
import { createCssSizeVariables as
|
|
5
|
-
import { useI18n as
|
|
6
|
-
import
|
|
3
|
+
import { useModifiers as _ } from "../../../utils/create-modifiers.js";
|
|
4
|
+
import { createCssSizeVariables as q } from "../../../utils/common.js";
|
|
5
|
+
import { useI18n as b } from "vue-i18n";
|
|
6
|
+
import x from "../../basic/nmorph-icon/NmorphIcon.vue.js";
|
|
7
7
|
import I from "../../../assets/icons/loading.svg.js";
|
|
8
8
|
const C = /* @__PURE__ */ S({
|
|
9
9
|
__name: "NmorphImage",
|
|
10
10
|
props: {
|
|
11
11
|
design: { type: null, required: !1, default: "nmorph" },
|
|
12
|
-
loadingText: { type: String, required: !1, default: "" },
|
|
13
12
|
loadFailedText: { type: String, required: !1, default: "" },
|
|
14
13
|
frameBorder: { type: Number, required: !1, default: 2.67 },
|
|
15
14
|
src: { type: String, required: !1 },
|
|
@@ -22,32 +21,32 @@ const C = /* @__PURE__ */ S({
|
|
|
22
21
|
emits: ["error", "load"],
|
|
23
22
|
setup(u, { expose: p, emit: f }) {
|
|
24
23
|
p();
|
|
25
|
-
const { t: l } =
|
|
24
|
+
const { t: l } = b(), e = u, c = t(() => e.loadFailedText ? e.loadFailedText : l("loadFailedText")), r = s(!1), o = s(!1), a = f, h = (d) => {
|
|
26
25
|
r.value = !0, o.value = !1, a("load", d);
|
|
27
|
-
},
|
|
26
|
+
}, g = (d) => {
|
|
28
27
|
r.value = !0, o.value = !0, a("error", d);
|
|
29
|
-
},
|
|
30
|
-
() =>
|
|
28
|
+
}, m = t(() => r.value && o.value), i = t(() => e.design || "nmorph"), v = t(
|
|
29
|
+
() => _({
|
|
31
30
|
nmorph: [i.value === "nmorph" ? "shadow-combined" : ""],
|
|
32
31
|
"nmorph-image": [
|
|
33
32
|
i.value,
|
|
34
33
|
e.frameBorder > 0 && "framed",
|
|
35
|
-
(
|
|
34
|
+
(m.value || !r.value) && "hide"
|
|
36
35
|
]
|
|
37
36
|
})
|
|
38
37
|
), y = t(() => ({
|
|
39
|
-
...
|
|
38
|
+
...q({
|
|
40
39
|
"--nmorph-private-image-width": e.width,
|
|
41
40
|
"--nmorph-private-image-height": e.height
|
|
42
41
|
}),
|
|
43
42
|
"--nmorph-private-image-fit": e.fit || "cover",
|
|
44
43
|
"--nmorph-private-image-frame-border": `${e.frameBorder}px`
|
|
45
|
-
})),
|
|
46
|
-
return
|
|
44
|
+
})), n = { t: l, props: e, computedLoadFailedText: c, imageLoadFinished: r, imageLoadError: o, emit: a, onImageLoad: h, onImageError: g, loadingFailed: m, resolvedDesign: i, modifiers: v, styles: y, get NmorphIcon() {
|
|
45
|
+
return x;
|
|
47
46
|
}, get NmorphIconLoader() {
|
|
48
47
|
return I;
|
|
49
48
|
} };
|
|
50
|
-
return Object.defineProperty(
|
|
49
|
+
return Object.defineProperty(n, "__isScriptSetup", { enumerable: !1, value: !0 }), n;
|
|
51
50
|
}
|
|
52
51
|
});
|
|
53
52
|
export {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './NmorphMediaTile.css';
|
|
2
|
-
import
|
|
3
|
-
import { openBlock as e, createElementBlock as
|
|
2
|
+
import d from "./NmorphMediaTile.vue2.js";
|
|
3
|
+
import { openBlock as e, createElementBlock as a, normalizeClass as m, withDirectives as p, createElementVNode as c, vShow as _, createCommentVNode as r, createBlock as i, withCtx as l, createVNode as n, toDisplayString as t, renderSlot as h } from "vue";
|
|
4
4
|
/* empty css */
|
|
5
5
|
import f from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
6
6
|
const v = ["src", "muted", "autoplay", "playsinline"], y = ["muted", "autoplay"], k = {
|
|
@@ -19,8 +19,8 @@ const v = ["src", "muted", "autoplay", "playsinline"], y = ["muted", "autoplay"]
|
|
|
19
19
|
key: 2,
|
|
20
20
|
class: "nmorph-media-tile__status"
|
|
21
21
|
};
|
|
22
|
-
function S(
|
|
23
|
-
return e(),
|
|
22
|
+
function S(s, x, V, o, B, M) {
|
|
23
|
+
return e(), a(
|
|
24
24
|
"div",
|
|
25
25
|
{
|
|
26
26
|
class: m(o.modifiers)
|
|
@@ -36,16 +36,16 @@ function S(d, x, V, o, B, M) {
|
|
|
36
36
|
}, null, 8, v), [
|
|
37
37
|
[_, o.videoVisible && !o.props.loading]
|
|
38
38
|
]),
|
|
39
|
-
o.needsSeparateAudioOutput ? (e(),
|
|
39
|
+
o.needsSeparateAudioOutput ? (e(), a("audio", {
|
|
40
40
|
key: 0,
|
|
41
41
|
ref: "audioRef",
|
|
42
42
|
class: "nmorph-media-tile__audio",
|
|
43
43
|
muted: o.props.muted,
|
|
44
44
|
autoplay: o.props.autoplay,
|
|
45
45
|
preload: "auto"
|
|
46
|
-
}, null, 8, y)) :
|
|
47
|
-
o.props.showFallback && (!o.videoVisible || o.props.loading) ? (e(),
|
|
48
|
-
o.props.loading ? (e(),
|
|
46
|
+
}, null, 8, y)) : r("v-if", !0),
|
|
47
|
+
o.props.showFallback && (!o.videoVisible || o.props.loading) ? (e(), a("div", k, [
|
|
48
|
+
o.props.loading ? (e(), i(o.NmorphIcon, {
|
|
49
49
|
key: 0,
|
|
50
50
|
class: "nmorph-media-tile__loader",
|
|
51
51
|
size: "large"
|
|
@@ -55,39 +55,40 @@ function S(d, x, V, o, B, M) {
|
|
|
55
55
|
]),
|
|
56
56
|
_: 1
|
|
57
57
|
/* STABLE */
|
|
58
|
-
})) : o.props.avatarSrc ? (e(),
|
|
58
|
+
})) : o.props.avatarSrc ? (e(), i(o.NmorphAvatar, {
|
|
59
59
|
key: 1,
|
|
60
60
|
src: o.props.avatarSrc,
|
|
61
61
|
name: o.props.name,
|
|
62
62
|
size: 72,
|
|
63
63
|
design: "plain"
|
|
64
|
-
}, null, 8, ["src", "name"])) : (e(),
|
|
64
|
+
}, null, 8, ["src", "name"])) : (e(), a(
|
|
65
65
|
"div",
|
|
66
66
|
b,
|
|
67
67
|
t(o.fallbackLabel),
|
|
68
68
|
1
|
|
69
69
|
/* TEXT */
|
|
70
70
|
)),
|
|
71
|
-
o.props.name ? (e(),
|
|
71
|
+
o.props.name ? (e(), a(
|
|
72
72
|
"span",
|
|
73
73
|
N,
|
|
74
74
|
t(o.props.name),
|
|
75
75
|
1
|
|
76
76
|
/* TEXT */
|
|
77
|
-
)) :
|
|
78
|
-
o.props.error && o.props.errorText ? (e(),
|
|
77
|
+
)) : r("v-if", !0),
|
|
78
|
+
o.props.error && o.props.errorText ? (e(), a(
|
|
79
79
|
"span",
|
|
80
80
|
u,
|
|
81
81
|
t(o.props.errorText),
|
|
82
82
|
1
|
|
83
83
|
/* TEXT */
|
|
84
|
-
)) :
|
|
85
|
-
])) :
|
|
86
|
-
o.props.showStatus ? (e(),
|
|
87
|
-
o.props.micMuted ? (e(),
|
|
84
|
+
)) : r("v-if", !0)
|
|
85
|
+
])) : r("v-if", !0),
|
|
86
|
+
o.props.showStatus ? (e(), a("div", g, [
|
|
87
|
+
o.props.micMuted ? (e(), i(o.NmorphButton, {
|
|
88
88
|
key: 0,
|
|
89
89
|
class: "nmorph-media-tile__status-item",
|
|
90
90
|
design: "plain",
|
|
91
|
+
borderless: "",
|
|
91
92
|
tabindex: -1,
|
|
92
93
|
"aria-label": "Microphone muted"
|
|
93
94
|
}, {
|
|
@@ -96,11 +97,12 @@ function S(d, x, V, o, B, M) {
|
|
|
96
97
|
]),
|
|
97
98
|
_: 1
|
|
98
99
|
/* STABLE */
|
|
99
|
-
})) :
|
|
100
|
-
o.props.videoOff ? (e(),
|
|
100
|
+
})) : r("v-if", !0),
|
|
101
|
+
o.props.videoOff ? (e(), i(o.NmorphButton, {
|
|
101
102
|
key: 1,
|
|
102
103
|
class: "nmorph-media-tile__status-item",
|
|
103
104
|
design: "plain",
|
|
105
|
+
borderless: "",
|
|
104
106
|
tabindex: -1,
|
|
105
107
|
"aria-label": "Video off"
|
|
106
108
|
}, {
|
|
@@ -109,11 +111,12 @@ function S(d, x, V, o, B, M) {
|
|
|
109
111
|
]),
|
|
110
112
|
_: 1
|
|
111
113
|
/* STABLE */
|
|
112
|
-
})) :
|
|
113
|
-
o.props.screenSharing ? (e(),
|
|
114
|
+
})) : r("v-if", !0),
|
|
115
|
+
o.props.screenSharing ? (e(), i(o.NmorphButton, {
|
|
114
116
|
key: 2,
|
|
115
117
|
class: "nmorph-media-tile__status-item",
|
|
116
118
|
design: "plain",
|
|
119
|
+
borderless: "",
|
|
117
120
|
tabindex: -1,
|
|
118
121
|
"aria-label": "Screen sharing"
|
|
119
122
|
}, {
|
|
@@ -122,15 +125,15 @@ function S(d, x, V, o, B, M) {
|
|
|
122
125
|
]),
|
|
123
126
|
_: 1
|
|
124
127
|
/* STABLE */
|
|
125
|
-
})) :
|
|
126
|
-
])) :
|
|
127
|
-
h(
|
|
128
|
+
})) : r("v-if", !0)
|
|
129
|
+
])) : r("v-if", !0),
|
|
130
|
+
h(s.$slots, "overlay")
|
|
128
131
|
],
|
|
129
132
|
2
|
|
130
133
|
/* CLASS */
|
|
131
134
|
);
|
|
132
135
|
}
|
|
133
|
-
const z = /* @__PURE__ */ f(
|
|
136
|
+
const z = /* @__PURE__ */ f(d, [["render", S], ["__file", "/builds/ketjo/nmorph/library/src/components/data/nmorph-media-tile/NmorphMediaTile.vue"]]);
|
|
134
137
|
export {
|
|
135
138
|
z as default
|
|
136
139
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nmorph-table{--nmorph-private-table-border-color: var(--nmorph-
|
|
1
|
+
.nmorph-table{--nmorph-private-table-border-color: color-mix(in srgb, var(--nmorph-text-color) 52%, transparent);--nmorph-private-table-cell-height: auto;--nmorph-private-table-row-hover-background: var(--nmorph-info-color)}.nmorph-table .nmorph-table__header th{border-bottom:0}.nmorph-table .nmorph-table__button-wrapper{display:flex;align-items:center;margin-left:var(--indentation-03)}.nmorph-table table{width:calc(100% - 2px);margin-left:1px;table-layout:fixed;border-collapse:collapse;border-spacing:0}.nmorph-table .nmorph-table__table-data{padding:var(--indentation-03) 0;border-bottom:1px solid var(--nmorph-private-table-border-color)}.nmorph-table .nmorph-table__table-data--bordered{border:1px solid var(--nmorph-private-table-border-color)}.nmorph-table .nmorph-table__cell{padding:0 var(--indentation-03)}.nmorph-table .nmorph-table__cell-content{display:flex;align-items:center}.nmorph-table .nmorph-table__cell--data{height:var(--nmorph-private-table-cell-height)}.nmorph-table .nmorph-table__body{position:relative}.nmorph-table .nmorph-table__body--virtual{overflow-x:hidden}.nmorph-table .nmorph-table__body--virtual .nmorph-table__table-data{height:var(--nmorph-private-table-virtual-row-height);padding-top:0;padding-bottom:0}.nmorph-table .nmorph-table__body--virtual.nmorph-table__body--dynamic .nmorph-table__table-data{height:auto}.nmorph-table .nmorph-table__virtual-spacer{position:relative;min-width:100%}.nmorph-table .nmorph-table__virtual-content{position:absolute;top:0;right:0;left:0}.nmorph-table .nmorph-table__table-data-row--row-hover:hover,.nmorph-table .nmorph-table__table-data-row--active{background:var(--nmorph-private-table-row-hover-background)}.nmorph-table--nmorph{overflow:hidden;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-outset);--nmorph-private-table-border-color: transparent}.nmorph-table--nmorph .nmorph-table__button-wrapper{padding:var(--indentation-02)}.nmorph-table--nmorph .nmorph-table__table-row{background:var(--nmorph-main-color);box-shadow:var(--nmorph-shadow-inset)}.nmorph-table--plain{overflow:hidden;background:var(--nmorph-main-color);border:var(--nmorph-plain-border);border-radius:var(--default-border-radius)}.nmorph-table--plain.nmorph-table--bordered{border:1px solid var(--nmorph-private-table-border-color)}.nmorph-table--plain.nmorph-table--bordered table{width:100%;margin-left:0}.nmorph-table--plain.nmorph-table--bordered .nmorph-table__table-data--bordered{border:0;border-right:1px solid var(--nmorph-private-table-border-color);border-bottom:1px solid var(--nmorph-private-table-border-color)}.nmorph-table--plain.nmorph-table--bordered .nmorph-table__table-data--bordered:last-child{border-right:0}.nmorph-table--plain.nmorph-table--bordered .nmorph-table__body:not(.nmorph-table__body--virtual) .nmorph-table__table-data-row:last-child .nmorph-table__table-data--bordered{border-bottom:0}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import './NmorphGuide.css';
|
|
2
|
-
import { defineComponent as j, ref as
|
|
2
|
+
import { defineComponent as j, ref as B, computed as a, watch as z, provide as A } from "vue";
|
|
3
3
|
import { useZIndex as V } from "../../../hooks/use-z-index.js";
|
|
4
4
|
import { nmorphGuideInjectionKey as W } from "./types.js";
|
|
5
5
|
const E = /* @__PURE__ */ j({
|
|
@@ -12,6 +12,7 @@ const E = /* @__PURE__ */ j({
|
|
|
12
12
|
closeOnFinish: { type: Boolean, required: !1, default: !0 },
|
|
13
13
|
showClose: { type: Boolean, required: !1, default: !0 },
|
|
14
14
|
showProgress: { type: Boolean, required: !1, default: !0 },
|
|
15
|
+
bordered: { type: Boolean, required: !1, default: !1 },
|
|
15
16
|
backText: { type: String, required: !1, default: "Back" },
|
|
16
17
|
nextText: { type: String, required: !1, default: "Next" },
|
|
17
18
|
finishText: { type: String, required: !1, default: "Finish" },
|
|
@@ -23,40 +24,40 @@ const E = /* @__PURE__ */ j({
|
|
|
23
24
|
maxWidth: { type: [Number, String], required: !1, default: "280px" }
|
|
24
25
|
},
|
|
25
26
|
emits: ["update:model-value", "update:active-step", "change", "back", "next", "finish", "close"],
|
|
26
|
-
setup(
|
|
27
|
-
const
|
|
28
|
-
let
|
|
29
|
-
const d = (e) => String(e),
|
|
27
|
+
setup(C, { expose: N, emit: F }) {
|
|
28
|
+
const t = C, i = F, u = B({}), x = B(void 0);
|
|
29
|
+
let f = 0;
|
|
30
|
+
const d = (e) => String(e), b = a(() => {
|
|
30
31
|
const e = /* @__PURE__ */ new Map();
|
|
31
|
-
return
|
|
32
|
-
e.set(d(
|
|
33
|
-
...
|
|
34
|
-
order:
|
|
32
|
+
return t.steps.forEach((r, o) => {
|
|
33
|
+
e.set(d(r.name), {
|
|
34
|
+
...r,
|
|
35
|
+
order: r.order ?? o
|
|
35
36
|
});
|
|
36
37
|
}), e;
|
|
37
38
|
}), s = a(
|
|
38
39
|
() => Object.values(u.value).map((e) => ({
|
|
39
40
|
...e,
|
|
40
|
-
...
|
|
41
|
+
...b.value.get(d(e.name)),
|
|
41
42
|
registrationOrder: e.registrationOrder
|
|
42
|
-
})).filter((e) => !e.disabled).sort((e,
|
|
43
|
-
const o = e.order ?? e.registrationOrder, P =
|
|
43
|
+
})).filter((e) => !e.disabled).sort((e, r) => {
|
|
44
|
+
const o = e.order ?? e.registrationOrder, P = r.order ?? r.registrationOrder;
|
|
44
45
|
return o - P;
|
|
45
46
|
})
|
|
46
|
-
), g = a(() =>
|
|
47
|
-
const
|
|
48
|
-
|
|
47
|
+
), g = a(() => t.modelValue && s.value.length > 0), T = V(g, () => t.zIndex), q = a(() => t.activeStep ?? x.value), l = a(() => s.value.findIndex((e) => e.name === q.value)), n = a(() => s.value[l.value] ?? null), O = a(() => l.value <= 0), w = a(() => l.value >= s.value.length - 1), p = (e) => {
|
|
48
|
+
const r = s.value.find((o) => o.name === e);
|
|
49
|
+
r && (x.value = e, i("update:active-step", e), i("change", r, s.value.indexOf(r)));
|
|
49
50
|
}, c = (e) => {
|
|
50
|
-
const
|
|
51
|
-
|
|
51
|
+
const r = s.value[e];
|
|
52
|
+
r && p(r.name);
|
|
52
53
|
}, v = () => {
|
|
53
54
|
i("update:model-value", !1), i("close", n.value, l.value);
|
|
54
55
|
}, m = () => {
|
|
55
|
-
i("finish", n.value, l.value),
|
|
56
|
+
i("finish", n.value, l.value), t.closeOnFinish && v();
|
|
56
57
|
}, h = () => {
|
|
57
58
|
if (n.value) {
|
|
58
59
|
if (i("back", n.value, l.value), O.value) {
|
|
59
|
-
|
|
60
|
+
t.loop && c(s.value.length - 1);
|
|
60
61
|
return;
|
|
61
62
|
}
|
|
62
63
|
c(l.value - 1);
|
|
@@ -64,31 +65,31 @@ const E = /* @__PURE__ */ j({
|
|
|
64
65
|
}, S = () => {
|
|
65
66
|
if (n.value) {
|
|
66
67
|
if (i("next", n.value, l.value), w.value) {
|
|
67
|
-
|
|
68
|
+
t.loop ? c(0) : m();
|
|
68
69
|
return;
|
|
69
70
|
}
|
|
70
71
|
c(l.value + 1);
|
|
71
72
|
}
|
|
72
73
|
}, y = (e) => {
|
|
73
|
-
|
|
74
|
+
p(e);
|
|
74
75
|
}, _ = (e) => {
|
|
75
|
-
const
|
|
76
|
+
const r = d(e.name), o = u.value[r];
|
|
76
77
|
u.value = {
|
|
77
78
|
...u.value,
|
|
78
|
-
[
|
|
79
|
+
[r]: {
|
|
79
80
|
...o,
|
|
80
81
|
...e,
|
|
81
|
-
registrationOrder: o?.registrationOrder ??
|
|
82
|
+
registrationOrder: o?.registrationOrder ?? f
|
|
82
83
|
}
|
|
83
|
-
}, o || (
|
|
84
|
+
}, o || (f += 1);
|
|
84
85
|
}, k = (e) => {
|
|
85
|
-
const
|
|
86
|
-
delete o[
|
|
86
|
+
const r = d(e), o = { ...u.value };
|
|
87
|
+
delete o[r], u.value = o;
|
|
87
88
|
};
|
|
88
89
|
z(
|
|
89
|
-
[() =>
|
|
90
|
-
([e,
|
|
91
|
-
!e || o ||
|
|
90
|
+
[() => t.modelValue, s, n],
|
|
91
|
+
([e, r, o]) => {
|
|
92
|
+
!e || o || r.length === 0 || p(r[0].name);
|
|
92
93
|
},
|
|
93
94
|
{ immediate: !0 }
|
|
94
95
|
), A(W, {
|
|
@@ -96,18 +97,19 @@ const E = /* @__PURE__ */ j({
|
|
|
96
97
|
activeStep: n,
|
|
97
98
|
activeIndex: l,
|
|
98
99
|
steps: s,
|
|
99
|
-
loop: a(() =>
|
|
100
|
-
showClose: a(() =>
|
|
101
|
-
showProgress: a(() =>
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
100
|
+
loop: a(() => t.loop),
|
|
101
|
+
showClose: a(() => t.showClose),
|
|
102
|
+
showProgress: a(() => t.showProgress),
|
|
103
|
+
bordered: a(() => t.bordered),
|
|
104
|
+
backText: a(() => t.backText),
|
|
105
|
+
nextText: a(() => t.nextText),
|
|
106
|
+
finishText: a(() => t.finishText),
|
|
107
|
+
closeText: a(() => t.closeText),
|
|
108
|
+
zIndex: T,
|
|
109
|
+
teleportTo: a(() => t.teleportTo),
|
|
110
|
+
disabledTeleport: a(() => t.disabledTeleport),
|
|
111
|
+
width: a(() => t.width),
|
|
112
|
+
maxWidth: a(() => t.maxWidth),
|
|
111
113
|
registerStep: _,
|
|
112
114
|
unregisterStep: k,
|
|
113
115
|
goToStep: y,
|
|
@@ -116,11 +118,11 @@ const E = /* @__PURE__ */ j({
|
|
|
116
118
|
finish: m,
|
|
117
119
|
close: v
|
|
118
120
|
}), N({ back: h, next: S, finish: m, close: v, goToStep: y });
|
|
119
|
-
const I = { props:
|
|
120
|
-
return
|
|
121
|
+
const I = { props: t, emit: i, registeredSteps: u, internalActiveStep: x, get registrationCursor() {
|
|
122
|
+
return f;
|
|
121
123
|
}, set registrationCursor(e) {
|
|
122
|
-
|
|
123
|
-
}, getStepKey: d, stepOverrides:
|
|
124
|
+
f = e;
|
|
125
|
+
}, getStepKey: d, stepOverrides: b, steps: s, active: g, guideZIndex: T, activeStepName: q, activeIndex: l, activeStep: n, isFirstStep: O, isLastStep: w, setActiveStep: p, goToIndex: c, close: v, finish: m, back: h, next: S, goToStep: y, registerStep: _, unregisterStep: k };
|
|
124
126
|
return Object.defineProperty(I, "__isScriptSetup", { enumerable: !1, value: !0 }), I;
|
|
125
127
|
}
|
|
126
128
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nmorph-guide-step__card{display:grid;gap:var(--indentation-03);min-width:min(240px,100vw - 48px)}.nmorph-guide-step__image{display:block;width:100%;max-height:140px;border-radius:var(--default-border-radius);object-fit:cover}.nmorph-guide-step__body{display:grid;gap:var(--indentation-02)}.nmorph-guide-step__progress{color:var(--nmorph-placeholder-text-color);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-guide-step__title{margin:0;color:var(--nmorph-text-color);font-size:var(--nmorph-typography-title-small-font-size);line-height:var(--nmorph-typography-title-small-line-height)}.nmorph-guide-step__text{margin:0;color:var(--nmorph-text-color);font-size:var(--nmorph-typography-body-font-size);line-height:var(--nmorph-typography-body-line-height)}.nmorph-guide-step__actions{display:flex;gap:var(--indentation-02);align-items:center}.nmorph-guide-step__spacer{flex:1 1 auto}
|
|
1
|
+
.nmorph-guide-step__card{display:grid;gap:var(--indentation-03);box-sizing:border-box;min-width:min(240px,100vw - 48px);padding:var(--indentation-02);border-radius:var(--default-border-radius)}.nmorph-guide-step__card--bordered{border:var(--nmorph-plain-border)}.nmorph-guide-step__image{display:block;width:100%;max-height:140px;border-radius:var(--default-border-radius);object-fit:cover}.nmorph-guide-step__body{display:grid;gap:var(--indentation-02)}.nmorph-guide-step__progress{color:var(--nmorph-placeholder-text-color);font-size:var(--nmorph-typography-body-small-font-size);line-height:var(--nmorph-typography-body-small-line-height)}.nmorph-guide-step__title{margin:0;color:var(--nmorph-text-color);font-size:var(--nmorph-typography-title-small-font-size);line-height:var(--nmorph-typography-title-small-line-height)}.nmorph-guide-step__text{margin:0;color:var(--nmorph-text-color);font-size:var(--nmorph-typography-body-font-size);line-height:var(--nmorph-typography-body-line-height)}.nmorph-guide-step__actions{display:flex;gap:var(--indentation-02);align-items:center}.nmorph-guide-step__spacer{flex:1 1 auto}
|
|
@@ -1,14 +1,9 @@
|
|
|
1
1
|
import './NmorphGuideStep.css';
|
|
2
2
|
import g from "./NmorphGuideStep.vue2.js";
|
|
3
|
-
import { openBlock as t, createBlock as s, withCtx as a, renderSlot as c, normalizeProps as
|
|
3
|
+
import { openBlock as t, createBlock as s, withCtx as a, renderSlot as c, normalizeProps as m, mergeProps as h, createElementBlock as o, normalizeClass as _, createCommentVNode as i, createElementVNode as d, toDisplayString as l, createVNode as p } from "vue";
|
|
4
4
|
/* empty css */
|
|
5
|
-
import
|
|
6
|
-
const
|
|
7
|
-
key: 1,
|
|
8
|
-
class: "nmorph-guide-step__card",
|
|
9
|
-
role: "dialog",
|
|
10
|
-
"aria-live": "polite"
|
|
11
|
-
}, v = ["src", "alt"], x = { class: "nmorph-guide-step__body" }, k = {
|
|
5
|
+
import u from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
6
|
+
const v = ["src", "alt"], x = { class: "nmorph-guide-step__body" }, k = {
|
|
12
7
|
key: 0,
|
|
13
8
|
class: "nmorph-guide-step__progress"
|
|
14
9
|
}, S = {
|
|
@@ -18,7 +13,7 @@ const u = {
|
|
|
18
13
|
key: 2,
|
|
19
14
|
class: "nmorph-guide-step__text"
|
|
20
15
|
}, b = { class: "nmorph-guide-step__actions" };
|
|
21
|
-
function
|
|
16
|
+
function C(n, r, w, e, y, N) {
|
|
22
17
|
return t(), s(e.NmorphTooltip, {
|
|
23
18
|
"force-show": e.isActive,
|
|
24
19
|
position: e.tooltipPosition,
|
|
@@ -31,77 +26,89 @@ function w(d, r, y, e, C, N) {
|
|
|
31
26
|
disabled: !e.guide || e.props.disabled
|
|
32
27
|
}, {
|
|
33
28
|
content: a(() => [
|
|
34
|
-
e.hasCustomContent && e.stepSlotProps ? c(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
k,
|
|
45
|
-
l(e.stepSlotProps.index + 1) + " / " + l(e.stepSlotProps.total),
|
|
46
|
-
1
|
|
47
|
-
/* TEXT */
|
|
48
|
-
)) : o("v-if", !0),
|
|
49
|
-
e.currentStep.title ? (t(), i(
|
|
50
|
-
"h3",
|
|
51
|
-
S,
|
|
52
|
-
l(e.currentStep.title),
|
|
53
|
-
1
|
|
54
|
-
/* TEXT */
|
|
55
|
-
)) : o("v-if", !0),
|
|
56
|
-
e.currentStep.text ? (t(), i(
|
|
57
|
-
"p",
|
|
58
|
-
f,
|
|
59
|
-
l(e.currentStep.text),
|
|
60
|
-
1
|
|
61
|
-
/* TEXT */
|
|
62
|
-
)) : o("v-if", !0)
|
|
63
|
-
]),
|
|
64
|
-
n("div", b, [
|
|
65
|
-
e.guide?.showClose.value ? (t(), s(e.NmorphButton, {
|
|
29
|
+
e.hasCustomContent && e.stepSlotProps ? c(n.$slots, "content", m(h({ key: 0 }, e.stepSlotProps))) : e.currentStep && e.stepSlotProps ? (t(), o(
|
|
30
|
+
"div",
|
|
31
|
+
{
|
|
32
|
+
key: 1,
|
|
33
|
+
class: _(["nmorph-guide-step__card", e.guide?.bordered.value && "nmorph-guide-step__card--bordered"]),
|
|
34
|
+
role: "dialog",
|
|
35
|
+
"aria-live": "polite"
|
|
36
|
+
},
|
|
37
|
+
[
|
|
38
|
+
e.currentStep.imageSrc ? (t(), o("img", {
|
|
66
39
|
key: 0,
|
|
67
|
-
class: "nmorph-guide-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
40
|
+
class: "nmorph-guide-step__image",
|
|
41
|
+
src: e.currentStep.imageSrc,
|
|
42
|
+
alt: e.currentStep.imageAlt || e.currentStep.title || ""
|
|
43
|
+
}, null, 8, v)) : i("v-if", !0),
|
|
44
|
+
d("div", x, [
|
|
45
|
+
e.guide?.showProgress.value ? (t(), o(
|
|
46
|
+
"div",
|
|
47
|
+
k,
|
|
48
|
+
l(e.stepSlotProps.index + 1) + " / " + l(e.stepSlotProps.total),
|
|
49
|
+
1
|
|
50
|
+
/* TEXT */
|
|
51
|
+
)) : i("v-if", !0),
|
|
52
|
+
e.currentStep.title ? (t(), o(
|
|
53
|
+
"h3",
|
|
54
|
+
S,
|
|
55
|
+
l(e.currentStep.title),
|
|
56
|
+
1
|
|
57
|
+
/* TEXT */
|
|
58
|
+
)) : i("v-if", !0),
|
|
59
|
+
e.currentStep.text ? (t(), o(
|
|
60
|
+
"p",
|
|
61
|
+
f,
|
|
62
|
+
l(e.currentStep.text),
|
|
63
|
+
1
|
|
64
|
+
/* TEXT */
|
|
65
|
+
)) : i("v-if", !0)
|
|
66
|
+
]),
|
|
67
|
+
d("div", b, [
|
|
68
|
+
e.guide?.showClose.value ? (t(), s(e.NmorphButton, {
|
|
69
|
+
key: 0,
|
|
70
|
+
class: "nmorph-guide-step__close",
|
|
71
|
+
text: e.guide.closeText.value,
|
|
72
|
+
design: "plain",
|
|
73
|
+
thickness: "thin",
|
|
74
|
+
onClick: e.guide.close
|
|
75
|
+
}, null, 8, ["text", "onClick"])) : i("v-if", !0),
|
|
76
|
+
r[1] || (r[1] = d(
|
|
77
|
+
"span",
|
|
78
|
+
{ class: "nmorph-guide-step__spacer" },
|
|
79
|
+
null,
|
|
80
|
+
-1
|
|
81
|
+
/* CACHED */
|
|
82
|
+
)),
|
|
83
|
+
p(e.NmorphButton, {
|
|
84
|
+
class: "nmorph-guide-step__back",
|
|
85
|
+
text: e.guide?.backText.value,
|
|
86
|
+
design: "plain",
|
|
87
|
+
thickness: "thin",
|
|
88
|
+
disabled: e.isFirstStep && !e.guide?.loop.value,
|
|
89
|
+
onClick: e.guide?.back
|
|
90
|
+
}, null, 8, ["text", "disabled", "onClick"]),
|
|
91
|
+
p(e.NmorphButton, {
|
|
92
|
+
class: "nmorph-guide-step__next",
|
|
93
|
+
text: e.isLastStep && !e.guide?.loop.value ? e.guide?.finishText.value : e.guide?.nextText.value,
|
|
94
|
+
design: "plain",
|
|
95
|
+
thickness: "thin",
|
|
96
|
+
onClick: r[0] || (r[0] = (P) => e.isLastStep && !e.guide?.loop.value ? e.guide?.finish() : e.guide?.next())
|
|
97
|
+
}, null, 8, ["text"])
|
|
98
|
+
])
|
|
99
|
+
],
|
|
100
|
+
2
|
|
101
|
+
/* CLASS */
|
|
102
|
+
)) : i("v-if", !0)
|
|
96
103
|
]),
|
|
97
104
|
default: a(() => [
|
|
98
|
-
c(
|
|
105
|
+
c(n.$slots, "default")
|
|
99
106
|
]),
|
|
100
107
|
_: 3
|
|
101
108
|
/* FORWARDED */
|
|
102
109
|
}, 8, ["force-show", "position", "z-index", "teleport-to", "disabled-teleport", "width", "max-width", "disabled"]);
|
|
103
110
|
}
|
|
104
|
-
const A = /* @__PURE__ */
|
|
111
|
+
const A = /* @__PURE__ */ u(g, [["render", C], ["__file", "/builds/ketjo/nmorph/library/src/components/feedback/nmorph-guide/NmorphGuideStep.vue"]]);
|
|
105
112
|
export {
|
|
106
113
|
A as default
|
|
107
114
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.nmorph-color-picker{display:inline-flex;flex:0 0 auto;flex-direction:column;align-items:flex-start;width:fit-content;max-width:100%}.nmorph-color-picker .nmorph-color-picker__content{position:relative;display:inline-flex;gap:var(--indentation-03);align-items:center;width:fit-content;max-width:100%;height:var(--nmorph-private-control-height);padding:0 var(--default-indentation-input);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:inset var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color),inset calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-color-picker .nmorph-color-picker__native{position:absolute;width:100%;height:100%;cursor:pointer;opacity:0;inset:0}.nmorph-color-picker .nmorph-color-picker__swatch{flex:0 0 auto;width:calc(var(--nmorph-private-control-height) - var(--indentation-03));height:calc(var(--nmorph-private-control-height) - var(--indentation-03));border-radius:var(--default-border-radius);box-shadow:inset 0 0 0 1px #ffffff40,0 0 0 1px #0000001f}.nmorph-color-picker .nmorph-color-picker__value{flex:0 0 7ch;width:7ch;min-width:7ch;overflow:hidden;font-weight:var(--nmorph-private-control-font-weight);font-size:var(--nmorph-private-control-font-size);font-family:var(--font-family-mono);line-height:var(--nmorph-private-control-line-height);white-space:nowrap;text-overflow:ellipsis;transform:translateY(var(--nmorph-private-control-text-offset-y));user-select:none;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.nmorph-color-picker.nmorph-color-picker--rgb .nmorph-color-picker__value{flex-basis:18ch;width:18ch;min-width:18ch}.nmorph-color-picker.nmorph-color-picker--hsl .nmorph-color-picker__value{flex-basis:20ch;width:20ch;min-width:20ch}.nmorph-color-picker.nmorph--focused .nmorph-color-picker__content{background:var(--nmorph-accent-color);box-shadow:var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color),calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-color-picker.nmorph--focused .nmorph-color-picker__value{color:var(--nmorph-focus-text-color)}.nmorph-color-picker.nmorph-color-picker--disabled{cursor:not-allowed;opacity:.6}.nmorph-color-picker.nmorph-color-picker--disabled .nmorph-color-picker__content{pointer-events:none}
|
|
1
|
+
.nmorph-color-picker{display:inline-flex;flex:0 0 auto;flex-direction:column;align-items:flex-start;width:fit-content;max-width:100%}.nmorph-color-picker .nmorph-color-picker__content{position:relative;display:inline-flex;gap:var(--indentation-03);align-items:center;width:fit-content;max-width:100%;height:var(--nmorph-private-control-height);padding:0 var(--default-indentation-input);background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:inset var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color),inset calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-color-picker .nmorph-color-picker__native{position:absolute;z-index:2;width:100%;height:100%;cursor:pointer;opacity:0;inset:0}.nmorph-color-picker .nmorph-color-picker__swatch{position:relative;z-index:1;flex:0 0 auto;width:calc(var(--nmorph-private-control-height) - var(--indentation-03) + 2px);height:calc(var(--nmorph-private-control-height) - var(--indentation-03) + 2px);overflow:hidden;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:inset 0 0 0 1px #ffffff40,0 0 0 1px #0000001f;pointer-events:none}.nmorph-color-picker .nmorph-color-picker__swatch:before{content:"";position:absolute;z-index:1;inset:1px;background:var(--nmorph-private-color-picker-color);border-radius:calc(var(--default-border-radius) - 1px)}.nmorph-color-picker .nmorph-color-picker__value{flex:0 0 7ch;width:7ch;min-width:7ch;overflow:hidden;font-weight:var(--nmorph-private-control-font-weight);font-size:var(--nmorph-private-control-font-size);font-family:var(--font-family-mono);line-height:var(--nmorph-private-control-line-height);white-space:nowrap;text-overflow:ellipsis;transform:translateY(var(--nmorph-private-control-text-offset-y));user-select:none;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.nmorph-color-picker.nmorph-color-picker--rgb .nmorph-color-picker__value{flex-basis:18ch;width:18ch;min-width:18ch}.nmorph-color-picker.nmorph-color-picker--hsl .nmorph-color-picker__value{flex-basis:20ch;width:20ch;min-width:20ch}.nmorph-color-picker.nmorph--focused .nmorph-color-picker__content{background:var(--nmorph-accent-color);box-shadow:var(--base-shadow-width) var(--base-shadow-width) var(--base-shadow-blur) var(--nmorph-dark-shade-color),calc(-1 * var(--base-shadow-width)) calc(-1 * var(--base-shadow-width)) var(--base-shadow-blur) var(--nmorph-light-shade-color)}.nmorph-color-picker.nmorph--focused .nmorph-color-picker__value{color:var(--nmorph-focus-text-color)}.nmorph-color-picker.nmorph-color-picker--disabled{cursor:not-allowed;opacity:.6}.nmorph-color-picker.nmorph-color-picker--disabled .nmorph-color-picker__content{pointer-events:none}
|