@linzjs/lui 21.20.0 → 21.21.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [21.21.0](https://github.com/linz/lui/compare/v21.20.0...v21.21.0) (2024-02-13)
+
+
+### Features
+
+* **LuiTab:** exposes button props ([#1095](https://github.com/linz/lui/issues/1095)) ([476aac1](https://github.com/linz/lui/commit/476aac1608298588c8854c9055bc25d1db549d18))
+
 # [21.20.0](https://github.com/linz/lui/compare/v21.19.0...v21.20.0) (2024-02-12)
 
 

package/dist/components/LuiTabs/LuiTab/LuiTab.d.ts

@@ -1,11 +1,11 @@
-import React, { MouseEvent } from 'react';
-interface LuiTabProps {
+import React, { ButtonHTMLAttributes, MouseEvent } from 'react';
+export interface LuiTabProps {
     onClick: (e: MouseEvent) => void | (() => void);
     active: boolean;
     id: string;
     ariaControls: string;
     titleAttribute?: string;
     children: React.ReactNode;
+    buttonProps?: Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className' | 'id' | 'aria-selected' | 'aria-controls' | 'title' | 'onClick' | 'children'>;
 }
 export declare const LuiTab: React.FC<React.PropsWithChildren<LuiTabProps>>;
-export {};

package/dist/components/LuiTabs/LuiTabsPanelSwitch/LuiTabsPanelSwitch.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
-interface LuiTabsPanelSwitch {
+import { LuiTabProps } from '../LuiTab/LuiTab';
+interface LuiTabsPanelSwitch extends Omit<LuiTabProps, 'id' | 'ariaControls' | 'active' | 'onClick' | 'children'> {
     targetPanel: string;
     setActivePanel?: (targetPanel: string) => {};
 }

package/dist/index.js

@@ -31659,7 +31659,7 @@ var LuiTabs = function (props) {
 };
 
 var LuiTab = function (props) {
-    return (React__default["default"].createElement("button", { className: clsx('LuiTab', props.active && 'LuiTab--active'), id: props.id, role: "tab", type: "button", "aria-selected": props.active, "aria-controls": "".concat(props.ariaControls), title: props.titleAttribute, onClick: props.onClick }, props.children));
+    return (React__default["default"].createElement("button", __assign({ className: clsx('LuiTab', props.active && 'LuiTab--active'), id: props.id, role: "tab", type: "button", "aria-selected": props.active, "aria-controls": "".concat(props.ariaControls), title: props.titleAttribute, onClick: props.onClick }, props.buttonProps), props.children));
 };
 
 // import './LuiTabsGroup.scss';
@@ -31681,12 +31681,13 @@ var LuiTabsPanel = function (_a) {
 };
 
 var LuiTabsPanelSwitch = function (props) {
+    var targetPanel = props.targetPanel; props.setActivePanel; var children = props.children, tabProps = __rest(props, ["targetPanel", "setActivePanel", "children"]);
     var context = React.useContext(LuiTabsContext);
-    var active = context.activePanel === props.targetPanel;
-    return (React__default["default"].createElement(LuiTab, { id: "".concat(props.targetPanel, "-tab"), ariaControls: "".concat(props.targetPanel, "-tab-panel"), active: active, onClick: function () {
+    var active = context.activePanel === targetPanel;
+    return (React__default["default"].createElement(LuiTab, __assign({ id: "".concat(targetPanel, "-tab"), ariaControls: "".concat(targetPanel, "-tab-panel"), active: active, onClick: function () {
             if (context.setActivePanel)
-                context.setActivePanel(props.targetPanel);
-        } }, props.children));
+                context.setActivePanel(targetPanel);
+        } }, tabProps), children));
 };
 
 var css_248z$g = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.LuiError {\n  font-family: \"Open Sans\", system-ui, sans-serif;\n  font-style: normal;\n  font-weight: 600;\n  margin-bottom: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.5rem;\n  color: #2a292c;\n}\n.LuiError-errorIcon {\n  vertical-align: middle;\n  display: inline-block;\n}\n.LuiError-errorText {\n  margin-left: 0.5rem;\n}";