@synerise/ds-button 0.18.8 → 0.18.10

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.18.10](https://github.com/synerise/synerise-design/compare/@synerise/ds-button@0.18.9...@synerise/ds-button@0.18.10) (2024-01-15)
+
+**Note:** Version bump only for package @synerise/ds-button
+
+
+
+
+
+## [0.18.9](https://github.com/synerise/synerise-design/compare/@synerise/ds-button@0.18.8...@synerise/ds-button@0.18.9) (2023-12-13)
+
+
+### Bug Fixes
+
+* **button:** creator block styles fixed ([2ecef7c](https://github.com/synerise/synerise-design/commit/2ecef7ce5bd12b9b6d3c52b913b66852babfa15d))
+
+
+
+
+
 ## [0.18.8](https://github.com/synerise/synerise-design/compare/@synerise/ds-button@0.18.7...@synerise/ds-button@0.18.8) (2023-12-11)
 
 **Note:** Version bump only for package @synerise/ds-button

package/dist/Checkbox/Checkbox.types.d.ts

@@ -6,6 +6,7 @@ export interface CheckboxButtonProps extends ButtonPropsOmitted {
     hasError?: boolean;
     indeterminate?: boolean;
     onChange?: (checked: boolean) => void;
+    className?: string;
 }
 export interface ButtonCheckboxIconProps {
     checked?: boolean;

package/dist/Creator/Creator.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { CreatorProps } from './Creator.types';
-declare const Creator: React.FC<CreatorProps>;
+declare const Creator: ({ onClick, disabled, label, block, status, className }: CreatorProps) => JSX.Element;
 export default Creator;

package/dist/Creator/Creator.js

@@ -1,4 +1,5 @@
-import * as React from 'react';
+import React from 'react';
+import classnames from 'classnames';
 import Icon, { AddM } from '@synerise/ds-icon';
 import * as S from './Creator.styles';
 
@@ -7,7 +8,8 @@ var Creator = function Creator(_ref) {
       disabled = _ref.disabled,
       label = _ref.label,
       block = _ref.block,
-      status = _ref.status;
+      status = _ref.status,
+      className = _ref.className;
 
   var _React$useState = React.useState(false),
       pressed = _React$useState[0],
@@ -21,7 +23,7 @@ var Creator = function Creator(_ref) {
   }, []);
   return /*#__PURE__*/React.createElement(S.Creator, {
     block: block,
-    className: "ds-button-creator",
+    className: classnames([className, 'ds-button-creator']),
     disabled: disabled,
     onClick: onClick,
     onMouseDown: onPress,

package/dist/Creator/Creator.styles.d.ts

@@ -1,5 +1,5 @@
 export declare const CreatorLabel: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const Creator: import("styled-components").StyledComponent<({ pressed, withLabel, ...rest }: any) => JSX.Element, any, {
+export declare const Creator: import("styled-components").StyledComponent<({ status, pressed, withLabel, ...rest }: any) => JSX.Element, any, {
     withLabel: boolean;
     pressed: boolean;
     status: string;

package/dist/Creator/Creator.styles.js

@@ -1,4 +1,4 @@
-var _excluded = ["pressed", "withLabel"];
+var _excluded = ["status", "pressed", "withLabel"];
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
@@ -27,7 +27,8 @@ var uploadStyles = function uploadStyles(_ref2) {
 };
 
 export var Creator = styled(function (_ref3) {
-  var pressed = _ref3.pressed,
+  var status = _ref3.status,
+      pressed = _ref3.pressed,
       withLabel = _ref3.withLabel,
       rest = _objectWithoutPropertiesLoose(_ref3, _excluded);
 
@@ -35,19 +36,19 @@ export var Creator = styled(function (_ref3) {
 }).withConfig({
   displayName: "Creatorstyles__Creator",
   componentId: "sc-1w96u6h-1"
-})(["&&&{width:", ";opacity:", ";height:48px;", " padding:0;border-radius:3px;border:1px dashed ", ";background:transparent;transition:all 0.3s ease;justify-content:", ";align-items:center;", "{margin:auto 12px;svg{transition:all 0.3s ease;color:", ";fill:", ";}}", "{background-color:", ";}", "{display:none;}&:hover:not(:disabled){", "{svg{color:", " !important;fill:", " !important;}}", "{color:", ";}}&:hover:not(:disabled):not(:focus){border:1px dashed ", ";background-color:", ";}", " &:focus:active{border:1px dashed ", " !important;box-shadow:none;background-color:", ";}&:focus{border:1px dashed ", ";box-shadow:none;}&:disabled{border-color:", ";background-color:", ";}", " ", "}"], function (props) {
+})(["&&&{width:", ";opacity:", ";height:48px;padding:", ";border-radius:3px;border:1px dashed ", ";background:transparent;transition:all 0.3s ease;justify-content:", ";align-items:center;", "{margin:auto 12px;svg{transition:all 0.3s ease;color:", ";fill:", ";}}", "{background-color:", ";}", "{display:none;}&:hover:not(:disabled){", "{svg{color:", " !important;fill:", " !important;}}", "{color:", ";}}&:hover:not(:disabled):not(:focus){border:1px dashed ", ";background-color:", ";}", " &:focus:active{border:1px dashed ", " !important;box-shadow:none;background-color:", ";}&:focus{border:1px dashed ", ";box-shadow:none;}&:disabled{border-color:", ";background-color:", ";}", " ", "}"], function (props) {
   if (!props.withLabel) return '48px';
   if (props.block) return '100%';
   return 'auto';
 }, function (props) {
   return props.disabled ? "0.4" : '1';
 }, function (props) {
-  return props.withLabel && !props.block && "min-width: 200px;";
+  return props.withLabel ? "0 12px 0 0" : '0';
 }, function (_ref4) {
   var theme = _ref4.theme;
   return theme.palette['grey-400'];
 }, function (props) {
-  return props.withLabel ? "flex-start" : 'center';
+  return props.withLabel && !props.block ? "flex-start" : 'center';
 }, IconContainer, function (props) {
   return props.theme.palette['grey-500'];
 }, function (props) {

package/dist/Creator/Creator.types.d.ts

@@ -10,4 +10,5 @@ export interface CreatorProps {
     label?: string | React.ReactNode;
     block?: boolean;
     status?: CreatorStatus;
+    className?: string;
 }

package/dist/Expander/Expander.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ExpanderProps } from './Expander.types';
-declare const Expander: React.FC<ExpanderProps>;
+declare const Expander: ({ size, expanded, disabled, onClick, className }: ExpanderProps) => JSX.Element;
 export default Expander;

package/dist/Expander/Expander.js

@@ -1,4 +1,5 @@
-import * as React from 'react';
+import React from 'react';
+import classnames from 'classnames';
 import Icon, { AngleDownS } from '@synerise/ds-icon';
 import * as S from './Expander.styles';
 import { ExpanderSize } from './Expander.types';
@@ -8,11 +9,12 @@ var Expander = function Expander(_ref) {
       size = _ref$size === void 0 ? 'S' : _ref$size,
       expanded = _ref.expanded,
       disabled = _ref.disabled,
-      onClick = _ref.onClick;
+      onClick = _ref.onClick,
+      className = _ref.className;
   return /*#__PURE__*/React.createElement(S.Expander, {
     onClick: onClick,
     size: ExpanderSize[size],
-    className: "ds-expander",
+    className: classnames([className, 'ds-expander']),
     expanded: expanded,
     disabled: disabled
   }, /*#__PURE__*/React.createElement(Icon, {

package/dist/Expander/Expander.types.d.ts

@@ -8,4 +8,5 @@ export interface ExpanderProps {
     size?: 'S' | 'M';
     disabled?: boolean;
     expanded?: boolean;
+    className?: string;
 }

package/dist/Star/Star.types.d.ts

@@ -3,5 +3,6 @@ type ButtonPropsOmitted = Omit<ButtonProps, 'type' | 'block' | 'color' | 'groupV
 export interface StarButtonProps extends ButtonPropsOmitted {
     active?: boolean;
     hasError?: boolean;
+    className?: string;
 }
 export {};

package/dist/index.d.ts

@@ -7,8 +7,8 @@ import * as ExpanderStyles from './Expander/Expander.styles';
 import * as StarStyles from './Star/Star.styles';
 declare class Button extends React.Component<ButtonProps> {
     static readonly Checkbox: (props: import("./Checkbox/Checkbox.types").CheckboxButtonProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
-    static readonly Creator: React.FC<import("./Creator/Creator.types").CreatorProps>;
-    static readonly Expander: React.FC<import("./Expander/Expander.types").ExpanderProps>;
+    static readonly Creator: ({ onClick, disabled, label, block, status, className }: import("./Creator/Creator.types").CreatorProps) => JSX.Element;
+    static readonly Expander: ({ size, expanded, disabled, onClick, className }: import("./Expander/Expander.types").ExpanderProps) => JSX.Element;
     static readonly Star: (props: import("./Star/Star.types").StarButtonProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
     render(): JSX.Element;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-button",
-  "version": "0.18.8",
+  "version": "0.18.10",
   "description": "Button UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "synerise/synerise-design",
@@ -33,7 +33,8 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-icon": "^0.58.8"
+    "@synerise/ds-icon": "^0.59.0",
+    "classnames": "2.3.2"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -42,9 +43,9 @@
     "styled-components": "5.0.1"
   },
   "devDependencies": {
-    "@synerise/ds-utils": "^0.24.22",
+    "@synerise/ds-utils": "^0.24.23",
     "@testing-library/react": "10.0.1",
     "csstype": "2.6.9"
   },
-  "gitHead": "5ab278e69cd049334216bc9867cca2ce6a5fc218"
+  "gitHead": "ba51e38beff83b8adba409f09311131f429ada01"
 }