@nmorph/nmorph-ui-kit 2.2.45 → 2.2.47

package/dist/assets/icons/forward.svg.js

@@ -1,18 +1,22 @@
-import { openBlock as t, createElementBlock as o, createElementVNode as n } from "vue";
-const r = {
+import { openBlock as o, createElementBlock as r, createElementVNode as t } from "vue";
+const n = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function l(c, e) {
-  return t(), o("svg", r, [...e[0] || (e[0] = [
-    n("path", {
+function l(s, e) {
+  return o(), r("svg", n, [...e[0] || (e[0] = [
+    t("path", {
       fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "72",
       d: "m576 288 224 224-224 224m192-224H480c-154.667 0-256 101.333-256 256"
     }, null, -1)
   ])]);
 }
-const m = { render: l };
+const c = { render: l };
 export {
-  m as default,
+  c as default,
   l as render
 };

package/dist/assets/icons/reply.svg.js

@@ -1,12 +1,16 @@
-import { openBlock as t, createElementBlock as n, createElementVNode as o } from "vue";
-const r = {
+import { openBlock as o, createElementBlock as r, createElementVNode as t } from "vue";
+const n = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "0 0 1024 1024"
 };
-function l(c, e) {
-  return t(), n("svg", r, [...e[0] || (e[0] = [
-    o("path", {
+function l(s, e) {
+  return o(), r("svg", n, [...e[0] || (e[0] = [
+    t("path", {
       fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "72",
       d: "M448 288 224 512l224 224M256 512h288c154.667 0 256 101.333 256 256"
     }, null, -1)
   ])]);

package/dist/components/basic/nmorph-icon/NmorphIcon.css

@@ -1 +1 @@
-.nmorph-icon,.nmorph-icon .nmorph-icon__content{display:flex;justify-content:center;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height)}.nmorph-icon svg{width:100%;height:100%;fill:var(--color);stroke-width:0}.nmorph-icon path{stroke:var(--color)}.nmorph-icon.nmorph-icon--small{--width: 14px;--height: 14px}.nmorph-icon.nmorph-icon--medium{--width: 20px;--height: 20px}.nmorph-icon.nmorph-icon--large{--width: 32px;--height: 32px}.nmorph-icon{--color: var(--nmorph-icon-color, var(--nmorph-text-color))}
+.nmorph-icon,.nmorph-icon .nmorph-icon__content{display:flex;justify-content:center;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height)}.nmorph-icon svg{width:100%;height:100%;fill:var(--color)}.nmorph-icon path[stroke],.nmorph-icon path[stroke-width],.nmorph-icon path[fill=none],.nmorph-icon rect[stroke],.nmorph-icon rect[stroke-width],.nmorph-icon rect[fill=none],.nmorph-icon line[stroke],.nmorph-icon line[stroke-width],.nmorph-icon polyline[stroke],.nmorph-icon polyline[stroke-width],.nmorph-icon polygon[stroke],.nmorph-icon polygon[stroke-width]{stroke:var(--color)}.nmorph-icon.nmorph-icon--small{--width: 14px;--height: 14px}.nmorph-icon.nmorph-icon--medium{--width: 20px;--height: 20px}.nmorph-icon.nmorph-icon--large{--width: 32px;--height: 32px}.nmorph-icon{--color: var(--nmorph-icon-color, var(--nmorph-text-color))}

package/dist/components/basic/nmorph-link/NmorphLink.vue.js

@@ -1,73 +1,85 @@
 import './NmorphLink.css';
-import { defineComponent as y, useSlots as k, computed as l, openBlock as t, createElementBlock as v, normalizeStyle as C, normalizeClass as g, createElementVNode as x, renderSlot as a, createBlock as s, unref as i, withCtx as d, resolveDynamicComponent as $, createCommentVNode as p, createTextVNode as B, toDisplayString as b } from "vue";
-import { useModifiers as S } from "../../../utils/create-modifiers.js";
-import { createCssVariables as V } from "../../../utils/common.js";
-import * as w from "../nmorph-icon/NmorphIcons.js";
-import { NmorphColor as I } from "../../../types/common.types.js";
-import f from "../nmorph-icon/NmorphIcon.vue.js";
+import { defineComponent as k, useSlots as _, computed as r, openBlock as t, createElementBlock as C, normalizeStyle as w, normalizeClass as b, createElementVNode as x, normalizeProps as B, guardReactiveProps as $, renderSlot as i, createBlock as n, unref as s, withCtx as f, resolveDynamicComponent as P, createCommentVNode as p, createTextVNode as S, toDisplayString as L } from "vue";
+import { useModifiers as V } from "../../../utils/create-modifiers.js";
+import { createCssVariables as z } from "../../../utils/common.js";
+import * as I from "../nmorph-icon/NmorphIcons.js";
+import { NmorphLinkTarget as T } from "./types.js";
+import { NmorphColor as A } from "../../../types/common.types.js";
+import m from "../nmorph-icon/NmorphIcon.vue.js";
 /* empty css                             */
-const z = ["href", "target"], P = /* @__PURE__ */ y({
+const F = /* @__PURE__ */ k({
   __name: "NmorphLink",
   props: {
-    type: { default: I.accent },
+    type: { default: A.accent },
     underline: { type: Boolean, default: !1 },
     href: { default: "" },
     text: { default: "" },
     target: { default: "self" },
+    rel: { default: void 0 },
+    referrerpolicy: { default: void 0 },
+    referrerPolicy: { default: void 0 },
+    download: { type: [String, Boolean], default: void 0 },
+    ariaLabel: { default: void 0 },
+    title: { default: void 0 },
     disabled: { type: Boolean, default: !1 },
     color: { default: void 0 },
     iconName: { default: void 0 }
   },
-  setup(c) {
-    const e = c, u = k(), r = w, h = (o) => o.split(/[-_\s]+/).filter(Boolean).map((n) => `${n.charAt(0).toUpperCase()}${n.slice(1)}`).join(""), m = l(() => {
+  setup(d) {
+    const e = d, u = _(), l = I, h = (o) => o.split(/[-_\s]+/).filter(Boolean).map((a) => `${a.charAt(0).toUpperCase()}${a.slice(1)}`).join(""), c = r(() => {
       if (e.iconName)
-        return e.iconName in r ? r[e.iconName] : r[`NmorphIcon${h(e.iconName)}`];
-    }), N = l(
-      () => S({
+        return e.iconName in l ? l[e.iconName] : l[`NmorphIcon${h(e.iconName)}`];
+    }), v = r(
+      () => V({
         "nmorph-link": [e.type, e.underline && "underline", e.disabled && "disabled"]
       })
-    ), _ = l(
-      () => V({
+    ), y = r(
+      () => z({
         "--link-color": e.color
       })
-    );
-    return (o, n) => (t(), v("div", {
-      class: g(N.value),
-      style: C(_.value)
+    ), N = r(() => T[e.target] ?? e.target), g = r(() => ({
+      href: e.href,
+      target: N.value,
+      rel: e.rel,
+      referrerpolicy: e.referrerpolicy ?? e.referrerPolicy,
+      download: e.download === !0 ? "" : e.download === !1 ? void 0 : e.download,
+      "aria-label": e.ariaLabel,
+      title: e.title
+    }));
+    return (o, a) => (t(), C("div", {
+      class: b(v.value),
+      style: w(y.value)
     }, [
-      x("a", {
-        href: e.href,
-        target: e.target
-      }, [
-        a(o.$slots, "prepend"),
-        m.value ? (t(), s(i(f), {
+      x("a", B($(g.value)), [
+        i(o.$slots, "prepend"),
+        c.value ? (t(), n(s(m), {
           key: 0,
           class: "nmorph-link__icon",
           width: "10px",
           height: "10px"
         }, {
-          default: d(() => [
-            (t(), s($(m.value)))
+          default: f(() => [
+            (t(), n(P(c.value)))
           ]),
           _: 1
         })) : p("", !0),
-        B(" " + b(c.text) + " ", 1),
-        i(u).icon ? (t(), s(i(f), {
+        S(" " + L(d.text) + " ", 1),
+        s(u).icon ? (t(), n(s(m), {
           key: 1,
           class: "nmorph-link__icon",
           width: "10px",
           height: "10px"
         }, {
-          default: d(() => [
-            a(o.$slots, "icon")
+          default: f(() => [
+            i(o.$slots, "icon")
           ]),
           _: 3
         })) : p("", !0),
-        a(o.$slots, "default")
-      ], 8, z)
+        i(o.$slots, "default")
+      ], 16)
     ], 6));
   }
 });
 export {
-  P as default
+  F as default
 };

package/dist/components/data/nmorph-emoji-picker/NmorphEmojiPicker.css

@@ -1 +1 @@
-.nmorph-emoji-picker{--nmorph-emoji-picker-width: 300px;--nmorph-emoji-picker-height: 260px;--nmorph-emoji-picker-columns: 8;--nmorph-emoji-picker-cell-size: 32px;--nmorph-emoji-picker-toggle-size: 28px;--nmorph-emoji-picker-scrollbar-size: 6px;--nmorph-emoji-picker-hover-background: color-mix(in srgb, var(--nmorph-text-color) 8%, transparent);--nmorph-emoji-picker-active-background: color-mix(in srgb, var(--nmorph-text-color) 12%, var(--nmorph-main-color));--nmorph-emoji-picker-focus-ring: color-mix(in srgb, var(--nmorph-text-color) 24%, transparent);--nmorph-emoji-picker-toggle-inset: calc(var(--indentation-02) + 2px);--nmorph-emoji-picker-toggle-reserve: calc( var(--nmorph-emoji-picker-toggle-size) + var(--nmorph-emoji-picker-toggle-inset) + var(--indentation-02) );position:relative;box-sizing:border-box;width:min(100%,var(--nmorph-emoji-picker-width));min-width:0;color:var(--nmorph-text-color);font:inherit}.nmorph-emoji-picker .nmorph-emoji-picker__compact,.nmorph-emoji-picker .nmorph-emoji-picker__panel{box-sizing:border-box;width:100%;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-emoji-picker .nmorph-emoji-picker__compact{display:flex;gap:var(--indentation-02);align-items:center;min-height:48px;padding:var(--indentation-02)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-list{display:flex;flex:1 1 auto;gap:4px;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button,.nmorph-emoji-picker .nmorph-emoji-picker__category,.nmorph-emoji-picker .nmorph-emoji-picker__emoji{margin:0;color:inherit;font:inherit;background:transparent;border:0;box-shadow:none;cursor:pointer;appearance:none}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:disabled,.nmorph-emoji-picker .nmorph-emoji-picker__category:disabled,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:disabled{cursor:not-allowed;opacity:.5}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:focus,.nmorph-emoji-picker .nmorph-emoji-picker__category:focus,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:focus{outline:none}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:focus-visible,.nmorph-emoji-picker .nmorph-emoji-picker__category:focus-visible,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:focus-visible{box-shadow:var(--nmorph-shadow-inset),0 0 0 1px var(--nmorph-emoji-picker-focus-ring)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button,.nmorph-emoji-picker .nmorph-emoji-picker__emoji{display:inline-flex;flex:0 0 var(--nmorph-emoji-picker-cell-size);justify-content:center;align-items:center;width:var(--nmorph-emoji-picker-cell-size);height:var(--nmorph-emoji-picker-cell-size);padding:0;font-size:20px;line-height:1;border-radius:var(--default-border-radius)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:hover:not(:disabled),.nmorph-emoji-picker .nmorph-emoji-picker__emoji:hover:not(:disabled){background:var(--nmorph-emoji-picker-hover-background)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button{position:absolute;top:var(--nmorph-emoji-picker-toggle-inset);right:var(--nmorph-emoji-picker-toggle-inset);z-index:2;width:var(--nmorph-emoji-picker-toggle-size);min-width:var(--nmorph-emoji-picker-toggle-size);height:var(--nmorph-emoji-picker-toggle-size);min-height:var(--nmorph-emoji-picker-toggle-size);color:var(--nmorph-semi-contrast-text-color);--height: var(--nmorph-emoji-picker-toggle-size);--size: var(--nmorph-emoji-picker-toggle-size);--nmorph-selection-control-inline-padding: 0;--color: currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__content,.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__fake{width:var(--nmorph-emoji-picker-toggle-size);min-width:var(--nmorph-emoji-picker-toggle-size);height:var(--nmorph-emoji-picker-toggle-size);min-height:var(--nmorph-emoji-picker-toggle-size)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__fake{padding:0;color:currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-icon{--color: currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button input:focus-visible{outline:none;opacity:0;scale:1}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button input:focus-visible+.nmorph-checkbox__fake{outline:1px solid var(--nmorph-emoji-picker-focus-ring);outline-offset:1px}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button:hover:not(.nmorph-checkbox--disabled){color:var(--nmorph-text-color);--color: var(--nmorph-text-color)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button:hover:not(.nmorph-checkbox--disabled) .nmorph-icon{--color: var(--nmorph-text-color)}.nmorph-emoji-picker .nmorph-emoji-picker__button-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;white-space:nowrap;clip-path:inset(50%)}.nmorph-emoji-picker .nmorph-emoji-picker__panel{display:flex;flex-direction:column;height:var(--nmorph-emoji-picker-height);min-height:180px;max-height:min(60vh,var(--nmorph-emoji-picker-height));padding:var(--indentation-02);overflow:hidden}.nmorph-emoji-picker .nmorph-emoji-picker__toolbar{display:flex;flex:0 0 auto;gap:var(--indentation-02);align-items:center;min-width:0;padding:2px}.nmorph-emoji-picker.nmorph-emoji-picker--collapsible .nmorph-emoji-picker__compact,.nmorph-emoji-picker.nmorph-emoji-picker--collapsible .nmorph-emoji-picker__toolbar{padding-right:var(--nmorph-emoji-picker-toggle-reserve)}.nmorph-emoji-picker .nmorph-emoji-picker__search{flex:1 1 auto;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__categories{display:flex;flex:0 0 auto;gap:4px;align-items:flex-start;min-width:0;margin:var(--indentation-02) 0;padding:0 2px}.nmorph-emoji-picker .nmorph-emoji-picker__categories .nmorph-scroll__bar--horizontal{right:2px;left:2px}.nmorph-emoji-picker .nmorph-emoji-picker__category{display:inline-flex;flex:0 0 auto;justify-content:center;align-items:center;max-width:120px;min-height:28px;padding:0 10px;overflow:hidden;color:var(--nmorph-semi-contrast-text-color);font-size:var(--font-size-extra-small);line-height:var(--line-height-regular);white-space:nowrap;text-overflow:ellipsis;border-radius:var(--default-border-radius)}.nmorph-emoji-picker .nmorph-emoji-picker__category:hover:not(:disabled){color:var(--nmorph-text-color);background:var(--nmorph-emoji-picker-hover-background)}.nmorph-emoji-picker .nmorph-emoji-picker__category.nmorph-emoji-picker__category--active{color:var(--nmorph-text-color);background:var(--nmorph-emoji-picker-active-background);box-shadow:var(--nmorph-shadow-inset)}.nmorph-emoji-picker .nmorph-emoji-picker__body{flex:1 1 auto;min-height:0}.nmorph-emoji-picker .nmorph-emoji-picker__body-content{box-sizing:border-box;min-height:100%;padding:2px}.nmorph-emoji-picker .nmorph-emoji-picker__section{display:grid;gap:4px}.nmorph-emoji-picker .nmorph-emoji-picker__section+.nmorph-emoji-picker__section{margin-top:var(--indentation-02)}.nmorph-emoji-picker .nmorph-emoji-picker__section-title{padding:0 4px;color:var(--nmorph-semi-contrast-text-color);font-weight:600;font-size:var(--font-size-extra-small);line-height:var(--line-height-regular)}.nmorph-emoji-picker .nmorph-emoji-picker__grid{display:grid;grid-template-columns:repeat(var(--nmorph-emoji-picker-columns),minmax(0,1fr));gap:2px}.nmorph-emoji-picker .nmorph-emoji-picker__emoji{width:100%;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__emoji-symbol{display:block;line-height:1}.nmorph-emoji-picker .nmorph-emoji-picker__empty{display:grid;gap:var(--indentation-02);place-items:center;min-height:100%;padding:var(--indentation-04);color:var(--nmorph-semi-contrast-text-color);text-align:center;--color: currentColor}.nmorph-emoji-picker.nmorph-emoji-picker--disabled{opacity:.65}
+.nmorph-emoji-picker{--nmorph-emoji-picker-width: 300px;--nmorph-emoji-picker-height: 260px;--nmorph-emoji-picker-columns: 8;--nmorph-emoji-picker-cell-size: 32px;--nmorph-emoji-picker-toggle-size: 28px;--nmorph-emoji-picker-scrollbar-size: 6px;--nmorph-emoji-picker-hover-background: color-mix(in srgb, var(--nmorph-text-color) 8%, transparent);--nmorph-emoji-picker-active-background: color-mix(in srgb, var(--nmorph-text-color) 12%, var(--nmorph-main-color));--nmorph-emoji-picker-focus-ring: color-mix(in srgb, var(--nmorph-text-color) 24%, transparent);--nmorph-emoji-picker-toggle-inset: calc(var(--indentation-02) + 2px);--nmorph-emoji-picker-toggle-reserve: calc( var(--nmorph-emoji-picker-toggle-size) + var(--nmorph-emoji-picker-toggle-inset) + var(--indentation-02) );position:relative;box-sizing:border-box;width:min(100%,var(--nmorph-emoji-picker-width));min-width:0;color:var(--nmorph-text-color);font:inherit}.nmorph-emoji-picker .nmorph-emoji-picker__compact,.nmorph-emoji-picker .nmorph-emoji-picker__panel{box-sizing:border-box;width:100%;background:var(--nmorph-main-color);border-radius:var(--default-border-radius);box-shadow:var(--nmorph-shadow-inset)}.nmorph-emoji-picker .nmorph-emoji-picker__compact{display:flex;gap:var(--indentation-02);align-items:center;min-height:48px;padding:var(--indentation-02)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-list{display:flex;flex:1 1 auto;gap:4px;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button,.nmorph-emoji-picker .nmorph-emoji-picker__category,.nmorph-emoji-picker .nmorph-emoji-picker__emoji{margin:0;color:inherit;font:inherit;background:transparent;border:0;box-shadow:none;cursor:pointer;appearance:none}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:disabled,.nmorph-emoji-picker .nmorph-emoji-picker__category:disabled,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:disabled{cursor:not-allowed;opacity:.5}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:focus,.nmorph-emoji-picker .nmorph-emoji-picker__category:focus,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:focus{outline:none}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:focus-visible,.nmorph-emoji-picker .nmorph-emoji-picker__category:focus-visible,.nmorph-emoji-picker .nmorph-emoji-picker__emoji:focus-visible{box-shadow:var(--nmorph-shadow-inset),0 0 0 1px var(--nmorph-emoji-picker-focus-ring)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button,.nmorph-emoji-picker .nmorph-emoji-picker__emoji{display:inline-flex;flex:0 0 var(--nmorph-emoji-picker-cell-size);justify-content:center;align-items:center;width:var(--nmorph-emoji-picker-cell-size);height:var(--nmorph-emoji-picker-cell-size);padding:0;font-size:20px;line-height:1;border-radius:var(--default-border-radius)}.nmorph-emoji-picker .nmorph-emoji-picker__quick-button:hover:not(:disabled),.nmorph-emoji-picker .nmorph-emoji-picker__emoji:hover:not(:disabled){background:var(--nmorph-emoji-picker-hover-background)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button{position:absolute;top:var(--nmorph-emoji-picker-toggle-inset);right:var(--nmorph-emoji-picker-toggle-inset);z-index:2;width:var(--nmorph-emoji-picker-toggle-size);min-width:var(--nmorph-emoji-picker-toggle-size);height:var(--nmorph-emoji-picker-toggle-size);min-height:var(--nmorph-emoji-picker-toggle-size);color:var(--nmorph-semi-contrast-text-color);--height: var(--nmorph-emoji-picker-toggle-size);--size: var(--nmorph-emoji-picker-toggle-size);--nmorph-selection-control-inline-padding: 0;--color: currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__content,.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__fake{width:var(--nmorph-emoji-picker-toggle-size);min-width:var(--nmorph-emoji-picker-toggle-size);height:var(--nmorph-emoji-picker-toggle-size);min-height:var(--nmorph-emoji-picker-toggle-size)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-checkbox__fake{padding:0;color:currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button .nmorph-icon{--color: currentColor}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button input:focus-visible{outline:none;opacity:0;scale:1}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button input:focus-visible+.nmorph-checkbox__fake{outline:1px solid var(--nmorph-emoji-picker-focus-ring);outline-offset:1px}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button:hover:not(.nmorph-checkbox--disabled){color:var(--nmorph-text-color);--color: var(--nmorph-text-color)}.nmorph-emoji-picker .nmorph-emoji-picker__toggle-button:hover:not(.nmorph-checkbox--disabled) .nmorph-icon{--color: var(--nmorph-text-color)}.nmorph-emoji-picker .nmorph-emoji-picker__button-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;white-space:nowrap;clip-path:inset(50%)}.nmorph-emoji-picker .nmorph-emoji-picker__panel{display:flex;flex-direction:column;height:var(--nmorph-emoji-picker-height);min-height:180px;max-height:min(60vh,var(--nmorph-emoji-picker-height));padding:var(--indentation-02);overflow:hidden}.nmorph-emoji-picker.nmorph-emoji-picker--hide-shadow .nmorph-emoji-picker__panel{box-shadow:none}.nmorph-emoji-picker .nmorph-emoji-picker__toolbar{display:flex;flex:0 0 auto;gap:var(--indentation-02);align-items:center;min-width:0;padding:2px}.nmorph-emoji-picker.nmorph-emoji-picker--collapsible .nmorph-emoji-picker__compact,.nmorph-emoji-picker.nmorph-emoji-picker--collapsible .nmorph-emoji-picker__toolbar{padding-right:var(--nmorph-emoji-picker-toggle-reserve)}.nmorph-emoji-picker .nmorph-emoji-picker__search{flex:1 1 auto;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__categories{display:flex;flex:0 0 auto;gap:4px;align-items:flex-start;min-width:0;margin:var(--indentation-02) 0;padding:0 2px}.nmorph-emoji-picker .nmorph-emoji-picker__categories .nmorph-scroll__bar--horizontal{right:2px;left:2px}.nmorph-emoji-picker .nmorph-emoji-picker__category{display:inline-flex;flex:0 0 auto;justify-content:center;align-items:center;max-width:120px;min-height:32px;padding:0 10px;overflow:hidden;color:var(--nmorph-semi-contrast-text-color);font-size:var(--font-size-extra-small);line-height:var(--line-height-regular);white-space:nowrap;text-overflow:ellipsis;border-radius:var(--default-border-radius)}.nmorph-emoji-picker .nmorph-emoji-picker__category:hover:not(:disabled){color:var(--nmorph-text-color);background:var(--nmorph-emoji-picker-hover-background)}.nmorph-emoji-picker .nmorph-emoji-picker__category.nmorph-emoji-picker__category--active{color:var(--nmorph-text-color);background:var(--nmorph-emoji-picker-active-background);box-shadow:var(--nmorph-shadow-inset)}.nmorph-emoji-picker .nmorph-emoji-picker__body{flex:1 1 auto;min-height:0}.nmorph-emoji-picker .nmorph-emoji-picker__body-content{box-sizing:border-box;min-height:100%;padding:2px}.nmorph-emoji-picker .nmorph-emoji-picker__section{display:grid;gap:4px}.nmorph-emoji-picker .nmorph-emoji-picker__section+.nmorph-emoji-picker__section{margin-top:var(--indentation-02)}.nmorph-emoji-picker .nmorph-emoji-picker__section-title{padding:0 4px;color:var(--nmorph-semi-contrast-text-color);font-weight:600;font-size:var(--font-size-extra-small);line-height:var(--line-height-regular)}.nmorph-emoji-picker .nmorph-emoji-picker__grid{display:grid;grid-template-columns:repeat(var(--nmorph-emoji-picker-columns),minmax(0,1fr));gap:2px}.nmorph-emoji-picker .nmorph-emoji-picker__emoji{width:100%;min-width:0}.nmorph-emoji-picker .nmorph-emoji-picker__emoji-symbol{display:block;line-height:1}.nmorph-emoji-picker .nmorph-emoji-picker__empty{display:grid;gap:var(--indentation-02);place-items:center;min-height:100%;padding:var(--indentation-04);color:var(--nmorph-semi-contrast-text-color);text-align:center;--color: currentColor}.nmorph-emoji-picker.nmorph-emoji-picker--disabled{opacity:.65}

package/dist/components/data/nmorph-emoji-picker/NmorphEmojiPicker.vue.js

@@ -1,5 +1,5 @@
 import './NmorphEmojiPicker.css';
-import { defineComponent as we, ref as S, computed as s, watch as Q, openBlock as c, createElementBlock as d, normalizeStyle as Se, normalizeClass as J, createBlock as le, unref as f, withModifiers as Ce, withCtx as v, createVNode as k, createElementVNode as L, toDisplayString as E, createCommentVNode as W, Fragment as O, renderList as $, nextTick as Ae } from "vue";
+import { defineComponent as Ee, ref as S, computed as s, watch as Q, openBlock as c, createElementBlock as d, normalizeStyle as Se, normalizeClass as J, createBlock as le, unref as b, withModifiers as Ce, withCtx as v, createVNode as k, createElementVNode as L, toDisplayString as w, createCommentVNode as W, Fragment as O, renderList as $, nextTick as Ae } from "vue";
 import { useModifiers as Ke } from "../../../utils/create-modifiers.js";
 import { createCssSizeVariables as Me } from "../../../utils/common.js";
 import Ne from "../../form/nmorph-checkbox/NmorphCheckbox.vue.js";
@@ -22,7 +22,7 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
 }, Ue = { class: "nmorph-emoji-picker__grid" }, Qe = ["aria-label", "title", "disabled", "onFocus", "onClick"], Je = { class: "nmorph-emoji-picker__emoji-symbol" }, We = {
   key: 1,
   class: "nmorph-emoji-picker__empty"
-}, uo = /* @__PURE__ */ we({
+}, uo = /* @__PURE__ */ Ee({
   __name: "NmorphEmojiPicker",
   props: {
     language: { default: "en" },
@@ -33,11 +33,12 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
     width: { default: "300px" },
     height: { default: "260px" },
     columns: { default: 8 },
-    disabled: { type: Boolean, default: !1 }
+    disabled: { type: Boolean, default: !1 },
+    hideShadow: { type: Boolean, default: !1 }
   },
   emits: ["select", "expand", "collapse"],
   setup(ie, { emit: se }) {
-    const l = ie, V = se, q = S(""), b = S(l.initialExpanded), y = S(""), C = S(0), Z = S(null), ce = {
+    const l = ie, V = se, q = S(""), f = S(l.initialExpanded), y = S(""), C = S(0), Z = S(null), ce = {
       searchPlaceholder: "Search emoji",
       searchLabel: "Search emoji",
       quickLabel: "Frequent emoji",
@@ -98,20 +99,20 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
     }, me = (e, o, r, t, n) => {
       const a = M(e);
       if (!a) return null;
-      const i = _(e) ? e : {}, p = de(i, o, t), m = g(i, ["annotation", "label", "name", "description"]) || a, h = A(i.tags || i.keywords || i.aliases || i.shortcodes), z = K(i, ["order", "sortOrder", "sort_order", "index"], n), U = i.skinToneVariants || i.skins || i.variants, B = pe(U).filter((I) => I.emoji !== a), w = p.key || o, ne = p.label || r || w, Ee = G(
+      const i = _(e) ? e : {}, p = de(i, o, t), m = g(i, ["annotation", "label", "name", "description"]) || a, h = A(i.tags || i.keywords || i.aliases || i.shortcodes), z = K(i, ["order", "sortOrder", "sort_order", "index"], n), U = i.skinToneVariants || i.skins || i.variants, B = pe(U).filter((I) => I.emoji !== a), E = p.key || o, ne = p.label || r || E, we = G(
         [a, m, ne, ...h, ...B.map((I) => I.annotation || I.emoji)].filter(Boolean).join(" ")
       );
       return {
-        key: `${w}-${z}-${a}`,
+        key: `${E}-${z}-${a}`,
         emoji: a,
         annotation: m,
         tags: h,
-        groupKey: w,
+        groupKey: E,
         groupLabel: ne,
         groupSort: p.sort,
         order: z,
         skinToneVariants: B,
-        searchText: Ee
+        searchText: we
       };
     }, D = (e) => {
       if (!(!_(e) || ue(e)))
@@ -133,7 +134,7 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
           return;
         }
         const m = _(n) ? n : {}, h = g(m, ["group", "category", "name", "label"]) || a, z = g(m, ["label", "name", "title", "groupLabel", "categoryLabel"]) || h, U = K(m, ["order", "groupOrder", "categoryOrder"], i);
-        p.forEach((B, w) => r(B, h, z, U, w));
+        p.forEach((B, E) => r(B, h, z, U, E));
       };
       if (Array.isArray(e))
         e.forEach((n, a) => {
@@ -156,10 +157,10 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
     })), oe = s(() => ({
       ...l.i18n?.categories || {},
       ...l.i18n?.categoryLabels || {}
-    })), j = s(() => he(l.dataSource)), be = s(() => {
+    })), j = s(() => he(l.dataSource)), fe = s(() => {
       const e = /* @__PURE__ */ new Map();
       return j.value.forEach((o) => e.set(o.emoji, o.annotation || o.emoji)), e;
-    }), T = s(() => Array.from(new Set(l.quickList.map((e) => e.trim()).filter(Boolean)))), re = s(() => !b.value && T.value.length > 0), x = s(() => G(q.value)), N = s(() => {
+    }), T = s(() => Array.from(new Set(l.quickList.map((e) => e.trim()).filter(Boolean)))), re = s(() => !f.value && T.value.length > 0), x = s(() => G(q.value)), N = s(() => {
       const e = /* @__PURE__ */ new Map();
       return j.value.forEach((o) => {
         e.has(o.groupKey) || e.set(o.groupKey, {
@@ -182,14 +183,14 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
     ), Q(
       () => l.initialExpanded,
       (e) => {
-        b.value = e;
+        f.value = e;
       }
     ), Q([x, y], () => {
       C.value = 0;
     });
-    const fe = s(() => x.value ? j.value.filter((e) => e.searchText.includes(x.value)) : y.value ? j.value.filter((e) => e.groupKey === y.value) : j.value), F = s(() => {
+    const be = s(() => x.value ? j.value.filter((e) => e.searchText.includes(x.value)) : y.value ? j.value.filter((e) => e.groupKey === y.value) : j.value), F = s(() => {
       const e = /* @__PURE__ */ new Map();
-      return fe.value.forEach((o) => {
+      return be.value.forEach((o) => {
         const r = oe.value[o.groupKey] || o.groupLabel, t = e.get(o.groupKey) || {
           key: o.groupKey,
           label: r,
@@ -203,9 +204,10 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
       () => Ke({
         "nmorph-emoji-picker": [
           re.value && "compact",
-          b.value && "expanded",
+          f.value && "expanded",
           H.value && "collapsible",
           l.disabled && "disabled",
+          l.hideShadow && "hide-shadow",
           !j.value.length && "empty"
         ]
       })
@@ -215,12 +217,12 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
         "--nmorph-emoji-picker-height": l.height
       }),
       "--nmorph-emoji-picker-columns": Math.max(1, Math.floor(l.columns))
-    })), te = (e) => be.value.get(e) || e, ae = (e) => {
+    })), te = (e) => fe.value.get(e) || e, ae = (e) => {
       l.disabled || V("select", e);
     }, ve = () => {
-      l.disabled || (b.value = !0, V("expand"));
+      l.disabled || (f.value = !0, V("expand"));
     }, je = () => {
-      l.disabled || !H.value || (b.value = !1, V("collapse"));
+      l.disabled || !H.value || (f.value = !1, V("collapse"));
     }, xe = (e) => {
       if (e) {
         ve();
@@ -247,24 +249,24 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
       style: Se(_e.value),
       lang: l.language
     }, [
-      H.value ? (c(), le(f(Ne), {
+      H.value ? (c(), le(b(Ne), {
         key: 0,
-        class: J(["nmorph-emoji-picker__toggle-button nmorph-emoji-picker__expand-button", { "nmorph-emoji-picker__collapse-button": b.value }]),
+        class: J(["nmorph-emoji-picker__toggle-button nmorph-emoji-picker__expand-button", { "nmorph-emoji-picker__collapse-button": f.value }]),
         design: "button",
-        "model-value": b.value,
-        "aria-label": b.value ? u.value.collapseLabel : u.value.expandLabel,
-        title: b.value ? u.value.collapseLabel : u.value.expandLabel,
+        "model-value": f.value,
+        "aria-label": f.value ? u.value.collapseLabel : u.value.expandLabel,
+        title: f.value ? u.value.collapseLabel : u.value.expandLabel,
         disabled: l.disabled,
-        onClick: o[0] || (o[0] = Ce((r) => xe(!b.value), ["prevent"]))
+        onClick: o[0] || (o[0] = Ce((r) => xe(!f.value), ["prevent"]))
       }, {
         label: v(() => [
-          k(f(X), { size: "small" }, {
+          k(b(X), { size: "small" }, {
             default: v(() => [
-              k(f(ze))
+              k(b(ze))
             ]),
             _: 1
           }),
-          L("span", Ve, E(b.value ? u.value.collapseLabel : u.value.expandLabel), 1)
+          L("span", Ve, w(f.value ? u.value.collapseLabel : u.value.expandLabel), 1)
         ]),
         _: 1
       }, 8, ["class", "model-value", "aria-label", "title", "disabled"])) : W("", !0),
@@ -274,7 +276,7 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
         role: "group",
         "aria-label": u.value.quickLabel
       }, [
-        k(f(Y), {
+        k(b(Y), {
           class: "nmorph-emoji-picker__quick-list",
           height: "calc(var(--nmorph-emoji-picker-cell-size) + var(--nmorph-emoji-picker-scrollbar-size))",
           "max-height": "calc(var(--nmorph-emoji-picker-cell-size) + var(--nmorph-emoji-picker-scrollbar-size))",
@@ -292,13 +294,13 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
               title: te(r),
               disabled: l.disabled,
               onClick: (t) => ae(r)
-            }, E(r), 9, De))), 128))
+            }, w(r), 9, De))), 128))
           ]),
           _: 1
         })
       ], 8, qe)) : (c(), d("div", Te, [
         L("div", Fe, [
-          k(f(Be), {
+          k(b(Be), {
             modelValue: q.value,
             "onUpdate:modelValue": o[1] || (o[1] = (r) => q.value = r),
             class: "nmorph-emoji-picker__search",
@@ -311,9 +313,9 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
             }
           }, {
             "prepend-icon": v(() => [
-              k(f(X), { size: "small" }, {
+              k(b(X), { size: "small" }, {
                 default: v(() => [
-                  k(f(Ie))
+                  k(b(Ie))
                 ]),
                 _: 1
               })
@@ -321,7 +323,7 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
             _: 1
           }, 8, ["modelValue", "placeholder", "disabled", "input-attrs"])
         ]),
-        N.value.length && !x.value ? (c(), le(f(Y), {
+        N.value.length && !x.value ? (c(), le(b(Y), {
           key: 0,
           class: "nmorph-emoji-picker__categories",
           height: "40px",
@@ -343,11 +345,11 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
               "aria-selected": r.key === y.value,
               disabled: l.disabled,
               onClick: (t) => y.value = r.key
-            }, E(r.label), 11, Re))), 128))
+            }, w(r.label), 11, Re))), 128))
           ]),
           _: 1
         }, 8, ["aria-label"])) : W("", !0),
-        k(f(Y), {
+        k(b(Y), {
           class: "nmorph-emoji-picker__body",
           height: "100%",
           "max-height": "100%",
@@ -368,7 +370,7 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
                 key: r.key,
                 class: "nmorph-emoji-picker__section"
               }, [
-                x.value ? (c(), d("div", Pe, E(r.label), 1)) : W("", !0),
+                x.value ? (c(), d("div", Pe, w(r.label), 1)) : W("", !0),
                 L("div", Ue, [
                   (c(!0), d(O, null, $(r.items, (t) => (c(), d("button", {
                     key: t.key,
@@ -380,17 +382,17 @@ const $e = ["lang"], Ve = { class: "nmorph-emoji-picker__button-label" }, qe = [
                     onFocus: (n) => C.value = R.value.findIndex((a) => a.key === t.key),
                     onClick: (n) => ae(t.emoji)
                   }, [
-                    L("span", Je, E(t.emoji), 1)
+                    L("span", Je, w(t.emoji), 1)
                   ], 40, Qe))), 128))
                 ])
               ]))), 128)) : (c(), d("div", We, [
-                k(f(X), null, {
+                k(b(X), null, {
                   default: v(() => [
-                    k(f(Oe))
+                    k(b(Oe))
                   ]),
                   _: 1
                 }),
-                L("span", null, E(u.value.noResults), 1)
+                L("span", null, w(u.value.noResults), 1)
               ]))
             ], 40, He)
           ]),

package/dist/components/feedback/nmorph-callout/NmorphCallout.css

@@ -1 +1 @@
-.nmorph-callout{--callout-color: var(--nmorph-accent-color);--callout-padding: var(--indentation-03) var(--indentation-04);--callout-border-radius: var(--default-border-radius);--callout-accent-width: var(--indentation-02);--callout-title-gap: var(--indentation-03);--callout-title-font-size: var(--font-size-medium);--callout-content-font-size: var(--font-size-extra-small);position:relative;padding:var(--callout-padding);overflow:hidden;border-radius:var(--callout-border-radius)}.nmorph-callout:before{position:absolute;top:0;left:0;width:var(--callout-accent-width);height:100%;background:var(--callout-color);content:""}.nmorph-callout:after{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--callout-color);opacity:.2;content:""}.nmorph-callout.nmorph-callout--warning{--callout-color: var(--nmorph-warn-color)}.nmorph-callout.nmorph-callout--success{--callout-color: var(--nmorph-success-color)}.nmorph-callout.nmorph-callout--error{--callout-color: var(--nmorph-error-color)}.nmorph-callout .nmorph-callout__title{margin-bottom:var(--callout-title-gap);font-weight:600;font-size:var(--callout-title-font-size);line-height:var(--line-height-loose)}.nmorph-callout .nmorph-callout__title,.nmorph-callout .nmorph-callout__content{position:relative;z-index:1}.nmorph-callout .nmorph-callout__content{font-weight:400;font-size:var(--callout-content-font-size);line-height:var(--line-height-regular);white-space:pre-wrap}
+.nmorph-callout{--callout-color: var(--nmorph-accent-color);--callout-padding: var(--indentation-03) var(--indentation-04);--callout-border-radius: var(--default-border-radius);--callout-accent-width: var(--indentation-02);--callout-title-gap: var(--indentation-03);--callout-title-font-size: var(--font-size-medium);--callout-content-font-size: var(--font-size-extra-small);position:relative;display:block;padding:var(--callout-padding);overflow:hidden;color:inherit;text-decoration:none;border-radius:var(--callout-border-radius)}.nmorph-callout:before{position:absolute;top:0;left:0;width:var(--callout-accent-width);height:100%;background:var(--callout-color);content:""}.nmorph-callout:after{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--callout-color);opacity:.2;content:""}.nmorph-callout.nmorph-callout--warning{--callout-color: var(--nmorph-warn-color)}.nmorph-callout.nmorph-callout--success{--callout-color: var(--nmorph-success-color)}.nmorph-callout.nmorph-callout--error{--callout-color: var(--nmorph-error-color)}.nmorph-callout .nmorph-callout__title{margin-bottom:var(--callout-title-gap);font-weight:600;font-size:var(--callout-title-font-size);line-height:var(--line-height-loose)}.nmorph-callout .nmorph-callout__title,.nmorph-callout .nmorph-callout__content{position:relative;z-index:1}.nmorph-callout .nmorph-callout__content{font-weight:400;font-size:var(--callout-content-font-size);line-height:var(--line-height-regular);white-space:pre-wrap}

package/dist/components/feedback/nmorph-callout/NmorphCallout.vue.js

@@ -1,15 +1,26 @@
 import './NmorphCallout.css';
-import { defineComponent as n, computed as i, openBlock as e, createElementBlock as o, normalizeStyle as r, normalizeClass as c, toDisplayString as d, createCommentVNode as s, createElementVNode as u } from "vue";
-import { createCssVariables as p, createCssSizeVariables as m } from "../../../utils/common.js";
-const f = {
+import { defineComponent as v, useSlots as m, computed as t, openBlock as a, createBlock as h, resolveDynamicComponent as _, mergeProps as y, withCtx as g, createElementBlock as r, renderSlot as n, createTextVNode as b, toDisplayString as z, createCommentVNode as S } from "vue";
+import { createCssVariables as k, createCssSizeVariables as C } from "../../../utils/common.js";
+const w = {
   key: 0,
   class: "nmorph-callout__title"
-}, _ = ["innerHTML"], S = /* @__PURE__ */ n({
+}, B = {
+  key: 1,
+  class: "nmorph-callout__content"
+}, F = ["innerHTML"], $ = /* @__PURE__ */ v({
   __name: "NmorphCallout",
   props: {
     type: { default: "info" },
     title: { default: "" },
-    content: {},
+    content: { default: "" },
+    as: { default: "div" },
+    href: { default: void 0 },
+    target: { default: void 0 },
+    rel: { default: void 0 },
+    referrerpolicy: { default: void 0 },
+    referrerPolicy: { default: void 0 },
+    download: { type: [String, Boolean], default: void 0 },
+    ariaLabel: { default: void 0 },
     color: { default: void 0 },
     padding: { default: "var(--indentation-03) var(--indentation-04)" },
     borderRadius: { default: "var(--default-border-radius)" },
@@ -18,32 +29,59 @@ const f = {
     titleFontSize: { default: "var(--font-size-medium)" },
     contentFontSize: { default: "var(--font-size-extra-small)" }
   },
-  setup(a) {
-    const t = a, l = i(() => ({
-      ...m({
-        "--callout-padding": t.padding,
-        "--callout-border-radius": t.borderRadius,
-        "--callout-accent-width": t.accentWidth,
-        "--callout-title-gap": t.titleGap,
-        "--callout-title-font-size": t.titleFontSize,
-        "--callout-content-font-size": t.contentFontSize
+  setup(d) {
+    const i = {
+      self: "_self",
+      blank: "_blank",
+      parent: "_parent",
+      top: "_top"
+    }, e = d, o = m(), s = t(() => ({
+      ...C({
+        "--callout-padding": e.padding,
+        "--callout-border-radius": e.borderRadius,
+        "--callout-accent-width": e.accentWidth,
+        "--callout-title-gap": e.titleGap,
+        "--callout-title-font-size": e.titleFontSize,
+        "--callout-content-font-size": e.contentFontSize
       }),
-      ...p({
-        "--callout-color": t.color
+      ...k({
+        "--callout-color": e.color
       })
-    }));
-    return (v, h) => (e(), o("div", {
-      class: c(["nmorph-callout", `nmorph-callout--${t.type}`]),
-      style: r(l.value)
-    }, [
-      t.title ? (e(), o("div", f, d(t.title), 1)) : s("", !0),
-      u("div", {
-        class: "nmorph-callout__content",
-        innerHTML: t.content
-      }, null, 8, _)
-    ], 6));
+    })), c = t(() => {
+      if (e.target)
+        return e.target in i ? i[e.target] : e.target;
+    }), u = t(() => e.as !== "a" ? {} : {
+      href: e.href,
+      target: c.value,
+      rel: e.rel,
+      referrerpolicy: e.referrerpolicy ?? e.referrerPolicy,
+      download: e.download === !0 ? "" : e.download === !1 ? void 0 : e.download,
+      "aria-label": e.ariaLabel
+    }), f = t(() => !!(o.header || o.title || e.title)), p = t(() => !!o.default);
+    return (l, L) => (a(), h(_(e.as), y({
+      class: ["nmorph-callout", `nmorph-callout--${e.type}`],
+      style: s.value
+    }, u.value), {
+      default: g(() => [
+        f.value ? (a(), r("div", w, [
+          n(l.$slots, "header", {}, () => [
+            n(l.$slots, "title", {}, () => [
+              b(z(e.title), 1)
+            ])
+          ])
+        ])) : S("", !0),
+        p.value ? (a(), r("div", B, [
+          n(l.$slots, "default")
+        ])) : (a(), r("div", {
+          key: 2,
+          class: "nmorph-callout__content",
+          innerHTML: e.content
+        }, null, 8, F))
+      ]),
+      _: 3
+    }, 16, ["class", "style"]));
   }
 });
 export {
-  S as default
+  $ as default
 };

package/dist/components/providers/nmorph-notification-provider/NmorphNotificationProvider.css

@@ -1 +1 @@
-.nmorph-notification-provider{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__notification{width:fit-content;height:fit-content;margin:1rem;transition:transform .5s ease,opacity .5s ease-in-out;pointer-events:all}.nmorph-notification-provider .nmorph-notification-provider__list{position:fixed;display:flex;flex-direction:column;width:fit-content;max-width:100vw;pointer-events:none}.nmorph-notification-provider .nmorph-notification-move{transition:transform .5s ease}.nmorph-notification-provider .nmorph-notification-provider__list--top-left{top:0;left:0;align-items:flex-start}.nmorph-notification-provider .nmorph-notification-provider__list--top-right{top:0;right:0;align-items:flex-end}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left{bottom:0;left:0;align-items:flex-start}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right{right:0;bottom:0;align-items:flex-end}.nmorph-notification-provider .nmorph-notification-provider__list--top-center{top:0;left:50%;align-items:center;transform:translate(-50%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center{bottom:0;left:50%;align-items:center;transform:translate(-50%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-leave-active{transition:transform .5s ease,opacity .5s ease-in-out}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-enter-from,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-enter-from{transform:translate(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-enter-from,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-enter-from{transform:translate(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-enter-from{transform:translateY(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-enter-from{transform:translateY(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-leave-to,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-leave-to{transform:translate(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-leave-to,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-leave-to{transform:translate(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-leave-to{transform:translateY(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-leave-to{transform:translateY(100%)}.nmorph-notification-provider .nmorph-notification-enter-from{opacity:0}.nmorph-notification-provider .nmorph-notification-enter-to{transform:translate(0);opacity:1}.nmorph-notification-provider .nmorph-notification-leave-active{overflow:hidden}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon{--color: var(--nmorph-text-color);display:flex;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--small{--width: 14px;--height: 14px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--medium{--width: 20px;--height: 20px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--large{--width: 32px;--height: 32px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon__content{display:flex;justify-content:center;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height);overflow:hidden}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__close .nmorph-icon,.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__content,.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__content-title{--color: var(--nmorph-white-color)}.nmorph-notification-provider .nmorph-notification-leave-active.nmorph-alert--success .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-success-color)}.nmorph-notification-provider .nmorph-notification-leave-active.nmorph-alert--error .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-error-color)}.nmorph-notification-provider .nmorph-notification-leave-active.nmorph-alert--warning .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-warn-color)}.nmorph-notification-provider .nmorph-notification-leave-active.nmorph-alert--info .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-info-color)}.nmorph-notification-provider .nmorph-notification-leave-active svg{width:100%;height:100%;fill:var(--color);stroke-width:0}.nmorph-notification-provider .nmorph-notification-leave-active path{stroke:var(--color)}.nmorph-notification-provider .nmorph-notification-leave-to{opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-provider__notification--closing,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-provider__notification--closing{position:absolute;transform:translate(-100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-provider__notification--closing,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-provider__notification--closing{position:absolute;transform:translate(100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-provider__notification--closing{position:absolute;transform:translateY(-100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-provider__notification--closing{position:absolute;transform:translateY(100%);opacity:0;pointer-events:none}
+.nmorph-notification-provider{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__notification{position:relative;width:fit-content;height:fit-content;margin:1rem;overflow:hidden;border-radius:var(--default-border-radius);transition:transform .5s ease,opacity .5s ease-in-out;pointer-events:all}.nmorph-notification-provider .nmorph-notification-provider__notification--with-duration .nmorph-alert{padding-bottom:calc(var(--indentation-03) + 12px)}.nmorph-notification-provider .nmorph-notification-provider__duration{position:absolute;right:var(--indentation-04);bottom:var(--indentation-02);left:var(--indentation-04);display:flex;gap:var(--indentation-02);align-items:center;color:var(--nmorph-white-color);pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__duration-track{flex:1 1 auto;min-width:20px;height:3px;overflow:hidden;background:color-mix(in srgb,currentColor 20%,transparent);border-radius:999px}.nmorph-notification-provider .nmorph-notification-provider__duration-bar{display:block;width:100%;height:100%;background:currentColor;border-radius:inherit;transform-origin:left center;opacity:.72;animation:nmorph-notification-provider-duration var(--nmorph-notification-provider-duration) linear forwards}.nmorph-notification-provider .nmorph-notification-provider__duration-value{flex:0 0 auto;color:currentColor;font-size:var(--font-size-extra-small);line-height:1;opacity:.72}.nmorph-notification-provider .nmorph-notification-provider__list{position:fixed;display:flex;flex-direction:column;width:fit-content;max-width:100vw;pointer-events:none}.nmorph-notification-provider .nmorph-notification-move{transition:transform .5s ease}.nmorph-notification-provider .nmorph-notification-provider__list--top-left{top:0;left:0;align-items:flex-start}.nmorph-notification-provider .nmorph-notification-provider__list--top-right{top:0;right:0;align-items:flex-end}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left{bottom:0;left:0;align-items:flex-start}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right{right:0;bottom:0;align-items:flex-end}.nmorph-notification-provider .nmorph-notification-provider__list--top-center{top:0;left:50%;align-items:center;transform:translate(-50%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center{bottom:0;left:50%;align-items:center;transform:translate(-50%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-enter-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-leave-active,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-leave-active{transition:transform .5s ease,opacity .5s ease-in-out}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-enter-from,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-enter-from{transform:translate(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-enter-from,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-enter-from{transform:translate(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-enter-from{transform:translateY(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-enter-from{transform:translateY(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-leave-to,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-leave-to{transform:translate(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-leave-to,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-leave-to{transform:translate(100%)}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-leave-to{transform:translateY(-100%)}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-leave-to{transform:translateY(100%)}.nmorph-notification-provider .nmorph-notification-enter-from{opacity:0}.nmorph-notification-provider .nmorph-notification-enter-to{transform:translate(0);opacity:1}.nmorph-notification-provider .nmorph-notification-leave-active{overflow:hidden}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon{--color: var(--nmorph-text-color);display:flex;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--small{--width: 14px;--height: 14px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--medium{--width: 20px;--height: 20px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon--large{--width: 32px;--height: 32px}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-icon__content{display:flex;justify-content:center;align-items:center;width:var(--width);min-width:var(--width);height:var(--height);min-height:var(--height);overflow:hidden}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__close .nmorph-icon,.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__content,.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert__content-title{--color: var(--nmorph-white-color)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert--success .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-success-color)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert--error .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-error-color)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert--warning .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-warn-color)}.nmorph-notification-provider .nmorph-notification-leave-active .nmorph-alert--info .nmorph-alert__icon .nmorph-icon{--color: var(--nmorph-info-color)}.nmorph-notification-provider .nmorph-notification-leave-active svg{width:100%;height:100%;fill:var(--color);stroke-width:0}.nmorph-notification-provider .nmorph-notification-leave-active path{stroke:var(--color)}.nmorph-notification-provider .nmorph-notification-leave-to{opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-left .nmorph-notification-provider__notification--closing,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-left .nmorph-notification-provider__notification--closing{position:absolute;transform:translate(-100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-right .nmorph-notification-provider__notification--closing,.nmorph-notification-provider .nmorph-notification-provider__list--bottom-right .nmorph-notification-provider__notification--closing{position:absolute;transform:translate(100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--top-center .nmorph-notification-provider__notification--closing{position:absolute;transform:translateY(-100%);opacity:0;pointer-events:none}.nmorph-notification-provider .nmorph-notification-provider__list--bottom-center .nmorph-notification-provider__notification--closing{position:absolute;transform:translateY(100%);opacity:0;pointer-events:none}@keyframes nmorph-notification-provider-duration{0%{transform:scaleX(1)}to{transform:scaleX(0)}}