@pequity/squirrel 5.4.11 → 6.0.0

package/dist/cjs/chunks/p-icon.js

@@ -13,7 +13,7 @@ const pIcon = require("../p-icon.js");
 * Licensed under MIT.
 *
 * @license MIT
-* @version 2.1.0
+* @version 2.2.0
 */
 const defaultIconDimensions = Object.freeze(
   {
@@ -163,7 +163,9 @@ const validateIconName = (icon, allowSimpleName) => {
   if (!icon) {
     return false;
   }
-  return !!((icon.provider === "" || icon.provider.match(matchIconName)) && (allowSimpleName && icon.prefix === "" || icon.prefix.match(matchIconName)) && icon.name.match(matchIconName));
+  return !!// Check prefix: cannot be empty, unless allowSimpleName is enabled
+  // Check name: cannot be empty
+  ((allowSimpleName && icon.prefix === "" || !!icon.prefix) && !!icon.name);
 };
 function mergeIconTransformations(obj1, obj2) {
   const result = {};
@@ -278,10 +280,15 @@ function quicklyValidateIconSet(obj) {
   const icons = data.icons;
   for (const name in icons) {
     const icon = icons[name];
-    if (!name.match(matchIconName) || typeof icon.body !== "string" || !checkOptionalProps(
-      icon,
-      defaultExtendedIconProps
-    )) {
+    if (
+      // Name cannot be empty
+      !name || // Must have body
+      typeof icon.body !== "string" || // Check other props
+      !checkOptionalProps(
+        icon,
+        defaultExtendedIconProps
+      )
+    ) {
       return null;
     }
   }
@@ -289,10 +296,15 @@ function quicklyValidateIconSet(obj) {
   for (const name in aliases) {
     const icon = aliases[name];
     const parent = icon.parent;
-    if (!name.match(matchIconName) || typeof parent !== "string" || !icons[parent] && !aliases[parent] || !checkOptionalProps(
-      icon,
-      defaultExtendedIconProps
-    )) {
+    if (
+      // Name cannot be empty
+      !name || // Parent must be set and point to existing icon
+      typeof parent !== "string" || !icons[parent] && !aliases[parent] || // Check other props
+      !checkOptionalProps(
+        icon,
+        defaultExtendedIconProps
+      )
+    ) {
       return null;
     }
   }
@@ -370,7 +382,12 @@ function addIcon$1(name, data) {
     return false;
   }
   const storage2 = getStorage(icon.provider, icon.prefix);
-  return addIconToStorage(storage2, icon.name, data);
+  if (data) {
+    return addIconToStorage(storage2, icon.name, data);
+  } else {
+    storage2.missing.add(icon.name);
+    return true;
+  }
 }
 function addCollection$1(data, provider) {
   if (typeof data !== "object") {
@@ -384,7 +401,7 @@ function addCollection$1(data, provider) {
     if (quicklyValidateIconSet(data)) {
       data.prefix = "";
       parseIconSet(data, (name, icon) => {
-        if (icon && addIcon$1(name, icon)) {
+        if (addIcon$1(name, icon)) {
           added = true;
         }
       });
@@ -410,7 +427,7 @@ function getIcon$1(name) {
   return result ? {
     ...defaultIconProps,
     ...result
-  } : null;
+  } : result;
 }
 function sortIcons(icons) {
   const result = {
@@ -1070,6 +1087,57 @@ function loadedNewIcons(storage2) {
     });
   }
 }
+function checkIconNamesForAPI(icons) {
+  const valid = [];
+  const invalid = [];
+  icons.forEach((name) => {
+    (name.match(matchIconName) ? valid : invalid).push(name);
+  });
+  return {
+    valid,
+    invalid
+  };
+}
+function parseLoaderResponse(storage2, icons, data, isAPIResponse) {
+  function checkMissing() {
+    const pending = storage2.pendingIcons;
+    icons.forEach((name) => {
+      if (pending) {
+        pending.delete(name);
+      }
+      if (!storage2.icons[name]) {
+        storage2.missing.add(name);
+      }
+    });
+  }
+  if (data && typeof data === "object") {
+    try {
+      const parsed = addIconSet(storage2, data);
+      if (!parsed.length) {
+        checkMissing();
+        return;
+      }
+      if (isAPIResponse) {
+        storeInBrowserStorage(storage2, data);
+      }
+    } catch (err) {
+      console.error(err);
+    }
+  }
+  checkMissing();
+  loadedNewIcons(storage2);
+}
+function parsePossiblyAsyncResponse(response, callback) {
+  if (response instanceof Promise) {
+    response.then((data) => {
+      callback(data);
+    }).catch(() => {
+      callback(null);
+    });
+  } else {
+    callback(response);
+  }
+}
 function loadNewIcons(storage2, icons) {
   if (!storage2.iconsToLoad) {
     storage2.iconsToLoad = icons;
@@ -1083,38 +1151,50 @@ function loadNewIcons(storage2, icons) {
       const { provider, prefix } = storage2;
       const icons2 = storage2.iconsToLoad;
       delete storage2.iconsToLoad;
-      let api;
-      if (!icons2 || !(api = getAPIModule(provider))) {
+      if (!icons2 || !icons2.length) {
+        return;
+      }
+      const customIconLoader = storage2.loadIcon;
+      if (storage2.loadIcons && (icons2.length > 1 || !customIconLoader)) {
+        parsePossiblyAsyncResponse(
+          storage2.loadIcons(icons2, prefix, provider),
+          (data) => {
+            parseLoaderResponse(storage2, icons2, data, false);
+          }
+        );
         return;
       }
-      const params = api.prepare(provider, prefix, icons2);
+      if (customIconLoader) {
+        icons2.forEach((name) => {
+          const response = customIconLoader(name, prefix, provider);
+          parsePossiblyAsyncResponse(response, (data) => {
+            const iconSet = data ? {
+              prefix,
+              icons: {
+                [name]: data
+              }
+            } : null;
+            parseLoaderResponse(storage2, [name], iconSet, false);
+          });
+        });
+        return;
+      }
+      const { valid, invalid } = checkIconNamesForAPI(icons2);
+      if (invalid.length) {
+        parseLoaderResponse(storage2, invalid, null, false);
+      }
+      if (!valid.length) {
+        return;
+      }
+      const api = prefix.match(matchIconName) ? getAPIModule(provider) : null;
+      if (!api) {
+        parseLoaderResponse(storage2, valid, null, false);
+        return;
+      }
+      const params = api.prepare(provider, prefix, valid);
       params.forEach((item) => {
         sendAPIQuery(provider, item, (data) => {
-          if (typeof data !== "object") {
-            item.icons.forEach((name) => {
-              storage2.missing.add(name);
-            });
-          } else {
-            try {
-              const parsed = addIconSet(
-                storage2,
-                data
-              );
-              if (!parsed.length) {
-                return;
-              }
-              const pending = storage2.pendingIcons;
-              if (pending) {
-                parsed.forEach((name) => {
-                  pending.delete(name);
-                });
-              }
-              storeInBrowserStorage(storage2, data);
-            } catch (err) {
-              console.error(err);
-            }
-          }
-          loadedNewIcons(storage2);
+          parseLoaderResponse(storage2, item.icons, data, true);
         });
       });
     });
@@ -1167,9 +1247,9 @@ const loadIcons$1 = (icons, callback) => {
     }
   });
   sources.forEach((storage2) => {
-    const { provider, prefix } = storage2;
-    if (newIcons[provider][prefix].length) {
-      loadNewIcons(storage2, newIcons[provider][prefix]);
+    const list = newIcons[storage2.provider][storage2.prefix];
+    if (list.length) {
+      loadNewIcons(storage2, list);
     }
   });
   return callback ? storeCallback(callback, sortedIcons, sources) : emptyCallback;
@@ -1208,12 +1288,31 @@ function testIconObject(value) {
   }
 }
 function parseIconValue(value, onload) {
-  const name = typeof value === "string" ? stringToIcon(value, true, true) : null;
-  if (!name) {
+  if (typeof value === "object") {
     const data2 = testIconObject(value);
     return {
-      value,
-      data: data2
+      data: data2,
+      value
+    };
+  }
+  if (typeof value !== "string") {
+    return {
+      value
+    };
+  }
+  if (value.includes("{")) {
+    const data2 = testIconObject(value);
+    if (data2) {
+      return {
+        data: data2,
+        value
+      };
+    }
+  }
+  const name = stringToIcon(value, true, true);
+  if (!name) {
+    return {
+      value
     };
   }
   const data = getIconData(name);
@@ -1239,6 +1338,7 @@ try {
 }
 function getRenderMode(body, mode) {
   switch (mode) {
+    // Force mode
     case "svg":
     case "bg":
     case "mask":
@@ -1578,6 +1678,12 @@ const fetchAPIModule = {
   prepare,
   send
 };
+function setCustomIconsLoader$1(loader, prefix, provider) {
+  getStorage(provider || "", prefix).loadIcons = loader;
+}
+function setCustomIconLoader$1(loader, prefix, provider) {
+  getStorage(provider || "", prefix).loadIcon = loader;
+}
 function toggleBrowserCache(storage2, value) {
   switch (storage2) {
     case "local":
@@ -1603,7 +1709,7 @@ function updateStyle(parent, inline) {
     styleNode.setAttribute(nodeAttr, nodeAttr);
     parent.appendChild(styleNode);
   }
-  styleNode.textContent = ":host{display:inline-block;vertical-align:" + (inline ? "-0.125em" : "0") + "}span,svg{display:block}" + customStyle;
+  styleNode.textContent = ":host{display:inline-block;vertical-align:" + (inline ? "-0.125em" : "0") + "}span,svg{display:block;margin:auto}" + customStyle;
 }
 function exportFunctions() {
   setAPIModule("", fetchAPIModule);
@@ -1680,6 +1786,8 @@ function exportFunctions() {
     loadIcons: loadIcons$1,
     loadIcon: loadIcon$1,
     addAPIProvider: addAPIProvider$1,
+    setCustomIconLoader: setCustomIconLoader$1,
+    setCustomIconsLoader: setCustomIconsLoader$1,
     appendCustomStyle,
     _api
   };

package/dist/cjs/chunks/p-link.js

@@ -14,6 +14,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     activeClass: {},
     exactActiveClass: {},
     ariaCurrentValue: {},
+    viewTransition: { type: Boolean },
     to: {},
     replace: { type: Boolean }
   },

package/dist/cjs/p-dropdown.js

@@ -1,10 +1,21 @@
 "use strict";
 const listKeyboardNavigation = require("./listKeyboardNavigation.js");
+const floatingVue = require("floating-vue");
 const vue = require("vue");
 const _pluginVue_exportHelper = require("./chunks/_plugin-vue_export-helper.js");
 const ESCAPE_KEY = "Escape";
+const nextFrame = () => {
+  return new Promise(
+    (resolve) => requestAnimationFrame(() => {
+      requestAnimationFrame(resolve);
+    })
+  );
+};
 const _sfc_main = vue.defineComponent({
   name: "PDropdown",
+  components: {
+    Dropdown: floatingVue.Dropdown
+  },
   inheritAttrs: false,
   props: {
     /**
@@ -31,49 +42,24 @@ const _sfc_main = vue.defineComponent({
       default: () => ({
         display: "inline-block"
       })
-    },
-    /**
-     * Custom reference element that is used to position the popper.
-     * Can be changed at runtime to create a dynamically positioned dropdown.
-     */
-    reference: {
-      type: HTMLElement,
-      default: null
     }
   },
   data() {
     return {
       defaultAttrs: {
         triggers: ["click"],
-        "auto-hide": true,
+        autoHide: true,
         theme: "p-dropdown-theme",
-        "popper-class": "dropdown",
+        popperClass: "dropdown",
         placement: "bottom-start",
         distance: 4,
         delay: 0,
         handleResize: true
       },
-      navigationSvc: null
+      navigationSvc: null,
+      prevReference: null
     };
   },
-  watch: {
-    reference: {
-      async handler(nV, oV) {
-        if (nV && oV !== nV) {
-          const popper = this.$refs.vPopper.$refs.popper;
-          if (popper) {
-            popper.$_detachPopperNode();
-            if (popper.shown) {
-              popper.hide({ skipDelay: true });
-            }
-            if (this.reference) {
-              popper.$_referenceNode = this.reference;
-            }
-          }
-        }
-      }
-    }
-  },
   mounted() {
     Object.assign(this.$refs.vPopper.$refs.popper.$el.style, this.triggerStyle);
   },
@@ -100,12 +86,32 @@ const _sfc_main = vue.defineComponent({
       var _a;
       (_a = this.navigationSvc) == null ? void 0 : _a.destroy();
       document.removeEventListener("keydown", this.popoverEscKeydown);
+    },
+    async updateReference(newReference) {
+      if (!newReference) {
+        throw Error("Reference element is required");
+      }
+      const popper = this.$refs.vPopper.$refs.popper;
+      if (popper) {
+        popper.$_detachPopperNode();
+        if (popper.isShown) {
+          popper.$emit("update:shown", false);
+          if (newReference === this.prevReference) {
+            return;
+          }
+        }
+        await nextFrame();
+        popper.$_referenceNode = newReference;
+        this.prevReference = newReference;
+        await nextFrame();
+        popper.$emit("update:shown", true);
+      }
     }
   }
 });
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_VDropdown = vue.resolveComponent("VDropdown");
-  return vue.openBlock(), vue.createBlock(_component_VDropdown, vue.mergeProps({ ref: "vPopper" }, { ..._ctx.defaultAttrs, ..._ctx.$attrs }, {
+  const _component_Dropdown = vue.resolveComponent("Dropdown");
+  return vue.openBlock(), vue.createBlock(_component_Dropdown, vue.mergeProps({ ref: "vPopper" }, { ..._ctx.defaultAttrs, ..._ctx.$attrs }, {
     onShow: _ctx.onShow,
     onHide: _ctx.destroy
   }), vue.createSlots({ _: 2 }, [

package/dist/cjs/p-modal.js

@@ -15,7 +15,10 @@ const _hoisted_7 = {
   class: "mb-4 px-8"
 };
 const _hoisted_8 = ["id"];
-const _hoisted_9 = { class: "mt-6 px-8 pt-6" };
+const _hoisted_9 = {
+  key: 0,
+  class: "px-8 pt-6"
+};
 const FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex="-1"])';
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...{
@@ -111,7 +114,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ],
   setup(__props, { emit: __emit }) {
     vue.useCssVars((_ctx) => ({
-      "8621f24e": __props.maxWidth
+      "4895a587": __props.maxWidth
     }));
     let animatingZIndex = 0;
     const emit = __emit;
@@ -352,11 +355,11 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                     vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
                   ], 10, _hoisted_8)
                 ], true),
-                _ctx.$slots["footer"] ? vue.renderSlot(_ctx.$slots, "footer-wrapper", { key: 1 }, () => [
-                  vue.createElementVNode("div", _hoisted_9, [
+                vue.renderSlot(_ctx.$slots, "footer-wrapper", {}, () => [
+                  _ctx.$slots["footer"] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9, [
                     vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
-                  ])
-                ], true) : vue.createCommentVNode("", true)
+                  ])) : vue.createCommentVNode("", true)
+                ], true)
               ], 14, _hoisted_3)
             ], 46, _hoisted_2), [
               [vue.vShow, show.value]
@@ -368,5 +371,5 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const pModal = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-7a8f90b4"]]);
+const pModal = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-5fd440a3"]]);
 module.exports = pModal;

package/dist/cjs/p-select-pill.js

@@ -91,7 +91,7 @@ const _hoisted_2 = {
   ref: "pill",
   class: "absolute left-0 top-0 inline-block h-full rounded-full bg-surface duration-200 ease-in-out"
 };
-const _hoisted_3 = ["disabled", "onClick"];
+const _hoisted_3 = ["disabled", "data-selected", "onClick"];
 const _hoisted_4 = { class: "flex" };
 const _hoisted_5 = {
   key: 0,
@@ -109,6 +109,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           _ctx.modelValue === o[_ctx.itemValue] ? `${_ctx.ACTIVE_CLASS} hover:text-p-purple-70` : "hover:text-p-gray-60",
           { "opacity-25": o.disabled }
         ]]),
+        "data-selected": _ctx.modelValue === o[_ctx.itemValue],
         onClick: ($event) => _ctx.click($event, o)
       }, [
         vue.createElementVNode("div", _hoisted_4, [