@pinfold/react 0.0.0-stage → 0.2.0

package/dist/accordion/lazy.cjs

@@ -0,0 +1,17 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }'use client';
+
+
+var _chunkRJPT3NTPcjs = require('../chunk-RJPT3NTP.cjs');
+require('../chunk-VPKVOJHA.cjs');
+
+// src/accordion/lazy.ts
+var Accordion = _chunkRJPT3NTPcjs.createLazyComponent.call(void 0, 
+  () => Promise.resolve().then(() => _interopRequireWildcard(require("./client.cjs"))).then((m) => ({ default: m.Accordion })),
+  { displayName: "LazyAccordion" }
+);
+var lazy_default = Accordion;
+
+
+
+exports.Accordion = Accordion; exports.default = lazy_default;

package/dist/accordion/lazy.d.cts

@@ -0,0 +1,16 @@
+import * as _pinfold_core from '@pinfold/core';
+import * as React from 'react';
+import { c as AnyAccordionConfig } from '../types-CkcgnWwL.cjs';
+export { A as AccordionConfig, a as AccordionMappedConfig } from '../types-CkcgnWwL.cjs';
+
+/**
+ * Code-split entry point. Nothing accordion-related enters the main bundle
+ * until the component first renders:
+ *
+ *   import { Accordion } from '@pinfold/react/accordion/lazy';
+ */
+declare const Accordion: React.ComponentType<AnyAccordionConfig & {
+    lazy?: _pinfold_core.PinfoldLazy;
+}>;
+
+export { Accordion, Accordion as default };

package/dist/accordion/lazy.d.ts

@@ -0,0 +1,16 @@
+import * as _pinfold_core from '@pinfold/core';
+import * as React from 'react';
+import { c as AnyAccordionConfig } from '../types-CkcgnWwL.js';
+export { A as AccordionConfig, a as AccordionMappedConfig } from '../types-CkcgnWwL.js';
+
+/**
+ * Code-split entry point. Nothing accordion-related enters the main bundle
+ * until the component first renders:
+ *
+ *   import { Accordion } from '@pinfold/react/accordion/lazy';
+ */
+declare const Accordion: React.ComponentType<AnyAccordionConfig & {
+    lazy?: _pinfold_core.PinfoldLazy;
+}>;
+
+export { Accordion, Accordion as default };

package/dist/accordion/lazy.js

@@ -0,0 +1,16 @@
+'use client';
+import {
+  createLazyComponent
+} from "../chunk-5ZMK623A.js";
+import "../chunk-Q232PTPW.js";
+
+// src/accordion/lazy.ts
+var Accordion = createLazyComponent(
+  () => import("./client.js").then((m) => ({ default: m.Accordion })),
+  { displayName: "LazyAccordion" }
+);
+var lazy_default = Accordion;
+export {
+  Accordion,
+  lazy_default as default
+};

package/dist/chunk-5ZMK623A.js

