components-test-pb 0.2.6 → 0.2.7

package/dist/components/index.d.ts

@@ -1,4 +1 @@
-export type { ButtonSlots, ButtonAppearance, ButtonShape, ButtonSize, ButtonProps, ButtonState, } from './Button/src';
-export { Button, useButton, renderButton, useButtonStyles, buttonClassNames, } from './Button/src';
-export type { TextSlots, TextProps, TextState, } from './Text';
-export { Text, useText, renderText, useTextStyles, textClassNames, } from './Text';
+export * from './src';

package/dist/components/index.js

@@ -1,3 +1 @@
-// <Button />
-export { Button, useButton, renderButton, useButtonStyles, buttonClassNames, } from './Button/src';
-export { Text, useText, renderText, useTextStyles, textClassNames, } from './Text';
+export * from './src';

package/dist/components/src/Button/Button.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from 'jsx-framework-test-pb';
+import type { ButtonProps } from './Button.types';
+export declare const Button: FC<ButtonProps>;

package/dist/components/{Button/src → src/Button}/Button.js

@@ -1,8 +1,6 @@
 import { useButton } from './useButton';
-import { useButtonStyles } from './useButtonStyles.styles';
 import { renderButton } from './renderButton';
 export const Button = (props) => {
     const state = useButton(props);
-    useButtonStyles(state);
     return renderButton(state);
 };

package/dist/components/src/Button/Button.types.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentProps, ComponentState, Slot } from '../../../utilities';
+export type ButtonSlots = {
+    root: NonNullable<Slot<'a'>>;
+};
+export type ButtonProps = ComponentProps<ButtonSlots> & {
+    appearance?: 'primary' | 'secondary' | 'ghost';
+    disabled?: boolean;
+    shape?: 'rounded' | 'circular' | 'square';
+    size?: 'small' | 'medium' | 'large';
+};
+export type ButtonState = ComponentState<ButtonSlots> & Required<Pick<ButtonProps, 'appearance' | 'disabled' | 'shape' | 'size'>>;

package/dist/components/src/Button/index.d.ts

@@ -0,0 +1,5 @@
+export { Button } from './Button';
+export type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';
+export { renderButton } from './renderButton';
+export { useButton } from './useButton';
+export { buttonClassNames, useButtonStyles } from './useButtonStyles.styles';

package/dist/components/{Button/src → src/Button}/index.js

@@ -1,4 +1,4 @@
 export { Button } from './Button';
-export { useButton } from './useButton';
 export { renderButton } from './renderButton';
-export { useButtonStyles, buttonClassNames } from './useButtonStyles.styles';
+export { useButton } from './useButton';
+export { buttonClassNames, useButtonStyles } from './useButtonStyles.styles';

package/dist/components/{Button/src → src/Button}/renderButton.d.ts

@@ -1,3 +1,3 @@
-import type { JSXElement } from '../../../utilities/src';
+import type { JSXElement } from '../../../utilities';
 import type { ButtonState } from './Button.types';
 export declare const renderButton: (state: ButtonState) => JSXElement;

