xertica-ui 2.8.0 → 2.9.7

package/dist/IsotypeMini-CQtWVo3h.js

@@ -0,0 +1,126 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { c as cn } from './button-B3SE1liJ.js';
+import { I as ISOTYPE_COLORS, m as mulberry32 } from './Isotype--fRZWwS6.js';
+
+const ISOTYPE_FRAME_VARIANTS = {
+  "blue-magenta": ["blue", "magenta"],
+  "blue-yellow": ["yellow", "blue"],
+  "green-red": ["green", "red"],
+  "green-blue": ["green", "blue"],
+  "magenta-yellow": ["yellow", "magenta"],
+  "magenta-purple": ["purple", "magenta"]
+};
+const ISOTYPE_FRAME_VARIANT_IDS = Object.keys(
+  ISOTYPE_FRAME_VARIANTS
+);
+
+const FRAME_SIZE = 78;
+const FRAME_THICKNESS = 27;
+const FRAME_OPACITY = 0.85;
+const BACK_FRAME = { x: 22, y: 0 };
+const FRONT_FRAME = { x: 0, y: 22 };
+function IsotypeFrames({
+  variant = "blue-magenta",
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [backKey, frontKey] = ISOTYPE_FRAME_VARIANTS[variant];
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: cn("aspect-square", className),
+      ...props,
+      children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 100 100", className: "h-full w-full", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: BACK_FRAME.x,
+            y: BACK_FRAME.y,
+            width: FRAME_SIZE,
+            height: FRAME_SIZE,
+            fill: "none",
+            stroke: ISOTYPE_COLORS[backKey],
+            strokeWidth: FRAME_THICKNESS,
+            opacity: FRAME_OPACITY
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "rect",
+          {
+            x: FRONT_FRAME.x,
+            y: FRONT_FRAME.y,
+            width: FRAME_SIZE,
+            height: FRAME_SIZE,
+            fill: "none",
+            stroke: ISOTYPE_COLORS[frontKey],
+            strokeWidth: FRAME_THICKNESS,
+            opacity: FRAME_OPACITY
+          }
+        )
+      ] })
+    }
+  );
+}
+
+const ISOTYPE_MINI_PATTERNS = {
+  core: [
+    "purple",
+    "blue",
+    "blue",
+    "magenta",
+    "yellow",
+    "green",
+    "magenta",
+    "red",
+    "brown"
+  ]
+};
+const ISOTYPE_MINI_PATTERN_IDS = Object.keys(
+  ISOTYPE_MINI_PATTERNS
+);
+function getIsotypeMiniVariant(patternId, seed) {
+  const base = ISOTYPE_MINI_PATTERNS[patternId];
+  const candidateIndices = base.reduce(
+    (acc, cell, i) => cell === "blank" ? acc : [...acc, i],
+    []
+  );
+  const rng = mulberry32(seed);
+  const chosen = candidateIndices[Math.floor(rng() * candidateIndices.length)];
+  return base.map((cell, i) => i === chosen ? "blank" : cell);
+}
+
+function IsotypeMini({
+  pattern = "core",
+  variantSeed,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const cells = variantSeed === void 0 ? ISOTYPE_MINI_PATTERNS[pattern] : getIsotypeMiniVariant(pattern, variantSeed);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: cn(
+        "grid aspect-square grid-cols-3 grid-rows-3",
+        className
+      ),
+      ...props,
+      children: cells.map((cell, index) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          style: { backgroundColor: cell === "blank" ? void 0 : ISOTYPE_COLORS[cell] }
+        },
+        index
+      ))
+    }
+  );
+}
+
+export { ISOTYPE_FRAME_VARIANTS as I, ISOTYPE_FRAME_VARIANT_IDS as a, ISOTYPE_MINI_PATTERNS as b, ISOTYPE_MINI_PATTERN_IDS as c, IsotypeFrames as d, IsotypeMini as e, getIsotypeMiniVariant as g };