@@ -0,0 +1,61 @@
+'use client';
+import {
+  usePinfold
+} from "./chunk-Q232PTPW.js";
+
+// src/lazy.tsx
+import * as React from "react";
+function createLazyComponent(loader, options = {}) {
+  var _a, _b;
+  const Lazy = React.lazy(loader);
+  const fallback = (_a = options.fallback) != null ? _a : null;
+  const Wrapped = (props) => {
+    var _a2, _b2;
+    const ctx = usePinfold();
+    const preferred = (_a2 = props.lazy) != null ? _a2 : ctx.lazy;
+    const strategy = preferred === "auto" ? (_b2 = options.auto) != null ? _b2 : "eager" : preferred;
+    const [ready, setReady] = React.useState(strategy === "eager");
+    const placeholder = React.useRef(null);
+    React.useEffect(() => {
+      if (ready) return;
+      if (strategy === "idle") {
+        const w = window;
+        if (w.requestIdleCallback) {
+          const id2 = w.requestIdleCallback(() => setReady(true));
+          return () => {
+            var _a3;
+            return (_a3 = w.cancelIdleCallback) == null ? void 0 : _a3.call(w, id2);
+          };
+        }
+        const id = setTimeout(() => setReady(true), 200);
+        return () => clearTimeout(id);
+      }
+      const el = placeholder.current;
+      if (!el || typeof IntersectionObserver === "undefined") {
+        setReady(true);
+        return;
+      }
+      const observer = new IntersectionObserver(
+        (entries) => {
+          if (entries.some((e) => e.isIntersecting)) {
+            setReady(true);
+            observer.disconnect();
+          }
+        },
+        { rootMargin: "200px" }
+      );
+      observer.observe(el);
+      return () => observer.disconnect();
+    }, [ready, strategy]);
+    if (!ready) {
+      return /* @__PURE__ */ React.createElement("div", { ref: placeholder, "data-pinfold-lazy": "", style: { minHeight: 1 } }, fallback);
+    }
+    return /* @__PURE__ */ React.createElement(React.Suspense, { fallback }, React.createElement(Lazy, props));
+  };
+  Wrapped.displayName = (_b = options.displayName) != null ? _b : "PinfoldLazy";
+  return Wrapped;
+}
+
+export {
+  createLazyComponent
+};

package/dist/chunk-BPPCPHHU.js

@@ -0,0 +1,70 @@
+'use client';
+import {
+  useIsomorphicLayoutEffect
+} from "./chunk-Q232PTPW.js";
+
+// src/slots.ts
+import { cn, mergeProps } from "@pinfold/core";
+function slotProps(overrides, slot, base) {
+  var _a, _b, _c;
+  if (!overrides) return base;
+  const extraClass = (_a = overrides.classNames) == null ? void 0 : _a[slot];
+  const extraStyle = (_b = overrides.styles) == null ? void 0 : _b[slot];
+  let next = base;
+  if (extraClass) next = { ...next, className: cn(next.className, extraClass) };
+  if (extraStyle) next = { ...next, style: { ...next.style, ...extraStyle } };
+  return mergeProps(next, (_c = overrides.slotProps) == null ? void 0 : _c[slot]);
+}
+function renderSlot(overrides, slot, props, state, children, defaultRender) {
+  var _a;
+  const custom = (_a = overrides == null ? void 0 : overrides.render) == null ? void 0 : _a[slot];
+  if (custom) return custom({ props, state, children });
+  return defaultRender(props, children);
+}
+
+// src/component.tsx
+import * as React from "react";
+function usePinfoldComponent(displayName, api, render, buildParts) {
+  const renderRef = React.useRef(render);
+  renderRef.current = render;
+  const ref = React.useRef(null);
+  if (ref.current === null) {
+    const store2 = { version: 0, listeners: /* @__PURE__ */ new Set() };
+    const subscribe = (listener) => {
+      store2.listeners.add(listener);
+      return () => {
+        store2.listeners.delete(listener);
+      };
+    };
+    const snapshot = () => store2.version;
+    const useFresh = () => React.useSyncExternalStore(subscribe, snapshot, snapshot);
+    const Component2 = ((props) => {
+      useFresh();
+      return renderRef.current(props);
+    });
+    Component2.displayName = displayName;
+    const parts = buildParts ? buildParts() : {};
+    for (const key of Object.keys(parts)) {
+      const part = parts[key];
+      const Live = (props) => {
+        useFresh();
+        return part(props);
+      };
+      Live.displayName = `${displayName}.${key}`;
+      Component2[key] = Live;
+    }
+    ref.current = { store: store2, Component: Component2 };
+  }
+  const { store, Component } = ref.current;
+  store.version++;
+  useIsomorphicLayoutEffect(() => {
+    store.listeners.forEach((listener) => listener());
+  });
+  return Object.assign(Component, api, { displayName });
+}
+
+export {
+  slotProps,
+  renderSlot,
+  usePinfoldComponent
+};

