feather-k-demo-utils 0.0.21 → 0.0.23

package/README.md

@@ -23,51 +23,11 @@ Enter your email address
 >increment version number...
 npm publish --access public
 
-Your prepublishOnly script will build before publishing. If you see any errors, let me know and I’ll help troubleshoot!
-
 ## Setting the Publish Date in Consuming Projects
 
 This package no longer exposes an in-package `PUBLISH_DATE`. If you need a build-time publish date in your consuming app, set it via your build (for example, with Vite's `define` option) and consume it from your application code directly.
 
 ## Quick Usage
 
-- **Install:**
-
-  ```bash
-  npm install feather-k-demo-utils
-  ```
-
-- **Include demo styles:**
-
-  ```js
-  import 'feather-k-demo-utils/styles/demo.css';
-  ```
-
-- **Use utils:**
-
-  ```js
-  import { featherkStylesVersion } from 'feather-k-demo-utils/utils';
-  ```
-
-- **Use components:**
-
-  ```vue
-  <script setup lang="ts">
-  import { DemoStats } from 'feather-k-demo-utils';
-  </script>
-
-  <template>
-    <DemoStats />
-  </template>
-  ```
-
-- **Verify package contents locally:**
-
-  ```bash
-  npm run build
-  npm pack
-  tar -tf feather-k-demo-utils-<version>.tgz
-  # confirm package/lib/styles/demo.css and package/lib/utils/index.js are present
-  ```
-
-> Note: If you want a dedicated components subpath (e.g. `feather-k-demo-utils/components`), we can add it to `package.json` `exports`.
+<!-- link to DEMO-UTIL.md -->
+see [DEMO-UTILS.md](https://github.com/NantHealth/feather-k-demo-utils/blob/integration/DEMO-UTILS.md)

package/lib/DemoStats.vue_vue_type_script_setup_true_lang-JUBFuGaw.js

@@ -0,0 +1,32 @@
+import { defineComponent as a, openBlock as t, createElementBlock as o, toDisplayString as i, createCommentVNode as n, createElementVNode as r } from "vue";
+const l = { class: "demo-stats-wrapper tb-v8_2_0" }, d = {
+  key: 0,
+  class: "demo-stats",
+  tabindex: "0",
+  role: "region",
+  "aria-label": "Demo Stats"
+}, m = { key: 0 }, h = { key: 1 }, u = { key: 2 }, v = /* @__PURE__ */ a({
+  __name: "DemoStats",
+  props: {
+    publishDate: {},
+    version: {}
+  },
+  setup(e) {
+    return (c, s) => (t(), o("div", l, [
+      e.publishDate || e.version ? (t(), o("div", d, [
+        e.version ? (t(), o("div", m, "using @featherk/styles@" + i(e.version), 1)) : n("", !0),
+        e.publishDate ? (t(), o("div", h, "Published: " + i(e.publishDate), 1)) : (t(), o("div", u, [...s[0] || (s[0] = [
+          r("a", {
+            href: "https://github.com/NantHealth/feather-k-demo-utils/blob/integration/README.md",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            style: { "pointer-events": "auto !important" }
+          }, " Setup Publish Date ", -1)
+        ])]))
+      ])) : n("", !0)
+    ]));
+  }
+});
+export {
+  v as _
+};

package/lib/components/index.es.js

@@ -1,4 +1,4 @@
-import { D as a } from "../DemoStats-0D9d7DGR.js";
+import { _ as a } from "../DemoStats.vue_vue_type_script_setup_true_lang-JUBFuGaw.js";
 export {
   a as DemoStats
 };

package/lib/index.es.js

@@ -1,5 +1,5 @@
 import { F as s, a as t, f as a, g as S, b as o } from "./cdnVersion-DGJCb4AH.js";
-import { D as F } from "./DemoStats-0D9d7DGR.js";
+import { _ as F } from "./DemoStats.vue_vue_type_script_setup_true_lang-JUBFuGaw.js";
 export {
   F as DemoStats,
   s as FEATHERK_STYLES_CDN_URL,

package/lib/styles/demo.css

@@ -1,9 +1,9 @@
-h1 {
-  color: var(--kendo-color-primary, limegreen);
-}
-
 /* moved from demo-utilities */
-.featherk-demo-form {
+/* .featherk-demo {
+  max-width: 1180px;
+  margin: 0 auto;
+}
+.demo-form {
   display: flex;
   flex-direction: column;
 
@@ -14,19 +14,138 @@ h1 {
     gap: 0.5em;
     justify-content: flex-start;
   }
+} */
+ .demo-app {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  gap: 1em;
+  align-items: center;
+}
+.demo-selection {
+  position: absolute;
+  right: 1rem;
+  top: 1rem;
+  & > .k-dropdownlist {
+    min-width: 30ch;
+  }
+}
+.featherk-demo {
+  max-width: 1180px;
+  .demo-form {
+    border: 1px solid var(--kendo-color-border);
+    padding: 1em;
+    max-width: 100%;
+  }
+  .demo-actions {
+    display: flex;
+    gap: 1em;
+  }
+  .demo-notes {
+    background-color: var(--kendo-color-light);
+    padding: 1em;
+    margin-top: 1em;
+    width: 800px;
+  }
 }
 
-/* .demo-stats-wrapper {
+.demo-notes {
+  ul {
+    list-style-type: none;
+    .todo {
+      &::before {
+        content: "☐ - ";
+        color: #333;
+        font-weight: bold;
+      }
+    }
+    .done {
+      color: var(--kendo-color-tertiary);
+      &::before {
+        content: "✔️ - ";
+        text-decoration: none;
+      }
+    }
+    .strike {
+      text-decoration: line-through;
+      text-decoration-color: var(--kendo-color-tertiary);
+      color: hsl(from var(--kendo-color-primary) h 60% l);
+      &::before {
+        content: "~~";
+        font-weight: bold;
+      }
+      &::after {
+        content: "~~";
+        font-weight: bold;
+      }
+    }
+    .info,
+    .note {
+      color: var(--kendo-color-secondary);
+      &::before {
+        content: "ℹ️ - ";
+      }
+    }
+    .question {
+      color: var(--kendo-color-error);
+      &::before {
+        content: "❓ - ";
+      }
+    }
+    .pro,
+    .con {
+      padding: 0.5em;
+    }
+    .pro {
+      color: var(--kendo-color-success);
+      background-color: var(--kendo-color-success-subtle);
+      text-align: left;
+      &::before {
+        content: "✅ - ";
+        font-weight: bold;
+      }
+    }
+    .con {
+      color: var(--kendo-color-error);
+      background-color: var(--kendo-color-error-subtle);
+      text-align: right;
+      a {
+        font-size: 1.25em;
+        color: var(--kendo-color-error);
+        text-decoration: dotted underline;
+      }
+      &::after {
+        content: " - ❌";
+        font-weight: bold;
+      }
+    }
+  }
+}
+
+/* TODO:  DemoStats.vue SCOPED STYLES NOT WORKING - moved to demo.css */
+.demo-stats-wrapper {
   .demo-stats {
     position: fixed;
     right: var(--kendo-spacing-4);
     bottom: var(--kendo-spacing-4);
-    background: hsl(from var(--kendo-color-primary) h s 90% / 0.5);
+    background: hsl(from var(--kendo-color-primary) h s 90% / 0.3);
+    color: var(--kendo-color-primary-subtle);
     font-size: var(--kendo-font-size-sm);
     margin: var(--kendo-spacing-2);
     padding: var(--kendo-spacing-2);
     border-radius: var(--kendo-border-radius-md);
     box-shadow: var(--kendo-elevation-2);
-    pointer-events: none;
+    &:hover {
+      background: hsl(from var(--kendo-color-primary) h s 90% / 0.5);
+      color: var(--kendo-color-primary);
+      box-shadow: var(--kendo-elevation-4);
+    }
+    &:focus,
+    &:focus-visible {
+      background: var(--kendo-color-primary);
+      color: var(--kendo-color-surface);
+      outline: 2px solid var(--kendo-color-primary);
+      outline-offset: 2px;
+    }
   }
-} */
+}

package/lib/utils/index.es.js

@@ -1,5 +1,5 @@
 import { F as s, a as t, f as a, g as S, b as o } from "../cdnVersion-DGJCb4AH.js";
-import { D as F } from "../DemoStats-0D9d7DGR.js";
+import { _ as F } from "../DemoStats.vue_vue_type_script_setup_true_lang-JUBFuGaw.js";
 export {
   F as DemoStats,
   s as FEATHERK_STYLES_CDN_URL,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "feather-k-demo-utils",
   "private": false,
-  "version": "0.0.21",
+  "version": "0.0.23",
   "type": "module",
   "main": "lib/index.es.js",
   "module": "lib/index.es.js",

package/lib/DemoStats-0D9d7DGR.js

@@ -1,37 +0,0 @@
-import { defineComponent as c, openBlock as o, createElementBlock as s, toDisplayString as a, createCommentVNode as r, createElementVNode as d } from "vue";
-const m = { class: "demo-stats-wrapper tb-v8_2_0" }, u = {
-  key: 0,
-  class: "demo-stats",
-  tabindex: "0",
-  role: "region",
-  "aria-label": "Demo Stats"
-}, h = { key: 0 }, v = { key: 1 }, b = { key: 2 }, _ = /* @__PURE__ */ c({
-  __name: "DemoStats",
-  props: {
-    publishDate: {},
-    version: {}
-  },
-  setup(e) {
-    return (n, t) => (o(), s("div", m, [
-      e.publishDate || e.version ? (o(), s("div", u, [
-        e.version ? (o(), s("div", h, "using @featherk/styles@" + a(e.version), 1)) : r("", !0),
-        e.publishDate ? (o(), s("div", v, "Published: " + a(e.publishDate), 1)) : (o(), s("div", b, [...t[0] || (t[0] = [
-          d("a", {
-            href: "https://github.com/NantHealth/feather-k-demo-utils/blob/integration/README.md",
-            target: "_blank",
-            rel: "noopener noreferrer",
-            style: { "pointer-events": "auto !important" }
-          }, " Setup Publish Date ", -1)
-        ])]))
-      ])) : r("", !0)
-    ]));
-  }
-}), p = (e, n) => {
-  const t = e.__vccOpts || e;
-  for (const [i, l] of n)
-    t[i] = l;
-  return t;
-}, k = /* @__PURE__ */ p(_, [["__scopeId", "data-v-57c6e8c2"]]);
-export {
-  k as D
-};