package/dist/IsotypeMini-Cu_sW5yN.cjs

@@ -0,0 +1,134 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const button = require('./button-DVhloDtr.cjs');
+const Isotype = require('./Isotype-B8XLEXSB.cjs');
+
+const ISOTYPE_FRAME_VARIANTS = {
+  "blue-magenta": ["blue", "magenta"],
+  "blue-yellow": ["yellow", "blue"],
+  "green-red": ["green", "red"],
+  "green-blue": ["green", "blue"],
+  "magenta-yellow": ["yellow", "magenta"],
+  "magenta-purple": ["purple", "magenta"]
+};
+const ISOTYPE_FRAME_VARIANT_IDS = Object.keys(
+  ISOTYPE_FRAME_VARIANTS
+);
+
+const FRAME_SIZE = 78;
+const FRAME_THICKNESS = 27;
+const FRAME_OPACITY = 0.85;
+const BACK_FRAME = { x: 22, y: 0 };
+const FRONT_FRAME = { x: 0, y: 22 };
+function IsotypeFrames({
+  variant = "blue-magenta",
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [backKey, frontKey] = ISOTYPE_FRAME_VARIANTS[variant];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: button.cn("aspect-square", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 100 100", className: "h-full w-full", "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "rect",
+          {
+            x: BACK_FRAME.x,
+            y: BACK_FRAME.y,
+            width: FRAME_SIZE,
+            height: FRAME_SIZE,
+            fill: "none",
+            stroke: Isotype.ISOTYPE_COLORS[backKey],
+            strokeWidth: FRAME_THICKNESS,
+            opacity: FRAME_OPACITY
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "rect",
+          {
+            x: FRONT_FRAME.x,
+            y: FRONT_FRAME.y,
+            width: FRAME_SIZE,
+            height: FRAME_SIZE,
+            fill: "none",
+            stroke: Isotype.ISOTYPE_COLORS[frontKey],
+            strokeWidth: FRAME_THICKNESS,
+            opacity: FRAME_OPACITY
+          }
+        )
+      ] })
+    }
+  );
+}
+
+const ISOTYPE_MINI_PATTERNS = {
+  core: [
+    "purple",
+    "blue",
+    "blue",
+    "magenta",
+    "yellow",
+    "green",
+    "magenta",
+    "red",
+    "brown"
+  ]
+};
+const ISOTYPE_MINI_PATTERN_IDS = Object.keys(
+  ISOTYPE_MINI_PATTERNS
+);
+function getIsotypeMiniVariant(patternId, seed) {
+  const base = ISOTYPE_MINI_PATTERNS[patternId];
+  const candidateIndices = base.reduce(
+    (acc, cell, i) => cell === "blank" ? acc : [...acc, i],
+    []
+  );
+  const rng = Isotype.mulberry32(seed);
+  const chosen = candidateIndices[Math.floor(rng() * candidateIndices.length)];
+  return base.map((cell, i) => i === chosen ? "blank" : cell);
+}
+
+function IsotypeMini({
+  pattern = "core",
+  variantSeed,
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const cells = variantSeed === void 0 ? ISOTYPE_MINI_PATTERNS[pattern] : getIsotypeMiniVariant(pattern, variantSeed);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: button.cn(
+        "grid aspect-square grid-cols-3 grid-rows-3",
+        className
+      ),
+      ...props,
+      children: cells.map((cell, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: { backgroundColor: cell === "blank" ? void 0 : Isotype.ISOTYPE_COLORS[cell] }
+        },
+        index
+      ))
+    }
+  );
+}
+
+exports.ISOTYPE_FRAME_VARIANTS = ISOTYPE_FRAME_VARIANTS;
+exports.ISOTYPE_FRAME_VARIANT_IDS = ISOTYPE_FRAME_VARIANT_IDS;
+exports.ISOTYPE_MINI_PATTERNS = ISOTYPE_MINI_PATTERNS;
+exports.ISOTYPE_MINI_PATTERN_IDS = ISOTYPE_MINI_PATTERN_IDS;
+exports.IsotypeFrames = IsotypeFrames;
+exports.IsotypeMini = IsotypeMini;
+exports.getIsotypeMiniVariant = getIsotypeMiniVariant;

