@milaboratories/uikit 2.10.37 → 2.10.39

package/dist/layout/PlBlockPage/PlBlockPage.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlBlockPage.vue2.js","sources":["../../../src/layout/PlBlockPage/PlBlockPage.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Root block page component */\nexport default {\n  name: \"PlBlockPage\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed, useCssModule, useSlots, useTemplateRef, watchEffect } from \"vue\";\nimport { PlBlockPageTitleTeleportTarget } from \"./PlBlockPageTitleTeleportTarget\";\nimport \"./pl-block-page.scss\";\nimport { PlIcon24 } from \"../../components/PlIcon24\";\nimport { type PlPlaceholderProps, PL_PLACEHOLDER_TEXTS, PlPlaceholder } from \"../PlPlaceholder\";\n\nconst slots = useSlots();\n\nconst props = defineProps<{\n  /**\n   * Page title (won't be displayed if `title` slot is also provided)\n   */\n  title?: string;\n  /**\n   * Text to display when subtitle is empty\n   */\n  subtitlePlaceholder?: string;\n  /**\n   * If `true` body gutters are removed\n   */\n  noBodyGutters?: boolean;\n  /**\n   * If defined, a loading overlay is displayed on the page body (over all default slot content)\n   */\n  bodyLoading?: PlPlaceholderProps[\"variant\"] | PlPlaceholderProps;\n}>();\n\n/** Page subtitle (editable) */\nconst subtitle = defineModel<string>(\"subtitle\");\n\nconst styles = useCssModule();\n\nconst loadingPlaceholder = computed<PlPlaceholderProps | undefined>(() => {\n  if (typeof props.bodyLoading === \"string\") {\n    return { variant: props.bodyLoading, ...PL_PLACEHOLDER_TEXTS.LOADING };\n  }\n  return props.bodyLoading;\n});\n\nconst teleportTarget = useTemplateRef(\"teleportTarget\");\n\nwatchEffect(() => {\n  PlBlockPageTitleTeleportTarget.value = teleportTarget.value;\n});\n</script>\n\n<template>\n  <div class=\"pl-layout-component pl-block-page\" :class=\"{ noBodyGutters: props.noBodyGutters }\">\n    <div v-if=\"slots.title || props.title\" :class=\"styles.header\">\n      <div class=\"pl-block-page__title\">\n        <div class=\"pl-block-page__title__default\">\n          <span v-if=\"slots.title\"><slot name=\"title\" /></span>\n          <span v-else>{{ props.title }}</span>\n          <slot name=\"after-title\" />\n        </div>\n        <div class=\"pl-block-page__title__append\">\n          <div ref=\"teleportTarget\" class=\"pl-block-page__title__append__teleport\" />\n          <slot name=\"append\" />\n        </div>\n      </div>\n      <div v-if=\"subtitle !== undefined\" :class=\"styles.subtitle\">\n        <input v-model.lazy.trim=\"subtitle\" :placeholder=\"props.subtitlePlaceholder\" />\n        <PlIcon24 :class=\"styles.editIcon\" name=\"edit\" color=\"var(--ic-02)\" />\n      </div>\n    </div>\n    <div v-else />\n    <div class=\"pl-block-page__body\">\n      <PlPlaceholder v-show=\"loadingPlaceholder\" v-bind=\"loadingPlaceholder\" />\n      <div :style=\"{ display: loadingPlaceholder ? 'none' : 'contents' }\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.header {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 24px;\n  margin-block-end: -8px;\n  gap: 2px;\n  overflow: hidden;\n}\n\n.subtitle {\n  display: flex;\n  padding-inline-end: 28px;\n\n  input {\n    anchor-name: --pl-block-page-subtitle;\n    field-sizing: content;\n    padding: 0;\n    border: none;\n    outline: none;\n    caret-color: var(--border-color-focus);\n    color: var(--txt-01);\n    font-family: Manrope;\n    font-size: 20px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: -0.2px;\n    margin-block-end: -4px;\n    max-inline-size: 100%;\n    text-overflow: ellipsis;\n\n    &::placeholder {\n      color: var(--txt-03);\n    }\n  }\n\n  .editIcon {\n    visibility: hidden;\n    position: fixed;\n    position-anchor: --pl-block-page-subtitle;\n    position-area: center inline-end;\n    inset-inline-start: 4px;\n  }\n  &:hover,\n  &:focus-within {\n    .editIcon {\n      visibility: visible;\n    }\n  }\n}\n</style>\n"],"names":["__default__","slots","useSlots","props","__props","subtitle","_useModel","styles","useCssModule","loadingPlaceholder","computed","PL_PLACEHOLDER_TEXTS","teleportTarget","useTemplateRef","watchEffect","PlBlockPageTitleTeleportTarget","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_hoisted_1","_hoisted_2","_hoisted_3","_renderSlot","_ctx","_hoisted_4","_toDisplayString","_hoisted_5","$event","_createVNode","PlIcon24","_hoisted_7","_hoisted_8","_withDirectives"],"mappings":";;;;;;uPAEAA,IAAe;AAAA,EACb,MAAM;AACR;;;;;;;;;;;;;AAUA,UAAMC,IAAQC,EAAA,GAERC,IAAQC,GAoBRC,IAAWC,KAAoB,UAAU,GAEzCC,IAASC,EAAA,GAETC,IAAqBC,EAAyC,MAC9D,OAAOP,EAAM,eAAgB,WACxB,EAAE,SAASA,EAAM,aAAa,GAAGQ,EAAqB,QAAA,IAExDR,EAAM,WACd,GAEKS,IAAiBC,EAAe,gBAAgB;AAEtD,WAAAC,EAAY,MAAM;AAChB,MAAAC,EAA+B,QAAQH,EAAe;AAAA,IACxD,CAAC,mBAICI,EAyBM,OAAA;AAAA,MAzBD,OAAKC,EAAA,CAAC,qCAAmC,EAAA,eAA0Bd,EAAM,eAAa,CAAA;AAAA,IAAA;MAC9Ee,EAAAjB,CAAA,EAAM,SAASE,EAAM,cAAhCa,EAgBM,OAAA;AAAA;QAhBkC,OAAKC,EAAEC,EAAAX,CAAA,EAAO,MAAM;AAAA,MAAA;QAC1DY,EAUM,OAVNC,GAUM;AAAA,UATJD,EAIM,OAJNE,GAIM;AAAA,YAHQH,EAAAjB,CAAA,EAAM,cAAlBe,EAAqD,QAAAM,GAAA;AAAA,cAA5BC,EAAqBC,EAAA,QAAA,OAAA;AAAA,YAAA,YAC9CR,EAAqC,QAAAS,GAAAC,EAArBvB,EAAM,KAAK,GAAA,CAAA;AAAA,YAC3BoB,EAA2BC,EAAA,QAAA,aAAA;AAAA,UAAA;UAE7BL,EAGM,OAHNQ,GAGM;AAAA,YAFJR,EAA2E,OAAA;AAAA,uBAAlE;AAAA,cAAJ,KAAIP;AAAA,cAAiB,OAAM;AAAA,YAAA;YAChCW,EAAsBC,EAAA,QAAA,QAAA;AAAA,UAAA;;QAGfnB,EAAA,UAAa,eAAxBW,EAGM,OAAA;AAAA;UAH8B,OAAKC,EAAEC,EAAAX,CAAA,EAAO,QAAQ;AAAA,QAAA;YACxDY,EAA+E,SAAA;AAAA,0DAArDd,EAAQ,QAAAuB;AAAA,YAAG,aAAazB,EAAM;AAAA,UAAA;;;cAA9BE,EAAA;AAAA;;gBAAX,MAAR;AAAA,gBAAa,MAAb;AAAA,cAAA;AAAA;;UACPwB,EAAsEX,EAAAY,CAAA,GAAA;AAAA,YAA3D,OAAKb,EAAEC,EAAAX,CAAA,EAAO,QAAQ;AAAA,YAAE,MAAK;AAAA,YAAO,OAAM;AAAA,UAAA;;qBAGzDS,EAAc,OAAAe,CAAA;AAAA,MACdZ,EAKM,OALNa,GAKM;AAAA,QAJJC,EAAAJ,EAAyEX,UAAtBT,EAAA,KAAkB,CAAA,GAAA,MAAA,EAAA,GAAA;AAAA,cAA9CA,EAAA,KAAkB;AAAA,QAAA;QACzCU,EAEM,OAAA;AAAA,UAFA,oBAAkBV,EAAA,QAAkB,SAAA,YAAA;AAAA,QAAA;UACxCc,EAAQC,EAAA,QAAA,SAAA;AAAA,QAAA;;;;;"}
+{"version":3,"file":"PlBlockPage.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/layout/PlBlockPage/PlBlockPage.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Root block page component */\nexport default {\n  name: \"PlBlockPage\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed, useCssModule, useSlots, useTemplateRef, watchEffect } from \"vue\";\nimport { PlBlockPageTitleTeleportTarget } from \"./PlBlockPageTitleTeleportTarget\";\nimport \"./pl-block-page.scss\";\nimport { PlIcon24 } from \"../../components/PlIcon24\";\nimport { type PlPlaceholderProps, PL_PLACEHOLDER_TEXTS, PlPlaceholder } from \"../PlPlaceholder\";\n\nconst slots = useSlots();\n\nconst props = defineProps<{\n  /**\n   * Page title (won't be displayed if `title` slot is also provided)\n   */\n  title?: string;\n  /**\n   * Text to display when subtitle is empty\n   */\n  subtitlePlaceholder?: string;\n  /**\n   * If `true` body gutters are removed\n   */\n  noBodyGutters?: boolean;\n  /**\n   * If defined, a loading overlay is displayed on the page body (over all default slot content)\n   */\n  bodyLoading?: PlPlaceholderProps[\"variant\"] | PlPlaceholderProps;\n}>();\n\n/** Page subtitle (editable) */\nconst subtitle = defineModel<string>(\"subtitle\");\n\nconst styles = useCssModule();\n\nconst loadingPlaceholder = computed<PlPlaceholderProps | undefined>(() => {\n  if (typeof props.bodyLoading === \"string\") {\n    return { variant: props.bodyLoading, ...PL_PLACEHOLDER_TEXTS.LOADING };\n  }\n  return props.bodyLoading;\n});\n\nconst teleportTarget = useTemplateRef(\"teleportTarget\");\n\nwatchEffect(() => {\n  PlBlockPageTitleTeleportTarget.value = teleportTarget.value;\n});\n</script>\n\n<template>\n  <div class=\"pl-layout-component pl-block-page\" :class=\"{ noBodyGutters: props.noBodyGutters }\">\n    <div v-if=\"slots.title || props.title\" :class=\"styles.header\">\n      <div class=\"pl-block-page__title\">\n        <div class=\"pl-block-page__title__default\">\n          <span v-if=\"slots.title\"><slot name=\"title\" /></span>\n          <span v-else>{{ props.title }}</span>\n          <slot name=\"after-title\" />\n        </div>\n        <div class=\"pl-block-page__title__append\">\n          <div ref=\"teleportTarget\" class=\"pl-block-page__title__append__teleport\" />\n          <slot name=\"append\" />\n        </div>\n      </div>\n      <div v-if=\"subtitle !== undefined\" :class=\"styles.subtitle\">\n        <input v-model.lazy.trim=\"subtitle\" :placeholder=\"props.subtitlePlaceholder\" />\n        <PlIcon24 :class=\"styles.editIcon\" name=\"edit\" color=\"var(--ic-02)\" />\n      </div>\n    </div>\n    <div v-else />\n    <div class=\"pl-block-page__body\">\n      <PlPlaceholder v-show=\"loadingPlaceholder\" v-bind=\"loadingPlaceholder\" />\n      <div :style=\"{ display: loadingPlaceholder ? 'none' : 'contents' }\">\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.header {\n  display: flex;\n  flex-direction: column;\n  padding: 12px 24px;\n  margin-block-end: -8px;\n  gap: 2px;\n  overflow: hidden;\n}\n\n.subtitle {\n  display: flex;\n  padding-inline-end: 28px;\n\n  input {\n    anchor-name: --pl-block-page-subtitle;\n    field-sizing: content;\n    padding: 0;\n    border: none;\n    outline: none;\n    caret-color: var(--border-color-focus);\n    color: var(--txt-01);\n    font-family: Manrope;\n    font-size: 20px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: -0.2px;\n    margin-block-end: -4px;\n    max-inline-size: 100%;\n    text-overflow: ellipsis;\n\n    &::placeholder {\n      color: var(--txt-03);\n    }\n  }\n\n  .editIcon {\n    visibility: hidden;\n    position: fixed;\n    position-anchor: --pl-block-page-subtitle;\n    position-area: center inline-end;\n    inset-inline-start: 4px;\n  }\n  &:hover,\n  &:focus-within {\n    .editIcon {\n      visibility: visible;\n    }\n  }\n}\n</style>\n"],"mappings":";;;;;;;CAGE,MAAM;;;;;;;;;;;;EAWR,IAAM,IAAQ,GAAU,EAElB,IAAQ,GAoBR,IAAW,EAAmB,GAAC,WAAW,EAE1C,IAAS,GAAc,EAEvB,IAAqB,QACrB,OAAO,EAAM,eAAgB,WACxB;GAAE,SAAS,EAAM;GAAa,GAAG,EAAqB;GAAS,GAEjE,EAAM,YACb,EAEI,IAAiB,EAAe,iBAAiB;SAEvD,QAAkB;AAChB,KAA+B,QAAQ,EAAe;IACtD,kBAIA,EAyBM,OAAA,EAzBD,OAAK,EAAA,CAAC,qCAAmC,EAAA,eAA0B,EAAM,eAAa,CAAA,CAAA,EAAA,EAAA,CAC9E,EAAA,EAAK,CAAC,SAAS,EAAM,SAAA,GAAA,EAAhC,EAgBM,OAAA;;GAhBkC,OAAK,EAAE,EAAA,EAAM,CAAC,OAAM;MAC1D,EAUM,OAVN,GAUM,CATJ,EAIM,OAJN,GAIM,CAHQ,EAAA,EAAK,CAAC,SAAA,GAAA,EAAlB,EAAqD,QAAA,GAAA,CAA5B,EAAqB,EAAA,QAAA,QAAA,CAAA,CAAA,KAAA,GAAA,EAC9C,EAAqC,QAAA,GAAA,EAArB,EAAM,MAAK,EAAA,EAAA,GAC3B,EAA2B,EAAA,QAAA,cAAA,CAAA,CAAA,EAE7B,EAGM,OAHN,GAGM,CAFJ,EAA2E,OAAA;YAAlE;GAAJ,KAAI;GAAiB,OAAM;iBAChC,EAAsB,EAAA,QAAA,SAAA,CAAA,CAAA,CAAA,CAAA,EAGf,EAAA,UAAa,KAAA,iBAAA,GAAA,EAAxB,EAGM,OAAA;;GAH8B,OAAK,EAAE,EAAA,EAAM,CAAC,SAAQ;QACxD,EAA+E,SAAA;4CAA7C,QAAA;GAAG,aAAa,EAAM;;;GAA9B,EAAA;;;IAAX,MAAR;IAAa,MAAb;;OACP,EAAsE,EAAA,EAAA,EAAA;GAA3D,OAAK,EAAE,EAAA,EAAM,CAAC,SAAQ;GAAE,MAAK;GAAO,OAAM;6CAGzD,EAAc,OAAA,EAAA,GACd,EAKM,OALN,GAKM,CAAA,EAJJ,EAAyE,EAAA,EAAA,EAAA,EAAA,EAAtB,EAAA,MAAkB,CAAA,EAAA,MAAA,GAAA,EAAA,CAAA,CAAA,GAA9C,EAAA,MAAkB,CAAA,CAAA,EACzC,EAEM,OAAA,EAFA,OAAK,EAAA,EAAA,SAAa,EAAA,QAAkB,SAAA,YAAA,CAAA,EAAA,EAAA,CACxC,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,EAAA"}

