@kaizen/components 1.64.14 → 1.65.0

package/dist/cjs/__future__/Tabs/Tabs.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var reactAriaComponents = require('react-aria-components');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081929117/Tabs Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tabs--controlled Storybook}
+ *
+ * Wrapper around all of the tab subcomponents
+ * Holds a TabList and TabPanels
+ */
+var Tabs = function (props) {
+  return React__default.default.createElement(reactAriaComponents.Tabs, tslib.__assign({}, props));
+};
+exports.Tabs = Tabs;

package/dist/cjs/__future__/Tabs/subcomponents/Tab/Tab.cjs

@@ -0,0 +1,39 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var reactAriaComponents = require('react-aria-components');
+var Badge = require('../../../../Badge/Badge.cjs');
+var Tab_module = require('./Tab.module.css.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+
+/**
+ * A tab button
+ */
+var Tab = function (props) {
+  var badge = props.badge,
+    children = props.children,
+    className = props.className,
+    restProps = tslib.__rest(props, ["badge", "children", "className"]);
+  var tabProps = tslib.__assign({
+    className: classnames__default.default(Tab_module.tab, className)
+  }, restProps);
+  return React__default.default.createElement(reactAriaComponents.Tab, tslib.__assign({}, tabProps), function (_a) {
+    var isSelected = _a.isSelected,
+      isFocusVisible = _a.isFocusVisible,
+      isHovered = _a.isHovered;
+    return React__default.default.createElement(React__default.default.Fragment, null, children, badge && React__default.default.createElement("span", {
+      className: Tab_module.badge
+    }, React__default.default.createElement(Badge.Badge, {
+      variant: isSelected || isFocusVisible || isHovered ? "active" : "default"
+    }, badge)));
+  });
+};
+exports.Tab = Tab;

package/dist/cjs/__future__/Tabs/subcomponents/Tab/Tab.module.css.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "tab": "Tab-module_tab__-XtyL",
+  "badge": "Tab-module_badge__Zfili"
+};
+module.exports = styles;

package/dist/cjs/__future__/Tabs/subcomponents/TabList/TabList.cjs

@@ -0,0 +1,31 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var reactAriaComponents = require('react-aria-components');
+var TabList_module = require('./TabList.module.css.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+
+/**
+ * Wrapper for the tabs themselves
+ */
+var TabList = function (props) {
+  var ariaLabel = props["aria-label"],
+    _a = props.noPadding,
+    noPadding = _a === void 0 ? false : _a,
+    children = props.children,
+    className = props.className,
+    restProps = tslib.__rest(props, ["aria-label", "noPadding", "children", "className"]);
+  return React__default.default.createElement(reactAriaComponents.TabList, tslib.__assign({
+    "aria-label": ariaLabel,
+    className: classnames__default.default(TabList_module.tabList, className, noPadding && TabList_module.noPadding)
+  }, restProps), children);
+};
+exports.TabList = TabList;

package/dist/cjs/__future__/Tabs/subcomponents/TabList/TabList.module.css.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var styles = {
+  "tabList": "TabList-module_tabList__e1qAi",
+  "noPadding": "TabList-module_noPadding__YM23K"
+};
+module.exports = styles;

package/dist/cjs/__future__/Tabs/subcomponents/TabPanel/TabPanel.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var reactAriaComponents = require('react-aria-components');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+/**
+ * Wrapper for the content that shows when tab is active
+ */
+var TabPanel = function (props) {
+  var className = props.className,
+    children = props.children,
+    restProps = tslib.__rest(props, ["className", "children"]);
+  return React__default.default.createElement(reactAriaComponents.TabPanel, tslib.__assign({
+    className: className
+  }, restProps), children);
+};
+exports.TabPanel = TabPanel;

package/dist/cjs/future.cjs

@@ -3,6 +3,14 @@
 var Select = require('./__future__/Select/Select.cjs');
 var RemovableTag = require('./__future__/Tag/RemovableTag/RemovableTag.cjs');
 var Tag = require('./__future__/Tag/Tag/Tag.cjs');
+var Tabs = require('./__future__/Tabs/Tabs.cjs');
+var Tab = require('./__future__/Tabs/subcomponents/Tab/Tab.cjs');
+var TabList = require('./__future__/Tabs/subcomponents/TabList/TabList.cjs');
+var TabPanel = require('./__future__/Tabs/subcomponents/TabPanel/TabPanel.cjs');
 exports.Select = Select.Select;
 exports.RemovableTag = RemovableTag.RemovableTag;
 exports.Tag = Tag.Tag;
+exports.Tabs = Tabs.Tabs;
+exports.Tab = Tab.Tab;
+exports.TabList = TabList.TabList;
+exports.TabPanel = TabPanel.TabPanel;

package/dist/esm/__future__/Tabs/Tabs.mjs

@@ -0,0 +1,15 @@
+import { __assign } from 'tslib';
+import React from 'react';
+import { Tabs as Tabs$1 } from 'react-aria-components';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081929117/Tabs Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tabs--controlled Storybook}
+ *
+ * Wrapper around all of the tab subcomponents
+ * Holds a TabList and TabPanels
+ */
+var Tabs = function (props) {
+  return /*#__PURE__*/React.createElement(Tabs$1, __assign({}, props));
+};
+export { Tabs };