package/dist/IsotypeTwist-BTdNL4iV.js

@@ -0,0 +1,106 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { c as cn } from './button-B05czY_8.js';
+
+const ISOTYPE_COLORS = {
+  purple: "#5A4A96",
+  blue: "#1899AF",
+  magenta: "#C45BAA",
+  yellow: "#FAF338",
+  green: "#2E8B5A",
+  red: "#DE5B48",
+  brown: "#2A2415"
+};
+const ISOTYPE_PATTERNS = {
+  core: [
+    "purple",
+    "blue",
+    "blue",
+    "blue",
+    "magenta",
+    "blank",
+    "yellow",
+    "green",
+    "magenta",
+    "yellow",
+    "yellow",
+    "green",
+    "magenta",
+    "red",
+    "red",
+    "brown"
+  ]
+};
+const ISOTYPE_PATTERN_IDS = Object.keys(ISOTYPE_PATTERNS);
+function mulberry32(seed) {
+  let a = seed >>> 0;
+  return () => {
+    a |= 0;
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function getIsotypeVariant(patternId, seed) {
+  const base = ISOTYPE_PATTERNS[patternId];
+  const candidateIndices = base.reduce(
+    (acc, cell, i) => cell === "blank" ? acc : [...acc, i],
+    []
+  );
+  const rng = mulberry32(seed);
+  const chosen = candidateIndices[Math.floor(rng() * candidateIndices.length)];
+  return base.map((cell, i) => i === chosen ? "blank" : cell);
+}
+
+const ISOTYPE_TWIST_VARIANTS = {
+  "magenta-blue": ["magenta", "blue"],
+  "blue-red": ["blue", "red"]
+};
+const ISOTYPE_TWIST_VARIANT_IDS = Object.keys(
+  ISOTYPE_TWIST_VARIANTS
+);
+
+const VIEW_WIDTH = 800;
+const VIEW_HEIGHT = 694;
+const TWIST_BLEND_MODE = "multiply";
+const BACK_SHAPE_PATH = "M218.149 0L344.167 230.665L470.185 0H681.981L467.008 344.092L687.805 693.902H473.892L344.167 458.948L214.443 693.902H0L221.326 344.092L5.82437 0H218.149Z";
+const FRONT_SHAPE_PATH = "M486.064 230.488L570.299 384.535L654.535 230.488H796.107L652.411 460.285L800 693.902H657.012L570.299 536.991L483.586 693.902H340.244L488.187 460.285L344.137 230.488H486.064Z";
+function IsotypeTwist({
+  variant = "magenta-blue",
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [backKey, frontKey] = ISOTYPE_TWIST_VARIANTS[variant];
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: cn("isolate aspect-[800/694]", className),
+      ...props,
+      children: /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          viewBox: `0 0 ${VIEW_WIDTH} ${VIEW_HEIGHT}`,
+          className: "h-full w-full",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsx("path", { d: BACK_SHAPE_PATH, fill: ISOTYPE_COLORS[backKey] }),
+            /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: FRONT_SHAPE_PATH,
+                fill: ISOTYPE_COLORS[frontKey],
+                style: { mixBlendMode: TWIST_BLEND_MODE }
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+
+export { ISOTYPE_PATTERNS as I, ISOTYPE_COLORS as a, ISOTYPE_PATTERN_IDS as b, ISOTYPE_TWIST_VARIANTS as c, ISOTYPE_TWIST_VARIANT_IDS as d, IsotypeTwist as e, getIsotypeVariant as g, mulberry32 as m };

package/dist/IsotypeTwist-DvsUgZs_.cjs

@@ -0,0 +1,115 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const button = require('./button-BMDlWZR8.cjs');
+
+const ISOTYPE_COLORS = {
+  purple: "#5A4A96",
+  blue: "#1899AF",
+  magenta: "#C45BAA",
+  yellow: "#FAF338",
+  green: "#2E8B5A",
+  red: "#DE5B48",
+  brown: "#2A2415"
+};
+const ISOTYPE_PATTERNS = {
+  core: [
+    "purple",
+    "blue",
+    "blue",
+    "blue",
+    "magenta",
+    "blank",
+    "yellow",
+    "green",
+    "magenta",
+    "yellow",
+    "yellow",
+    "green",
+    "magenta",
+    "red",
+    "red",
+    "brown"
+  ]
+};
+const ISOTYPE_PATTERN_IDS = Object.keys(ISOTYPE_PATTERNS);
+function mulberry32(seed) {
+  let a = seed >>> 0;
+  return () => {
+    a |= 0;
+    a = a + 1831565813 | 0;
+    let t = Math.imul(a ^ a >>> 15, 1 | a);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function getIsotypeVariant(patternId, seed) {
+  const base = ISOTYPE_PATTERNS[patternId];
+  const candidateIndices = base.reduce(
+    (acc, cell, i) => cell === "blank" ? acc : [...acc, i],
+    []
+  );
+  const rng = mulberry32(seed);
+  const chosen = candidateIndices[Math.floor(rng() * candidateIndices.length)];
+  return base.map((cell, i) => i === chosen ? "blank" : cell);
+}
+
+const ISOTYPE_TWIST_VARIANTS = {
+  "magenta-blue": ["magenta", "blue"],
+  "blue-red": ["blue", "red"]
+};
+const ISOTYPE_TWIST_VARIANT_IDS = Object.keys(
+  ISOTYPE_TWIST_VARIANTS
+);
+
+const VIEW_WIDTH = 800;
+const VIEW_HEIGHT = 694;
+const TWIST_BLEND_MODE = "multiply";
+const BACK_SHAPE_PATH = "M218.149 0L344.167 230.665L470.185 0H681.981L467.008 344.092L687.805 693.902H473.892L344.167 458.948L214.443 693.902H0L221.326 344.092L5.82437 0H218.149Z";
+const FRONT_SHAPE_PATH = "M486.064 230.488L570.299 384.535L654.535 230.488H796.107L652.411 460.285L800 693.902H657.012L570.299 536.991L483.586 693.902H340.244L488.187 460.285L344.137 230.488H486.064Z";
+function IsotypeTwist({
+  variant = "magenta-blue",
+  className,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const [backKey, frontKey] = ISOTYPE_TWIST_VARIANTS[variant];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      role: ariaLabel ? "img" : void 0,
+      "aria-label": ariaLabel,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: button.cn("isolate aspect-[800/694]", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "svg",
+        {
+          viewBox: `0 0 ${VIEW_WIDTH} ${VIEW_HEIGHT}`,
+          className: "h-full w-full",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("path", { d: BACK_SHAPE_PATH, fill: ISOTYPE_COLORS[backKey] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "path",
+              {
+                d: FRONT_SHAPE_PATH,
+                fill: ISOTYPE_COLORS[frontKey],
+                style: { mixBlendMode: TWIST_BLEND_MODE }
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+
+exports.ISOTYPE_COLORS = ISOTYPE_COLORS;
+exports.ISOTYPE_PATTERNS = ISOTYPE_PATTERNS;
+exports.ISOTYPE_PATTERN_IDS = ISOTYPE_PATTERN_IDS;
+exports.ISOTYPE_TWIST_VARIANTS = ISOTYPE_TWIST_VARIANTS;
+exports.ISOTYPE_TWIST_VARIANT_IDS = ISOTYPE_TWIST_VARIANT_IDS;
+exports.IsotypeTwist = IsotypeTwist;
+exports.getIsotypeVariant = getIsotypeVariant;
+exports.mulberry32 = mulberry32;