@elvora/core 1.0.0-rc.1

package/dist/index.js

@@ -0,0 +1,603 @@
+export { FOCUSABLE_SELECTOR, createFocusTrap, generateId, getFirstFocusable, getFocusableElements, getLastFocusable, isElementVisible, isFocusable } from './chunk-VFHCOPTO.js';
+
+// src/utils/composeRefs.ts
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref != null) {
+    ref.current = value;
+  }
+}
+function composeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      setRef(ref, node);
+    }
+  };
+}
+
+// src/utils/composeEventHandlers.ts
+function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForDefaultPrevented = true } = {}) {
+  return function handleEvent(event) {
+    originalEventHandler?.(event);
+    if (checkForDefaultPrevented === false || !event.defaultPrevented) {
+      ourEventHandler?.(event);
+    }
+  };
+}
+
+// src/utils/mergeProps.ts
+function mergeProps(a, b) {
+  const merged = { ...a };
+  for (const key in b) {
+    const aValue = a[key];
+    const bValue = b[key];
+    if (key.startsWith("on") && typeof aValue === "function" && typeof bValue === "function") {
+      merged[key] = composeEventHandlers(
+        aValue,
+        bValue
+      );
+    } else if (key === "className" && typeof aValue === "string" && typeof bValue === "string") {
+      merged[key] = `${aValue} ${bValue}`.trim();
+    } else if (key === "style" && aValue && bValue && typeof aValue === "object" && typeof bValue === "object") {
+      merged[key] = { ...aValue, ...bValue };
+    } else {
+      merged[key] = bValue;
+    }
+  }
+  return merged;
+}
+
+// src/utils/dataAttr.ts
+function dataAttr(condition) {
+  return condition ? "" : void 0;
+}
+function ariaAttr(condition) {
+  return condition ? true : void 0;
+}
+
+// src/utils/qrcode.ts
+var ECC_ORDER = { L: 0, M: 1, Q: 2, H: 3 };
+var ECC_CODEWORDS_PER_BLOCK = [
+  // L,  M,  Q,  H
+  [7, 10, 13, 17],
+  // 1
+  [10, 16, 22, 28],
+  // 2
+  [15, 26, 18, 22],
+  // 3
+  [20, 18, 26, 16],
+  // 4
+  [26, 24, 18, 22],
+  // 5
+  [18, 16, 24, 28],
+  // 6
+  [20, 18, 18, 26],
+  // 7
+  [24, 22, 22, 26],
+  // 8
+  [30, 22, 20, 24],
+  // 9
+  [18, 26, 24, 28]
+  // 10
+];
+var NUM_ERROR_CORRECTION_BLOCKS = [
+  [1, 1, 1, 1],
+  [1, 1, 1, 1],
+  [1, 1, 2, 2],
+  [1, 2, 2, 4],
+  [1, 2, 4, 4],
+  [2, 4, 4, 4],
+  [2, 4, 6, 5],
+  [2, 4, 6, 6],
+  [2, 5, 8, 8],
+  [4, 5, 8, 8]
+];
+function getEccCount(ver, ecl) {
+  return ECC_CODEWORDS_PER_BLOCK[ver - 1][ECC_ORDER[ecl]];
+}
+function getNumBlocks(ver, ecl) {
+  return NUM_ERROR_CORRECTION_BLOCKS[ver - 1][ECC_ORDER[ecl]];
+}
+var NUM_RAW_DATA_MODULES = (ver) => {
+  let result = (16 * ver + 128) * ver + 64;
+  if (ver >= 2) {
+    const align = Math.floor(ver / 7) + 2;
+    result -= (25 * align - 10) * align - 55;
+    if (ver >= 7) result -= 36;
+  }
+  return result;
+};
+var NUM_DATA_CODEWORDS = (ver, ecl) => {
+  return Math.floor(NUM_RAW_DATA_MODULES(ver) / 8) - getEccCount(ver, ecl) * getNumBlocks(ver, ecl);
+};
+var EXP_TABLE = new Array(256).fill(0);
+var LOG_TABLE = new Array(256).fill(0);
+{
+  let x = 1;
+  for (let i = 0; i < 255; i++) {
+    EXP_TABLE[i] = x;
+    LOG_TABLE[x] = i;
+    x = x << 1;
+    if (x & 256) x ^= 285;
+  }
+  EXP_TABLE[255] = EXP_TABLE[0];
+}
+function rsMul(x, y) {
+  if (x === 0 || y === 0) return 0;
+  return EXP_TABLE[(LOG_TABLE[x] + LOG_TABLE[y]) % 255];
+}
+function rsGeneratorPoly(degree) {
+  const result = [1];
+  for (let i = 0; i < degree; i++) {
+    const next = new Array(result.length + 1).fill(0);
+    for (let j = 0; j < result.length; j++) {
+      next[j] = (next[j] ^ rsMul(result[j], EXP_TABLE[i])) & 255;
+      next[j + 1] = (next[j + 1] ^ result[j]) & 255;
+    }
+    for (let j = 0; j < next.length; j++) result[j] = next[j];
+    result.push(next[next.length - 1]);
+  }
+  return result;
+}
+function rsRemainder(data, generator) {
+  const result = new Array(generator.length - 1).fill(0);
+  for (const b of data) {
+    const factor = (b ^ result.shift()) & 255;
+    result.push(0);
+    for (let i = 0; i < result.length; i++) result[i] = (result[i] ^ rsMul(generator[i], factor)) & 255;
+  }
+  return result;
+}
+var BitBuffer = class {
+  constructor() {
+    this.bits = [];
+  }
+  append(value, length) {
+    for (let i = length - 1; i >= 0; i--) this.bits.push(value >>> i & 1);
+  }
+};
+function encodeToBitBuffer(text, version) {
+  const buf = new BitBuffer();
+  buf.append(4, 4);
+  const charCountBits = version < 10 ? 8 : 16;
+  const enc = new TextEncoder();
+  const arr = enc.encode(text);
+  buf.append(arr.length, charCountBits);
+  for (const b of arr) buf.append(b, 8);
+  return buf;
+}
+function chooseVersion(text, ecl) {
+  for (let v = 1; v <= 10; v++) {
+    const buf = encodeToBitBuffer(text, v);
+    const capacity = NUM_DATA_CODEWORDS(v, ecl) * 8;
+    if (buf.bits.length <= capacity) return { version: v, bits: buf };
+  }
+  throw new Error("Data too long for QR Code v1-10. Trim the input or use a smaller ECC level.");
+}
+function buildDataCodewords(version, ecl, bits) {
+  const capacity = NUM_DATA_CODEWORDS(version, ecl) * 8;
+  const termLen = Math.min(4, capacity - bits.bits.length);
+  bits.append(0, termLen);
+  bits.append(0, (8 - bits.bits.length % 8) % 8);
+  const padBytes = [236, 17];
+  for (let i = 0; bits.bits.length < capacity; i++) bits.append(padBytes[i % 2], 8);
+  const bytes = [];
+  for (let i = 0; i < bits.bits.length; i += 8) {
+    let b = 0;
+    for (let j = 0; j < 8; j++) b = b << 1 | bits.bits[i + j];
+    bytes.push(b);
+  }
+  const eccPerBlock = getEccCount(version, ecl);
+  const numBlocks = getNumBlocks(version, ecl);
+  const totalCodewords = Math.floor(NUM_RAW_DATA_MODULES(version) / 8);
+  const numShortBlocks = numBlocks - totalCodewords % numBlocks;
+  const shortBlockLen = Math.floor(totalCodewords / numBlocks);
+  const blocks = [];
+  const generator = rsGeneratorPoly(eccPerBlock);
+  let k = 0;
+  for (let i = 0; i < numBlocks; i++) {
+    const dataLen = shortBlockLen - eccPerBlock + (i < numShortBlocks ? 0 : 1);
+    const data = bytes.slice(k, k + dataLen);
+    k += dataLen;
+    const block = data.slice();
+    const ec = rsRemainder(data, generator);
+    for (const b of ec) block.push(b);
+    blocks.push(block);
+  }
+  const result = [];
+  const lastBlock = blocks[blocks.length - 1];
+  for (let i = 0; i < lastBlock.length; i++) {
+    for (let j = 0; j < blocks.length; j++) {
+      if (i !== shortBlockLen - eccPerBlock || j >= numShortBlocks) result.push(blocks[j][i]);
+    }
+  }
+  return result;
+}
+function buildMatrix(version, ecl, codewords) {
+  const size = version * 4 + 17;
+  const matrix = Array.from({ length: size }, () => new Array(size).fill(false));
+  const reserved = Array.from({ length: size }, () => new Array(size).fill(false));
+  const setModule = (x, y, dark) => {
+    matrix[y][x] = dark;
+    reserved[y][x] = true;
+  };
+  const drawFinder = (cx, cy) => {
+    for (let dy = -4; dy <= 4; dy++) {
+      for (let dx = -4; dx <= 4; dx++) {
+        const x = cx + dx;
+        const y = cy + dy;
+        if (x < 0 || y < 0 || x >= size || y >= size) continue;
+        const dist = Math.max(Math.abs(dx), Math.abs(dy));
+        setModule(x, y, dist !== 2 && dist !== 4);
+      }
+    }
+  };
+  drawFinder(3, 3);
+  drawFinder(size - 4, 3);
+  drawFinder(3, size - 4);
+  for (let i = 8; i < size - 8; i++) {
+    setModule(6, i, i % 2 === 0);
+    setModule(i, 6, i % 2 === 0);
+  }
+  if (version >= 2) {
+    const positions = getAlignmentPositions(version);
+    for (const ay of positions) {
+      for (const ax of positions) {
+        if (ax === 6 && ay === 6 || ax === 6 && ay === size - 7 || ax === size - 7 && ay === 6) continue;
+        for (let dy = -2; dy <= 2; dy++) {
+          for (let dx = -2; dx <= 2; dx++) {
+            const dist = Math.max(Math.abs(dx), Math.abs(dy));
+            setModule(ax + dx, ay + dy, dist !== 1);
+          }
+        }
+      }
+    }
+  }
+  setModule(8, size - 8, true);
+  for (let i = 0; i < 9; i++) {
+    reserved[8][i] = true;
+    reserved[i][8] = true;
+  }
+  for (let i = 0; i < 8; i++) {
+    reserved[8][size - 1 - i] = true;
+    reserved[size - 1 - i][8] = true;
+  }
+  const bits = [];
+  for (const b of codewords) for (let i = 7; i >= 0; i--) bits.push(b >>> i & 1);
+  let bitIdx = 0;
+  for (let right = size - 1; right >= 1; right -= 2) {
+    if (right === 6) right = 5;
+    for (let vert = 0; vert < size; vert++) {
+      for (let j = 0; j < 2; j++) {
+        const x = right - j;
+        const upward = (right + 1 & 2) === 0;
+        const y = upward ? size - 1 - vert : vert;
+        if (!reserved[y][x] && bitIdx < bits.length) {
+          matrix[y][x] = bits[bitIdx] === 1;
+          bitIdx++;
+        }
+      }
+    }
+  }
+  const mask = 0;
+  for (let y = 0; y < size; y++) {
+    for (let x = 0; x < size; x++) {
+      if (reserved[y][x]) continue;
+      if ((x + y) % 2 === 0) matrix[y][x] = !matrix[y][x];
+    }
+  }
+  const formatBits = encodeFormat(ECC_ORDER[ecl], mask);
+  for (let i = 0; i <= 5; i++) matrix[8][i] = (formatBits >> i & 1) === 1;
+  matrix[8][7] = (formatBits >> 6 & 1) === 1;
+  matrix[8][8] = (formatBits >> 7 & 1) === 1;
+  matrix[7][8] = (formatBits >> 8 & 1) === 1;
+  for (let i = 9; i < 15; i++) matrix[14 - i][8] = (formatBits >> i & 1) === 1;
+  for (let i = 0; i < 8; i++) matrix[size - 1 - i][8] = (formatBits >> i & 1) === 1;
+  for (let i = 8; i < 15; i++) matrix[8][size - 15 + i] = (formatBits >> i & 1) === 1;
+  return matrix;
+}
+function getAlignmentPositions(version) {
+  if (version === 1) return [];
+  const numAlign = Math.floor(version / 7) + 2;
+  const step = Math.ceil((version * 4 + 4) / (numAlign * 2 - 2) * 2) / 2 * 2;
+  const positions = [6];
+  for (let pos = version * 4 + 10; positions.length < numAlign; pos -= step) positions.splice(1, 0, pos);
+  return positions;
+}
+function encodeFormat(eclLevel, mask) {
+  const map = [1, 0, 3, 2];
+  const eclBits = map[eclLevel];
+  const data = eclBits << 3 | mask;
+  let bch = data;
+  for (let i = 0; i < 10; i++) bch = bch << 1 ^ (bch >> 9) * 1335;
+  return (data << 10 | bch) ^ 21522;
+}
+function generateQrMatrix(text, ecl = "M") {
+  const { version, bits } = chooseVersion(text, ecl);
+  const codewords = buildDataCodewords(version, ecl, bits);
+  const modules = buildMatrix(version, ecl, codewords);
+  return { size: modules.length, modules, version };
+}
+
+// src/a11y/keys.ts
+var Keys = {
+  Enter: "Enter",
+  Space: " ",
+  Escape: "Escape",
+  Tab: "Tab",
+  ArrowUp: "ArrowUp",
+  ArrowDown: "ArrowDown",
+  ArrowLeft: "ArrowLeft",
+  ArrowRight: "ArrowRight",
+  Home: "Home",
+  End: "End",
+  PageUp: "PageUp",
+  PageDown: "PageDown",
+  Backspace: "Backspace",
+  Delete: "Delete"
+};
+function isActivationKey(key) {
+  return key === Keys.Enter || key === Keys.Space;
+}
+
+// src/styles/button.ts
+var sizeMap = {
+  xs: { padX: 8, padY: 4, font: 12, height: 24, gap: 4, radius: "sm" },
+  sm: { padX: 12, padY: 6, font: 13, height: 32, gap: 6, radius: "md" },
+  md: { padX: 16, padY: 8, font: 14, height: 40, gap: 8, radius: "md" },
+  lg: { padX: 20, padY: 10, font: 16, height: 48, gap: 8, radius: "lg" },
+  xl: { padX: 24, padY: 12, font: 18, height: 56, gap: 10, radius: "lg" }
+};
+function getButtonStyle(input) {
+  const { theme, variant, size, fullWidth, isLoading, isDisabled, isPressed, isHovered, isFocusVisible } = input;
+  const intent = theme.colors.intent[input.intent ?? (variant === "destructive" ? "danger" : "primary")];
+  const dims = sizeMap[size];
+  const radius = theme.radii[dims.radius];
+  const baseRoot = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "row",
+    gap: dims.gap,
+    paddingLeft: dims.padX,
+    paddingRight: dims.padX,
+    paddingTop: dims.padY,
+    paddingBottom: dims.padY,
+    minHeight: dims.height,
+    borderRadius: radius,
+    borderWidth: 1,
+    borderStyle: "solid",
+    borderColor: "transparent",
+    fontFamily: theme.tokens.typography.fontFamilies.sans,
+    fontSize: dims.font,
+    fontWeight: theme.tokens.typography.fontWeights.medium,
+    lineHeight: theme.tokens.typography.lineHeights.tight,
+    width: fullWidth ? "100%" : "auto",
+    cursor: isDisabled || isLoading ? "not-allowed" : "pointer",
+    opacity: isDisabled ? 0.5 : 1,
+    userSelect: "none",
+    transitionProperty: "background-color, border-color, color, box-shadow, transform",
+    transitionDuration: theme.durations.fast,
+    transitionTimingFunction: theme.easings.standard,
+    boxShadow: isFocusVisible ? theme.shadows.focus : void 0
+  };
+  let root = baseRoot;
+  let labelColor = theme.colors.fg;
+  let spinnerColor = theme.colors.fg;
+  switch (variant) {
+    case "primary":
+    case "destructive": {
+      const bg = isPressed ? intent.solidActive : isHovered ? intent.solidHover : intent.solid;
+      root = { ...root, backgroundColor: bg, borderColor: bg, color: intent.solidFg };
+      labelColor = intent.solidFg;
+      spinnerColor = intent.solidFg;
+      break;
+    }
+    case "secondary": {
+      const bg = isPressed ? theme.colors.intent.neutral.subtleHover : isHovered ? theme.colors.intent.neutral.subtleHover : theme.colors.intent.neutral.subtle;
+      root = {
+        ...root,
+        backgroundColor: bg,
+        borderColor: theme.colors.border,
+        color: theme.colors.fg
+      };
+      labelColor = theme.colors.fg;
+      spinnerColor = theme.colors.fg;
+      break;
+    }
+    case "tertiary": {
+      const bg = isPressed ? intent.subtleHover : isHovered ? intent.subtle : "transparent";
+      root = { ...root, backgroundColor: bg, color: intent.fg };
+      labelColor = intent.fg;
+      spinnerColor = intent.fg;
+      break;
+    }
+    case "outline": {
+      const bg = isPressed ? intent.subtleHover : isHovered ? intent.subtle : "transparent";
+      root = { ...root, backgroundColor: bg, borderColor: intent.border, color: intent.fg };
+      labelColor = intent.fg;
+      spinnerColor = intent.fg;
+      break;
+    }
+    case "ghost": {
+      const bg = isPressed ? theme.colors.intent.neutral.subtleHover : isHovered ? theme.colors.intent.neutral.subtle : "transparent";
+      root = { ...root, backgroundColor: bg, color: theme.colors.fg };
+      labelColor = theme.colors.fg;
+      spinnerColor = theme.colors.fg;
+      break;
+    }
+    case "link": {
+      root = {
+        ...root,
+        backgroundColor: "transparent",
+        minHeight: "auto",
+        padding: 0,
+        color: intent.fg,
+        textDecoration: isHovered || isPressed ? "underline" : "none",
+        borderWidth: 0
+      };
+      labelColor = intent.fg;
+      spinnerColor = intent.fg;
+      break;
+    }
+  }
+  return {
+    root,
+    label: {
+      color: labelColor,
+      fontSize: dims.font,
+      fontWeight: theme.tokens.typography.fontWeights.medium,
+      opacity: isLoading ? 0 : 1
+    },
+    spinnerColor
+  };
+}
+
+// src/styles/input.ts
+var sizeMap2 = {
+  xs: { padX: 8, padY: 4, font: 12, height: 24, radius: "sm" },
+  sm: { padX: 10, padY: 6, font: 13, height: 32, radius: "md" },
+  md: { padX: 12, padY: 8, font: 14, height: 40, radius: "md" },
+  lg: { padX: 14, padY: 10, font: 16, height: 48, radius: "lg" },
+  xl: { padX: 16, padY: 12, font: 18, height: 56, radius: "lg" }
+};
+var statusIntent = {
+  neutral: "neutral",
+  info: "info",
+  success: "success",
+  warning: "warning",
+  error: "danger"
+};
+function getInputStyle(input) {
+  const { theme, size, status, isDisabled, isReadOnly, isInvalid, isFocused, isHovered } = input;
+  const dims = sizeMap2[size];
+  const intent = theme.colors.intent[isInvalid ? "danger" : statusIntent[status]];
+  const borderColor = isFocused ? intent.border : isHovered && !isDisabled ? theme.colors.borderStrong : isInvalid || status === "error" ? theme.colors.intent.danger.border : theme.colors.border;
+  return {
+    display: "inline-flex",
+    alignItems: "center",
+    width: "100%",
+    minHeight: dims.height,
+    paddingLeft: dims.padX,
+    paddingRight: dims.padX,
+    paddingTop: dims.padY,
+    paddingBottom: dims.padY,
+    borderRadius: theme.radii[dims.radius],
+    borderWidth: 1,
+    borderStyle: "solid",
+    borderColor,
+    backgroundColor: isDisabled ? theme.colors.surface : theme.colors.surfaceElevated,
+    color: theme.colors.fg,
+    fontFamily: theme.tokens.typography.fontFamilies.sans,
+    fontSize: dims.font,
+    lineHeight: theme.tokens.typography.lineHeights.normal,
+    outline: "none",
+    opacity: isDisabled ? 0.6 : 1,
+    cursor: isDisabled ? "not-allowed" : isReadOnly ? "default" : "text",
+    boxShadow: isFocused ? `0 0 0 3px ${intent.ring}33` : void 0,
+    transitionProperty: "border-color, box-shadow, background-color",
+    transitionDuration: theme.durations.fast,
+    transitionTimingFunction: theme.easings.standard
+  };
+}
+
+// src/styles/floatingLabel.ts
+var sizeMap3 = {
+  xs: { padX: 8, padY: 4, restFont: 12, floatFont: 10 },
+  sm: { padX: 10, padY: 6, restFont: 13, floatFont: 11 },
+  md: { padX: 12, padY: 8, restFont: 14, floatFont: 12 },
+  lg: { padX: 14, padY: 10, restFont: 16, floatFont: 12 },
+  xl: { padX: 16, padY: 12, restFont: 18, floatFont: 13 }
+};
+function getFloatingLabelStyle(input) {
+  const { theme, size, variant, floated, focused, invalid, restAlign = "center" } = input;
+  const dims = sizeMap3[size];
+  const activeColor = invalid ? theme.colors.intent.danger.fg : focused ? theme.colors.intent.info.fg : theme.colors.fgMuted;
+  const floatedTop = variant === "outlined" ? 0 : 4;
+  const restTop = restAlign === "top" ? dims.padY : "50%";
+  const restTransform = restAlign === "top" ? "translateY(0)" : "translateY(-50%)";
+  return {
+    wrapper: {
+      position: "relative",
+      display: "inline-flex",
+      width: "100%"
+    },
+    label: {
+      position: "absolute",
+      left: dims.padX,
+      maxWidth: `calc(100% - ${dims.padX * 2}px)`,
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      pointerEvents: "none",
+      fontFamily: theme.tokens.typography.fontFamilies.sans,
+      color: floated ? activeColor : theme.colors.fgMuted,
+      top: floated ? floatedTop : restTop,
+      transform: floated ? "translateY(-50%)" : restTransform,
+      fontSize: floated ? dims.floatFont : dims.restFont,
+      lineHeight: theme.tokens.typography.lineHeights.snug,
+      transitionProperty: "top, font-size, color",
+      transitionDuration: theme.durations.fast,
+      transitionTimingFunction: theme.easings.standard,
+      // Outlined: paint the field background behind the floated label so the
+      // label visually "notches" the top border.
+      ...variant === "outlined" && floated ? { paddingLeft: 4, paddingRight: 4, backgroundColor: theme.colors.surfaceElevated } : null
+    }
+  };
+}
+
+// src/components/button.ts
+var defaultButtonProps = {
+  variant: "primary",
+  size: "md",
+  type: "button",
+  fullWidth: false,
+  isLoading: false,
+  isDisabled: false,
+  loadingText: "Loading"
+};
+
+// src/components/input.ts
+var defaultInputProps = {
+  size: "md",
+  status: "neutral",
+  isReadOnly: false,
+  isDisabled: false,
+  isRequired: false,
+  isInvalid: false
+};
+
+// src/components/tabs.ts
+function getNextTabIndex(event, currentIndex, tabs, options = {}) {
+  const { orientation = "horizontal" } = options;
+  const last = tabs.length - 1;
+  const next = (i) => {
+    let n = i;
+    do {
+      n = n >= last ? 0 : n + 1;
+    } while (tabs[n]?.isDisabled && n !== i);
+    return n;
+  };
+  const prev = (i) => {
+    let p = i;
+    do {
+      p = p <= 0 ? last : p - 1;
+    } while (tabs[p]?.isDisabled && p !== i);
+    return p;
+  };
+  if (orientation === "horizontal") {
+    if (event.key === "ArrowRight") return next(currentIndex);
+    if (event.key === "ArrowLeft") return prev(currentIndex);
+  } else {
+    if (event.key === "ArrowDown") return next(currentIndex);
+    if (event.key === "ArrowUp") return prev(currentIndex);
+  }
+  if (event.key === "Home") return next(-1);
+  if (event.key === "End") return prev(0);
+  return currentIndex;
+}
+
+export { Keys, ariaAttr, composeEventHandlers, composeRefs, dataAttr, defaultButtonProps, defaultInputProps, generateQrMatrix, getButtonStyle, getFloatingLabelStyle, getInputStyle, getNextTabIndex, isActivationKey, mergeProps, setRef };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map