@bccampus/ui-components 0.4.0 → 0.4.2

package/dist/composite.js

@@ -1,472 +1,82 @@
-import { jsx as b, jsxs as q } from "react/jsx-runtime";
-import { useMemo as w, createContext as L, useContext as N, useRef as E, useCallback as p, useSyncExternalStore as $, useId as M, useImperativeHandle as A } from "react";
-const O = (o, t) => {
-  const e = { ...o };
-  return t.forEach((s) => {
-    const n = s.split("."), l = n.pop();
-    if (l) {
-      const i = n.reduce((r, d) => r && d in r ? r[d] : void 0, e);
-      i && l in i && delete i[l];
-    }
-  }), e;
-};
-let R = Symbol("clean"), c = [], f = 0;
-const g = 4;
-let K = (o) => {
-  let t = [], e = {
-    get() {
-      return e.lc || e.listen(() => {
-      })(), e.value;
-    },
-    lc: 0,
-    listen(s) {
-      return e.lc = t.push(s), () => {
-        for (let l = f + g; l < c.length; )
-          c[l] === s ? c.splice(l, g) : l += g;
-        let n = t.indexOf(s);
-        ~n && (t.splice(n, 1), --e.lc || e.off());
-      };
-    },
-    notify(s, n) {
-      let l = !c.length;
-      for (let i of t)
-        c.push(i, e.value, s, n);
-      if (l) {
-        for (f = 0; f < c.length; f += g)
-          c[f](
-            c[f + 1],
-            c[f + 2],
-            c[f + 3]
-          );
-        c.length = 0;
-      }
-    },
-    /* It will be called on last listener unsubscribing.
-       We will redefine it in onMount and onStop. */
-    off() {
-    },
-    set(s) {
-      let n = e.value;
-      n !== s && (e.value = s, e.notify(n));
-    },
-    subscribe(s) {
-      let n = e.listen(s);
-      return s(e.value), n;
-    },
-    value: o
-  };
-  return process.env.NODE_ENV !== "production" && (e[R] = () => {
-    t = [], e.lc = 0, e.off();
-  }), e;
-};
-function U(o, t, e) {
-  let s = new Set(t).add(void 0);
-  return o.listen((n, l, i) => {
-    s.has(i) && e(n, l, i);
-  });
-}
-let S = (o = {}) => {
-  let t = K(o);
-  return t.setKey = function(e, s) {
-    let n = t.value;
-    typeof s > "u" && e in t.value ? (t.value = { ...t.value }, delete t.value[e], t.notify(n, e)) : t.value[e] !== s && (t.value = {
-      ...t.value,
-      [e]: s
-    }, t.notify(n, e));
-  }, t;
-};
-class u {
-  #e;
-  parent = null;
-  children;
-  level;
-  data;
-  state;
-  pointers;
-  childrenProp;
-  constructor(t, e, s) {
-    this.#e = e.getItemKey(t), this.data = S(O(t, [e.itemChildrenProp])), this.state = S({
-      focused: !1,
-      selected: !1,
-      disabled: !1,
-      ...e.initialState
-    }), this.pointers = {}, this.parent = s, this.level = s ? s.level + 1 : 0, this.childrenProp = e.itemChildrenProp;
-    const n = e.getItemChildren(t);
-    n && (this.children = n.map((l) => new u(l, e, this)));
-  }
-  get key() {
-    return this.#e;
-  }
-  *[Symbol.iterator]() {
-    if (this.key !== "ALL" && (yield this), this.children)
-      for (const t of this.children)
-        for (const e of t) yield e;
-  }
-  toJSON() {
-    const t = { ...this.data.get() };
-    if (this.children) {
-      t[this.childrenProp] = [];
-      for (const e of this.children)
-        t[this.childrenProp].push(e.toJSON());
-    }
-    return t;
-  }
-  descendants() {
-    if (!this.children) return [];
-    const t = [];
-    return this.children.forEach(
-      (e) => {
-        t.push(e);
-        const s = e.descendants();
-        s && t.push(...s);
-      }
-    ), t;
-  }
-  ancestors() {
-    const t = [];
-    let e = this.parent;
-    for (; e; )
-      t.push(e), e = e.parent;
-    return t;
-  }
-  toggleSelect(t = !1) {
-    this.state.get().selected ? this.deselect(t) : this.select(t);
-  }
-  select(t = !1) {
-    if (this.state.setKey("selected", !0), t && this.children) {
-      const e = this.children.map((s) => s.select(!0)).flat();
-      return [this.key, ...e];
-    }
-    return [this.key];
-  }
-  deselect(t = !1) {
-    if (this.state.setKey("selected", !1), t && this.children) {
-      const e = this.children.map((s) => s.deselect(!0)).flat();
-      return [this.key, ...e];
-    }
-    return [this.key];
-  }
-  disable(t = !1) {
-    if (this.state.setKey("disabled", !0), t && this.children) {
-      const e = this.children.map((s) => s.disable(!0)).flat();
-      return [this.key, ...e];
-    }
-    return [this.key];
-  }
-  enable(t = !1) {
-    if (this.state.setKey("disabled", !1), t && this.children) {
-      const e = this.children.map((s) => s.enable(!0)).flat();
-      return [this.key, ...e];
-    }
-    return [this.key];
-  }
-}
-const j = /* @__PURE__ */ new Set(["ctrl", "shift", "alt", "meta"]), C = {
-  " ": "space"
-};
-function J(o, t) {
-  if (o.size !== t.size) return !1;
-  for (const e of t)
-    if (!o.has(e)) return !1;
-  return !0;
-}
-function Q(o) {
-  const t = [];
-  for (const [e, s] of Object.entries(o)) {
-    const n = e.toLowerCase().trim().split(/\s*\+\s*/);
-    n.length === 1 && j.has(n[0]) ? console.error(`[useKeyboardEvent] \`${e}\`: A key sequence cannot be only a modifier key.`) : n.includes("") ? console.error(`[useKeyboardEvent] \`${e}\`: Unknown key defined in the sequence.`) : t.push({
-      sequence: new Set(n),
-      handler: s
-    });
-  }
-  return t;
-}
-const v = {
-  eventKeyProp: "key"
-};
-function z(o, t = v) {
-  const e = { ...t, ...v }, s = Q(o);
-  return (n) => {
-    const l = /* @__PURE__ */ new Set(), i = n[e.eventKeyProp];
-    n.ctrlKey && l.add("ctrl"), n.shiftKey && l.add("shift"), n.altKey && l.add("alt"), n.metaKey && l.add("meta"), C[i] ? l.add(C[i]) : l.add(i.toLowerCase());
-    const r = s.find((d) => J(l, d.sequence));
-    r && (n.preventDefault(), n.stopPropagation(), r.handler(n));
-  };
-}
-function T(o, t) {
-  return w(() => z(o, t), [o, t]);
-}
-function I(o, t) {
-  const e = new Set(o);
-  for (const s of t)
-    e.add(s);
-  return e;
-}
-function Y(o, t) {
-  const e = new Set(o);
-  for (const s of t)
-    e.delete(s);
-  return e;
-}
-class G {
+import { C as m, a as u } from "./composite-component-DSUbd1XS.js";
+import { C as s } from "./CompositeDataItem-DuHOHCWy.js";
+import { u as n } from "./AbstractSelectionProvider-BtaROstC.js";
+import { A as P } from "./AbstractSelectionProvider-BtaROstC.js";
+import { A as v } from "./AbstractFocusProvider-CxvlcEki.js";
+class l {
   #e;
   lookup = /* @__PURE__ */ new Map();
-  firstFocusableItem;
-  focusedItem = K(null);
-  disabledKeys = K(/* @__PURE__ */ new Set());
-  selectedKeys = K(/* @__PURE__ */ new Set());
+  focusProvider;
+  selectionProvider;
+  disabledKeys = /* @__PURE__ */ new Set();
   root;
-  constructor(t, e) {
+  constructor(e, t, i) {
     this.#e = {
       itemKeyProp: "key",
       itemChildrenProp: "children",
       disabledKeys: [],
       selectedKeys: [],
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      getItemKey: (s) => s[this.#e.itemKeyProp],
+      getItemKey: (o) => o[this.#e.itemKeyProp],
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      getItemChildren: (s) => s[this.#e.itemChildrenProp] ? s[this.#e.itemChildrenProp] : void 0,
-      ...e
-    }, this.init(t);
+      getItemChildren: (o) => o[this.#e.itemChildrenProp] ? o[this.#e.itemChildrenProp] : void 0,
+      ...i
+    }, this.focusProvider = t.focusProvider, this.selectionProvider = t.selectionProvider, this.init(e);
   }
   *[Symbol.iterator]() {
     if (this.root.children)
-      for (const t of this.root.children)
-        yield t;
+      for (const e of this.root.children)
+        yield e;
   }
   toJSON() {
     return this.root.toJSON()[this.#e.itemChildrenProp];
   }
-  init(t) {
-    this.root = new u(
-      { [this.#e.itemKeyProp]: "ALL", [this.#e.itemChildrenProp]: t },
+  init(e) {
+    this.root = new s(
+      { [this.#e.itemKeyProp]: "ALL", [this.#e.itemChildrenProp]: e },
       this.#e,
       null
-    ), this.lookup = new Map([...this.root].map((s) => [s.key, s])), this.#e.disabledKeys.forEach((s) => this.disable(s)), this.#e.selectedKeys.forEach((s) => this.select(s)), this.firstFocusableItem = this.getFirstFocusableItem() ?? null, this.firstFocusableItem && (this.firstFocusableItem.state.setKey("focused", !0), this.focusedItem.set(this.firstFocusableItem));
-    const e = [...this.lookup];
-    for (let s = 0; s < e.length; s++) {
-      const [n, l] = e[s];
-      if (this.isFocusable(l) && s < e.length - 1) {
-        let i = s === e.length - 1 ? 0 : s + 1;
-        for (; i < e.length && !this.isFocusable(e[i][1]); )
-          i = (i + 1) % e.length;
-        l.pointers.down = e[i][0], e[i][1].pointers.up = n;
-      }
+    ), this.lookup = new Map([...this.root].map((t) => [t.key, t])), this.#e.disabledKeys.forEach((t) => this.#t(t)), this.selectionProvider && this.selectionProvider.init(this, this.#e), this.focusProvider.init(this, this.#e);
+  }
+  item(e) {
+    return this.lookup.get(e);
+  }
+  descendants(e) {
+    const t = this.lookup.get(e);
+    if (t)
+      return t.descendants();
+  }
+  ancestors(e) {
+    const t = this.lookup.get(e);
+    if (t)
+      return t.ancestors();
+  }
+  #t(e, t = !1) {
+    const i = e instanceof s ? e : this.lookup.get(e);
+    if (!i) return;
+    const o = i.disable(t);
+    this.disabledKeys = n(this.disabledKeys, o);
+  }
+  updateItem(e, t) {
+    const i = this.lookup.get(e);
+    if (i) {
+      const o = {
+        ...i.data.get(),
+        ...typeof t == "function" ? t(i.data.get()) : t
+      }, r = this.#e.getItemKey(o);
+      if (i.key !== r) throw "Item key cannot be updated!";
+      this.#i(e), i.data.set(o);
     }
   }
-  isFocusable(t) {
-    return !t.state.get().disabled;
-  }
-  getFirstFocusableItem() {
-    let t = this.lookup.values().next();
-    for (; t.value && !this.isFocusable(t.value); )
-      t = this.lookup.values().next();
-    return t.value;
-  }
-  item(t) {
-    return this.lookup.get(t);
-  }
-  descendants(t) {
-    const e = this.lookup.get(t);
-    if (e)
-      return e.descendants();
-  }
-  ancestors(t) {
-    const e = this.lookup.get(t);
-    if (e)
-      return e.ancestors();
-  }
-  focus(t) {
-    const e = t instanceof u ? t : this.lookup.get(t);
-    if (e) {
-      if (this.focusedItem.get()) {
-        if (e.key === this.focusedItem.get()?.key) return;
-        this.focusedItem.get().state.setKey("focused", !1);
-      }
-      e.state.setKey("focused", !0), this.focusedItem.set(e);
-    }
-  }
-  toggleSelect(t, e = !1) {
-    const s = t instanceof u ? t : this.lookup.get(t);
-    s && (s.state.get().selected ? this.deselect(s, e) : this.select(s, e));
-  }
-  select(t, e = !1) {
-    const s = t instanceof u ? t : this.lookup.get(t);
-    if (!s) return;
-    const n = s.select(e);
-    this.selectedKeys.set(I(this.selectedKeys.get(), n));
-  }
-  deselect(t, e = !1) {
-    const s = t instanceof u ? t : this.lookup.get(t);
-    if (!s) return;
-    const n = s.deselect(e);
-    this.selectedKeys.set(Y(this.selectedKeys.get(), n));
-  }
-  disable(t, e = !1) {
-    const s = t instanceof u ? t : this.lookup.get(t);
-    if (!s) return;
-    const n = s.disable(e);
-    this.disabledKeys.set(I(this.selectedKeys.get(), n));
+  #i(e) {
+    this.selectionProvider && this.selectionProvider.selectedKeys.get().has(e) && this.selectionProvider.selectedKeys.set(/* @__PURE__ */ new Set([...this.selectionProvider.selectedKeys.get()]));
   }
-  enable(t, e = !1) {
-    const s = t instanceof u ? t : this.lookup.get(t);
-    if (!s) return;
-    const n = s.enable(e);
-    this.disabledKeys.set(I(this.selectedKeys.get(), n));
-  }
-  updateItem(t, e) {
-    const s = this.lookup.get(t);
-    if (s) {
-      const n = {
-        ...s.data.get(),
-        ...typeof e == "function" ? e(s.data.get()) : e
-      }, l = this.#e.getItemKey(n);
-      if (s.key !== l) throw "Item key cannot be updated!";
-      this.#t(t), s.data.set(n);
-    }
-  }
-  #t(t) {
-    this.selectedKeys.get().has(t) && this.selectedKeys.set(/* @__PURE__ */ new Set([...this.selectedKeys.get()]));
-  }
-}
-const P = L(void 0);
-function H() {
-  const o = N(P);
-  if (!o)
-    throw new Error("No CompositeDataContext has been set, use CompositeDataContext to provide a context");
-  return o;
-}
-function X({
-  data: o,
-  children: t,
-  ...e
-}) {
-  const s = w(() => new G(o, e), [o, e]);
-  return /* @__PURE__ */ b(P, { value: s, children: t });
-}
-let k = (o, t) => (e) => {
-  o.current !== e && (o.current = e, t());
-};
-function x(o, { keys: t, deps: e = [o, t] } = {}) {
-  let s = E();
-  s.current = o.get();
-  let n = p((i) => (k(s, i)(o.value), t?.length > 0 ? U(o, t, k(s, i)) : o.listen(k(s, i))), e), l = () => s.current;
-  return $(n, l, l);
-}
-function D({
-  id: o,
-  className: t,
-  item: e,
-  mouseEventHandler: s,
-  keyboardEventHandler: n,
-  render: l
-}) {
-  const i = x(e.data), r = x(e.state), d = w(() => r.disabled ? {} : {
-    mouseEventHandler: () => s?.(e),
-    keyboardEventHandler: () => n?.(e)
-  }, [r.disabled, e, n, s]);
-  return /* @__PURE__ */ q(
-    "div",
-    {
-      id: o,
-      role: "option",
-      "aria-disabled": r.disabled,
-      "data-key": e.key,
-      tabIndex: r.disabled ? void 0 : r.focused ? 0 : -1,
-      className: t,
-      children: [
-        l({ data: i, key: e.key, level: e.level }, r, d),
-        e.children && e.children.length > 0 && [...e.children].map((a) => /* @__PURE__ */ b(
-          D,
-          {
-            id: `${o}-${e.key}`,
-            item: a,
-            render: l,
-            className: t,
-            mouseEventHandler: s,
-            keyboardEventHandler: n
-          },
-          a.key
-        ))
-      ]
-    }
-  );
-}
-function V(o) {
-  return o ?? M();
-}
-function Z({
-  renderItem: o,
-  className: t,
-  itemClassName: e,
-  ref: s,
-  id: n,
-  ...l
-}) {
-  const i = H(), r = E(null), d = V(n), a = p(
-    (h) => {
-      i.focus(h);
-    },
-    [i]
-  ), y = p(() => {
-    i.focusedItem.get()?.pointers.down && a(i.focusedItem.get().pointers.down);
-  }, [i, a]), m = p(() => {
-    i.focusedItem.get()?.pointers.up && a(i.focusedItem.get().pointers.up);
-  }, [i, a]), F = T({
-    ArrowUp: m,
-    ArrowLeft: m,
-    ArrowDown: y,
-    ArrowRight: y,
-    Space: () => {
-      i.focusedItem.get() && i.toggleSelect(i.focusedItem.get());
-    }
-  }), _ = p(
-    (h) => {
-      a(h.key), i.toggleSelect(h);
-    },
-    [i, a]
-  );
-  return A(
-    s,
-    () => ({
-      focusDown() {
-        y();
-      },
-      focusUp() {
-        m();
-      },
-      select() {
-        i.focusedItem.get() && i.toggleSelect(i.focusedItem.get());
-      }
-    }),
-    [i, y, m]
-  ), /* @__PURE__ */ b(
-    "div",
-    {
-      ref: r,
-      id: d,
-      className: t,
-      tabIndex: -1,
-      role: "listbox",
-      onKeyDown: F,
-      ...l,
-      children: [...i].map((h) => /* @__PURE__ */ b(
-        D,
-        {
-          className: e,
-          id: `${d}-${h.key}`,
-          item: h,
-          render: o,
-          mouseEventHandler: _
-        },
-        h.key
-      ))
-    }
-  );
 }
 export {
-  Z as CompositeComponent,
-  X as CompositeComponentContext,
-  D as CompositeComponentItem,
-  H as useCompositeContext
+  v as AbstractFocusProvider,
+  P as AbstractSelectionProvider,
+  m as CompositeComponent,
+  u as CompositeComponentItem,
+  l as CompositeData,
+  s as CompositeDataItem
 };

package/dist/icon-generator-tuhuqdpL.js

@@ -0,0 +1,76 @@
+import { jsx as u } from "react/jsx-runtime";
+import { useMemo as r } from "react";
+import { T as o, g as l } from "./generate-tiles-DuagGD1d.js";
+import { c as m } from "./utils-CRiPKpXj.js";
+const k = [
+  [o.PieRand, o.PieRand],
+  [o.PieRand, o.PieRand]
+];
+function b({
+  pattern: e = k,
+  tileSize: h = 64,
+  tileClassName: c,
+  tileBgClassName: s,
+  renderChildren: d,
+  fit: i = "none",
+  ...g
+}) {
+  const t = r(
+    () => ({
+      width: e.reduce((n, v) => Math.max(n, v.length), 0) * h,
+      height: e.length * h
+    }),
+    [e, h]
+  ), a = r(() => {
+    const n = l(e, h, c);
+    return s && n.unshift(
+      /* @__PURE__ */ u(
+        "rect",
+        {
+          x: 0,
+          y: 0,
+          width: t.width,
+          height: t.height,
+          className: m("fill-black stroke-2 stroke-black", s)
+        },
+        "svg-mask-invert"
+      )
+    ), n;
+  }, [e, t, c, s, h]), w = r(() => {
+    switch (i) {
+      case "fill":
+        return t.width <= t.height ? "100%" : void 0;
+      case "width":
+        return "100%";
+      case "none":
+        return t.width;
+      default:
+        return;
+    }
+  }, [i, t]), f = r(() => {
+    switch (i) {
+      case "fill":
+        return t.height < t.width ? "100%" : void 0;
+      case "height":
+        return "100%";
+      case "none":
+        return t.height;
+      default:
+        return;
+    }
+  }, [i, t]);
+  return /* @__PURE__ */ u(
+    "svg",
+    {
+      width: w,
+      height: f,
+      viewBox: `0 0 ${t.width} ${t.height}`,
+      overflow: "visible",
+      ...g,
+      children: d ? d(a, t.width, t.height) : a
+    }
+  );
+}
+export {
+  b as I
+};

package/dist/icon-generator.d.ts

@@ -3,7 +3,7 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 
 export declare function IconGenerator({ pattern, tileSize, tileClassName, tileBgClassName, renderChildren, fit, ...props }: IconGeneratorProps): JSX_2.Element;
 
-declare interface IconGeneratorProps extends Omit<React.ComponentProps<"svg">, "children" | "width" | "height" | "overflow"> {
+export declare interface IconGeneratorProps extends Omit<React.ComponentProps<"svg">, "children" | "width" | "height" | "overflow"> {
     pattern?: (TileShape | TileConfig)[][];
     tileSize?: number;
     tileClassName?: string;
@@ -12,13 +12,20 @@ declare interface IconGeneratorProps extends Omit<React.ComponentProps<"svg">, "
     renderChildren?: (paths: (JSX.Element | null)[], width: number, height: number) => React.ReactNode;
 }
 
-declare interface TileConfig {
+export declare interface MaskedImageGeneratorProps extends IconGeneratorProps {
+    src: string;
+    imageFit?: "cover" | "contain" | "fill";
+    imagePosition?: "top" | "center" | "bottom";
+    maskType?: "alpha" | "luminance";
+}
+
+export declare interface TileConfig {
     shape: TileShape;
     scale?: number;
     className?: string;
 }
 
-declare const TileShape: {
+export declare const TileShape: {
     readonly Blank: 0;
     readonly Rand: 1;
     readonly Mosaic: 2;
@@ -46,6 +53,6 @@ declare const TileShape: {
     readonly PieRand: 25;
 };
 
-declare type TileShape = (typeof TileShape)[keyof typeof TileShape];
+export declare type TileShape = (typeof TileShape)[keyof typeof TileShape];
 
 export { }