@commercetools-uikit/accessible-button - npm Package Compare versions

dist/declarations/src/accessible-button.d.ts

		import { ReactNode, KeyboardEvent, ComponentType, MouseEvent } from 'react';
		export type TAccessibleButtonProps = {
		/**
		* By default the component renders a `button` element. You can pass an optional `React.ElemenType`
		* in case this needs to be rendered as a different element.
		*/
		as?: string \| ComponentType;
		/**
		* The ID of the element.
		*/
		id?: string;
		/**
		* The [type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button) of the `button` element.
		*/
		type?: 'submit' \| 'reset' \| 'button';
		/**
		* The aria-label value.
		*/
		label: string;
		/**
		* Any React node.
		*/
		children: ReactNode;
		/**
		* If `true`, indicates that this is a toggle button.
		*/
		isToggleButton?: boolean;
		/**
		* If `true`, indicates that this element is in a toggled state.
		* <br/>
		* This prop is only used if `isToggleButton` is `true`.
		*/
		isToggled?: boolean;
		/**
		* If `true`, indicates that the element is in a disabled state.
		*/
		isDisabled?: boolean;
		/**
		* Allow to override the styles by passing a `className` prop.
		* <br/>
		* Custom styles can also be passed using the [`css` prop from emotion](https://emotion.sh/docs/css-prop#style-precedence).
		*/
		className?: string;
		/**
		* Event handler when the button is clicked, or the user presses `ENTER` or `SPACE`.
		*/
		onClick?: (event: MouseEvent<HTMLButtonElement> \| KeyboardEvent<HTMLButtonElement>) => void;
		/**
		* Any HTML attributes to be forwarded to the HTML element.
		*/
		buttonAttributes?: Record<string, unknown>;
		@@ -14,0 +52,0 @@ };

package.json

		{
		"name": "@commercetools-uikit/accessible-button",
		"description": "A React component that you can use to wrap your buttons in an accessible <button/> element.",
		"version": "0.0.0-canary-20240805095513",
		"version": "0.0.0-canary-20240807084212",
		"bugs": "https://github.com/commercetools/ui-kit/issues",
		@@ -32,4 +32,4 @@ "repository": {
		"@babel/runtime-corejs3": "^7.20.13",
		"@commercetools-uikit/design-system": "0.0.0-canary-20240805095513",
		"@commercetools-uikit/utils": "0.0.0-canary-20240805095513",
		"@commercetools-uikit/design-system": "0.0.0-canary-20240807084212",
		"@commercetools-uikit/utils": "0.0.0-canary-20240807084212",
		"@emotion/react": "^11.10.5",
		@@ -36,0 +36,0 @@ "@emotion/styled": "^11.10.5",

New alerts