package/dist/layout/PlBlockPage/PlBlockPageTitleTeleportTarget.js

@@ -1,6 +1,5 @@
 import { ref as e } from "vue";
-const r = e();
-export {
-  r as PlBlockPageTitleTeleportTarget
-};
-//# sourceMappingURL=PlBlockPageTitleTeleportTarget.js.map
+const t = e();
+export { t as PlBlockPageTitleTeleportTarget };
+
+//# sourceMappingURL=PlBlockPageTitleTeleportTarget.js.map

package/dist/layout/PlBlockPage/PlBlockPageTitleTeleportTarget.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlBlockPageTitleTeleportTarget.js","sources":["../../../src/layout/PlBlockPage/PlBlockPageTitleTeleportTarget.ts"],"sourcesContent":["import { ref } from \"vue\";\n\nexport const PlBlockPageTitleTeleportTarget = ref<HTMLElement | null>();\n"],"names":["PlBlockPageTitleTeleportTarget","ref"],"mappings":";AAEO,MAAMA,IAAiCC,EAAA;"}
+{"version":3,"file":"PlBlockPageTitleTeleportTarget.js","names":[],"sources":["../../../src/layout/PlBlockPage/PlBlockPageTitleTeleportTarget.ts"],"sourcesContent":["import { ref } from \"vue\";\n\nexport const PlBlockPageTitleTeleportTarget = ref<HTMLElement | null>();\n"],"mappings":";AAEA,MAAa,IAAiC,GAAyB"}

package/dist/layout/PlBlockPage/pl-block-page.css