package/dist/chunk-DQWSDHRY.cjs

@@ -0,0 +1,71 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }'use client';
+
+
+var _chunkVPKVOJHAcjs = require('./chunk-VPKVOJHA.cjs');
+
+// src/slots.ts
+var _core = require('@pinfold/core');
+function slotProps(overrides, slot, base) {
+  var _a, _b, _c;
+  if (!overrides) return base;
+  const extraClass = (_a = overrides.classNames) == null ? void 0 : _a[slot];
+  const extraStyle = (_b = overrides.styles) == null ? void 0 : _b[slot];
+  let next = base;
+  if (extraClass) next = { ...next, className: _core.cn.call(void 0, next.className, extraClass) };
+  if (extraStyle) next = { ...next, style: { ...next.style, ...extraStyle } };
+  return _core.mergeProps.call(void 0, next, (_c = overrides.slotProps) == null ? void 0 : _c[slot]);
+}
+function renderSlot(overrides, slot, props, state, children, defaultRender) {
+  var _a;
+  const custom = (_a = overrides == null ? void 0 : overrides.render) == null ? void 0 : _a[slot];
+  if (custom) return custom({ props, state, children });
+  return defaultRender(props, children);
+}
+
+// src/component.tsx
+var _react = require('react'); var React = _interopRequireWildcard(_react);
+function usePinfoldComponent(displayName, api, render, buildParts) {
+  const renderRef = React.useRef(render);
+  renderRef.current = render;
+  const ref = React.useRef(null);
+  if (ref.current === null) {
+    const store2 = { version: 0, listeners: /* @__PURE__ */ new Set() };
+    const subscribe = (listener) => {
+      store2.listeners.add(listener);
+      return () => {
+        store2.listeners.delete(listener);
+      };
+    };
+    const snapshot = () => store2.version;
+    const useFresh = () => React.useSyncExternalStore(subscribe, snapshot, snapshot);
+    const Component2 = ((props) => {
+      useFresh();
+      return renderRef.current(props);
+    });
+    Component2.displayName = displayName;
+    const parts = buildParts ? buildParts() : {};
+    for (const key of Object.keys(parts)) {
+      const part = parts[key];
+      const Live = (props) => {
+        useFresh();
+        return part(props);
+      };
+      Live.displayName = `${displayName}.${key}`;
+      Component2[key] = Live;
+    }
+    ref.current = { store: store2, Component: Component2 };
+  }
+  const { store, Component } = ref.current;
+  store.version++;
+  _chunkVPKVOJHAcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+    store.listeners.forEach((listener) => listener());
+  });
+  return Object.assign(Component, api, { displayName });
+}
+
+
+
+
+
+exports.slotProps = slotProps; exports.renderSlot = renderSlot; exports.usePinfoldComponent = usePinfoldComponent;

package/dist/chunk-Q232PTPW.js

