Merge pull request #48 from atomicjolt/sc/slots-api

Implement Slots API
atomicjolt · Dec 2, 2024 · cf6954d · cf6954d
2 parents 39d5c8a + 9e257be
commit cf6954d
Show file tree

Hide file tree

Showing 57 changed files with 2,029 additions and 2,824 deletions.
diff --git a/.changeset/witty-chairs-confess.md b/.changeset/witty-chairs-confess.md
@@ -0,0 +1,5 @@
+---
+"@atomicjolt/atomic-elements": major
+---
+
+Migrated Table to new collections API
diff --git a/.storybook/main.ts b/.storybook/main.ts
@@ -3,6 +3,7 @@ import { StorybookConfig } from "@storybook/react-vite";
 const config: StorybookConfig = {
   stories: [
     "../packages/atomic-elements/**/*.stories.@(js|jsx|ts|tsx)",
+    "../packages/atomic-elements/src/**/*.mdx",
   ],
 
   addons: [

diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/atomic-elements/package.json b/packages/atomic-elements/package.json
@@ -15,7 +15,7 @@
     "@react-aria/button": "^3.9.5",
     "@react-aria/calendar": "^3.5.8",
     "@react-aria/checkbox": "^3.14.3",
-    "@react-aria/collections": "^3.0.0-alpha.5",
+    "@react-aria/collections": "^3.0.0-alpha.6",
     "@react-aria/combobox": "^3.9.1",
     "@react-aria/datepicker": "^3.10.1",
     "@react-aria/dialog": "^3.5.14",
@@ -44,7 +44,7 @@
     "@react-aria/utils": "^3.24.1",
     "@react-aria/visually-hidden": "^3.8.12",
     "@react-stately/flags": "^3.0.3",
-    "@react-stately/table": "^3.11.8",
+    "@react-stately/table": "^3.13.0",
     "@react-stately/utils": "^3.10.1",
     "classnames": "^2.3.1",
     "react-stately": "^3.30.1",

diff --git a/packages/atomic-elements/src/components/Buttons/Button/Button.component.tsx b/packages/atomic-elements/src/components/Buttons/Button/Button.component.tsx
@@ -5,6 +5,7 @@ import { mergeProps, useObjectRef } from "@react-aria/utils";
 import { SpinnerLoader } from "../../Loaders/SpinnerLoader";
 import {
   ExtendedSize,
+  HasIcon,
   HasVariant,
   LoadingProps,
   RenderBaseProps,
@@ -53,7 +54,8 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
   function Button(props, forwardedRef) {
     [props, forwardedRef] = useContextPropsV2(
       ButtonContext,
-      props,
+      // Button doesn't have Icon props, but the context does
+      props as ButtonProps & HasIcon,
       forwardedRef
     );
 

diff --git a/packages/atomic-elements/src/components/Fields/Atoms/Input/Input.component.tsx b/packages/atomic-elements/src/components/Fields/Atoms/Input/Input.component.tsx
@@ -5,6 +5,7 @@ import { ElementWrapperProps } from "../../../../types";
 import { useContextPropsV2 } from "@hooks/useContextProps";
 import { useRenderProps } from "@hooks";
 import { InputContext } from "./Input.context";
+import { SlotProps } from "@hooks/useSlottedContext";
 
 const StyledInput = styled.input`
   ${mixins.Regular}
@@ -13,7 +14,11 @@ const StyledInput = styled.input`
 `;
 
 export interface InputProps
-  extends ElementWrapperProps<React.InputHTMLAttributes<HTMLInputElement>> {}
+  extends Omit<
+      ElementWrapperProps<React.InputHTMLAttributes<HTMLInputElement>>,
+      "slot"
+    >,
+    SlotProps {}
 
 /** A wrapped `<input type="text" />` element */
 export const Input = forwardRef(function Input(
@@ -30,5 +35,12 @@ export const Input = forwardRef(function Input(
     style,
   });
 
-  return <StyledInput ref={ref} {...renderProps} {...rest} />;
+  return (
+    <StyledInput
+      ref={ref}
+      {...renderProps}
+      {...rest}
+      slot={rest.slot || undefined}
+    />
+  );
 });