@axiomui/primitives 0.1.1 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.cjs +52 -0
  2. package/dist/index.d.cts +7 -2
  3. package/dist/index.d.ts +7 -2
  4. package/dist/index.js +55 -0
  5. package/package.json +2 -5
package/dist/index.cjs CHANGED
@@ -22,6 +22,7 @@ var index_exports = {};
22
22
  __export(index_exports, {
23
23
  Box: () => Box,
24
24
  Flex: () => Flex,
25
+ Slot: () => Slot,
25
26
  Stack: () => Stack,
26
27
  Text: () => Text
27
28
  });
@@ -105,6 +106,56 @@ function Flex(props) {
105
106
  );
106
107
  }
107
108
 
109
+ // src/Slot.tsx
110
+ var import_react = require("react");
111
+ function mergeClassName(slotClassName, childClassName) {
112
+ if (!slotClassName && !childClassName) {
113
+ return void 0;
114
+ }
115
+ return [slotClassName, childClassName].filter(Boolean).join(" ");
116
+ }
117
+ function composeEventHandlers(childHandler, slotHandler) {
118
+ if (!childHandler && !slotHandler) {
119
+ return void 0;
120
+ }
121
+ return (event) => {
122
+ childHandler?.(event);
123
+ slotHandler?.(event);
124
+ };
125
+ }
126
+ function mergeProps(slotProps, childProps) {
127
+ const merged = {
128
+ ...slotProps,
129
+ ...childProps,
130
+ className: mergeClassName(slotProps.className, childProps.className),
131
+ style: {
132
+ ...slotProps.style ?? {},
133
+ ...typeof childProps.style === "object" && childProps.style ? childProps.style : {}
134
+ }
135
+ };
136
+ if ("onClick" in slotProps || "onClick" in childProps) {
137
+ merged.onClick = composeEventHandlers(
138
+ childProps.onClick,
139
+ slotProps.onClick
140
+ );
141
+ }
142
+ if ("onKeyDown" in slotProps || "onKeyDown" in childProps) {
143
+ merged.onKeyDown = composeEventHandlers(
144
+ childProps.onKeyDown,
145
+ slotProps.onKeyDown
146
+ );
147
+ }
148
+ return merged;
149
+ }
150
+ function Slot({ children, ...slotProps }) {
151
+ const child = import_react.Children.only(children);
152
+ if (!(0, import_react.isValidElement)(child)) {
153
+ throw new Error("Slot expects a single valid React element child.");
154
+ }
155
+ const childProps = child.props;
156
+ return (0, import_react.cloneElement)(child, mergeProps(slotProps, childProps));
157
+ }
158
+
108
159
  // src/Stack.tsx
109
160
  var import_jsx_runtime3 = require("react/jsx-runtime");
