@crystallize/design-system 0.0.1 → 0.0.2

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @crystallize/design-system
 
+## 0.0.2
+
+### Patch Changes
+
+- 742b7b00: Add collapse all chunks button and remove unused prop from ActionMenu
+
 ## 0.0.1
 
 ### Patch Changes

package/dist/index.d.ts

@@ -12,10 +12,9 @@ declare function Item({ children, className, onSelect }: ItemProps): JSX.Element
 
 declare type ActionMenuProps = {
     children: ReactNode;
-    className?: string;
     tabIndex?: number;
 };
-declare function ActionMenu({ children, className, tabIndex }: ActionMenuProps): JSX.Element;
+declare function ActionMenu({ children, tabIndex }: ActionMenuProps): JSX.Element;
 declare namespace ActionMenu {
     var Item: typeof Item;
 }
@@ -102,7 +101,7 @@ declare type DropdownMenuRootProps = {
     children: ReactNode;
     content: ReactNode;
     alignContent?: 'start' | 'center' | 'end';
-    onOpenChange: (isOpen: boolean) => void;
+    onOpenChange?: (isOpen: boolean) => void;
 };
 declare function DropdownMenuRoot({ children, content, onOpenChange, alignContent }: DropdownMenuRootProps): JSX.Element;
 

package/dist/index.js

@@ -650,17 +650,17 @@ function Item2({ children, className, onSelect }) {
 
 // src/action-menu/action-menu.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function ActionMenu({ children, className, tabIndex }) {
+function ActionMenu({ children, tabIndex }) {
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenu.Root, {
     content: children,
+    alignContent: "center",
     children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("button", {
       tabIndex,
       type: "button",
       className: (0, import_clsx4.default)(
         "items-center bg-transparent rounded-full border-none cursor-pointer flex justify-center p-1",
         "hover:bg-gray-6 focus:bg-gray-6 focus:outline-offset-2 focus:outline focus:outline-1 focus:outline-glacier focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-1 focus-visible:outline-glacier",
-        "active:scale-95",
-        className
+        "active:scale-95"
       ),
       "aria-label": "more options",
       children: [

package/dist/index.mjs

@@ -609,17 +609,17 @@ function Item2({ children, className, onSelect }) {
 
 // src/action-menu/action-menu.tsx
 import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
-function ActionMenu({ children, className, tabIndex }) {
+function ActionMenu({ children, tabIndex }) {
   return /* @__PURE__ */ jsx14(DropdownMenu.Root, {
     content: children,
+    alignContent: "center",
     children: /* @__PURE__ */ jsxs9("button", {
       tabIndex,
       type: "button",
       className: clsx4(
         "items-center bg-transparent rounded-full border-none cursor-pointer flex justify-center p-1",
         "hover:bg-gray-6 focus:bg-gray-6 focus:outline-offset-2 focus:outline focus:outline-1 focus:outline-glacier focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-1 focus-visible:outline-glacier",
-        "active:scale-95",
-        className
+        "active:scale-95"
       ),
       "aria-label": "more options",
       children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystallize/design-system",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/action-menu/action-menu.tsx

@@ -8,14 +8,12 @@ import { Item } from './action-item';
 
 type ActionMenuProps = {
   children: ReactNode;
-  className?: string;
   tabIndex?: number;
 };
 
-export function ActionMenu({ children, className, tabIndex }: ActionMenuProps) {
+export function ActionMenu({ children, tabIndex }: ActionMenuProps) {
   return (
-    // @ts-expect-error
-    <DropdownMenu.Root content={children}>
+    <DropdownMenu.Root content={children} alignContent="center">
       <button
         tabIndex={tabIndex}
         type="button"
@@ -23,7 +21,6 @@ export function ActionMenu({ children, className, tabIndex }: ActionMenuProps) {
           'items-center bg-transparent rounded-full border-none cursor-pointer flex justify-center p-1',
           'hover:bg-gray-6 focus:bg-gray-6 focus:outline-offset-2 focus:outline focus:outline-1 focus:outline-glacier focus-visible:outline-offset-2 focus-visible:outline focus-visible:outline-1 focus-visible:outline-glacier',
           'active:scale-95',
-          className,
         )}
         aria-label="more options"
       >

package/src/dropdown-menu/dropdown-menu-root.tsx

@@ -5,7 +5,7 @@ type DropdownMenuRootProps = {
   children: ReactNode;
   content: ReactNode;
   alignContent?: 'start' | 'center' | 'end';
-  onOpenChange: (isOpen: boolean) => void;
+  onOpenChange?: (isOpen: boolean) => void;
 };
 
 export function DropdownMenuRoot({ children, content, onOpenChange, alignContent = 'start' }: DropdownMenuRootProps) {