@@ -1 +1 @@
-.pl-block-page{--pl-block-page-body-padding: var(--main-spacing, 24px);background-color:var(--bg-elevated-01);height:100%;max-width:100%;display:grid;grid-template-rows:auto minmax(0,1fr)}.pl-block-page.noBodyGutters{--pl-block-page-body-padding: 0}.pl-block-page__title{display:flex;align-items:center;gap:12px;min-width:0;max-width:100%}.pl-block-page__title__default{flex:1;min-width:0;max-width:100%;margin:0;color:var(--txt-01);display:flex;flex-direction:row;align-items:center;gap:12px}.pl-block-page__title__default>span{font-size:28px;font-weight:500;line-height:36px;letter-spacing:-.56px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:100%;display:inline-block}.pl-block-page__title__append{margin-left:auto;display:flex;align-items:center;gap:2px}.pl-block-page__title__append__teleport{display:contents}.pl-block-page__body{max-width:100%;display:flex;flex-direction:column;gap:var(--gap-v);padding:var(--pl-block-page-body-padding);--thumb-color: var(--ic-02);overflow-y:auto;overflow-x:auto}.pl-block-page__body::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-block-page__body::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-block-page__body::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}
+.pl-block-page{--pl-block-page-body-padding:var(--main-spacing,24px);background-color:var(--bg-elevated-01);grid-template-rows:auto minmax(0,1fr);max-width:100%;height:100%;display:grid}.pl-block-page.noBodyGutters{--pl-block-page-body-padding:0}.pl-block-page__title{align-items:center;gap:12px;min-width:0;max-width:100%;display:flex}.pl-block-page__title__default{min-width:0;max-width:100%;color:var(--txt-01);flex-direction:row;flex:1;align-items:center;gap:12px;margin:0;display:flex}.pl-block-page__title__default>span{letter-spacing:-.56px;white-space:nowrap;text-overflow:ellipsis;min-width:0;max-width:100%;font-size:28px;font-weight:500;line-height:36px;display:inline-block;overflow:hidden}.pl-block-page__title__append{align-items:center;gap:2px;margin-left:auto;display:flex}.pl-block-page__title__append__teleport{display:contents}.pl-block-page__body{gap:var(--gap-v);max-width:100%;padding:var(--pl-block-page-body-padding);--thumb-color:var(--ic-02);flex-direction:column;display:flex;overflow:auto}.pl-block-page__body::-webkit-scrollbar{width:var(--scrollbar-width,6px);background-color:#0000;height:5px;display:block}.pl-block-page__body::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-block-page__body::-webkit-scrollbar-thumb:hover{--thumb-color:var(--border-color-focus)}

package/dist/layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.js

@@ -1,17 +1,14 @@
-import { onMounted as r, onUpdated as i, nextTick as l } from "vue";
-import { PlBlockPageTitleTeleportTarget as o } from "./PlBlockPageTitleTeleportTarget.js";
-function a(t) {
-  const e = () => {
-    l(() => {
-      o.value || console.error(
-        `[${t}] Error: Either 'PlBlockPage' component is missing or it has no title. 
-          Ensure that you placed the components inside <PlBlockPage /> with a title.`
-      );
-    });
-  };
-  return r(e), i(e), o;
+import { PlBlockPageTitleTeleportTarget as e } from "./PlBlockPageTitleTeleportTarget.js";
+import { nextTick as t, onMounted as n, onUpdated as r } from "vue";
+function i(i) {
+	let a = () => {
+		t(() => {
+			e.value || console.error(`[${i}] Error: Either 'PlBlockPage' component is missing or it has no title. 
+          Ensure that you placed the components inside <PlBlockPage /> with a title.`);
+		});
+	};
+	return n(a), r(a), e;
 }
-export {
-  a as usePlBlockPageTitleTeleportTarget
-};
-//# sourceMappingURL=usePlBlockPageTitleTeleportTarget.js.map
+export { i as usePlBlockPageTitleTeleportTarget };
+
+//# sourceMappingURL=usePlBlockPageTitleTeleportTarget.js.map

package/dist/layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePlBlockPageTitleTeleportTarget.js","sources":["../../../src/layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.ts"],"sourcesContent":["import { nextTick, onMounted, onUpdated } from \"vue\";\nimport { PlBlockPageTitleTeleportTarget } from \"./PlBlockPageTitleTeleportTarget\";\n\nexport function usePlBlockPageTitleTeleportTarget(componentName: string) {\n  const check = () => {\n    nextTick(() => {\n      if (!PlBlockPageTitleTeleportTarget.value) {\n        console.error(\n          `[${componentName}] Error: Either 'PlBlockPage' component is missing or it has no title. \n          Ensure that you placed the components inside <PlBlockPage /> with a title.`,\n        );\n      }\n    });\n  };\n\n  onMounted(check);\n  onUpdated(check);\n\n  return PlBlockPageTitleTeleportTarget;\n}\n"],"names":["usePlBlockPageTitleTeleportTarget","componentName","check","nextTick","PlBlockPageTitleTeleportTarget","onMounted","onUpdated"],"mappings":";;AAGO,SAASA,EAAkCC,GAAuB;AACvE,QAAMC,IAAQ,MAAM;AAClB,IAAAC,EAAS,MAAM;AACb,MAAKC,EAA+B,SAClC,QAAQ;AAAA,QACN,IAAIH,CAAa;AAAA;AAAA,MAAA;AAAA,IAIvB,CAAC;AAAA,EACH;AAEA,SAAAI,EAAUH,CAAK,GACfI,EAAUJ,CAAK,GAERE;AACT;"}
+{"version":3,"file":"usePlBlockPageTitleTeleportTarget.js","names":[],"sources":["../../../src/layout/PlBlockPage/usePlBlockPageTitleTeleportTarget.ts"],"sourcesContent":["import { nextTick, onMounted, onUpdated } from \"vue\";\nimport { PlBlockPageTitleTeleportTarget } from \"./PlBlockPageTitleTeleportTarget\";\n\nexport function usePlBlockPageTitleTeleportTarget(componentName: string) {\n  const check = () => {\n    nextTick(() => {\n      if (!PlBlockPageTitleTeleportTarget.value) {\n        console.error(\n          `[${componentName}] Error: Either 'PlBlockPage' component is missing or it has no title. \n          Ensure that you placed the components inside <PlBlockPage /> with a title.`,\n        );\n      }\n    });\n  };\n\n  onMounted(check);\n  onUpdated(check);\n\n  return PlBlockPageTitleTeleportTarget;\n}\n"],"mappings":";;AAGA,SAAgB,EAAkC,GAAuB;CACvE,IAAM,UAAc;AAClB,UAAe;AACb,GAAK,EAA+B,SAClC,QAAQ,MACN,IAAI,EAAc;sFAEnB;IAEH;;AAMJ,QAHA,EAAU,EAAM,EAChB,EAAU,EAAM,EAET"}

package/dist/layout/PlContainer/PlContainer.js

@@ -0,0 +1,5 @@
+import e from "./PlContainer.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=PlContainer.js.map

package/dist/layout/PlContainer/PlContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlContainer.js","names":[],"sources":["../../../src/layout/PlContainer/PlContainer.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Container with vertical spacing */\nexport default {\n  name: \"PlContainer\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport \"./pl-container.scss\";\nimport PlSplash from \"../../components/PlSplash/PlSplash.vue\";\n\nconst props = defineProps<{\n  /**\n   * CSS width value (px, %)\n   */\n  width?: string;\n  /**\n   * Shows loading overlay\n   */\n  loading?: boolean;\n  /**\n   * Optional loading text\n   */\n  loadingText?: string;\n}>();\n\nconst style = computed(() => ({\n  width: props.width,\n}));\n</script>\n\n<template>\n  <PlSplash\n    :loading=\"loading\"\n    :loading-text=\"loadingText\"\n    class=\"pl-container pl-layout-component\"\n    :style=\"style\"\n  >\n    <slot />\n  </PlSplash>\n</template>\n"],"mappings":""}

package/dist/layout/PlContainer/PlContainer.vue2.js

@@ -1,5 +1,30 @@
-import f from "./PlContainer.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=PlContainer.vue2.js.map
+import './pl-container.css';/* empty css             */
+import e from "../../components/PlSplash/PlSplash.js";
+import { computed as t, createBlock as n, defineComponent as r, normalizeStyle as i, openBlock as a, renderSlot as o, withCtx as s } from "vue";
+var c = /* @__PURE__ */ r({
+	name: "PlContainer",
+	props: {
+		width: {},
+		loading: { type: Boolean },
+		loadingText: {}
+	},
+	setup(r) {
+		let c = r, l = t(() => ({ width: c.width }));
+		return (t, c) => (a(), n(e, {
+			loading: r.loading,
+			"loading-text": r.loadingText,
+			class: "pl-container pl-layout-component",
+			style: i(l.value)
+		}, {
+			default: s(() => [o(t.$slots, "default")]),
+			_: 3
+		}, 8, [
+			"loading",
+			"loading-text",
+			"style"
+		]));
+	}
+});
+export { c as default };
+
+//# sourceMappingURL=PlContainer.vue2.js.map

package/dist/layout/PlContainer/PlContainer.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlContainer.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"PlContainer.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/layout/PlContainer/PlContainer.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Container with vertical spacing */\nexport default {\n  name: \"PlContainer\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport \"./pl-container.scss\";\nimport PlSplash from \"../../components/PlSplash/PlSplash.vue\";\n\nconst props = defineProps<{\n  /**\n   * CSS width value (px, %)\n   */\n  width?: string;\n  /**\n   * Shows loading overlay\n   */\n  loading?: boolean;\n  /**\n   * Optional loading text\n   */\n  loadingText?: string;\n}>();\n\nconst style = computed(() => ({\n  width: props.width,\n}));\n</script>\n\n<template>\n  <PlSplash\n    :loading=\"loading\"\n    :loading-text=\"loadingText\"\n    class=\"pl-container pl-layout-component\"\n    :style=\"style\"\n  >\n    <slot />\n  </PlSplash>\n</template>\n"],"mappings":";;;;CAGE,MAAM;;;;;;;EASR,IAAM,IAAQ,GAeR,IAAQ,SAAgB,EAC5B,OAAO,EAAM,OACd,EAAE;yBAID,EAOW,GAAA;GANR,SAAS,EAAA;GACT,gBAAc,EAAA;GACf,OAAM;GACL,OAAK,EAAE,EAAA,MAAK;;oBAEL,CAAR,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/layout/PlContainer/pl-container.css

@@ -1 +1 @@
-.pl-container{display:flex;flex-direction:column;gap:var(--gap-v)}
+.pl-container{gap:var(--gap-v);flex-direction:column;display:flex}

package/dist/layout/PlGrid/PlGrid.js

@@ -0,0 +1,5 @@
+import e from "./PlGrid.vue2.js";
+var t = e;
+export { t as default };
+
+//# sourceMappingURL=PlGrid.js.map

package/dist/layout/PlGrid/PlGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlGrid.js","names":[],"sources":["../../../src/layout/PlGrid/PlGrid.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Grid container */\nexport default {\n  name: \"PlGrid\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport \"./pl-grid.scss\";\n\nconst props = defineProps<{\n  columns: number;\n}>();\n\nconst style = computed(() => {\n  return {\n    gridTemplateColumns: `repeat(${props.columns}, minmax(0, 1fr))`,\n  };\n});\n</script>\n\n<template>\n  <div class=\"pl-layout-component pl-grid\" :style=\"style\">\n    <slot />\n  </div>\n</template>\n"],"mappings":""}

package/dist/layout/PlGrid/PlGrid.vue2.js