@@ -0,0 +1,115 @@
+'use client';
+
+// src/hooks.ts
+import * as React from "react";
+var useIsomorphicLayoutEffect = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
+function useId2(provided) {
+  const generated = React.useId();
+  return provided || "pinfold-" + generated.replace(/[^\w-]/g, "");
+}
+function useEvent(fn) {
+  const ref = React.useRef(fn);
+  useIsomorphicLayoutEffect(() => {
+    ref.current = fn;
+  });
+  return React.useCallback(((...args) => ref.current(...args)), []);
+}
+function useControllableState({
+  value,
+  defaultValue,
+  onChange
+}) {
+  const [uncontrolled, setUncontrolled] = React.useState(defaultValue);
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : uncontrolled;
+  const currentRef = React.useRef(current);
+  currentRef.current = current;
+  const setValue = useEvent((next) => {
+    const resolved = typeof next === "function" ? next(currentRef.current) : next;
+    if (Object.is(resolved, currentRef.current)) return;
+    if (!isControlled) setUncontrolled(resolved);
+    onChange == null ? void 0 : onChange(resolved);
+  });
+  return [current, setValue];
+}
+
+// src/provider.tsx
+import * as React2 from "react";
+var DEFAULTS = {
+  theme: "system",
+  radius: "md",
+  dir: "ltr",
+  size: "md",
+  tone: "primary",
+  stylePack: "default",
+  lazy: "auto",
+  disableAnimation: false,
+  defaults: {}
+};
+var PinfoldContext = React2.createContext(DEFAULTS);
+function usePinfold() {
+  return React2.useContext(PinfoldContext);
+}
+function PinfoldProvider(props) {
+  const { children, applyToDocument = false, className, config, ...own } = props;
+  const parent = React2.useContext(PinfoldContext);
+  const overrides = { ...stripUndefined(config != null ? config : {}), ...stripUndefined(own) };
+  const value = React2.useMemo(
+    () => ({ ...parent, ...overrides, defaults: mergeDefaults(parent.defaults, overrides.defaults) }),
+    // Keyed on the serialised overrides: configs are plain data, and inline objects must not bust the memo.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [parent, stableKey(overrides)]
+  );
+  useIsomorphicLayoutEffect(() => {
+    if (!applyToDocument) return;
+    const el = document.documentElement;
+    const attrs = [
+      ["data-pinfold-theme", value.theme === "system" ? null : value.theme],
+      ["data-pinfold-radius", value.radius],
+      ["data-pinfold-style", value.stylePack === "default" ? null : value.stylePack]
+    ];
+    const previous = attrs.map(([name]) => el.getAttribute(name));
+    attrs.forEach(([name, v]) => restore(el, name, v));
+    return () => attrs.forEach(([name], i) => restore(el, name, previous[i]));
+  }, [applyToDocument, value.theme, value.radius, value.stylePack]);
+  const body = applyToDocument ? children : /* @__PURE__ */ React2.createElement(
+    "div",
+    {
+      className: className ? "pinfold " + className : "pinfold",
+      dir: value.dir,
+      "data-pinfold-theme": value.theme === "system" ? void 0 : value.theme,
+      "data-pinfold-radius": value.radius,
+      "data-pinfold-style": value.stylePack === "default" ? void 0 : value.stylePack
+    },
+    children
+  );
+  return /* @__PURE__ */ React2.createElement(PinfoldContext.Provider, { value }, body);
+}
+function mergeDefaults(parent, own) {
+  if (!own) return parent;
+  const out = { ...parent };
+  for (const key in own) out[key] = { ...parent[key], ...own[key] };
+  return out;
+}
+function stableKey(obj) {
+  let fn = 0;
+  return JSON.stringify(obj, (_, v) => typeof v === "function" ? `fn${fn++}` : v);
+}
+function restore(el, attr, v) {
+  if (v == null) el.removeAttribute(attr);
+  else el.setAttribute(attr, v);
+}
+function stripUndefined(obj) {
+  const out = {};
+  for (const k in obj) if (obj[k] !== void 0) out[k] = obj[k];
+  return out;
+}
+
+export {
+  useIsomorphicLayoutEffect,
+  useId2 as useId,
+  useEvent,
+  useControllableState,
+  usePinfold,
+  PinfoldProvider
+};

package/dist/chunk-RJPT3NTP.cjs

