@momentum-design/components 0.129.13 → 0.129.15

package/dist/components/buttongroup/buttongroup.component.js

@@ -13,24 +13,22 @@ import { Component } from '../../models';
 import { DEFAULTS } from './buttongroup.constants';
 import styles from './buttongroup.styles';
 /**
- * buttongroup component, is a wrapper to group multiple buttons.
- * It can support icon buttons, combination of icon and pill buttons, and text buttons.
- * Button group can be positioned in horizontal orientation and vertical orientation.
+ * `mdc-buttongroup` is a wrapper component that groups multiple buttons together.
  *
- * The sizes of buttons within the button group can be set using the `size` attribute on the button group,
- * which will apply the size to all buttons within the group.
+ * ## Supported button types
+ * - Icon buttons
+ * - Pill buttons
+ * - Combination of icon and pill buttons
  *
- * Buttons of sizes 24, 28, 32, and 40 are only supported inside a button group. Default size is 28.
+ * ## Features
+ * - Horizontal or vertical orientation
+ * - Unified size and variant applied to all child buttons
+ * - Optional compact mode for reduced height
+ * - Supported sizes: 24, 28 (default), 32, 40
  *
- * The variant of buttons within the button group can be set using the `variant` attribute on the button group,
- * which will apply the variant to all buttons within the group. Default variant is `primary`.
- *
- * All buttons are placed horizontally by default. To change the orientation to vertical, set the `orientation` attribute to `vertical`.
- *
- * Things to note:
- * - Button group will allow only `mdc-button` components as its direct children.
- * - Button group will set the `size` and `variant` attributes on the buttons within it,
- *   so any `size` or `variant` set directly on any button will be overridden.
+ * ## Usage
+ * - Only `mdc-button` components are allowed as direct children
+ * - The `size` and `variant` set on buttongroup override individual button settings
  *
  * @tagname mdc-buttongroup
  *
@@ -46,23 +44,30 @@ class ButtonGroup extends Component {
     constructor() {
         super(...arguments);
         /**
-         * Orientation of the buttongroup.
+         * Layout direction of the buttons within the group.
+         * - `horizontal`: Buttons are arranged side by side (default)
+         * - `vertical`: Buttons are stacked vertically
          * @default 'horizontal'
          */
         this.orientation = DEFAULTS.ORIENTATION;
         /**
-         * Variant of the buttons within the buttongroup.
+         * Visual style variant applied to all buttons in the group.
+         * - `primary`: Solid background color
+         * - `secondary`: Transparent background with solid border
+         * - `tertiary`: No background or border, text-only appearance
          * @default 'primary'
          */
         this.variant = DEFAULTS.VARIANT;
         /**
-         * Size of the buttons within the buttongroup.
-         * @default '28'
+         * Size applied to all buttons in the group.
+         * Available sizes: 24, 28, 32, 40
+         * @default 28
          */
         this.size = DEFAULTS.SIZE;
         /**
-         * When this is true, the buttons within the buttongroup will be compact.
-         * i.e. Irrespective of the size of the buttons, they will have a height of 24px.
+         * Enables compact mode with reduced height.
+         * When true, all buttons have a fixed height of 24px regardless of their size setting.
+         * Useful for space-constrained layouts.
          * @default false
          */
         this.compact = false;

package/dist/components/buttonsimple/buttonsimple.component.d.ts

@@ -9,16 +9,18 @@ declare const Buttonsimple_base: import("../../utils/mixins/index.types").Constr
  * It is used as an internal component and is not intended to be used directly by consumers.
  * Consumers should use the `mdc-button` component instead.
  *
+ * @tagname mdc-buttonsimple
+ *
+ * @slot - Text label of the button.
+ *
  * @event click - (React: onClick) This event is dispatched when the button is clicked.
  * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the button.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the button.
  * @event focus - (React: onFocus) This event is dispatched when the button receives focus.
  *
- * @tagname mdc-buttonsimple
- *
  * @cssproperty --mdc-button-height - Height for button size
  * @cssproperty --mdc-button-background - Background color of the button
- * @cssproperty --mdc-button-border-color - Borer color of the button
+ * @cssproperty --mdc-button-border-color - Border color of the button
  * @cssproperty --mdc-button-text-color - Text color of the button
  */
 declare class Buttonsimple extends Buttonsimple_base {

package/dist/components/buttonsimple/buttonsimple.component.js

@@ -21,16 +21,18 @@ import styles from './buttonsimple.styles';
  * It is used as an internal component and is not intended to be used directly by consumers.
  * Consumers should use the `mdc-button` component instead.
  *
+ * @tagname mdc-buttonsimple
+ *
+ * @slot - Text label of the button.
+ *
  * @event click - (React: onClick) This event is dispatched when the button is clicked.
  * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the button.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the button.
  * @event focus - (React: onFocus) This event is dispatched when the button receives focus.
  *
- * @tagname mdc-buttonsimple
- *
  * @cssproperty --mdc-button-height - Height for button size
  * @cssproperty --mdc-button-background - Background color of the button
- * @cssproperty --mdc-button-border-color - Borer color of the button
+ * @cssproperty --mdc-button-border-color - Border color of the button
  * @cssproperty --mdc-button-text-color - Text color of the button
  */
 class Buttonsimple extends AutoFocusOnMountMixin(TabIndexMixin(DisabledMixin(Component))) {