@@ -1,5 +1,16 @@
-import f from "./PlGrid.vue.js";
-export {
-  f as default
-};
-//# sourceMappingURL=PlGrid.vue2.js.map
+import './pl-grid.css';/* empty css        */
+import { computed as e, createElementBlock as t, defineComponent as n, normalizeStyle as r, openBlock as i, renderSlot as a } from "vue";
+var o = /* @__PURE__ */ n({
+	name: "PlGrid",
+	props: { columns: {} },
+	setup(n) {
+		let o = n, s = e(() => ({ gridTemplateColumns: `repeat(${o.columns}, minmax(0, 1fr))` }));
+		return (e, n) => (i(), t("div", {
+			class: "pl-layout-component pl-grid",
+			style: r(s.value)
+		}, [a(e.$slots, "default")], 4));
+	}
+});
+export { o as default };
+
+//# sourceMappingURL=PlGrid.vue2.js.map

package/dist/layout/PlGrid/PlGrid.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlGrid.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"PlGrid.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/layout/PlGrid/PlGrid.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Grid container */\nexport default {\n  name: \"PlGrid\",\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport \"./pl-grid.scss\";\n\nconst props = defineProps<{\n  columns: number;\n}>();\n\nconst style = computed(() => {\n  return {\n    gridTemplateColumns: `repeat(${props.columns}, minmax(0, 1fr))`,\n  };\n});\n</script>\n\n<template>\n  <div class=\"pl-layout-component pl-grid\" :style=\"style\">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;CAGE,MAAM;;;EAQR,IAAM,IAAQ,GAIR,IAAQ,SACL,EACL,qBAAqB,UAAU,EAAM,QAAQ,oBAC9C,EACD;yBAIA,EAEM,OAAA;GAFD,OAAM;GAA+B,OAAK,EAAE,EAAA,MAAK;MACpD,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}

package/dist/layout/PlGrid/pl-grid.css

@@ -1 +1 @@
-.pl-grid{display:grid;row-gap:var(--gap-h);column-gap:var(--gap-v)}
+.pl-grid{row-gap:var(--gap-h);column-gap:var(--gap-v);display:grid}

package/dist/layout/PlPlaceholder/PlPlaceholder.js

@@ -0,0 +1,7 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./PlPlaceholder.vue2.js";
+import n from "./PlPlaceholder.style.js";
+var r = /* @__PURE__ */ e(t, [["__cssModules", { $style: n }]]);
+export { r as default };
+
+//# sourceMappingURL=PlPlaceholder.js.map

package/dist/layout/PlPlaceholder/PlPlaceholder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlPlaceholder.js","names":[],"sources":["../../../src/layout/PlPlaceholder/PlPlaceholder.vue"],"sourcesContent":["<script lang=\"ts\">\nimport paintWorkletCode from \"./paint-worklet.js?raw\";\n\nexport interface PlPlaceholderProps {\n  variant?: \"table\" | \"graph\";\n  title?: string;\n  subtitle?: string | string[];\n}\n\n// Register paint worklet once at module load (uses blob URL to comply with CSP)\nconst workletBlob = new Blob([paintWorkletCode], { type: \"application/javascript\" });\nconst workletUrl = URL.createObjectURL(workletBlob);\n(\n  CSS as unknown as {\n    paintWorklet: { addModule: (url: string) => void };\n  }\n).paintWorklet.addModule(workletUrl);\n</script>\n\n<script setup lang=\"ts\">\nimport { useCssModule } from \"vue\";\nimport PlLoaderLogo from \"../../components/PlLoaderLogo.vue\";\n\nconst props = defineProps<PlPlaceholderProps>();\n\nconst styles = useCssModule();\n</script>\n\n<template>\n  <div :class=\"styles.root\">\n    <div\n      :class=\"[\n        styles.background,\n        {\n          [styles.table]: props.variant === 'table',\n          [styles.graph]: props.variant === 'graph',\n        },\n      ]\"\n    />\n    <div :class=\"styles.content\">\n      <PlLoaderLogo :size=\"64\" color=\"var(--color-div-grey)\" />\n      <div v-if=\"props.title || props.subtitle\" :class=\"styles.text\">\n        <div v-if=\"props.title\" :class=\"styles.title\">{{ props.title }}</div>\n        <div v-if=\"props.subtitle\" :class=\"styles.subtitle\">\n          <template v-if=\"Array.isArray(props.subtitle)\">\n            <span v-for=\"(item, key) of props.subtitle\" :key>{{ item }}</span>\n          </template>\n          <span v-else>{{ props.subtitle }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.root {\n  block-size: 100%;\n  inline-size: 100%;\n  position: relative;\n  user-select: none;\n  background-color: var(--bg-elevated-01);\n}\n\n.background {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  mask: linear-gradient(transparent 35%, #000 40% 60%, transparent 65%);\n  mask-size: 100% 300%;\n  animation-duration: 5s;\n  animation-iteration-count: infinite;\n  animation-name: slide;\n  &.table {\n    background-image: paint(pl-placeholder-table-skeleton);\n  }\n  &.graph {\n    background-image: paint(pl-placeholder-graph-skeleton);\n  }\n}\n\n.content {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  gap: 12px;\n}\n\n.text {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n  -webkit-text-stroke-color: white;\n  -webkit-text-stroke-width: 4px;\n  paint-order: stroke;\n}\n\n.title {\n  color: var(--txt-03);\n  font-size: 20px;\n  font-weight: 500;\n  line-height: 24px;\n  letter-spacing: -0.2px;\n}\n\n.subtitle {\n  color: var(--txt-03);\n  font-weight: 500;\n  line-height: 20px;\n  display: grid;\n  span {\n    grid-area: 1 / 1;\n    text-align: center;\n    animation-name: active-subtitle;\n    animation-duration: calc(6s * sibling-count());\n    animation-iteration-count: infinite;\n    animation-timing-function: steps(sibling-count(), jump-none);\n    visibility: if(\n      style(--pl-placeholder-active-subtitle: sibling-index()): visible; else: hidden;\n    );\n  }\n}\n\n@keyframes slide {\n  from {\n    mask-position: 0 100%;\n  }\n}\n\n@keyframes active-subtitle {\n  from {\n    --pl-placeholder-active-subtitle: 1;\n  }\n  to {\n    --pl-placeholder-active-subtitle: sibling-count();\n  }\n}\n\n@property --pl-placeholder-active-subtitle {\n  syntax: \"<number>\";\n  inherits: false;\n  initial-value: 1;\n}\n</style>\n"],"mappings":""}

package/dist/layout/PlPlaceholder/PlPlaceholder.style.js

@@ -0,0 +1,15 @@
+import './PlPlaceholder.vue.css';var e = {
+	root: "_root_xfknp_2",
+	background: "_background_xfknp_10",
+	slide: "_slide_xfknp_1",
+	table: "_table_xfknp_19",
+	graph: "_graph_xfknp_22",
+	content: "_content_xfknp_27",
+	text: "_text_xfknp_37",
+	title: "_title_xfknp_47",
+	subtitle: "_subtitle_xfknp_55",
+	"active-subtitle": "_active-subtitle_xfknp_1"
+};
+export { e as default };
+
+//# sourceMappingURL=PlPlaceholder.style.js.map

package/dist/layout/PlPlaceholder/PlPlaceholder.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlPlaceholder.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/layout/PlPlaceholder/PlPlaceholder.vue"],"sourcesContent":["<script lang=\"ts\">\nimport paintWorkletCode from \"./paint-worklet.js?raw\";\n\nexport interface PlPlaceholderProps {\n  variant?: \"table\" | \"graph\";\n  title?: string;\n  subtitle?: string | string[];\n}\n\n// Register paint worklet once at module load (uses blob URL to comply with CSP)\nconst workletBlob = new Blob([paintWorkletCode], { type: \"application/javascript\" });\nconst workletUrl = URL.createObjectURL(workletBlob);\n(\n  CSS as unknown as {\n    paintWorklet: { addModule: (url: string) => void };\n  }\n).paintWorklet.addModule(workletUrl);\n</script>\n\n<script setup lang=\"ts\">\nimport { useCssModule } from \"vue\";\nimport PlLoaderLogo from \"../../components/PlLoaderLogo.vue\";\n\nconst props = defineProps<PlPlaceholderProps>();\n\nconst styles = useCssModule();\n</script>\n\n<template>\n  <div :class=\"styles.root\">\n    <div\n      :class=\"[\n        styles.background,\n        {\n          [styles.table]: props.variant === 'table',\n          [styles.graph]: props.variant === 'graph',\n        },\n      ]\"\n    />\n    <div :class=\"styles.content\">\n      <PlLoaderLogo :size=\"64\" color=\"var(--color-div-grey)\" />\n      <div v-if=\"props.title || props.subtitle\" :class=\"styles.text\">\n        <div v-if=\"props.title\" :class=\"styles.title\">{{ props.title }}</div>\n        <div v-if=\"props.subtitle\" :class=\"styles.subtitle\">\n          <template v-if=\"Array.isArray(props.subtitle)\">\n            <span v-for=\"(item, key) of props.subtitle\" :key>{{ item }}</span>\n          </template>\n          <span v-else>{{ props.subtitle }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.root {\n  block-size: 100%;\n  inline-size: 100%;\n  position: relative;\n  user-select: none;\n  background-color: var(--bg-elevated-01);\n}\n\n.background {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  mask: linear-gradient(transparent 35%, #000 40% 60%, transparent 65%);\n  mask-size: 100% 300%;\n  animation-duration: 5s;\n  animation-iteration-count: infinite;\n  animation-name: slide;\n  &.table {\n    background-image: paint(pl-placeholder-table-skeleton);\n  }\n  &.graph {\n    background-image: paint(pl-placeholder-graph-skeleton);\n  }\n}\n\n.content {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  gap: 12px;\n}\n\n.text {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n  -webkit-text-stroke-color: white;\n  -webkit-text-stroke-width: 4px;\n  paint-order: stroke;\n}\n\n.title {\n  color: var(--txt-03);\n  font-size: 20px;\n  font-weight: 500;\n  line-height: 24px;\n  letter-spacing: -0.2px;\n}\n\n.subtitle {\n  color: var(--txt-03);\n  font-weight: 500;\n  line-height: 20px;\n  display: grid;\n  span {\n    grid-area: 1 / 1;\n    text-align: center;\n    animation-name: active-subtitle;\n    animation-duration: calc(6s * sibling-count());\n    animation-iteration-count: infinite;\n    animation-timing-function: steps(sibling-count(), jump-none);\n    visibility: if(\n      style(--pl-placeholder-active-subtitle: sibling-index()): visible; else: hidden;\n    );\n  }\n}\n\n@keyframes slide {\n  from {\n    mask-position: 0 100%;\n  }\n}\n\n@keyframes active-subtitle {\n  from {\n    --pl-placeholder-active-subtitle: 1;\n  }\n  to {\n    --pl-placeholder-active-subtitle: sibling-count();\n  }\n}\n\n@property --pl-placeholder-active-subtitle {\n  syntax: \"<number>\";\n  inherits: false;\n  initial-value: 1;\n}\n</style>\n"],"mappings":""}

