@citygross/components_v2 0.0.54 → 0.0.56

package/dist/components/AlertBox/AlertBox.d.ts

@@ -1,17 +1,17 @@
 import React from 'react';
-import { TPaletteKeys, THardSpacingKeys, TSpacingKeys } from '@citygross/design-tokens_v2';
+import { THardSpacingKeys, TPaletteKeys, TSpacingKeys } from '@citygross/design-tokens_v2';
 
 declare type TAlertBox = {
+    arrowPlacement?: 'left' | 'right';
+    arrowSpacing?: THardSpacingKeys;
     background?: TPaletteKeys;
     borderColor?: TPaletteKeys;
-    icon?: JSX.Element;
     children: React.ReactNode;
+    icon?: JSX.Element;
     iconMinWidth?: THardSpacingKeys;
-    withArrow?: boolean;
-    arrowPlacement?: 'left' | 'right';
-    arrowSpacing?: THardSpacingKeys;
     padding?: TSpacingKeys;
+    withArrow?: boolean;
 };
-declare function AlertBox({ background, borderColor, icon, iconMinWidth, withArrow, arrowSpacing, arrowPlacement, padding, children }: TAlertBox): JSX.Element;
+declare function AlertBox({ arrowPlacement, arrowSpacing, background, borderColor, children, icon, iconMinWidth, padding, withArrow }: TAlertBox): JSX.Element;
 
 export { AlertBox, TAlertBox };

package/dist/components/AlertBox/AlertBox.js

@@ -3,15 +3,15 @@ import { BoxArrow } from '../BoxArrow/BoxArrow.js';
 import { alertBox, iconContainer } from './AlertBox.css.vanilla.js';
 
 function AlertBox({
+  arrowPlacement,
+  arrowSpacing,
   background = "blueLight",
   borderColor = "alertBlue",
+  children,
   icon,
   iconMinWidth = 24,
-  withArrow,
-  arrowSpacing,
-  arrowPlacement,
   padding = "sm",
-  children
+  withArrow
 }) {
   return /* @__PURE__ */ React.createElement("div", null, withArrow ? /* @__PURE__ */ React.createElement(
     BoxArrow,
@@ -30,7 +30,7 @@ function AlertBox({
         padding
       })
     },
-    icon ? /* @__PURE__ */ React.createElement("div", { className: iconContainer({ minWidth: `${iconMinWidth}` }) }, icon) : null,
+    icon ? /* @__PURE__ */ React.createElement("div", { className: iconContainer({ minWidth: iconMinWidth }) }, icon) : null,
     children
   ));
 }

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

@@ -1,21 +1,21 @@
 import React from 'react';
 
 declare type TCgButton = {
-    size?: 'small' | 'medium' | 'icon' | 'large';
-    variant?: 'primary' | 'secondary' | 'ghost' | 'tertiary' | 'prio' | 'dark';
-    icon?: React.ReactNode;
-    flexReverse?: boolean;
-    loading?: boolean;
+    ariaLabel?: string;
+    buttonRef?: React.Ref<HTMLButtonElement>;
     children?: React.ReactNode;
+    className?: string;
     disabled?: boolean;
-    onClick?: () => void;
+    flexReverse?: boolean;
     fullWidth?: boolean;
-    buttonRef?: React.Ref<HTMLButtonElement>;
+    icon?: React.ReactNode;
+    loading?: boolean;
+    onClick?: () => void;
     round?: boolean;
-    className?: string;
     shouldPreventDefault?: boolean;
-    ariaLabel?: string;
+    size?: 'small' | 'medium' | 'icon' | 'large';
+    variant?: 'primary' | 'secondary' | 'ghost' | 'tertiary' | 'prio' | 'dark';
 };
-declare const Button: ({ size, variant, icon, flexReverse, disabled, onClick, children, loading, fullWidth, buttonRef, round, className, shouldPreventDefault, ariaLabel }: TCgButton) => JSX.Element;
+declare const Button: ({ ariaLabel, buttonRef, children, className, disabled, flexReverse, fullWidth, icon, loading, onClick, round, shouldPreventDefault, size, variant }: TCgButton) => JSX.Element;
 
 export { Button, TCgButton };

package/dist/components/Button/Button.js

@@ -3,43 +3,38 @@ import { button, buttonContent, buttonLoader } from './Button.css.vanilla.js';
 import { Spinner } from '../Spinner/Spinner.js';
 
 const Button = ({
-  size,
-  variant,
-  icon,
-  flexReverse,
-  disabled,
-  onClick,
+  ariaLabel,
+  buttonRef,
   children,
-  loading,
+  className,
+  disabled,
+  flexReverse,
   fullWidth,
-  buttonRef,
+  icon,
+  loading,
+  onClick,
   round,
-  className,
   shouldPreventDefault = true,
-  ariaLabel
+  size,
+  variant
 }) => {
   return /* @__PURE__ */ React.createElement(
     "button",
     {
-      ref: buttonRef,
       "aria-label": ariaLabel,
       className: `${button({
         buttonPadding: size,
         buttonRadius: round ? "round" : "default",
+        buttonShadow: variant === "ghost" || variant === "secondary" ? "none" : size === "small" ? "small" : "default",
         buttonVariant: variant,
-        fullWidth,
-        buttonShadow: variant === "ghost" || variant === "secondary" ? "none" : size === "small" ? "small" : "default"
+        fullWidth
       })} ${className}`,
       disabled: disabled || loading,
-      onKeyDown: (event) => {
-        if (event.key === "Enter") {
-          onClick && onClick();
-        }
-      },
       onClick: (e) => {
         shouldPreventDefault && e.preventDefault();
         onClick && onClick();
-      }
+      },
+      ref: buttonRef
     },
     /* @__PURE__ */ React.createElement(
       "div",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@citygross/components_v2",
-  "version": "0.0.54",
+  "version": "0.0.56",
   "license": "ISC",
   "sideEffects": false,
   "main": "./dist/index.js",
@@ -69,7 +69,7 @@
     "@citygross/icons_v2": "^0.0.5",
     "@citygross/react-use-bg-wizard": "^0.0.8",
     "@citygross/typography": "^0.0.89",
-    "@citygross/utils": "^0.0.41",
+    "@citygross/utils": "^0.0.42",
     "@vanilla-extract/css": "^1.14.1",
     "@vanilla-extract/css-utils": "^0.1.3",
     "@vanilla-extract/recipes": "^0.5.1",
@@ -79,5 +79,5 @@
     "react-slick": "^0.30.1",
     "slick-carousel": "^1.8.1"
   },
-  "gitHead": "830c0216869887f1ce92050246d7ccf6cbe37e03"
+  "gitHead": "fc1009c67829050fbc4e15999644e665bed85139"
 }