@@ -0,0 +1,62 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }'use client';
+
+
+var _chunkVPKVOJHAcjs = require('./chunk-VPKVOJHA.cjs');
+
+// src/lazy.tsx
+var _react = require('react'); var React = _interopRequireWildcard(_react);
+function createLazyComponent(loader, options = {}) {
+  var _a, _b;
+  const Lazy = React.lazy(loader);
+  const fallback = (_a = options.fallback) != null ? _a : null;
+  const Wrapped = (props) => {
+    var _a2, _b2;
+    const ctx = _chunkVPKVOJHAcjs.usePinfold.call(void 0, );
+    const preferred = (_a2 = props.lazy) != null ? _a2 : ctx.lazy;
+    const strategy = preferred === "auto" ? (_b2 = options.auto) != null ? _b2 : "eager" : preferred;
+    const [ready, setReady] = React.useState(strategy === "eager");
+    const placeholder = React.useRef(null);
+    React.useEffect(() => {
+      if (ready) return;
+      if (strategy === "idle") {
+        const w = window;
+        if (w.requestIdleCallback) {
+          const id2 = w.requestIdleCallback(() => setReady(true));
+          return () => {
+            var _a3;
+            return (_a3 = w.cancelIdleCallback) == null ? void 0 : _a3.call(w, id2);
+          };
+        }
+        const id = setTimeout(() => setReady(true), 200);
+        return () => clearTimeout(id);
+      }
+      const el = placeholder.current;
+      if (!el || typeof IntersectionObserver === "undefined") {
+        setReady(true);
+        return;
+      }
+      const observer = new IntersectionObserver(
+        (entries) => {
+          if (entries.some((e) => e.isIntersecting)) {
+            setReady(true);
+            observer.disconnect();
+          }
+        },
+        { rootMargin: "200px" }
+      );
+      observer.observe(el);
+      return () => observer.disconnect();
+    }, [ready, strategy]);
+    if (!ready) {
+      return /* @__PURE__ */ React.createElement("div", { ref: placeholder, "data-pinfold-lazy": "", style: { minHeight: 1 } }, fallback);
+    }
+    return /* @__PURE__ */ React.createElement(React.Suspense, { fallback }, React.createElement(Lazy, props));
+  };
+  Wrapped.displayName = (_b = options.displayName) != null ? _b : "PinfoldLazy";
+  return Wrapped;
+}
+
+
+
+exports.createLazyComponent = createLazyComponent;

package/dist/chunk-VPKVOJHA.cjs