package/dist/layout/PlPlaceholder/PlPlaceholder.vue.css

@@ -0,0 +1 @@
+._root_xfknp_2{-webkit-user-select:none;user-select:none;background-color:var(--bg-elevated-01);block-size:100%;inline-size:100%;position:relative}._background_xfknp_10{pointer-events:none;animation-name:_slide_xfknp_1;animation-duration:5s;animation-iteration-count:infinite;position:absolute;inset:0;-webkit-mask:linear-gradient(#0000 35%,#000 40% 60%,#0000 65%) 0 0/100% 300%;mask:linear-gradient(#0000 35%,#000 40% 60%,#0000 65%) 0 0/100% 300%}._background_xfknp_10._table_xfknp_19{background-image:paint(pl-placeholder-table-skeleton)}._background_xfknp_10._graph_xfknp_22{background-image:paint(pl-placeholder-graph-skeleton)}._content_xfknp_27{flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}._text_xfknp_37{-webkit-text-stroke-color:white;-webkit-text-stroke-width:4px;paint-order:stroke;flex-direction:column;align-items:center;gap:4px;display:flex}._title_xfknp_47{color:var(--txt-03);letter-spacing:-.2px;font-size:20px;font-weight:500;line-height:24px}._subtitle_xfknp_55{color:var(--txt-03);font-weight:500;line-height:20px;display:grid}._subtitle_xfknp_55 span{text-align:center;animation-name:_active-subtitle_xfknp_1;animation-duration:calc(6s * sibling-count());animation-iteration-count:infinite;animation-timing-function:steps(sibling-count(), jump-none);visibility:if(style(--pl-placeholder-active-subtitle: sibling-index()): visible; else: hidden;);grid-area:1/1}@keyframes _slide_xfknp_1{0%{-webkit-mask-position:0 100%;mask-position:0 100%}}@keyframes _active-subtitle_xfknp_1{0%{--pl-placeholder-active-subtitle:1}to{--pl-placeholder-active-subtitle:sibling-count()}}@property --pl-placeholder-active-subtitle{syntax:"<number>";inherits:false;initial-value:1}

package/dist/layout/PlPlaceholder/PlPlaceholder.vue2.js

@@ -1,56 +1,35 @@
-import { defineComponent as u, useCssModule as m, createElementBlock as o, openBlock as l, normalizeClass as a, unref as r, createElementVNode as n, createVNode as b, createCommentVNode as s, toDisplayString as i, Fragment as k, renderList as v } from "vue";
-import y from "../../components/PlLoaderLogo.vue.js";
-import _ from "./paint-worklet.js";
-const f = { key: 1 }, g = new Blob([_], { type: "application/javascript" }), C = URL.createObjectURL(g);
-CSS.paintWorklet.addModule(C);
-const N = /* @__PURE__ */ u({
-  __name: "PlPlaceholder",
-  props: {
-    variant: {},
-    title: {},
-    subtitle: {}
-  },
-  setup(c) {
-    const t = c, e = m();
-    return (h, L) => (l(), o("div", {
-      class: a(r(e).root)
-    }, [
-      n("div", {
-        class: a([
-          r(e).background,
-          {
-            [r(e).table]: t.variant === "table",
-            [r(e).graph]: t.variant === "graph"
-          }
-        ])
-      }, null, 2),
-      n("div", {
-        class: a(r(e).content)
-      }, [
-        b(y, {
-          size: 64,
-          color: "var(--color-div-grey)"
-        }),
-        t.title || t.subtitle ? (l(), o("div", {
-          key: 0,
-          class: a(r(e).text)
-        }, [
-          t.title ? (l(), o("div", {
-            key: 0,
-            class: a(r(e).title)
-          }, i(t.title), 3)) : s("", !0),
-          t.subtitle ? (l(), o("div", {
-            key: 1,
-            class: a(r(e).subtitle)
-          }, [
-            Array.isArray(t.subtitle) ? (l(!0), o(k, { key: 0 }, v(t.subtitle, (d, p) => (l(), o("span", { key: p }, i(d), 1))), 128)) : (l(), o("span", f, i(t.subtitle), 1))
-          ], 2)) : s("", !0)
-        ], 2)) : s("", !0)
-      ], 2)
-    ], 2));
-  }
+import e from "../../components/PlLoaderLogo.js";
+import t from "./paint-worklet.js";
+import { Fragment as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, normalizeClass as c, openBlock as l, renderList as u, toDisplayString as d, unref as f, useCssModule as p } from "vue";
+var m = { key: 1 }, h = new Blob([t], { type: "application/javascript" }), g = URL.createObjectURL(h);
+CSS.paintWorklet.addModule(g);
+var _ = /* @__PURE__ */ s({
+	__name: "PlPlaceholder",
+	props: {
+		variant: {},
+		title: {},
+		subtitle: {}
+	},
+	setup(t) {
+		let s = t, h = p();
+		return (t, p) => (l(), i("div", { class: c(f(h).root) }, [a("div", { class: c([f(h).background, {
+			[f(h).table]: s.variant === "table",
+			[f(h).graph]: s.variant === "graph"
+		}]) }, null, 2), a("div", { class: c(f(h).content) }, [o(e, {
+			size: 64,
+			color: "var(--color-div-grey)"
+		}), s.title || s.subtitle ? (l(), i("div", {
+			key: 0,
+			class: c(f(h).text)
+		}, [s.title ? (l(), i("div", {
+			key: 0,
+			class: c(f(h).title)
+		}, d(s.title), 3)) : r("", !0), s.subtitle ? (l(), i("div", {
+			key: 1,
+			class: c(f(h).subtitle)
+		}, [Array.isArray(s.subtitle) ? (l(!0), i(n, { key: 0 }, u(s.subtitle, (e, t) => (l(), i("span", { key: t }, d(e), 1))), 128)) : (l(), i("span", m, d(s.subtitle), 1))], 2)) : r("", !0)], 2)) : r("", !0)], 2)], 2));
+	}
 });
-export {
-  N as default
-};
-//# sourceMappingURL=PlPlaceholder.vue2.js.map
+export { _ as default };
+
+//# sourceMappingURL=PlPlaceholder.vue2.js.map

package/dist/layout/PlPlaceholder/PlPlaceholder.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlPlaceholder.vue2.js","sources":["../../../src/layout/PlPlaceholder/PlPlaceholder.vue"],"sourcesContent":["<script lang=\"ts\">\nimport paintWorkletCode from \"./paint-worklet.js?raw\";\n\nexport interface PlPlaceholderProps {\n  variant?: \"table\" | \"graph\";\n  title?: string;\n  subtitle?: string | string[];\n}\n\n// Register paint worklet once at module load (uses blob URL to comply with CSP)\nconst workletBlob = new Blob([paintWorkletCode], { type: \"application/javascript\" });\nconst workletUrl = URL.createObjectURL(workletBlob);\n(\n  CSS as unknown as {\n    paintWorklet: { addModule: (url: string) => void };\n  }\n).paintWorklet.addModule(workletUrl);\n</script>\n\n<script setup lang=\"ts\">\nimport { useCssModule } from \"vue\";\nimport PlLoaderLogo from \"../../components/PlLoaderLogo.vue\";\n\nconst props = defineProps<PlPlaceholderProps>();\n\nconst styles = useCssModule();\n</script>\n\n<template>\n  <div :class=\"styles.root\">\n    <div\n      :class=\"[\n        styles.background,\n        {\n          [styles.table]: props.variant === 'table',\n          [styles.graph]: props.variant === 'graph',\n        },\n      ]\"\n    />\n    <div :class=\"styles.content\">\n      <PlLoaderLogo :size=\"64\" color=\"var(--color-div-grey)\" />\n      <div v-if=\"props.title || props.subtitle\" :class=\"styles.text\">\n        <div v-if=\"props.title\" :class=\"styles.title\">{{ props.title }}</div>\n        <div v-if=\"props.subtitle\" :class=\"styles.subtitle\">\n          <template v-if=\"Array.isArray(props.subtitle)\">\n            <span v-for=\"(item, key) of props.subtitle\" :key>{{ item }}</span>\n          </template>\n          <span v-else>{{ props.subtitle }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.root {\n  block-size: 100%;\n  inline-size: 100%;\n  position: relative;\n  user-select: none;\n  background-color: var(--bg-elevated-01);\n}\n\n.background {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  mask: linear-gradient(transparent 35%, #000 40% 60%, transparent 65%);\n  mask-size: 100% 300%;\n  animation-duration: 5s;\n  animation-iteration-count: infinite;\n  animation-name: slide;\n  &.table {\n    background-image: paint(pl-placeholder-table-skeleton);\n  }\n  &.graph {\n    background-image: paint(pl-placeholder-graph-skeleton);\n  }\n}\n\n.content {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  gap: 12px;\n}\n\n.text {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n  -webkit-text-stroke-color: white;\n  -webkit-text-stroke-width: 4px;\n  paint-order: stroke;\n}\n\n.title {\n  color: var(--txt-03);\n  font-size: 20px;\n  font-weight: 500;\n  line-height: 24px;\n  letter-spacing: -0.2px;\n}\n\n.subtitle {\n  color: var(--txt-03);\n  font-weight: 500;\n  line-height: 20px;\n  display: grid;\n  span {\n    grid-area: 1 / 1;\n    text-align: center;\n    animation-name: active-subtitle;\n    animation-duration: calc(6s * sibling-count());\n    animation-iteration-count: infinite;\n    animation-timing-function: steps(sibling-count(), jump-none);\n    visibility: if(\n      style(--pl-placeholder-active-subtitle: sibling-index()): visible; else: hidden;\n    );\n  }\n}\n\n@keyframes slide {\n  from {\n    mask-position: 0 100%;\n  }\n}\n\n@keyframes active-subtitle {\n  from {\n    --pl-placeholder-active-subtitle: 1;\n  }\n  to {\n    --pl-placeholder-active-subtitle: sibling-count();\n  }\n}\n\n@property --pl-placeholder-active-subtitle {\n  syntax: \"<number>\";\n  inherits: false;\n  initial-value: 1;\n}\n</style>\n"],"names":["workletBlob","paintWorkletCode","workletUrl","props","__props","styles","useCssModule","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createVNode","PlLoaderLogo","_toDisplayString","_openBlock","_Fragment","item","key","_hoisted_1"],"mappings":";;;sBAUMA,IAAc,IAAI,KAAK,CAACC,CAAgB,GAAG,EAAE,MAAM,0BAA0B,GAC7EC,IAAa,IAAI,gBAAgBF,CAAW;AAEhD,IAGA,aAAa,UAAUE,CAAU;;;;;;;;;AAOnC,UAAMC,IAAQC,GAERC,IAASC,EAAA;2BAIbC,EAsBM,OAAA;AAAA,MAtBA,OAAKC,EAAEC,EAAAJ,CAAA,EAAO,IAAI;AAAA,IAAA;MACtBK,EAQE,OAAA;AAAA,QAPC,OAAKF,EAAA;AAAA,UAAYC,EAAAJ,CAAA,EAAO;AAAA;YAAiC,CAAAI,EAAAJ,CAAA,EAAO,KAAK,GAAGF,EAAM,YAAO;AAAA,YAAyB,CAAAM,EAAAJ,CAAA,EAAO,KAAK,GAAGF,EAAM,YAAO;AAAA,UAAA;AAAA;;MAQ7IO,EAWM,OAAA;AAAA,QAXA,OAAKF,EAAEC,EAAAJ,CAAA,EAAO,OAAO;AAAA,MAAA;QACzBM,EAAyDC,GAAA;AAAA,UAA1C,MAAM;AAAA,UAAI,OAAM;AAAA,QAAA;QACpBT,EAAM,SAASA,EAAM,iBAAhCI,EAQM,OAAA;AAAA;UARqC,OAAKC,EAAEC,EAAAJ,CAAA,EAAO,IAAI;AAAA,QAAA;UAChDF,EAAM,cAAjBI,EAAqE,OAAA;AAAA;YAA5C,OAAKC,EAAEC,EAAAJ,CAAA,EAAO,KAAK;AAAA,UAAA,GAAKQ,EAAAV,EAAM,KAAK,GAAA,CAAA;UACjDA,EAAM,iBAAjBI,EAKM,OAAA;AAAA;YALsB,OAAKC,EAAEC,EAAAJ,CAAA,EAAO,QAAQ;AAAA,UAAA;YAChC,MAAM,QAAQF,EAAM,QAAQ,KAC1CW,EAAA,EAAA,GAAAP,EAAkEQ,iBAAtCZ,EAAM,UAAQ,CAA5Ba,GAAMC,OAApBH,EAAA,GAAAP,EAAkE,QAAA,EAArB,KAAAU,OAAOD,CAAI,GAAA,CAAA,mBAE1DT,EAAwC,QAAAW,GAAAL,EAAxBV,EAAM,QAAQ,GAAA,CAAA;AAAA,UAAA;;;;;;"}
+{"version":3,"file":"PlPlaceholder.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/layout/PlPlaceholder/PlPlaceholder.vue"],"sourcesContent":["<script lang=\"ts\">\nimport paintWorkletCode from \"./paint-worklet.js?raw\";\n\nexport interface PlPlaceholderProps {\n  variant?: \"table\" | \"graph\";\n  title?: string;\n  subtitle?: string | string[];\n}\n\n// Register paint worklet once at module load (uses blob URL to comply with CSP)\nconst workletBlob = new Blob([paintWorkletCode], { type: \"application/javascript\" });\nconst workletUrl = URL.createObjectURL(workletBlob);\n(\n  CSS as unknown as {\n    paintWorklet: { addModule: (url: string) => void };\n  }\n).paintWorklet.addModule(workletUrl);\n</script>\n\n<script setup lang=\"ts\">\nimport { useCssModule } from \"vue\";\nimport PlLoaderLogo from \"../../components/PlLoaderLogo.vue\";\n\nconst props = defineProps<PlPlaceholderProps>();\n\nconst styles = useCssModule();\n</script>\n\n<template>\n  <div :class=\"styles.root\">\n    <div\n      :class=\"[\n        styles.background,\n        {\n          [styles.table]: props.variant === 'table',\n          [styles.graph]: props.variant === 'graph',\n        },\n      ]\"\n    />\n    <div :class=\"styles.content\">\n      <PlLoaderLogo :size=\"64\" color=\"var(--color-div-grey)\" />\n      <div v-if=\"props.title || props.subtitle\" :class=\"styles.text\">\n        <div v-if=\"props.title\" :class=\"styles.title\">{{ props.title }}</div>\n        <div v-if=\"props.subtitle\" :class=\"styles.subtitle\">\n          <template v-if=\"Array.isArray(props.subtitle)\">\n            <span v-for=\"(item, key) of props.subtitle\" :key>{{ item }}</span>\n          </template>\n          <span v-else>{{ props.subtitle }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style module>\n.root {\n  block-size: 100%;\n  inline-size: 100%;\n  position: relative;\n  user-select: none;\n  background-color: var(--bg-elevated-01);\n}\n\n.background {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n  mask: linear-gradient(transparent 35%, #000 40% 60%, transparent 65%);\n  mask-size: 100% 300%;\n  animation-duration: 5s;\n  animation-iteration-count: infinite;\n  animation-name: slide;\n  &.table {\n    background-image: paint(pl-placeholder-table-skeleton);\n  }\n  &.graph {\n    background-image: paint(pl-placeholder-graph-skeleton);\n  }\n}\n\n.content {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  gap: 12px;\n}\n\n.text {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n  -webkit-text-stroke-color: white;\n  -webkit-text-stroke-width: 4px;\n  paint-order: stroke;\n}\n\n.title {\n  color: var(--txt-03);\n  font-size: 20px;\n  font-weight: 500;\n  line-height: 24px;\n  letter-spacing: -0.2px;\n}\n\n.subtitle {\n  color: var(--txt-03);\n  font-weight: 500;\n  line-height: 20px;\n  display: grid;\n  span {\n    grid-area: 1 / 1;\n    text-align: center;\n    animation-name: active-subtitle;\n    animation-duration: calc(6s * sibling-count());\n    animation-iteration-count: infinite;\n    animation-timing-function: steps(sibling-count(), jump-none);\n    visibility: if(\n      style(--pl-placeholder-active-subtitle: sibling-index()): visible; else: hidden;\n    );\n  }\n}\n\n@keyframes slide {\n  from {\n    mask-position: 0 100%;\n  }\n}\n\n@keyframes active-subtitle {\n  from {\n    --pl-placeholder-active-subtitle: 1;\n  }\n  to {\n    --pl-placeholder-active-subtitle: sibling-count();\n  }\n}\n\n@property --pl-placeholder-active-subtitle {\n  syntax: \"<number>\";\n  inherits: false;\n  initial-value: 1;\n}\n</style>\n"],"mappings":";;;oBAUM,IAAc,IAAI,KAAK,CAAC,EAAiB,EAAE,EAAE,MAAM,0BAA0B,CAAC,EAC9E,IAAa,IAAI,gBAAgB,EAAY;AAEjD,IAGA,aAAa,UAAU,EAAW;;;;;;;;;EAOpC,IAAM,IAAQ,GAER,IAAS,GAAc;yBAI3B,EAsBM,OAAA,EAtBA,OAAK,EAAE,EAAA,EAAM,CAAC,KAAI,EAAA,EAAA,CACtB,EAQE,OAAA,EAPC,OAAK,EAAA,CAAY,EAAA,EAAM,CAAC,YAAA;IAAiC,EAAA,EAAM,CAAC,QAAQ,EAAM,YAAO;IAAyB,EAAA,EAAM,CAAC,QAAQ,EAAM,YAAO;mBAQ7I,EAWM,OAAA,EAXA,OAAK,EAAE,EAAA,EAAM,CAAC,QAAO,EAAA,EAAA,CACzB,EAAyD,GAAA;GAA1C,MAAM;GAAI,OAAM;MACpB,EAAM,SAAS,EAAM,YAAA,GAAA,EAAhC,EAQM,OAAA;;GARqC,OAAK,EAAE,EAAA,EAAM,CAAC,KAAI;MAChD,EAAM,SAAA,GAAA,EAAjB,EAAqE,OAAA;;GAA5C,OAAK,EAAE,EAAA,EAAM,CAAC,MAAK;OAAK,EAAM,MAAK,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EACjD,EAAM,YAAA,GAAA,EAAjB,EAKM,OAAA;;GALsB,OAAK,EAAE,EAAA,EAAM,CAAC,SAAQ;MAChC,MAAM,QAAQ,EAAM,SAAQ,IAAA,EAAA,GAAA,EAC1C,EAAkE,GAAA,EAAA,KAAA,GAAA,EAAA,EAAtC,EAAM,WAApB,GAAM,YAApB,EAAkE,QAAA,EAArB,QAAG,EAAA,EAAI,EAAI,EAAA,EAAA,kBAE1D,EAAwC,QAAA,GAAA,EAAxB,EAAM,SAAQ,EAAA,EAAA,EAAA,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,CAAA,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,CAAA,EAAA,EAAA,CAAA,EAAA,EAAA"}

package/dist/layout/PlPlaceholder/index.js

@@ -1,24 +1,24 @@
+import "./PlPlaceholder.js";
 const e = {
-  LOADING: {
-    title: "Loading data...",
-    subtitle: [
-      "No action needed—the job is active",
-      "Larger datasets take longer to load",
-      "Results will appear here as soon as they’re ready",
-      "Loading may take minutes to hours"
-    ]
-  },
-  RUNNING: {
-    title: "Running analysis...",
-    subtitle: [
-      "No action needed—the job is active",
-      "Larger datasets take longer to process",
-      "Results will appear here as soon as they’re ready",
-      "Processing may take minutes to hours"
-    ]
-  }
+	LOADING: {
+		title: "Loading data...",
+		subtitle: [
+			"No action needed—the job is active",
+			"Larger datasets take longer to load",
+			"Results will appear here as soon as they’re ready",
+			"Loading may take minutes to hours"
+		]
+	},
+	RUNNING: {
+		title: "Running analysis...",
+		subtitle: [
+			"No action needed—the job is active",
+			"Larger datasets take longer to process",
+			"Results will appear here as soon as they’re ready",
+			"Processing may take minutes to hours"
+		]
+	}
 };
-export {
-  e as PL_PLACEHOLDER_TEXTS
-};
-//# sourceMappingURL=index.js.map
+export { e as PL_PLACEHOLDER_TEXTS };
+
+//# sourceMappingURL=index.js.map

package/dist/layout/PlPlaceholder/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/layout/PlPlaceholder/index.ts"],"sourcesContent":["export { type PlPlaceholderProps, default as PlPlaceholder } from \"./PlPlaceholder.vue\";\n\nexport const PL_PLACEHOLDER_TEXTS = {\n  LOADING: {\n    title: \"Loading data...\",\n    subtitle: [\n      \"No action needed—the job is active\",\n      \"Larger datasets take longer to load\",\n      \"Results will appear here as soon as they’re ready\",\n      \"Loading may take minutes to hours\",\n    ],\n  },\n  RUNNING: {\n    title: \"Running analysis...\",\n    subtitle: [\n      \"No action needed—the job is active\",\n      \"Larger datasets take longer to process\",\n      \"Results will appear here as soon as they’re ready\",\n      \"Processing may take minutes to hours\",\n    ],\n  },\n};\n"],"names":["PL_PLACEHOLDER_TEXTS"],"mappings":"AAEO,MAAMA,IAAuB;AAAA,EAClC,SAAS;AAAA,IACP,OAAO;AAAA,IACP,UAAU;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAAA,EAEF,SAAS;AAAA,IACP,OAAO;AAAA,IACP,UAAU;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/layout/PlPlaceholder/index.ts"],"sourcesContent":["export { type PlPlaceholderProps, default as PlPlaceholder } from \"./PlPlaceholder.vue\";\n\nexport const PL_PLACEHOLDER_TEXTS = {\n  LOADING: {\n    title: \"Loading data...\",\n    subtitle: [\n      \"No action needed—the job is active\",\n      \"Larger datasets take longer to load\",\n      \"Results will appear here as soon as they’re ready\",\n      \"Loading may take minutes to hours\",\n    ],\n  },\n  RUNNING: {\n    title: \"Running analysis...\",\n    subtitle: [\n      \"No action needed—the job is active\",\n      \"Larger datasets take longer to process\",\n      \"Results will appear here as soon as they’re ready\",\n      \"Processing may take minutes to hours\",\n    ],\n  },\n};\n"],"mappings":";AAEA,MAAa,IAAuB;CAClC,SAAS;EACP,OAAO;EACP,UAAU;GACR;GACA;GACA;GACA;GACD;EACF;CACD,SAAS;EACP,OAAO;EACP,UAAU;GACR;GACA;GACA;GACA;GACD;EACF;CACF"}