package/dist/components/{Button/src → src/Button}/renderButton.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "jsx-framework-test-pb/jsx-runtime";
-import { assertSlots } from '../../../utilities/src';
+import { assertSlots } from '../../../utilities';
 export const renderButton = (state) => {
     assertSlots(state);
     return (_jsx(state.root, { children: state.root.children }));

package/dist/components/src/Button/useButton.js

@@ -0,0 +1,15 @@
+import { getIntrinsicElementProps, slot } from '../../../utilities';
+export const useButton = (props) => {
+    const { appearance, disabled, shape, size } = props;
+    const state = {
+        appearance: appearance ?? 'secondary',
+        disabled: disabled ?? false,
+        shape: shape ?? 'rounded',
+        size: size ?? 'medium',
+        components: { root: 'a' },
+        root: slot.always(getIntrinsicElementProps('a', {
+            ...props
+        }), { elementType: 'a' }),
+    };
+    return state;
+};

package/dist/components/{Button/src → src/Button}/useButtonStyles.styles.d.ts

@@ -1,4 +1,4 @@
-import { SlotClassNames } from '../../../utilities';
-import { ButtonSlots, ButtonState } from './Button.types';
+import type { SlotClassNames } from '../../../utilities';
+import type { ButtonSlots, ButtonState } from './Button.types';
 export declare const buttonClassNames: SlotClassNames<ButtonSlots>;
 export declare const useButtonStyles: (state: ButtonState) => ButtonState;

package/dist/components/src/Button/useButtonStyles.styles.js

@@ -0,0 +1,31 @@
+import { makeResetStyles, makeStyles, mergeClasses } from 'css-engine-test-pb';
+import { textClassNames } from '../Text';
+export const buttonClassNames = {
+    root: 'c-button'
+};
+const useResetStyles = makeResetStyles({});
+const useVariationStyles = makeStyles({
+    primary: {},
+    secondary: {},
+    ghost: {},
+    circular: {},
+    rounded: {},
+    square: {},
+    small: {},
+    medium: {},
+    large: {}
+});
+const useDisabledStyles = makeStyles({
+    base: {},
+    primary: {},
+    secondary: {},
+    ghost: {}
+});
+export const useButtonStyles = (state) => {
+    const resetStyles = useResetStyles();
+    const variationStyles = useVariationStyles();
+    const disabledStyles = useDisabledStyles();
+    const { appearance, disabled, shape, size } = state;
+    state.root.className = mergeClasses(textClassNames.root, resetStyles, appearance && variationStyles[appearance], variationStyles[shape], variationStyles[size], disabled && disabledStyles.base, appearance && disabled && disabledStyles[appearance], state.root.className);
+    return state;
+};

package/dist/components/src/Text/Text.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from 'jsx-framework-test-pb';
+import type { TextProps } from './Text.types';
+export declare const Text: FC<TextProps>;

package/dist/components/{Text → src/Text}/Text.types.d.ts

@@ -1,16 +1,10 @@
-import type { ComponentProps, ComponentState, Slot } from '../../utilities';
+import type { ComponentProps, ComponentState, Slot } from '../../../utilities';
 export type TextSlots = {
     root: Slot<'span', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'pre' | 'strong' | 'b' | 'em' | 'i'>;
 };
 export type TextProps = ComponentProps<TextSlots> & {
     font?: 'base' | 'monospace' | 'numeric';
-    italic?: boolean;
     size?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 1000;
-    strikethrough?: boolean;
-    truncate?: boolean;
-    underline?: boolean;
     weight?: 'regular' | 'medium' | 'semibold' | 'bold';
-    wrap?: boolean;
 };
-export type TextPresetprops = Omit<TextProps, 'font' | 'size' | 'weight'>;
-export type TextState = ComponentState<TextSlots> & Required<Pick<TextProps, 'font' | 'italic' | 'size' | 'strikethrough' | 'truncate' | 'underline' | 'weight' | 'wrap'>>;
+export type TextState = ComponentState<TextSlots> & Required<Pick<TextProps, 'font' | 'size' | 'weight'>>;

package/dist/components/src/Text/index.d.ts

@@ -0,0 +1,5 @@
+export { Text } from './Text';
+export type { TextProps, TextSlots, TextState } from './Text.types';
+export { renderText } from './renderText';
+export { useText } from './useText';
+export { textClassNames, useTextStyles } from './useTextStyles.styles';

package/dist/components/{Text → src/Text}/index.js

@@ -1,4 +1,4 @@
 export { Text } from './Text';
-export { useText } from './useText';
 export { renderText } from './renderText';
-export { useTextStyles, textClassNames } from './useTextStyles.styles';
+export { useText } from './useText';
+export { textClassNames, useTextStyles } from './useTextStyles.styles';

package/dist/components/{Text → src/Text}/renderText.d.ts

@@ -1,3 +1,3 @@
-import type { JSXElement } from '../../utilities/src/compose/types';
+import type { JSXElement } from '../../../utilities';
 import type { TextState } from './Text.types';
 export declare const renderText: (state: TextState) => JSXElement;

package/dist/components/{Text → src/Text}/renderText.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "jsx-framework-test-pb/jsx-runtime";
-import { assertSlots } from '../../utilities/src';
+import { assertSlots } from '../../../utilities';
 export const renderText = (state) => {
     assertSlots(state);
-    return (_jsx(state.root, { children: state.root.children }));
+    return _jsx(state.root, {});
 };

package/dist/components/src/Text/useText.js

@@ -0,0 +1,14 @@
+import { getIntrinsicElementProps, slot } from '../../../utilities';
+export const useText = (props) => {
+    const { font, size, weight } = props;
+    const state = {
+        font: font ?? 'base',
+        size: size ?? 300,
+        weight: weight ?? 'regular',
+        components: { root: 'span' },
+        root: slot.always(getIntrinsicElementProps('span', {
+            ...props
+        }), { elementType: 'span' })
+    };
+    return state;
+};

package/dist/components/{Text → src/Text}/useTextStyles.styles.d.ts

@@ -1,4 +1,4 @@
-import type { SlotClassNames } from '../../utilities';
+import type { SlotClassNames } from '../../../utilities';
 import type { TextSlots, TextState } from './Text.types';
 export declare const textClassNames: SlotClassNames<TextSlots>;
 export declare const useTextStyles: (state: TextState) => TextState;

package/dist/components/src/Text/useTextStyles.styles.js

@@ -0,0 +1,41 @@
+import { makeResetStyles, makeStyles, mergeClasses } from 'css-engine-test-pb';
+export const textClassNames = {
+    root: 'c-text'
+};
+const useResetStyles = makeResetStyles({
+    fontFamily: 'Neue Montreal',
+    fontSize: '14px',
+    lineHeight: '20px',
+    fontWeight: 450,
+    textAlign: 'start',
+    display: 'inline',
+    whiteSpace: 'normal',
+    overflow: 'visible',
+    textOverflow: 'clip'
+});
+const useVariationStyles = makeStyles({
+    base: {},
+    monospace: {},
+    numeric: {},
+    100: {},
+    200: {},
+    300: {},
+    400: {},
+    500: {},
+    600: {},
+    700: {},
+    800: {},
+    900: {},
+    1000: {},
+    regular: {},
+    medium: {},
+    semibold: {},
+    bold: {}
+});
+export const useTextStyles = (state) => {
+    const resetStyles = useResetStyles();
+    const variationStyles = useVariationStyles();
+    const { font, size, weight } = state;
+    state.root.className = mergeClasses(textClassNames.root, resetStyles, variationStyles[font], variationStyles[size], variationStyles[weight], state.root.className);
+    return state;
+};

package/dist/components/src/index.d.ts

@@ -0,0 +1,4 @@
+export { Button, buttonClassNames } from './Button';
+export type { ButtonProps, ButtonSlots } from './Button';
+export { Text, textClassNames } from './Text';
+export type { TextProps, TextSlots } from './Text';

package/dist/components/src/index.js

@@ -0,0 +1,2 @@
+export { Button, buttonClassNames } from './Button';
+export { Text, textClassNames } from './Text';

package/dist/index.d.ts

@@ -1,8 +1,6 @@
-export { assertSlots, getIntrinsicElementProps, slot, useARIAButtonProps } from './utilities';
-export { tokens, defaultTheme, themeToCSS, insertTheme } from './theme';
-export type { Theme } from './theme';
-export { Button, useButton, renderButton, useButtonStyles, buttonClassNames, } from './components';
-export type { ButtonSlots, ButtonAppearance, ButtonShape, ButtonSize, ButtonProps, ButtonState, } from './components';
-export { Text, useText, renderText, useTextStyles, textClassNames, } from './components';
-export type { TextSlots, TextProps, TextState, } from './components';
-export type { JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, ARIAButtonType, ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonSlotProps, ARIAButtonAlteredProps, ARIAButtonResultProps, } from './utilities';
+export type { JSXElement, JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, } from './utilities';
+export { assertSlots } from './utilities';
+export { Button, buttonClassNames } from './components';
+export type { ButtonProps, ButtonSlots } from './components';
+export { Text, textClassNames } from './components';
+export type { TextProps, TextSlots } from './components';

package/dist/index.js

@@ -1,4 +1,3 @@
-export { assertSlots, getIntrinsicElementProps, slot, useARIAButtonProps } from './utilities';
-export { tokens, defaultTheme, themeToCSS, insertTheme } from './theme';
-export { Button, useButton, renderButton, useButtonStyles, buttonClassNames, } from './components';
-export { Text, useText, renderText, useTextStyles, textClassNames, } from './components';
+export { assertSlots } from './utilities';
+export { Button, buttonClassNames } from './components';
+export { Text, textClassNames } from './components';

package/dist/utilities/index.d.ts

@@ -1,2 +1,2 @@
-export { assertSlots, getIntrinsicElementProps, slot, useARIAButtonProps } from './src';
-export type { JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, ARIAButtonType, ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonSlotProps, ARIAButtonAlteredProps, ARIAButtonResultProps, } from './src';
+export type { JSXElement, JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, } from './src';
+export { assertSlots, getIntrinsicElementProps, slot } from './src';

package/dist/utilities/index.js

@@ -1 +1 @@
-export { assertSlots, getIntrinsicElementProps, slot, useARIAButtonProps } from './src';
+export { assertSlots, getIntrinsicElementProps, slot } from './src';

package/dist/utilities/src/compose/assertSlots.d.ts

@@ -1,5 +1,14 @@
 import type { FC } from 'jsx-framework-test-pb';
 import type { ComponentState, SlotPropsRecord } from './types';
+/**
+ * Asserts and transforms slot entries on `state` into callable JSX components.
+ *
+ * After calling this, each slot key (e.g. `state.root`, `state.icon`) becomes
+ * a function component that can be used directly in JSX: `<state.root />`.
+ *
+ * The component renders using the element type from `state.components[key]`
+ * and merges the resolved slot props with any props passed via JSX.
+ */
 export declare function assertSlots<Slots extends SlotPropsRecord>(state: ComponentState<Slots>): asserts state is ComponentState<Slots> & {
     [K in keyof Slots]: FC<any>;
 };

package/dist/utilities/src/compose/assertSlots.js

@@ -1,15 +1,30 @@
 import { jsx } from 'jsx-framework-test-pb/jsx-runtime';
+/**
+ * Asserts and transforms slot entries on `state` into callable JSX components.
+ *
+ * After calling this, each slot key (e.g. `state.root`, `state.icon`) becomes
+ * a function component that can be used directly in JSX: `<state.root />`.
+ *
+ * The component renders using the element type from `state.components[key]`
+ * and merges the resolved slot props with any props passed via JSX.
+ */
 export function assertSlots(state) {
-    const components = state.components;
-    for (const name of Object.keys(components)) {
-        const Component = components[name];
+    for (const name of Object.keys(state.components)) {
+        const elementType = state.components[name];
         const slotProps = state[name];
-        if (slotProps != null) {
-            const fn = (jsxProps) => {
-                return jsx(Component, { ...slotProps, ...jsxProps });
-            };
-            fn.children = slotProps.children;
-            state[name] = fn;
+        if (slotProps === undefined) {
+            // Optional slot not provided — render nothing
+            state[name] = () => null;
+            continue;
         }
+        const { children, elementType: slotElementType, ...restProps } = slotProps;
+        const resolvedElementType = slotElementType ?? elementType;
+        state[name] = (jsxProps) => {
+            const mergedProps = { ...restProps, ...jsxProps };
+            if (children !== undefined) {
+                mergedProps.children = jsxProps?.children ?? children;
+            }
+            return jsx(resolvedElementType, mergedProps);
+        };
     }
 }

package/dist/utilities/src/compose/getIntrinsicElementProps.d.ts

@@ -1,2 +1,3 @@
-import type { UnknownSlotProps, JSXIntrinsicElementKeys } from './types';
-export declare function getIntrinsicElementProps<Props extends UnknownSlotProps & Record<string, any>>(tagName: JSXIntrinsicElementKeys, props: Props): Props;
+import type { JSX } from 'jsx-framework-test-pb/jsx-runtime';
+import type { JSXIntrinsicElementKeys } from './types';
+export declare function getIntrinsicElementProps<Tag extends JSXIntrinsicElementKeys>(_elementType: Tag, props: Record<string, unknown>, excludedPropNames?: string[]): JSX.IntrinsicElements[Tag];

package/dist/utilities/src/compose/getIntrinsicElementProps.js

@@ -1,53 +1,54 @@
-// Global HTML attributes valid on all elements
-const nativeProps = new Set([
-    // Core
-    'as', 'children', 'className', 'style', 'id', 'key',
-    // HTML global attributes
-    'accessKey', 'autoFocus', 'contentEditable', 'dir', 'draggable',
-    'hidden', 'lang', 'nonce', 'placeholder', 'slot', 'spellCheck',
-    'tabIndex', 'title', 'translate', 'role',
-    // Data & ARIA (handled separately via prefix check)
-    // Event handlers
-    'onAbort', 'onAnimationEnd', 'onAnimationIteration', 'onAnimationStart',
-    'onBlur', 'onChange', 'onClick', 'onCompositionEnd', 'onCompositionStart',
-    'onCompositionUpdate', 'onContextMenu', 'onCopy', 'onCut', 'onDoubleClick',
-    'onDrag', 'onDragEnd', 'onDragEnter', 'onDragExit', 'onDragLeave',
-    'onDragOver', 'onDragStart', 'onDrop', 'onError', 'onFocus', 'onFocusIn',
-    'onFocusOut', 'onGotPointerCapture', 'onInput', 'onInvalid', 'onKeyDown',
-    'onKeyPress', 'onKeyUp', 'onLoad', 'onLostPointerCapture', 'onMouseDown',
-    'onMouseEnter', 'onMouseLeave', 'onMouseMove', 'onMouseOut', 'onMouseOver',
-    'onMouseUp', 'onPaste', 'onPointerCancel', 'onPointerDown', 'onPointerEnter',
-    'onPointerLeave', 'onPointerMove', 'onPointerOut', 'onPointerOver',
-    'onPointerUp', 'onScroll', 'onSelect', 'onSubmit', 'onTouchCancel',
-    'onTouchEnd', 'onTouchMove', 'onTouchStart', 'onTransitionEnd', 'onWheel',
-    // Form element attributes
-    'accept', 'acceptCharset', 'action', 'allowFullScreen', 'alt', 'async',
-    'autoCapitalize', 'autoComplete', 'autoPlay', 'capture', 'cellPadding',
-    'cellSpacing', 'charSet', 'checked', 'cite', 'colSpan', 'cols', 'controls',
-    'coords', 'crossOrigin', 'dateTime', 'default', 'defer', 'disabled',
-    'download', 'encType', 'form', 'formAction', 'formEncType', 'formMethod',
-    'formNoValidate', 'formTarget', 'frameBorder', 'headers', 'height', 'high',
-    'href', 'hrefLang', 'htmlFor', 'httpEquiv', 'icon', 'inputMode', 'integrity',
-    'is', 'kind', 'label', 'list', 'loop', 'low', 'max', 'maxLength', 'media',
-    'method', 'min', 'minLength', 'multiple', 'muted', 'name', 'noValidate',
-    'open', 'optimum', 'pattern', 'playsInline', 'poster', 'preload',
-    'readOnly', 'rel', 'required', 'reversed', 'rowSpan', 'rows', 'sandbox',
-    'scope', 'scoped', 'scrolling', 'seamless', 'selected', 'shape', 'size',
-    'sizes', 'span', 'src', 'srcDoc', 'srcLang', 'srcSet', 'start', 'step',
-    'summary', 'target', 'type', 'useMap', 'value', 'width', 'wrap',
+// All valid HTML attribute names defined by the JSX framework's HTMLAttributes interfaces.
+// aria-* and data-* are handled by prefix checks below.
+// on* event handlers are handled by prefix check below.
+const htmlAttributeNames = new Set([
+    // Global (HTMLAttributes)
+    'className', 'id', 'style', 'title', 'lang', 'dir', 'hidden', 'tabIndex', 'role',
+    'children', 'key', 'ref', 'as',
+    // Anchor (AnchorHTMLAttributes)
+    'href', 'target', 'rel', 'download', 'hrefLang',
+    // Button (ButtonHTMLAttributes)
+    'disabled', 'type', 'value', 'autoFocus', 'form',
+    'formAction', 'formEncType', 'formMethod', 'formNoValidate', 'formTarget',
+    // Form (FormHTMLAttributes)
+    'action', 'method', 'encType', 'noValidate', 'autoComplete',
+    // Input (InputHTMLAttributes)
+    'accept', 'alt', 'capture', 'checked', 'max', 'maxLength', 'min', 'minLength',
+    'multiple', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'size',
+    'src', 'step',
+    // Textarea (TextareaHTMLAttributes)
+    'cols', 'rows', 'wrap',
+    // Select/Option
+    'selected', 'label',
+    // Img (ImgHTMLAttributes)
+    'crossOrigin', 'decoding', 'height', 'loading', 'sizes', 'srcSet', 'width',
+    // Media (VideoHTMLAttributes / AudioHTMLAttributes)
+    'autoPlay', 'controls', 'loop', 'muted', 'poster', 'preload',
+    // Table (TdHTMLAttributes / ThHTMLAttributes)
+    'cellPadding', 'cellSpacing', 'colSpan', 'rowSpan', 'headers', 'scope',
+    // Iframe (IframeHTMLAttributes)
+    'allow', 'allowFullScreen', 'sandbox', 'srcDoc',
+    // Label (LabelHTMLAttributes)
+    'htmlFor',
+    // SVG (SVGAttributes)
+    'viewBox', 'xmlns', 'fill', 'stroke', 'strokeWidth', 'strokeLinecap', 'strokeLinejoin',
+    // Meta (MetaHTMLAttributes) / Link (LinkHTMLAttributes)
+    'charSet', 'content', 'httpEquiv', 'media',
+    // Details / Dialog
+    'open',
 ]);
-function isNativeProp(key) {
-    return nativeProps.has(key) || key.startsWith('data-') || key.startsWith('aria-');
-}
-export function getIntrinsicElementProps(tagName, props) {
+export function getIntrinsicElementProps(_elementType, props, excludedPropNames) {
     const result = {};
     for (const key of Object.keys(props)) {
-        if (isNativeProp(key)) {
+        if (excludedPropNames?.includes(key)) {
+            continue;
+        }
+        if (htmlAttributeNames.has(key) ||
+            key.startsWith('on') ||
+            key.startsWith('aria-') ||
+            key.startsWith('data-')) {
             result[key] = props[key];
         }
     }
-    if (!result.as) {
-        result.as = tagName;
-    }
     return result;
 }

package/dist/utilities/src/compose/index.d.ts

@@ -1,4 +1,4 @@
+export type { JSXElement, JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, } from './types';
 export { assertSlots } from './assertSlots';
 export { getIntrinsicElementProps } from './getIntrinsicElementProps';
 export { slot } from './slot';
-export type { JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, JSXElement, } from './types';

package/dist/utilities/src/compose/slot.d.ts

@@ -1,11 +1,22 @@
-import type { SlotShorthandValue, UnknownSlotProps } from './types';
-type SlotValue = UnknownSlotProps | SlotShorthandValue | null | undefined;
-interface SlotOptions<Props extends UnknownSlotProps> {
-    elementType: string;
-    defaultProps?: Partial<Props>;
-}
+import type { FC } from 'jsx-framework-test-pb';
+import type { JSXIntrinsicElementKeys, SlotShorthandValue, UnknownSlotProps, WithoutSlotRenderFunction } from './types';
+type SlotOptions<Tag extends JSXIntrinsicElementKeys | FC<any>> = {
+    elementType: Tag;
+};
 export declare const slot: {
-    always<Props extends UnknownSlotProps>(value: SlotValue, options: SlotOptions<Props>): Props;
-    optional<Props extends UnknownSlotProps>(value: SlotValue, options: SlotOptions<Props>): Props | undefined;
+    /**
+     * Resolves a slot that is always rendered. If `value` is null or undefined,
+     * returns an empty props object (the slot still renders using its element type).
+     */
+    always<T extends UnknownSlotProps, Tag extends JSXIntrinsicElementKeys | FC<any>>(value: T | SlotShorthandValue | null | undefined, options: SlotOptions<Tag>): WithoutSlotRenderFunction<T> & (Tag extends JSXIntrinsicElementKeys ? {
+        as?: Tag;
+    } : {});
+    /**
+     * Resolves an optional slot. If `value` is null or undefined, returns undefined
+     * so that `assertSlots` skips rendering the slot entirely.
+     */
+    optional<T extends UnknownSlotProps, Tag extends JSXIntrinsicElementKeys | FC<any>>(value: T | SlotShorthandValue | null | undefined, options: SlotOptions<Tag>): (WithoutSlotRenderFunction<T> & (Tag extends JSXIntrinsicElementKeys ? {
+        as?: Tag;
+    } : {})) | undefined;
 };
 export {};

package/dist/utilities/src/compose/slot.js

@@ -1,25 +1,34 @@
-import { isElement } from 'jsx-framework-test-pb';
-function isShorthand(value) {
-    return typeof value === 'string' || typeof value === 'number' || isElement(value);
-}
-function resolveSlot(value, options) {
-    const { defaultProps } = options;
-    if (value == null) {
-        return (defaultProps ?? {});
+const ELEMENT_TYPE = Symbol.for('uraniyum.element');
+function resolveSlotValue(value, elementType) {
+    if (value === null || value === undefined) {
+        return { elementType };
+    }
+    if (typeof value === 'string' || typeof value === 'number') {
+        return { elementType, children: value };
     }
-    if (isShorthand(value)) {
-        return { ...defaultProps, children: value };
+    // JSX Element shorthand — wrap as children
+    if (typeof value === 'object' && value.$$typeof === ELEMENT_TYPE) {
+        return { elementType, children: value };
     }
-    return { ...defaultProps, ...value };
+    // Props object
+    return { elementType, ...value };
 }
 export const slot = {
+    /**
+     * Resolves a slot that is always rendered. If `value` is null or undefined,
+     * returns an empty props object (the slot still renders using its element type).
+     */
     always(value, options) {
-        return resolveSlot(value, options);
+        return resolveSlotValue(value, options.elementType);
     },
+    /**
+     * Resolves an optional slot. If `value` is null or undefined, returns undefined
+     * so that `assertSlots` skips rendering the slot entirely.
+     */
     optional(value, options) {
-        if (value == null) {
+        if (value === null || value === undefined) {
             return undefined;
         }
-        return resolveSlot(value, options);
+        return resolveSlotValue(value, options.elementType);
     },
 };

package/dist/utilities/src/compose/types.d.ts

@@ -8,7 +8,6 @@ type ReplaceNullWithUndefined<T> = T extends null ? undefined : T;
 type EmptyIntrinsicElements = 'area' | 'base' | 'br' | 'col' | 'embed' | 'hr' | 'img' | 'input' | 'link' | 'meta' | 'param' | 'source' | 'track' | 'wbr';
 type IntrinsicElementProps<Type extends JSXIntrinsicElementKeys> = Type extends EmptyIntrinsicElements ? PropsWithoutChildren<JSXIntrinsicElement<Type>> : JSXIntrinsicElement<Type>;
 export type SlotRenderFunction<Props> = (Component: FC<Props> | JSXIntrinsicElementKeys, props: Omit<Props, 'as'>) => ElementChild;
-export type SlotPropsRecord = Record<string, UnknownSlotProps | SlotShorthandValue | null | undefined>;
 export type SlotShorthandValue = Element | string | number;
 export type UnknownSlotProps = {
     className?: string | number;
@@ -16,6 +15,7 @@ export type UnknownSlotProps = {
     as?: JSXIntrinsicElementKeys;
     children?: ElementChild | ElementChild[] | SlotRenderFunction<any>;
 };
+export type SlotPropsRecord = Record<string, UnknownSlotProps | SlotShorthandValue | null | undefined>;
 type WithSlotShorthandValue<Props> = Props | ('children' extends keyof Props ? Extract<SlotShorthandValue, Props['children']> : never);
 export type WithSlotRenderFunction<Props> = PropsWithoutChildren<Props> & {
     children?: 'children' extends keyof Props ? Props['children'] | SlotRenderFunction<Props> : never;

package/dist/utilities/src/index.d.ts

@@ -1,4 +1,2 @@
+export type { JSXElement, JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, } from './compose';
 export { assertSlots, getIntrinsicElementProps, slot } from './compose';
-export { useARIAButtonProps } from './ARIA';
-export type { JSXIntrinsicElementKeys, JSXIntrinsicElement, SlotRenderFunction, SlotPropsRecord, SlotShorthandValue, UnknownSlotProps, WithSlotRenderFunction, WithoutSlotRenderFunction, IsSingleton, AsIntrinsicElement, Slot, ExtractSlotProps, ComponentProps, ComponentState, SlotClassNames, EventData, EventHandler, DistributiveOmit, UnionToIntersection, JSXElement, } from './compose';
-export type { ARIAButtonType, ARIAButtonElement, ARIAButtonElementIntersection, ARIAButtonProps, ARIAButtonSlotProps, ARIAButtonAlteredProps, ARIAButtonResultProps, } from './ARIA';

package/dist/utilities/src/index.js

@@ -1,2 +1 @@
 export { assertSlots, getIntrinsicElementProps, slot } from './compose';
-export { useARIAButtonProps } from './ARIA';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "components-test-pb",
-  "version": "0.2.6",
+  "version": "0.2.7",
   "description": "",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",