@process.co/ui 0.0.22 → 0.0.23

package/dist/components/slots/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var React3 = require('react');
+var React4 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 require('react-dom');
 
@@ -22,7 +22,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -1064,6 +1064,7 @@ var require_package = __commonJS({
     };
   }
 });
+var DevContext = React4.createContext(null);
 
 // src/components/slots/SlotElements.tsx
 var SlotElements = (props) => {
@@ -1102,10 +1103,10 @@ function composeRefs(...refs) {
   };
 }
 function useComposedRefs(...refs) {
-  return React3__namespace.useCallback(composeRefs(...refs), refs);
+  return React4__namespace.useCallback(composeRefs(...refs), refs);
 }
 var REACT_LAZY_TYPE = Symbol.for("react.lazy");
-var use = React3__namespace[" use ".trim().toString()];
+var use = React4__namespace[" use ".trim().toString()];
 function isPromiseLike(value) {
   return typeof value === "object" && value !== null && "then" in value;
 }
@@ -1115,24 +1116,24 @@ function isLazyComponent(element) {
 // @__NO_SIDE_EFFECTS__
 function createSlot(ownerName) {
   const SlotClone = /* @__PURE__ */ createSlotClone(ownerName);
-  const Slot2 = React3__namespace.forwardRef((props, forwardedRef) => {
+  const Slot2 = React4__namespace.forwardRef((props, forwardedRef) => {
     let { children, ...slotProps } = props;
     if (isLazyComponent(children) && typeof use === "function") {
       children = use(children._payload);
     }
-    const childrenArray = React3__namespace.Children.toArray(children);
+    const childrenArray = React4__namespace.Children.toArray(children);
     const slottable = childrenArray.find(isSlottable);
     if (slottable) {
       const newElement = slottable.props.children;
       const newChildren = childrenArray.map((child) => {
         if (child === slottable) {
-          if (React3__namespace.Children.count(newElement) > 1) return React3__namespace.Children.only(null);
-          return React3__namespace.isValidElement(newElement) ? newElement.props.children : null;
+          if (React4__namespace.Children.count(newElement) > 1) return React4__namespace.Children.only(null);
+          return React4__namespace.isValidElement(newElement) ? newElement.props.children : null;
         } else {
           return child;
         }
       });
-      return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: React3__namespace.isValidElement(newElement) ? React3__namespace.cloneElement(newElement, void 0, newChildren) : null });
+      return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: React4__namespace.isValidElement(newElement) ? React4__namespace.cloneElement(newElement, void 0, newChildren) : null });
     }
     return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children });
   });