110
161
  var directionClassNameMap2 = {
@@ -185,6 +236,7 @@ function Text(props) {
185
236
  0 && (module.exports = {
186
237
  Box,
187
238
  Flex,
239
+ Slot,
188
240
  Stack,
189
241
  Text
190
242
  });
package/dist/index.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import { ElementType, ReactNode, ComponentPropsWithoutRef, ReactElement } from 'react';
1
+ import { ElementType, ReactNode, ComponentPropsWithoutRef, ReactElement, HTMLAttributes } from 'react';
2
2
 
3
3
  type PrimitiveElement = ElementType;
4
4
  type AsProp<TAs extends PrimitiveElement> = {
@@ -27,6 +27,11 @@ type FlexOwnProps = {
27
27
  type FlexProps = Omit<BoxProps<'div'>, 'display'> & FlexOwnProps;
28
28
  declare function Flex(props: FlexProps): ReactElement;
29
29
 
30
+ type SlotProps = HTMLAttributes<HTMLElement> & {
31
+ children: ReactElement;
32
+ };
33
+ declare function Slot({ children, ...slotProps }: SlotProps): ReactElement;
34
+
30
35
  type StackOwnProps = {
31
36
  direction?: 'vertical' | 'horizontal';
32
37
  gap?: '0' | '1' | '2' | '3' | '4' | '6' | '8';
@@ -46,4 +51,4 @@ type TextOwnProps = {
46
51
  type TextProps<TAs extends PrimitiveElement = 'span'> = PolymorphicComponentProps<TAs, TextOwnProps>;
47
52
  declare function Text<TAs extends PrimitiveElement = 'span'>(props: TextProps<TAs>): ReactElement;
48
53
 
49
- export { Box, type BoxProps, Flex, type FlexProps, type PolymorphicComponentProps, type PrimitiveElement, Stack, type StackProps, Text, type TextProps };
54
+ export { Box, type BoxProps, Flex, type FlexProps, type PolymorphicComponentProps, type PrimitiveElement, Slot, Stack, type StackProps, Text, type TextProps };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { ElementType, ReactNode, ComponentPropsWithoutRef, ReactElement } from 'react';
1
+ import { ElementType, ReactNode, ComponentPropsWithoutRef, ReactElement, HTMLAttributes } from 'react';
2
2
 
3
3
  type PrimitiveElement = ElementType;
4
4
  type AsProp<TAs extends PrimitiveElement> = {
@@ -27,6 +27,11 @@ type FlexOwnProps = {
27
27
  type FlexProps = Omit<BoxProps<'div'>, 'display'> & FlexOwnProps;
28
28
  declare function Flex(props: FlexProps): ReactElement;
29
29
 
30
+ type SlotProps = HTMLAttributes<HTMLElement> & {
31
+ children: ReactElement;
32
+ };
33
+ declare function Slot({ children, ...slotProps }: SlotProps): ReactElement;
34
+
30
35
  type StackOwnProps = {
31
36
  direction?: 'vertical' | 'horizontal';
32
37
  gap?: '0' | '1' | '2' | '3' | '4' | '6' | '8';
@@ -46,4 +51,4 @@ type TextOwnProps = {
46
51
  type TextProps<TAs extends PrimitiveElement = 'span'> = PolymorphicComponentProps<TAs, TextOwnProps>;
47
52
  declare function Text<TAs extends PrimitiveElement = 'span'>(props: TextProps<TAs>): ReactElement;
48
53
 
49
- export { Box, type BoxProps, Flex, type FlexProps, type PolymorphicComponentProps, type PrimitiveElement, Stack, type StackProps, Text, type TextProps };
54
+ export { Box, type BoxProps, Flex, type FlexProps, type PolymorphicComponentProps, type PrimitiveElement, Slot, Stack, type StackProps, Text, type TextProps };
package/dist/index.js CHANGED
@@ -76,6 +76,60 @@ function Flex(props) {
76
76
  );
77
77
  }
78
78
 
79
+ // src/Slot.tsx
80
+ import {
81
+ Children,
82
+ cloneElement,
83
+ isValidElement
84
+ } from "react";
85
+ function mergeClassName(slotClassName, childClassName) {
86
+ if (!slotClassName && !childClassName) {
87
+ return void 0;
88
+ }
89
+ return [slotClassName, childClassName].filter(Boolean).join(" ");
90
+ }
91
+ function composeEventHandlers(childHandler, slotHandler) {
92
+ if (!childHandler && !slotHandler) {
93
+ return void 0;
94
+ }
95
+ return (event) => {
96
+ childHandler?.(event);
97
+ slotHandler?.(event);
98
+ };
99
+ }
100
+ function mergeProps(slotProps, childProps) {
101
+ const merged = {
102
+ ...slotProps,
103
+ ...childProps,
104
+ className: mergeClassName(slotProps.className, childProps.className),
105
+ style: {
106
+ ...slotProps.style ?? {},
107
+ ...typeof childProps.style === "object" && childProps.style ? childProps.style : {}
108
+ }
109
+ };
110
+ if ("onClick" in slotProps || "onClick" in childProps) {
111
+ merged.onClick = composeEventHandlers(
112
+ childProps.onClick,
113
+ slotProps.onClick
114
+ );
115
+ }
116
+ if ("onKeyDown" in slotProps || "onKeyDown" in childProps) {
117
+ merged.onKeyDown = composeEventHandlers(
118
+ childProps.onKeyDown,
119
+ slotProps.onKeyDown
120
+ );
121
+ }
122
+ return merged;
123
+ }
124
+ function Slot({ children, ...slotProps }) {
125
+ const child = Children.only(children);
126
+ if (!isValidElement(child)) {
127
+ throw new Error("Slot expects a single valid React element child.");
128
+ }
129
+ const childProps = child.props;
130
+ return cloneElement(child, mergeProps(slotProps, childProps));
131
+ }
132
+
79
133
  // src/Stack.tsx
80
134
  import { jsx as jsx3 } from "react/jsx-runtime";
81
135
  var directionClassNameMap2 = {
@@ -155,6 +209,7 @@ function Text(props) {
155
209
  export {
156
210
  Box,
157
211
  Flex,
212
+ Slot,
158
213
  Stack,
159
214
  Text
160
215
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@axiomui/primitives",
3
- "version": "0.1.1",
3
+ "version": "0.3.0",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -17,15 +17,12 @@
17
17
  "files": [
18
18
  "dist"
19
19
  ],
20
- "publishConfig": {
21
- "access": "public"
22
- },
23
20
  "peerDependencies": {
24
21
  "react": "^18",
25
22
  "react-dom": "^18"
26
23
  },
27
24
  "dependencies": {
28
- "@axiomui/tokens": "0.1.1"
25
+ "@axiomui/tokens": "^0.3.0"
29
26
  },
30
27
  "sideEffects": false,
31
28
  "scripts": {