package/dist/esm/__future__/Tabs/subcomponents/Tab/Tab.mjs

@@ -0,0 +1,30 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import { Tab as Tab$1 } from 'react-aria-components';
+import { Badge } from '../../../../Badge/Badge.mjs';
+import styles from './Tab.module.css.mjs';
+
+/**
+ * A tab button
+ */
+var Tab = function (props) {
+  var badge = props.badge,
+    children = props.children,
+    className = props.className,
+    restProps = __rest(props, ["badge", "children", "className"]);
+  var tabProps = __assign({
+    className: classnames(styles.tab, className)
+  }, restProps);
+  return /*#__PURE__*/React.createElement(Tab$1, __assign({}, tabProps), function (_a) {
+    var isSelected = _a.isSelected,
+      isFocusVisible = _a.isFocusVisible,
+      isHovered = _a.isHovered;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children, badge && ( /*#__PURE__*/React.createElement("span", {
+      className: styles.badge
+    }, /*#__PURE__*/React.createElement(Badge, {
+      variant: isSelected || isFocusVisible || isHovered ? "active" : "default"
+    }, badge))));
+  });
+};
+export { Tab };

package/dist/esm/__future__/Tabs/subcomponents/Tab/Tab.module.css.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "tab": "Tab-module_tab__-XtyL",
+  "badge": "Tab-module_badge__Zfili"
+};
+export { styles as default };

package/dist/esm/__future__/Tabs/subcomponents/TabList/TabList.mjs

@@ -0,0 +1,22 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import { TabList as TabList$1 } from 'react-aria-components';
+import styles from './TabList.module.css.mjs';
+
+/**
+ * Wrapper for the tabs themselves
+ */
+var TabList = function (props) {
+  var ariaLabel = props["aria-label"],
+    _a = props.noPadding,
+    noPadding = _a === void 0 ? false : _a,
+    children = props.children,
+    className = props.className,
+    restProps = __rest(props, ["aria-label", "noPadding", "children", "className"]);
+  return /*#__PURE__*/React.createElement(TabList$1, __assign({
+    "aria-label": ariaLabel,
+    className: classnames(styles.tabList, className, noPadding && styles.noPadding)
+  }, restProps), children);
+};
+export { TabList };

package/dist/esm/__future__/Tabs/subcomponents/TabList/TabList.module.css.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "tabList": "TabList-module_tabList__e1qAi",
+  "noPadding": "TabList-module_noPadding__YM23K"
+};
+export { styles as default };

package/dist/esm/__future__/Tabs/subcomponents/TabPanel/TabPanel.mjs

@@ -0,0 +1,16 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import { TabPanel as TabPanel$1 } from 'react-aria-components';
+
+/**
+ * Wrapper for the content that shows when tab is active
+ */
+var TabPanel = function (props) {
+  var className = props.className,
+    children = props.children,
+    restProps = __rest(props, ["className", "children"]);
+  return /*#__PURE__*/React.createElement(TabPanel$1, __assign({
+    className: className
+  }, restProps), children);
+};
+export { TabPanel };

package/dist/esm/future.mjs

@@ -1,3 +1,7 @@
 export { Select } from './__future__/Select/Select.mjs';
 export { RemovableTag } from './__future__/Tag/RemovableTag/RemovableTag.mjs';
 export { Tag } from './__future__/Tag/Tag/Tag.mjs';
+export { Tabs } from './__future__/Tabs/Tabs.mjs';
+export { Tab } from './__future__/Tabs/subcomponents/Tab/Tab.mjs';
+export { TabList } from './__future__/Tabs/subcomponents/TabList/TabList.mjs';
+export { TabPanel } from './__future__/Tabs/subcomponents/TabPanel/TabPanel.mjs';