@speakapbv/dough-component-library 9.10.0 → 9.11.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/components/button/button.d.ts +1 -0
  2. package/dist/components/drop-menu/drop-menu.d.ts +1 -0
  3. package/dist/index.es.js +7 -6
  4. package/dist/index.js +7 -6
  5. package/package.json +1 -1
package/dist/components/button/button.d.ts CHANGED
@@ -8,6 +8,7 @@ export declare enum ButtonInputType {
8
8
  LINK = "link"
9
9
  }
10
10
  export interface ButtonProps {
11
+ alignIconRight?: boolean;
11
12
  className?: string;
12
13
  children?: ReactNode;
13
14
  dataAttributes?: DoughDataAttributes;
package/dist/components/drop-menu/drop-menu.d.ts CHANGED
@@ -6,6 +6,7 @@ export declare type DoughDropMenuRef = {
6
6
  hide(): void;
7
7
  };
8
8
  export interface DropMenuProps {
9
+ alignIconRight?: boolean;
9
10
  className?: string;
10
11
  children?: ReactNode;
11
12
  dataAttributes?: DoughDataAttributes;
package/dist/index.es.js CHANGED
@@ -607,8 +607,8 @@ var Button = function (props) {
607
607
  var doubleClickPrevent = false;
608
608
  var clickTime = 0;
609
609
  var doubleClickDuration = 250;
610
- var _a = props.shadow, shadow = _a === void 0 ? true : _a, _b = props.padding, padding = _b === void 0 ? true : _b, _c = props.size, size = _c === void 0 ? Sizes.SMALL : _c, _d = props.type, type = _d === void 0 ? ButtonInputType.BUTTON : _d, _e = props.linkProps, linkProps = _e === void 0 ? {} : _e;
611
- var _f = useState(props.color ? props.color : Colors.BUTTON), colorVal = _f[0], setColorVal = _f[1];
610
+ var _a = props.alignIconRight, alignIconRight = _a === void 0 ? false : _a, _b = props.shadow, shadow = _b === void 0 ? true : _b, _c = props.padding, padding = _c === void 0 ? true : _c, _d = props.size, size = _d === void 0 ? Sizes.SMALL : _d, _e = props.type, type = _e === void 0 ? ButtonInputType.BUTTON : _e, _f = props.linkProps, linkProps = _f === void 0 ? {} : _f;
611
+ var _g = useState(props.color ? props.color : Colors.BUTTON), colorVal = _g[0], setColorVal = _g[1];
612
612
  var initColorVal = useState(props.color ? props.color : Colors.BUTTON)[0];
613
613
  var buttonRef = useRef(null);
614
614
  var clickAndDoubleClickHandler = function (eNative, e, handler) {
@@ -720,6 +720,7 @@ var Button = function (props) {
720
720
  "dough-button-wait": props.busy,
721
721
  "dough-button-disabled": props.disabled,
722
722
  }) },
723
+ props.icon && !alignIconRight && (React.createElement("div", { className: "dough-button-icon" }, props.icon)),
723
724
  React.createElement("div", { className: cn("dough-button-background-wrapper", initColorVal) },
724
725
  props.color && props.color.match("dough-color-text") && (React.createElement(React.Fragment, null,
725
726
  props.border && (React.createElement("svg", { className: "dough-button-background-wrapper-border-svg" },
@@ -730,7 +731,7 @@ var Button = function (props) {
730
731
  props.busy && (React.createElement("div", { className: "dough-button-waiter" },
731
732
  React.createElement("svg", { width: "100%", height: "100%" },
732
733
  React.createElement("rect", { width: "100%", height: "100%", fill: "currentColor" }))))),
733
- props.icon && (React.createElement("div", { className: "dough-button-icon" }, props.icon)),
734
+ props.icon && alignIconRight && (React.createElement("div", { className: "dough-button-icon" }, props.icon)),
734
735
  React.createElement("div", { className: "dough-button-label" },
735
736
  props.label && React.createElement(React.Fragment, null, props.label),
736
737
  !props.label && props.children && props.children))); };
@@ -1507,9 +1508,9 @@ var css_248z$c = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium
1507
1508
  styleInject(css_248z$c);
1508
1509
 
1509
1510
  var DropMenu = forwardRef(function (props, ref) {
1510
- var _a = props.color, color = _a === void 0 ? Colors.TRANSPARENT : _a, _b = props.closeOnClickOutside, closeOnClickOutside = _b === void 0 ? true : _b, _c = props.closeOnEscape, closeOnEscape = _c === void 0 ? true : _c, _d = props.disabled, disabled = _d === void 0 ? false : _d, _e = props.showCaret, showCaret = _e === void 0 ? true : _e, _f = props.rightShift, rightShift = _f === void 0 ? 0 : _f, _g = props.shadow, shadow = _g === void 0 ? false : _g, _h = props.show, show = _h === void 0 ? false : _h, _j = props.rounded, rounded = _j === void 0 ? true : _j, _k = props.icon, icon = _k === void 0 ? React.createElement(EllipsisVIcon, null) : _k, _l = props.size, size = _l === void 0 ? Sizes.SMALL : _l, _m = props.innerButtonSize, innerButtonSize = _m === void 0 ? Sizes.NORMAL : _m;
1511
+ var _a = props.alignIconRight, alignIconRight = _a === void 0 ? false : _a, _b = props.color, color = _b === void 0 ? Colors.TRANSPARENT : _b, _c = props.closeOnClickOutside, closeOnClickOutside = _c === void 0 ? true : _c, _d = props.closeOnEscape, closeOnEscape = _d === void 0 ? true : _d, _e = props.disabled, disabled = _e === void 0 ? false : _e, _f = props.showCaret, showCaret = _f === void 0 ? true : _f, _g = props.rightShift, rightShift = _g === void 0 ? 0 : _g, _h = props.shadow, shadow = _h === void 0 ? false : _h, _j = props.show, show = _j === void 0 ? false : _j, _k = props.rounded, rounded = _k === void 0 ? true : _k, _l = props.icon, icon = _l === void 0 ? React.createElement(EllipsisVIcon, null) : _l, _m = props.size, size = _m === void 0 ? Sizes.SMALL : _m, _o = props.innerButtonSize, innerButtonSize = _o === void 0 ? Sizes.NORMAL : _o;
1511
1512
  var componentRef = useRef(null);
1512
- var _o = useState(false), showDropArea = _o[0], setShowDropArea = _o[1];
1513
+ var _p = useState(false), showDropArea = _p[0], setShowDropArea = _p[1];
1513
1514
  var openDropArea = function (e) {
1514
1515
  var _a, _b;
1515
1516
  cancelEvent(e);
@@ -1581,7 +1582,7 @@ var DropMenu = forwardRef(function (props, ref) {
1581
1582
  "dough-dropmenu-as-line": props.asInvisibleLine,
1582
1583
  "dough-dropmenu-full-width": props.fullWidth,
1583
1584
  }), ref: componentRef }, props.dataAttributes),
1584
- props.asInvisibleLine !== true && (React.createElement(Button, { className: cn("dough-drop-menu-button", props.buttonClassName), color: color, disabled: disabled, icon: icon, padding: props.padding, fullWidth: props.fullWidth, label: props.label, onClick: function (e) {
1585
+ props.asInvisibleLine !== true && (React.createElement(Button, { className: cn("dough-drop-menu-button", props.buttonClassName), color: color, disabled: disabled, icon: icon, alignIconRight: alignIconRight, padding: props.padding, fullWidth: props.fullWidth, label: props.label, onClick: function (e) {
1585
1586
  if (showDropArea === true) {
1586
1587
  closeDropArea();
1587
1588
  }
package/dist/index.js CHANGED
@@ -602,8 +602,8 @@ var Button = function (props) {
602
602
  var doubleClickPrevent = false;
603
603
  var clickTime = 0;
604
604
  var doubleClickDuration = 250;
605
- var _a = props.shadow, shadow = _a === void 0 ? true : _a, _b = props.padding, padding = _b === void 0 ? true : _b, _c = props.size, size = _c === void 0 ? exports.Sizes.SMALL : _c, _d = props.type, type = _d === void 0 ? exports.ButtonInputType.BUTTON : _d, _e = props.linkProps, linkProps = _e === void 0 ? {} : _e;
606
- var _f = React.useState(props.color ? props.color : exports.Colors.BUTTON), colorVal = _f[0], setColorVal = _f[1];
605
+ var _a = props.alignIconRight, alignIconRight = _a === void 0 ? false : _a, _b = props.shadow, shadow = _b === void 0 ? true : _b, _c = props.padding, padding = _c === void 0 ? true : _c, _d = props.size, size = _d === void 0 ? exports.Sizes.SMALL : _d, _e = props.type, type = _e === void 0 ? exports.ButtonInputType.BUTTON : _e, _f = props.linkProps, linkProps = _f === void 0 ? {} : _f;
606
+ var _g = React.useState(props.color ? props.color : exports.Colors.BUTTON), colorVal = _g[0], setColorVal = _g[1];
607
607
  var initColorVal = React.useState(props.color ? props.color : exports.Colors.BUTTON)[0];
608
608
  var buttonRef = React.useRef(null);
609
609
  var clickAndDoubleClickHandler = function (eNative, e, handler) {
@@ -715,6 +715,7 @@ var Button = function (props) {
715
715
  "dough-button-wait": props.busy,
716
716
  "dough-button-disabled": props.disabled,
717
717
  }) },
718
+ props.icon && !alignIconRight && (React__default.createElement("div", { className: "dough-button-icon" }, props.icon)),
718
719
  React__default.createElement("div", { className: cn("dough-button-background-wrapper", initColorVal) },
719
720
  props.color && props.color.match("dough-color-text") && (React__default.createElement(React__default.Fragment, null,
720
721
  props.border && (React__default.createElement("svg", { className: "dough-button-background-wrapper-border-svg" },
@@ -725,7 +726,7 @@ var Button = function (props) {
725
726
  props.busy && (React__default.createElement("div", { className: "dough-button-waiter" },
726
727
  React__default.createElement("svg", { width: "100%", height: "100%" },
727
728
  React__default.createElement("rect", { width: "100%", height: "100%", fill: "currentColor" }))))),
728
- props.icon && (React__default.createElement("div", { className: "dough-button-icon" }, props.icon)),
729
+ props.icon && alignIconRight && (React__default.createElement("div", { className: "dough-button-icon" }, props.icon)),
729
730
  React__default.createElement("div", { className: "dough-button-label" },
730
731
  props.label && React__default.createElement(React__default.Fragment, null, props.label),
731
732
  !props.label && props.children && props.children))); };
@@ -1493,9 +1494,9 @@ var css_248z$c = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium
1493
1494
  styleInject(css_248z$c);
1494
1495
 
1495
1496
  var DropMenu = React.forwardRef(function (props, ref) {
1496
- var _a = props.color, color = _a === void 0 ? exports.Colors.TRANSPARENT : _a, _b = props.closeOnClickOutside, closeOnClickOutside = _b === void 0 ? true : _b, _c = props.closeOnEscape, closeOnEscape = _c === void 0 ? true : _c, _d = props.disabled, disabled = _d === void 0 ? false : _d, _e = props.showCaret, showCaret = _e === void 0 ? true : _e, _f = props.rightShift, rightShift = _f === void 0 ? 0 : _f, _g = props.shadow, shadow = _g === void 0 ? false : _g, _h = props.show, show = _h === void 0 ? false : _h, _j = props.rounded, rounded = _j === void 0 ? true : _j, _k = props.icon, icon = _k === void 0 ? React__default.createElement(EllipsisVIcon, null) : _k, _l = props.size, size = _l === void 0 ? exports.Sizes.SMALL : _l, _m = props.innerButtonSize, innerButtonSize = _m === void 0 ? exports.Sizes.NORMAL : _m;
1497
+ var _a = props.alignIconRight, alignIconRight = _a === void 0 ? false : _a, _b = props.color, color = _b === void 0 ? exports.Colors.TRANSPARENT : _b, _c = props.closeOnClickOutside, closeOnClickOutside = _c === void 0 ? true : _c, _d = props.closeOnEscape, closeOnEscape = _d === void 0 ? true : _d, _e = props.disabled, disabled = _e === void 0 ? false : _e, _f = props.showCaret, showCaret = _f === void 0 ? true : _f, _g = props.rightShift, rightShift = _g === void 0 ? 0 : _g, _h = props.shadow, shadow = _h === void 0 ? false : _h, _j = props.show, show = _j === void 0 ? false : _j, _k = props.rounded, rounded = _k === void 0 ? true : _k, _l = props.icon, icon = _l === void 0 ? React__default.createElement(EllipsisVIcon, null) : _l, _m = props.size, size = _m === void 0 ? exports.Sizes.SMALL : _m, _o = props.innerButtonSize, innerButtonSize = _o === void 0 ? exports.Sizes.NORMAL : _o;
1497
1498
  var componentRef = React.useRef(null);
1498
- var _o = React.useState(false), showDropArea = _o[0], setShowDropArea = _o[1];
1499
+ var _p = React.useState(false), showDropArea = _p[0], setShowDropArea = _p[1];
1499
1500
  var openDropArea = function (e) {
1500
1501
  var _a, _b;
1501
1502
  cancelEvent(e);
@@ -1567,7 +1568,7 @@ var DropMenu = React.forwardRef(function (props, ref) {
1567
1568
  "dough-dropmenu-as-line": props.asInvisibleLine,
1568
1569
  "dough-dropmenu-full-width": props.fullWidth,
1569
1570
  }), ref: componentRef }, props.dataAttributes),
1570
- props.asInvisibleLine !== true && (React__default.createElement(Button, { className: cn("dough-drop-menu-button", props.buttonClassName), color: color, disabled: disabled, icon: icon, padding: props.padding, fullWidth: props.fullWidth, label: props.label, onClick: function (e) {
1571
+ props.asInvisibleLine !== true && (React__default.createElement(Button, { className: cn("dough-drop-menu-button", props.buttonClassName), color: color, disabled: disabled, icon: icon, alignIconRight: alignIconRight, padding: props.padding, fullWidth: props.fullWidth, label: props.label, onClick: function (e) {
1571
1572
  if (showDropArea === true) {
1572
1573
  closeDropArea();
1573
1574
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@speakapbv/dough-component-library",
3
- "version": "9.10.0",
3
+ "version": "9.11.0",
4
4
  "description": "DOUGH: Speakap React Component Library",
5
5
  "author": "Speakap",
6
6
  "license": "MIT",