package/dist/layout/PlPlaceholder/paint-worklet.js

@@ -1,128 +1,4 @@
-const n = `registerPaint(
-  "pl-placeholder-table-skeleton",
-  class {
-    /**
-     * @param {CanvasRenderingContext2D} ctx
-     * @param {Object} size
-     * @param {number} size.width
-     * @param {number} size.height
-     */
-    paint(ctx, { width, height }) {
-      const headerHeight = 42;
-      const headerWidth = 48;
+var e = "registerPaint(\n  \"pl-placeholder-table-skeleton\",\n  class {\n    /**\n     * @param {CanvasRenderingContext2D} ctx\n     * @param {Object} size\n     * @param {number} size.width\n     * @param {number} size.height\n     */\n    paint(ctx, { width, height }) {\n      const headerHeight = 42;\n      const headerWidth = 48;\n\n      ctx.fillStyle = \"#F7F8FA\";\n\n      // headers\n      {\n        const path = new Path2D();\n        path.lineTo(width, 0);\n        path.lineTo(width, headerHeight);\n        path.lineTo(headerWidth, headerHeight);\n        path.lineTo(headerWidth, height);\n        path.lineTo(0, height);\n        path.lineTo(0, 0);\n        ctx.fill(path);\n      }\n\n      ctx.strokeStyle = \"#E1E3EB\";\n\n      // vertical lines\n      const columnWidth = (width - headerWidth) / 6;\n      for (\n        let horizontalPosition = headerWidth;\n        horizontalPosition < width;\n        horizontalPosition += columnWidth\n      ) {\n        const path = new Path2D();\n        path.moveTo(horizontalPosition, 0);\n        path.lineTo(horizontalPosition, height);\n        ctx.stroke(path);\n      }\n\n      // horizontal lines\n      for (\n        let verticalPosition = headerHeight;\n        verticalPosition < height;\n        verticalPosition += headerHeight\n      ) {\n        const path = new Path2D();\n        path.moveTo(0, verticalPosition);\n        path.lineTo(width, verticalPosition);\n        ctx.stroke(path);\n      }\n    }\n  },\n);\n\nregisterPaint(\n  \"pl-placeholder-graph-skeleton\",\n  class {\n    /**\n     * @param {CanvasRenderingContext2D} ctx\n     * @param {Object} size\n     * @param {number} size.width\n     * @param {number} size.height\n     */\n    paint(ctx, { width, height }) {\n      const padding = 6;\n      const cellWidth = 100;\n      const cellHeight = 60;\n\n      ctx.strokeStyle = \"#E1E3EB\";\n\n      // vertical lines\n      for (\n        let horizontalPosition = cellWidth + padding;\n        horizontalPosition <= width;\n        horizontalPosition += cellWidth\n      ) {\n        const path = new Path2D();\n        path.moveTo(horizontalPosition, 0);\n        path.lineTo(horizontalPosition, height - padding);\n        ctx.stroke(path);\n      }\n\n      // horizontal lines\n      for (\n        let verticalPosition = height - padding - cellHeight;\n        verticalPosition >= 0;\n        verticalPosition -= cellHeight\n      ) {\n        const path = new Path2D();\n        path.moveTo(padding, verticalPosition);\n        path.lineTo(width, verticalPosition);\n        ctx.stroke(path);\n      }\n\n      ctx.strokeStyle = \"#110529\";\n\n      // vertical arrow\n      {\n        const path = new Path2D();\n        path.moveTo(padding, height - padding);\n        path.lineTo(padding, 0);\n        path.lineTo(0, padding);\n        path.moveTo(padding, 0);\n        path.lineTo(padding * 2, padding);\n        ctx.stroke(path);\n      }\n\n      // horizontal arrow\n      {\n        const path = new Path2D();\n        path.moveTo(padding, height - padding);\n        path.lineTo(width, height - padding);\n        path.lineTo(width - padding, height - padding * 2);\n        path.moveTo(width, height - padding);\n        path.lineTo(width - padding, height);\n        ctx.stroke(path);\n      }\n    }\n  },\n);\n";
+export { e as default };
 
-      ctx.fillStyle = "#F7F8FA";
-
-      // headers
-      {
-        const path = new Path2D();
-        path.lineTo(width, 0);
-        path.lineTo(width, headerHeight);
-        path.lineTo(headerWidth, headerHeight);
-        path.lineTo(headerWidth, height);
-        path.lineTo(0, height);
-        path.lineTo(0, 0);
-        ctx.fill(path);
-      }
-
-      ctx.strokeStyle = "#E1E3EB";
-
-      // vertical lines
-      const columnWidth = (width - headerWidth) / 6;
-      for (
-        let horizontalPosition = headerWidth;
-        horizontalPosition < width;
-        horizontalPosition += columnWidth
-      ) {
-        const path = new Path2D();
-        path.moveTo(horizontalPosition, 0);
-        path.lineTo(horizontalPosition, height);
-        ctx.stroke(path);
-      }
-
-      // horizontal lines
-      for (
-        let verticalPosition = headerHeight;
-        verticalPosition < height;
-        verticalPosition += headerHeight
-      ) {
-        const path = new Path2D();
-        path.moveTo(0, verticalPosition);
-        path.lineTo(width, verticalPosition);
-        ctx.stroke(path);
-      }
-    }
-  },
-);
-
-registerPaint(
-  "pl-placeholder-graph-skeleton",
-  class {
-    /**
-     * @param {CanvasRenderingContext2D} ctx
-     * @param {Object} size
-     * @param {number} size.width
-     * @param {number} size.height
-     */
-    paint(ctx, { width, height }) {
-      const padding = 6;
-      const cellWidth = 100;
-      const cellHeight = 60;
-
-      ctx.strokeStyle = "#E1E3EB";
-
-      // vertical lines
-      for (
-        let horizontalPosition = cellWidth + padding;
-        horizontalPosition <= width;
-        horizontalPosition += cellWidth
-      ) {
-        const path = new Path2D();
-        path.moveTo(horizontalPosition, 0);
-        path.lineTo(horizontalPosition, height - padding);
-        ctx.stroke(path);
-      }
-
-      // horizontal lines
-      for (
-        let verticalPosition = height - padding - cellHeight;
-        verticalPosition >= 0;
-        verticalPosition -= cellHeight
-      ) {
-        const path = new Path2D();
-        path.moveTo(padding, verticalPosition);
-        path.lineTo(width, verticalPosition);
-        ctx.stroke(path);
-      }
-
-      ctx.strokeStyle = "#110529";
-
-      // vertical arrow
-      {
-        const path = new Path2D();
-        path.moveTo(padding, height - padding);
-        path.lineTo(padding, 0);
-        path.lineTo(0, padding);
-        path.moveTo(padding, 0);
-        path.lineTo(padding * 2, padding);
-        ctx.stroke(path);
-      }
-
-      // horizontal arrow
-      {
-        const path = new Path2D();
-        path.moveTo(padding, height - padding);
-        path.lineTo(width, height - padding);
-        path.lineTo(width - padding, height - padding * 2);
-        path.moveTo(width, height - padding);
-        path.lineTo(width - padding, height);
-        ctx.stroke(path);
-      }
-    }
-  },
-);
-`;
-export {
-  n as default
-};
-//# sourceMappingURL=paint-worklet.js.map
+//# sourceMappingURL=paint-worklet.js.map