@@ -0,0 +1,116 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }'use client';
+
+// src/hooks.ts
+var _react = require('react'); var React = _interopRequireWildcard(_react); var React2 = _interopRequireWildcard(_react);
+var useIsomorphicLayoutEffect = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
+function useId2(provided) {
+  const generated = React.useId();
+  return provided || "pinfold-" + generated.replace(/[^\w-]/g, "");
+}
+function useEvent(fn) {
+  const ref = React.useRef(fn);
+  useIsomorphicLayoutEffect(() => {
+    ref.current = fn;
+  });
+  return React.useCallback(((...args) => ref.current(...args)), []);
+}
+function useControllableState({
+  value,
+  defaultValue,
+  onChange
+}) {
+  const [uncontrolled, setUncontrolled] = React.useState(defaultValue);
+  const isControlled = value !== void 0;
+  const current = isControlled ? value : uncontrolled;
+  const currentRef = React.useRef(current);
+  currentRef.current = current;
+  const setValue = useEvent((next) => {
+    const resolved = typeof next === "function" ? next(currentRef.current) : next;
+    if (Object.is(resolved, currentRef.current)) return;
+    if (!isControlled) setUncontrolled(resolved);
+    onChange == null ? void 0 : onChange(resolved);
+  });
+  return [current, setValue];
+}
+
+// src/provider.tsx
+
+var DEFAULTS = {
+  theme: "system",
+  radius: "md",
+  dir: "ltr",
+  size: "md",
+  tone: "primary",
+  stylePack: "default",
+  lazy: "auto",
+  disableAnimation: false,
+  defaults: {}
+};
+var PinfoldContext = React2.createContext(DEFAULTS);
+function usePinfold() {
+  return React2.useContext(PinfoldContext);
+}
+function PinfoldProvider(props) {
+  const { children, applyToDocument = false, className, config, ...own } = props;
+  const parent = React2.useContext(PinfoldContext);
+  const overrides = { ...stripUndefined(config != null ? config : {}), ...stripUndefined(own) };
+  const value = React2.useMemo(
+    () => ({ ...parent, ...overrides, defaults: mergeDefaults(parent.defaults, overrides.defaults) }),
+    // Keyed on the serialised overrides: configs are plain data, and inline objects must not bust the memo.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [parent, stableKey(overrides)]
+  );
+  useIsomorphicLayoutEffect(() => {
+    if (!applyToDocument) return;
+    const el = document.documentElement;
+    const attrs = [
+      ["data-pinfold-theme", value.theme === "system" ? null : value.theme],
+      ["data-pinfold-radius", value.radius],
+      ["data-pinfold-style", value.stylePack === "default" ? null : value.stylePack]
+    ];
+    const previous = attrs.map(([name]) => el.getAttribute(name));
+    attrs.forEach(([name, v]) => restore(el, name, v));
+    return () => attrs.forEach(([name], i) => restore(el, name, previous[i]));
+  }, [applyToDocument, value.theme, value.radius, value.stylePack]);
+  const body = applyToDocument ? children : /* @__PURE__ */ React2.createElement(
+    "div",
+    {
+      className: className ? "pinfold " + className : "pinfold",
+      dir: value.dir,
+      "data-pinfold-theme": value.theme === "system" ? void 0 : value.theme,
+      "data-pinfold-radius": value.radius,
+      "data-pinfold-style": value.stylePack === "default" ? void 0 : value.stylePack
+    },
+    children
+  );
+  return /* @__PURE__ */ React2.createElement(PinfoldContext.Provider, { value }, body);
+}
+function mergeDefaults(parent, own) {
+  if (!own) return parent;
+  const out = { ...parent };
+  for (const key in own) out[key] = { ...parent[key], ...own[key] };
+  return out;
+}
+function stableKey(obj) {
+  let fn = 0;
+  return JSON.stringify(obj, (_, v) => typeof v === "function" ? `fn${fn++}` : v);
+}
+function restore(el, attr, v) {
+  if (v == null) el.removeAttribute(attr);
+  else el.setAttribute(attr, v);
+}
+function stripUndefined(obj) {
+  const out = {};
+  for (const k in obj) if (obj[k] !== void 0) out[k] = obj[k];
+  return out;
+}
+
+
+
+
+
+
+
+
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect; exports.useId = useId2; exports.useEvent = useEvent; exports.useControllableState = useControllableState; exports.usePinfold = usePinfold; exports.PinfoldProvider = PinfoldProvider;

package/dist/client.cjs

@@ -0,0 +1,30 @@
+"use client";
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});'use client';
+
+
+
+
+var _chunkDQWSDHRYcjs = require('./chunk-DQWSDHRY.cjs');
+
+
+var _chunkRJPT3NTPcjs = require('./chunk-RJPT3NTP.cjs');
+
+
+
+
+
+
+
+var _chunkVPKVOJHAcjs = require('./chunk-VPKVOJHA.cjs');
+
+
+
+
+
+
+
+
+
+
+
+exports.PinfoldProvider = _chunkVPKVOJHAcjs.PinfoldProvider; exports.createLazyComponent = _chunkRJPT3NTPcjs.createLazyComponent; exports.renderSlot = _chunkDQWSDHRYcjs.renderSlot; exports.slotProps = _chunkDQWSDHRYcjs.slotProps; exports.useControllableState = _chunkVPKVOJHAcjs.useControllableState; exports.useEvent = _chunkVPKVOJHAcjs.useEvent; exports.useId = _chunkVPKVOJHAcjs.useId; exports.useIsomorphicLayoutEffect = _chunkVPKVOJHAcjs.useIsomorphicLayoutEffect; exports.usePinfold = _chunkVPKVOJHAcjs.usePinfold; exports.usePinfoldComponent = _chunkDQWSDHRYcjs.usePinfoldComponent;