@@ -1142,27 +1143,27 @@ function createSlot(ownerName) {
 var Slot = /* @__PURE__ */ createSlot("Slot");
 // @__NO_SIDE_EFFECTS__
 function createSlotClone(ownerName) {
-  const SlotClone = React3__namespace.forwardRef((props, forwardedRef) => {
+  const SlotClone = React4__namespace.forwardRef((props, forwardedRef) => {
     let { children, ...slotProps } = props;
     if (isLazyComponent(children) && typeof use === "function") {
       children = use(children._payload);
     }
-    if (React3__namespace.isValidElement(children)) {
+    if (React4__namespace.isValidElement(children)) {
       const childrenRef = getElementRef(children);
       const props2 = mergeProps(slotProps, children.props);
-      if (children.type !== React3__namespace.Fragment) {
+      if (children.type !== React4__namespace.Fragment) {
         props2.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
       }
-      return React3__namespace.cloneElement(children, props2);
+      return React4__namespace.cloneElement(children, props2);
     }
-    return React3__namespace.Children.count(children) > 1 ? React3__namespace.Children.only(null) : null;
+    return React4__namespace.Children.count(children) > 1 ? React4__namespace.Children.only(null) : null;
   });
   SlotClone.displayName = `${ownerName}.SlotClone`;
   return SlotClone;
 }
 var SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
 function isSlottable(child) {
-  return React3__namespace.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER;
+  return React4__namespace.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER;
 }
 function mergeProps(slotProps, childProps) {
   const overrideProps = { ...childProps };
@@ -4309,7 +4310,7 @@ function Button({
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ React3__namespace.createElement(
+  return /* @__PURE__ */ React4__namespace.createElement(
     Comp,
     {
       "data-slot": "button",
@@ -4335,32 +4336,32 @@ function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForD
 function createContextScope(scopeName, createContextScopeDeps = []) {
   let defaultContexts = [];
   function createContext3(rootComponentName, defaultContext) {
-    const BaseContext = React3__namespace.createContext(defaultContext);
+    const BaseContext = React4__namespace.createContext(defaultContext);
     const index = defaultContexts.length;
     defaultContexts = [...defaultContexts, defaultContext];
     const Provider = (props) => {
       const { scope, children, ...context } = props;
       const Context = scope?.[scopeName]?.[index] || BaseContext;
-      const value = React3__namespace.useMemo(() => context, Object.values(context));
+      const value = React4__namespace.useMemo(() => context, Object.values(context));
       return /* @__PURE__ */ jsxRuntime.jsx(Context.Provider, { value, children });
     };
     Provider.displayName = rootComponentName + "Provider";
-    function useContext2(consumerName, scope) {
+    function useContext22(consumerName, scope) {
       const Context = scope?.[scopeName]?.[index] || BaseContext;
-      const context = React3__namespace.useContext(Context);
+      const context = React4__namespace.useContext(Context);
       if (context) return context;
       if (defaultContext !== void 0) return defaultContext;
       throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
     }
-    return [Provider, useContext2];
+    return [Provider, useContext22];
   }
   const createScope = () => {
     const scopeContexts = defaultContexts.map((defaultContext) => {
-      return React3__namespace.createContext(defaultContext);
+      return React4__namespace.createContext(defaultContext);
     });
     return function useScope(scope) {
       const contexts = scope?.[scopeName] || scopeContexts;
-      return React3__namespace.useMemo(
+      return React4__namespace.useMemo(
         () => ({ [`__scope${scopeName}`]: { ...scope, [scopeName]: contexts } }),
         [scope, contexts]
       );
@@ -4383,15 +4384,15 @@ function composeContextScopes(...scopes) {
         const currentScope = scopeProps[`__scope${scopeName}`];
         return { ...nextScopes2, ...currentScope };
       }, {});
-      return React3__namespace.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
+      return React4__namespace.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
     };
   };
   createScope.scopeName = baseScope.scopeName;
   return createScope;
 }
-var useLayoutEffect2 = globalThis?.document ? React3__namespace.useLayoutEffect : () => {
+var useLayoutEffect2 = globalThis?.document ? React4__namespace.useLayoutEffect : () => {
 };
-var useInsertionEffect = React3__namespace[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
+var useInsertionEffect = React4__namespace[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
 function useControllableState({
   prop,
   defaultProp,
@@ -4406,8 +4407,8 @@ function useControllableState({
   const isControlled = prop !== void 0;
   const value = isControlled ? prop : uncontrolledProp;
   {
-    const isControlledRef = React3__namespace.useRef(prop !== void 0);
-    React3__namespace.useEffect(() => {
+    const isControlledRef = React4__namespace.useRef(prop !== void 0);
+    React4__namespace.useEffect(() => {
       const wasControlled = isControlledRef.current;
       if (wasControlled !== isControlled) {
         const from = wasControlled ? "controlled" : "uncontrolled";
@@ -4419,7 +4420,7 @@ function useControllableState({
       isControlledRef.current = isControlled;
     }, [isControlled, caller]);
   }
-  const setValue = React3__namespace.useCallback(
+  const setValue = React4__namespace.useCallback(
     (nextValue) => {
       if (isControlled) {
         const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
@@ -4438,13 +4439,13 @@ function useUncontrolledState({
   defaultProp,
   onChange: onChange2
 }) {
-  const [value, setValue] = React3__namespace.useState(defaultProp);
-  const prevValueRef = React3__namespace.useRef(value);
-  const onChangeRef = React3__namespace.useRef(onChange2);
+  const [value, setValue] = React4__namespace.useState(defaultProp);
+  const prevValueRef = React4__namespace.useRef(value);
+  const onChangeRef = React4__namespace.useRef(onChange2);
   useInsertionEffect(() => {
     onChangeRef.current = onChange2;
   }, [onChange2]);
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     if (prevValueRef.current !== value) {
       onChangeRef.current?.(value);
       prevValueRef.current = value;
@@ -4456,8 +4457,8 @@ function isFunction(value) {
   return typeof value === "function";
 }
 function usePrevious(value) {
-  const ref = React3__namespace.useRef({ value, previous: value });
-  return React3__namespace.useMemo(() => {
+  const ref = React4__namespace.useRef({ value, previous: value });
+  return React4__namespace.useMemo(() => {
     if (ref.current.value !== value) {
       ref.current.previous = ref.current.value;
       ref.current.value = value;
@@ -4466,7 +4467,7 @@ function usePrevious(value) {
   }, [value]);
 }
 function useSize(element) {
-  const [size, setSize] = React3__namespace.useState(void 0);
+  const [size, setSize] = React4__namespace.useState(void 0);
   useLayoutEffect2(() => {
     if (element) {
       setSize({ width: element.offsetWidth, height: element.offsetHeight });
@@ -4502,21 +4503,21 @@ function useSize(element) {
 // @__NO_SIDE_EFFECTS__
 function createSlot2(ownerName) {
   const SlotClone = /* @__PURE__ */ createSlotClone2(ownerName);
-  const Slot2 = React3__namespace.forwardRef((props, forwardedRef) => {
+  const Slot2 = React4__namespace.forwardRef((props, forwardedRef) => {
     const { children, ...slotProps } = props;
-    const childrenArray = React3__namespace.Children.toArray(children);
+    const childrenArray = React4__namespace.Children.toArray(children);
     const slottable = childrenArray.find(isSlottable2);
     if (slottable) {
       const newElement = slottable.props.children;
       const newChildren = childrenArray.map((child) => {
         if (child === slottable) {
-          if (React3__namespace.Children.count(newElement) > 1) return React3__namespace.Children.only(null);
-          return React3__namespace.isValidElement(newElement) ? newElement.props.children : null;
+          if (React4__namespace.Children.count(newElement) > 1) return React4__namespace.Children.only(null);
+          return React4__namespace.isValidElement(newElement) ? newElement.props.children : null;
         } else {
           return child;
         }
       });
-      return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: React3__namespace.isValidElement(newElement) ? React3__namespace.cloneElement(newElement, void 0, newChildren) : null });
+      return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children: React4__namespace.isValidElement(newElement) ? React4__namespace.cloneElement(newElement, void 0, newChildren) : null });
     }
     return /* @__PURE__ */ jsxRuntime.jsx(SlotClone, { ...slotProps, ref: forwardedRef, children });
   });
@@ -4525,24 +4526,24 @@ function createSlot2(ownerName) {
 }
 // @__NO_SIDE_EFFECTS__
 function createSlotClone2(ownerName) {
-  const SlotClone = React3__namespace.forwardRef((props, forwardedRef) => {
+  const SlotClone = React4__namespace.forwardRef((props, forwardedRef) => {
     const { children, ...slotProps } = props;
-    if (React3__namespace.isValidElement(children)) {
+    if (React4__namespace.isValidElement(children)) {
       const childrenRef = getElementRef2(children);
       const props2 = mergeProps2(slotProps, children.props);
-      if (children.type !== React3__namespace.Fragment) {
+      if (children.type !== React4__namespace.Fragment) {
         props2.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
       }
-      return React3__namespace.cloneElement(children, props2);
+      return React4__namespace.cloneElement(children, props2);
     }
-    return React3__namespace.Children.count(children) > 1 ? React3__namespace.Children.only(null) : null;
+    return React4__namespace.Children.count(children) > 1 ? React4__namespace.Children.only(null) : null;
   });
   SlotClone.displayName = `${ownerName}.SlotClone`;
   return SlotClone;
 }
 var SLOTTABLE_IDENTIFIER2 = Symbol("radix.slottable");
 function isSlottable2(child) {
-  return React3__namespace.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER2;
+  return React4__namespace.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER2;
 }
 function mergeProps2(slotProps, childProps) {
   const overrideProps = { ...childProps };
@@ -4602,7 +4603,7 @@ var NODES = [
 ];
 var Primitive = NODES.reduce((primitive, node) => {
   const Slot2 = createSlot2(`Primitive.${node}`);
-  const Node2 = React3__namespace.forwardRef((props, forwardedRef) => {
+  const Node2 = React4__namespace.forwardRef((props, forwardedRef) => {
     const { asChild, ...primitiveProps } = props;
     const Comp = asChild ? Slot2 : node;
     if (typeof window !== "undefined") {
@@ -4616,7 +4617,7 @@ var Primitive = NODES.reduce((primitive, node) => {
 var SWITCH_NAME = "Switch";
 var [createSwitchContext] = createContextScope(SWITCH_NAME);
 var [SwitchProvider, useSwitchContext] = createSwitchContext(SWITCH_NAME);
-var Switch = React3__namespace.forwardRef(
+var Switch = React4__namespace.forwardRef(
   (props, forwardedRef) => {
     const {
       __scopeSwitch,
@@ -4630,9 +4631,9 @@ var Switch = React3__namespace.forwardRef(
       form,
       ...switchProps
     } = props;
-    const [button, setButton] = React3__namespace.useState(null);
+    const [button, setButton] = React4__namespace.useState(null);
     const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));
-    const hasConsumerStoppedPropagationRef = React3__namespace.useRef(false);
+    const hasConsumerStoppedPropagationRef = React4__namespace.useRef(false);
     const isFormControl = button ? form || !!button.closest("form") : true;
     const [checked, setChecked] = useControllableState({
       prop: checkedProp,
@@ -4682,7 +4683,7 @@ var Switch = React3__namespace.forwardRef(
 );
 Switch.displayName = SWITCH_NAME;
 var THUMB_NAME = "SwitchThumb";
-var SwitchThumb = React3__namespace.forwardRef(
+var SwitchThumb = React4__namespace.forwardRef(
   (props, forwardedRef) => {
     const { __scopeSwitch, ...thumbProps } = props;
     const context = useSwitchContext(THUMB_NAME, __scopeSwitch);
@@ -4699,7 +4700,7 @@ var SwitchThumb = React3__namespace.forwardRef(
 );
 SwitchThumb.displayName = THUMB_NAME;
 var BUBBLE_INPUT_NAME = "SwitchBubbleInput";
-var SwitchBubbleInput = React3__namespace.forwardRef(
+var SwitchBubbleInput = React4__namespace.forwardRef(
   ({
     __scopeSwitch,
     control,
@@ -4707,11 +4708,11 @@ var SwitchBubbleInput = React3__namespace.forwardRef(
     bubbles = true,
     ...props
   }, forwardedRef) => {
-    const ref = React3__namespace.useRef(null);
+    const ref = React4__namespace.useRef(null);
     const composedRefs = useComposedRefs(ref, forwardedRef);
     const prevChecked = usePrevious(checked);
     const controlSize = useSize(control);
-    React3__namespace.useEffect(() => {
+    React4__namespace.useEffect(() => {
       const input = ref.current;
       if (!input) return;
       const inputProto = window.HTMLInputElement.prototype;
@@ -4792,14 +4793,14 @@ var switchThumbVariants = cva(
   }
 );
 function Switch2({ className, size, ...props }) {
-  return /* @__PURE__ */ React3__namespace.createElement(
+  return /* @__PURE__ */ React4__namespace.createElement(
     Root,
     {
       "data-slot": "switch",
       className: cn(switchRootVariants({ size }), className),
       ...props
     },
-    /* @__PURE__ */ React3__namespace.createElement(
+    /* @__PURE__ */ React4__namespace.createElement(
       Thumb,
       {
         "data-slot": "switch-thumb",
@@ -7924,7 +7925,7 @@ var defaultProps = {
   swapOpacity: false,
   widthAuto: false
 };
-var FontAwesomeIcon = /* @__PURE__ */ React3__namespace.default.forwardRef(function(props, ref) {
+var FontAwesomeIcon = /* @__PURE__ */ React4__namespace.default.forwardRef(function(props, ref) {
   var allProps = _objectSpread22(_objectSpread22({}, defaultProps), props);
   var iconArgs = allProps.icon, maskArgs = allProps.mask, symbol = allProps.symbol, className = allProps.className, title = allProps.title, titleId = allProps.titleId, maskId = allProps.maskId;
   var iconLookup = normalizeIconArgs(iconArgs);
@@ -7985,7 +7986,7 @@ FontAwesomeIcon.propTypes = {
   swapOpacity: import_prop_types.default.bool,
   widthAuto: import_prop_types.default.bool
 };
-var convertCurry = convert.bind(null, React3__namespace.default.createElement);
+var convertCurry = convert.bind(null, React4__namespace.default.createElement);
 
 // ../../node_modules/.pnpm/@fortawesome+pro-solid-svg-icons@6.7.2/node_modules/@fortawesome/pro-solid-svg-icons/index.mjs
 var faGripVertical = {
@@ -8010,6 +8011,18 @@ var SlotDragHandle = (props) => {
   const { slotId } = props;
   return /* @__PURE__ */ React.createElement("div", { className: "uii:cursor-grab" }, /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: faGripVertical }));
 };
+
+// src/components/slots/index.tsx
+function useSlotContext(slotId) {
+  const devContext = React4.useContext(DevContext);
+  const [activeSlotId, setActiveSlotId] = React4.useState(void 0);
+  React4.useEffect(() => {
+    if (devContext) {
+      setActiveSlotId(devContext.activeSlotId ?? void 0);
+    }
+  }, [devContext, slotId]);
+  return { active: (activeSlotId ?? "") === slotId, enabled: true };
+}
 /*! Bundled license information:
 
 react-is/cjs/react-is.production.min.js:
@@ -8059,5 +8072,6 @@ exports.SlotDelete = SlotDelete;
 exports.SlotDragHandle = SlotDragHandle;
 exports.SlotElements = SlotElements;
 exports.SlotEnable = SlotEnable;
+exports.useSlotContext = useSlotContext;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map