package/dist/layout/PlPlaceholder/paint-worklet.js.map

@@ -1 +1 @@
-{"version":3,"file":"paint-worklet.js","sources":["../../../src/layout/PlPlaceholder/paint-worklet.js?raw"],"sourcesContent":["export default \"registerPaint(\\n  \\\"pl-placeholder-table-skeleton\\\",\\n  class {\\n    /**\\n     * @param {CanvasRenderingContext2D} ctx\\n     * @param {Object} size\\n     * @param {number} size.width\\n     * @param {number} size.height\\n     */\\n    paint(ctx, { width, height }) {\\n      const headerHeight = 42;\\n      const headerWidth = 48;\\n\\n      ctx.fillStyle = \\\"#F7F8FA\\\";\\n\\n      // headers\\n      {\\n        const path = new Path2D();\\n        path.lineTo(width, 0);\\n        path.lineTo(width, headerHeight);\\n        path.lineTo(headerWidth, headerHeight);\\n        path.lineTo(headerWidth, height);\\n        path.lineTo(0, height);\\n        path.lineTo(0, 0);\\n        ctx.fill(path);\\n      }\\n\\n      ctx.strokeStyle = \\\"#E1E3EB\\\";\\n\\n      // vertical lines\\n      const columnWidth = (width - headerWidth) / 6;\\n      for (\\n        let horizontalPosition = headerWidth;\\n        horizontalPosition < width;\\n        horizontalPosition += columnWidth\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(horizontalPosition, 0);\\n        path.lineTo(horizontalPosition, height);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal lines\\n      for (\\n        let verticalPosition = headerHeight;\\n        verticalPosition < height;\\n        verticalPosition += headerHeight\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(0, verticalPosition);\\n        path.lineTo(width, verticalPosition);\\n        ctx.stroke(path);\\n      }\\n    }\\n  },\\n);\\n\\nregisterPaint(\\n  \\\"pl-placeholder-graph-skeleton\\\",\\n  class {\\n    /**\\n     * @param {CanvasRenderingContext2D} ctx\\n     * @param {Object} size\\n     * @param {number} size.width\\n     * @param {number} size.height\\n     */\\n    paint(ctx, { width, height }) {\\n      const padding = 6;\\n      const cellWidth = 100;\\n      const cellHeight = 60;\\n\\n      ctx.strokeStyle = \\\"#E1E3EB\\\";\\n\\n      // vertical lines\\n      for (\\n        let horizontalPosition = cellWidth + padding;\\n        horizontalPosition <= width;\\n        horizontalPosition += cellWidth\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(horizontalPosition, 0);\\n        path.lineTo(horizontalPosition, height - padding);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal lines\\n      for (\\n        let verticalPosition = height - padding - cellHeight;\\n        verticalPosition >= 0;\\n        verticalPosition -= cellHeight\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(padding, verticalPosition);\\n        path.lineTo(width, verticalPosition);\\n        ctx.stroke(path);\\n      }\\n\\n      ctx.strokeStyle = \\\"#110529\\\";\\n\\n      // vertical arrow\\n      {\\n        const path = new Path2D();\\n        path.moveTo(padding, height - padding);\\n        path.lineTo(padding, 0);\\n        path.lineTo(0, padding);\\n        path.moveTo(padding, 0);\\n        path.lineTo(padding * 2, padding);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal arrow\\n      {\\n        const path = new Path2D();\\n        path.moveTo(padding, height - padding);\\n        path.lineTo(width, height - padding);\\n        path.lineTo(width - padding, height - padding * 2);\\n        path.moveTo(width, height - padding);\\n        path.lineTo(width - padding, height);\\n        ctx.stroke(path);\\n      }\\n    }\\n  },\\n);\\n\""],"names":["paintWorkletCode"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"paint-worklet.js","names":[],"sources":["../../../src/layout/PlPlaceholder/paint-worklet.js?raw"],"sourcesContent":["export default \"registerPaint(\\n  \\\"pl-placeholder-table-skeleton\\\",\\n  class {\\n    /**\\n     * @param {CanvasRenderingContext2D} ctx\\n     * @param {Object} size\\n     * @param {number} size.width\\n     * @param {number} size.height\\n     */\\n    paint(ctx, { width, height }) {\\n      const headerHeight = 42;\\n      const headerWidth = 48;\\n\\n      ctx.fillStyle = \\\"#F7F8FA\\\";\\n\\n      // headers\\n      {\\n        const path = new Path2D();\\n        path.lineTo(width, 0);\\n        path.lineTo(width, headerHeight);\\n        path.lineTo(headerWidth, headerHeight);\\n        path.lineTo(headerWidth, height);\\n        path.lineTo(0, height);\\n        path.lineTo(0, 0);\\n        ctx.fill(path);\\n      }\\n\\n      ctx.strokeStyle = \\\"#E1E3EB\\\";\\n\\n      // vertical lines\\n      const columnWidth = (width - headerWidth) / 6;\\n      for (\\n        let horizontalPosition = headerWidth;\\n        horizontalPosition < width;\\n        horizontalPosition += columnWidth\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(horizontalPosition, 0);\\n        path.lineTo(horizontalPosition, height);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal lines\\n      for (\\n        let verticalPosition = headerHeight;\\n        verticalPosition < height;\\n        verticalPosition += headerHeight\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(0, verticalPosition);\\n        path.lineTo(width, verticalPosition);\\n        ctx.stroke(path);\\n      }\\n    }\\n  },\\n);\\n\\nregisterPaint(\\n  \\\"pl-placeholder-graph-skeleton\\\",\\n  class {\\n    /**\\n     * @param {CanvasRenderingContext2D} ctx\\n     * @param {Object} size\\n     * @param {number} size.width\\n     * @param {number} size.height\\n     */\\n    paint(ctx, { width, height }) {\\n      const padding = 6;\\n      const cellWidth = 100;\\n      const cellHeight = 60;\\n\\n      ctx.strokeStyle = \\\"#E1E3EB\\\";\\n\\n      // vertical lines\\n      for (\\n        let horizontalPosition = cellWidth + padding;\\n        horizontalPosition <= width;\\n        horizontalPosition += cellWidth\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(horizontalPosition, 0);\\n        path.lineTo(horizontalPosition, height - padding);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal lines\\n      for (\\n        let verticalPosition = height - padding - cellHeight;\\n        verticalPosition >= 0;\\n        verticalPosition -= cellHeight\\n      ) {\\n        const path = new Path2D();\\n        path.moveTo(padding, verticalPosition);\\n        path.lineTo(width, verticalPosition);\\n        ctx.stroke(path);\\n      }\\n\\n      ctx.strokeStyle = \\\"#110529\\\";\\n\\n      // vertical arrow\\n      {\\n        const path = new Path2D();\\n        path.moveTo(padding, height - padding);\\n        path.lineTo(padding, 0);\\n        path.lineTo(0, padding);\\n        path.moveTo(padding, 0);\\n        path.lineTo(padding * 2, padding);\\n        ctx.stroke(path);\\n      }\\n\\n      // horizontal arrow\\n      {\\n        const path = new Path2D();\\n        path.moveTo(padding, height - padding);\\n        path.lineTo(width, height - padding);\\n        path.lineTo(width - padding, height - padding * 2);\\n        path.moveTo(width, height - padding);\\n        path.lineTo(width - padding, height);\\n        ctx.stroke(path);\\n      }\\n    }\\n  },\\n);\\n\""],"mappings":"AAAA,IAAA,IAAe"}