@alfalab/core-components-tab-bar 1.0.3 → 1.1.0

package/Component.js

@@ -7,15 +7,13 @@ var React = require('react');
 var cn = require('classnames');
 var coreComponentsShared = require('@alfalab/core-components-shared');
 var components_tab_Component = require('./components/tab/Component.js');
-require('@alfalab/core-components-badge');
-require('@alfalab/core-components-typography');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"tab-bar__component_15pc1","border":"tab-bar__border_15pc1"};
+var styles = {"component":"tab-bar__component_16z03","border":"tab-bar__border_16z03"};
 require('./index.css')
 
 var TabBarComponent = React.forwardRef(function (_a, ref) {

package/components/tab/Component.js

@@ -13,7 +13,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"tab-bar__component_1js6c","selected":"tab-bar__selected_1js6c","icon":"tab-bar__icon_1js6c","label":"tab-bar__label_1js6c","labelSelected":"tab-bar__labelSelected_1js6c","indicator":"tab-bar__indicator_1js6c"};
+var styles = {"component":"tab-bar__component_lg08x","selected":"tab-bar__selected_lg08x","icon":"tab-bar__icon_lg08x","label":"tab-bar__label_lg08x","labelSelected":"tab-bar__labelSelected_lg08x","indicator":"tab-bar__indicator_lg08x"};
 require('./index.css')
 
 var TabComponent = React.forwardRef(function (_a, ref) {

package/components/tab/index.css

@@ -1,4 +1,4 @@
-/* hash: okzse */
+/* hash: 1ov0x */
 :root {
 } /* deprecated */ :root {
     --color-light-accent-primary: #ef3124;
@@ -19,7 +19,7 @@
     --gap-xs: 8px;
 } :root {
 } :root {
-} .tab-bar__component_1js6c {
+} .tab-bar__component_lg08x {
     box-sizing: border-box;
     background-color: transparent;
     -webkit-tap-highlight-color: transparent;
@@ -43,15 +43,15 @@
     align-items: center;
     padding: var(--gap-xs) 0;
     color: var(--color-light-neutral-translucent-700);
-} .tab-bar__selected_1js6c {
+} .tab-bar__selected_lg08x {
     color: var(--color-light-accent-primary);
-} .tab-bar__icon_1js6c {
+} .tab-bar__icon_lg08x {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
-} .tab-bar__label_1js6c {
+} .tab-bar__label_lg08x {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -60,9 +60,9 @@
     flex-shrink: 0;
 
     color: var(--color-light-text-secondary);
-} .tab-bar__labelSelected_1js6c {
+} .tab-bar__labelSelected_lg08x {
     color: inherit;
-} .tab-bar__indicator_1js6c {
+} .tab-bar__indicator_lg08x {
     position: absolute;
     top: var(--gap-2xs);
     left: calc(50% + var(--gap-2xs));

package/components/tab/index.js

@@ -3,11 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var components_tab_Component = require('./Component.js');
-require('tslib');
-require('react');
-require('classnames');
-require('@alfalab/core-components-badge');
-require('@alfalab/core-components-typography');
 
 
 

package/cssm/Component.js

@@ -8,9 +8,6 @@ var cn = require('classnames');
 var coreComponentsShared = require('@alfalab/core-components-shared/cssm');
 var components_tab_Component = require('./components/tab/Component.js');
 var styles = require('./index.module.css');
-require('@alfalab/core-components-badge/cssm');
-require('@alfalab/core-components-typography/cssm');
-require('./components/tab/index.module.css');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/cssm/components/tab/index.js

@@ -3,12 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var components_tab_Component = require('./Component.js');
-require('tslib');
-require('react');
-require('classnames');
-require('@alfalab/core-components-badge/cssm');
-require('@alfalab/core-components-typography/cssm');
-require('./index.module.css');
 
 
 

package/cssm/index.js

@@ -3,15 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var Component = require('./Component.js');
-require('tslib');
-require('react');
-require('classnames');
-require('@alfalab/core-components-shared/cssm');
-require('./components/tab/Component.js');
-require('@alfalab/core-components-badge/cssm');
-require('@alfalab/core-components-typography/cssm');
-require('./components/tab/index.module.css');
-require('./index.module.css');
 
 
 

package/cssm/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTabBarTestIds } from "../utils";

package/cssm/shared/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var utils = require('../utils.js');
+
+
+
+exports.getTabBarTestIds = utils.getTabBarTestIds;

package/cssm/utils.d.ts

@@ -0,0 +1,5 @@
+declare function getTabBarTestIds(dataTestId: string): {
+    tabBar: string;
+    tab: string;
+};
+export { getTabBarTestIds };

package/cssm/utils.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var coreComponentsShared = require('@alfalab/core-components-shared/cssm');
+
+function getTabBarTestIds(dataTestId) {
+    return {
+        tabBar: dataTestId,
+        tab: coreComponentsShared.getDataTestId(dataTestId, 'tab'),
+    };
+}
+
+exports.getTabBarTestIds = getTabBarTestIds;

package/esm/Component.js

@@ -3,10 +3,8 @@ import React, { forwardRef, Children, cloneElement } from 'react';
 import cn from 'classnames';
 import { getDataTestId } from '@alfalab/core-components-shared/esm';
 import { Tab } from './components/tab/Component.js';
-import '@alfalab/core-components-badge/esm';
-import '@alfalab/core-components-typography/esm';
 
-var styles = {"component":"tab-bar__component_15pc1","border":"tab-bar__border_15pc1"};
+var styles = {"component":"tab-bar__component_16z03","border":"tab-bar__border_16z03"};
 require('./index.css')
 
 var TabBarComponent = forwardRef(function (_a, ref) {

package/esm/components/tab/Component.js

@@ -4,7 +4,7 @@ import cn from 'classnames';
 import { Badge } from '@alfalab/core-components-badge/esm';
 import { Typography } from '@alfalab/core-components-typography/esm';
 
-var styles = {"component":"tab-bar__component_1js6c","selected":"tab-bar__selected_1js6c","icon":"tab-bar__icon_1js6c","label":"tab-bar__label_1js6c","labelSelected":"tab-bar__labelSelected_1js6c","indicator":"tab-bar__indicator_1js6c"};
+var styles = {"component":"tab-bar__component_lg08x","selected":"tab-bar__selected_lg08x","icon":"tab-bar__icon_lg08x","label":"tab-bar__label_lg08x","labelSelected":"tab-bar__labelSelected_lg08x","indicator":"tab-bar__indicator_lg08x"};
 require('./index.css')
 
 var TabComponent = forwardRef(function (_a, ref) {

package/esm/components/tab/index.css

@@ -1,4 +1,4 @@
-/* hash: okzse */
+/* hash: 1ov0x */
 :root {
 } /* deprecated */ :root {
     --color-light-accent-primary: #ef3124;
@@ -19,7 +19,7 @@
     --gap-xs: 8px;
 } :root {
 } :root {
-} .tab-bar__component_1js6c {
+} .tab-bar__component_lg08x {
     box-sizing: border-box;
     background-color: transparent;
     -webkit-tap-highlight-color: transparent;
@@ -43,15 +43,15 @@
     align-items: center;
     padding: var(--gap-xs) 0;
     color: var(--color-light-neutral-translucent-700);
-} .tab-bar__selected_1js6c {
+} .tab-bar__selected_lg08x {
     color: var(--color-light-accent-primary);
-} .tab-bar__icon_1js6c {
+} .tab-bar__icon_lg08x {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
-} .tab-bar__label_1js6c {
+} .tab-bar__label_lg08x {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -60,9 +60,9 @@
     flex-shrink: 0;
 
     color: var(--color-light-text-secondary);
-} .tab-bar__labelSelected_1js6c {
+} .tab-bar__labelSelected_lg08x {
     color: inherit;
-} .tab-bar__indicator_1js6c {
+} .tab-bar__indicator_lg08x {
     position: absolute;
     top: var(--gap-2xs);
     left: calc(50% + var(--gap-2xs));

package/esm/components/tab/index.js

@@ -1,6 +1 @@
 export { Tab } from './Component.js';
-import 'tslib';
-import 'react';
-import 'classnames';
-import '@alfalab/core-components-badge/esm';
-import '@alfalab/core-components-typography/esm';

package/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: ftaot */
+/* hash: 1y5xt */
 :root {
 } /* deprecated */ :root {
     --color-light-base-bg-primary: #fff;
@@ -18,7 +18,7 @@
 } :root {
 } :root {
     --tab-bar-bg-color: var(--color-light-base-bg-primary);
-} .tab-bar__component_15pc1 {
+} .tab-bar__component_16z03 {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -27,6 +27,6 @@
     box-sizing: border-box;
     overflow: hidden;
     transition: box-shadow 0.2s ease;
-} .tab-bar__border_15pc1 {
+} .tab-bar__border_16z03 {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-300);
 }

package/esm/index.js

@@ -1,8 +1 @@
 export { TabBar } from './Component.js';
-import 'tslib';
-import 'react';
-import 'classnames';
-import '@alfalab/core-components-shared/esm';
-import './components/tab/Component.js';
-import '@alfalab/core-components-badge/esm';
-import '@alfalab/core-components-typography/esm';

package/esm/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTabBarTestIds } from "../utils";

package/esm/shared/index.js

@@ -0,0 +1 @@
+export { getTabBarTestIds } from '../utils.js';

package/esm/utils.d.ts

@@ -0,0 +1,5 @@
+declare function getTabBarTestIds(dataTestId: string): {
+    tabBar: string;
+    tab: string;
+};
+export { getTabBarTestIds };

package/esm/utils.js

@@ -0,0 +1,10 @@
+import { getDataTestId } from '@alfalab/core-components-shared/esm';
+
+function getTabBarTestIds(dataTestId) {
+    return {
+        tabBar: dataTestId,
+        tab: getDataTestId(dataTestId, 'tab'),
+    };
+}
+
+export { getTabBarTestIds };

package/index.css

@@ -1,4 +1,4 @@
-/* hash: ftaot */
+/* hash: 1y5xt */
 :root {
 } /* deprecated */ :root {
     --color-light-base-bg-primary: #fff;
@@ -18,7 +18,7 @@
 } :root {
 } :root {
     --tab-bar-bg-color: var(--color-light-base-bg-primary);
-} .tab-bar__component_15pc1 {
+} .tab-bar__component_16z03 {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -27,6 +27,6 @@
     box-sizing: border-box;
     overflow: hidden;
     transition: box-shadow 0.2s ease;
-} .tab-bar__border_15pc1 {
+} .tab-bar__border_16z03 {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-300);
 }

package/index.js

@@ -3,13 +3,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var Component = require('./Component.js');
-require('tslib');
-require('react');
-require('classnames');
-require('@alfalab/core-components-shared');
-require('./components/tab/Component.js');
-require('@alfalab/core-components-badge');
-require('@alfalab/core-components-typography');
 
 
 

package/modern/Component.js

@@ -2,10 +2,8 @@ import React, { forwardRef, Children, cloneElement } from 'react';
 import cn from 'classnames';
 import { getDataTestId } from '@alfalab/core-components-shared/modern';
 import { Tab } from './components/tab/Component.js';
-import '@alfalab/core-components-badge/modern';
-import '@alfalab/core-components-typography/modern';
 
-const styles = {"component":"tab-bar__component_15pc1","border":"tab-bar__border_15pc1"};
+const styles = {"component":"tab-bar__component_16z03","border":"tab-bar__border_16z03"};
 require('./index.css')
 
 const TabBarComponent = forwardRef(({ children, className, selectedId, border, dataTestId, tabClassNames, onChange, ...restProps }, ref) => {

package/modern/components/tab/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { Badge } from '@alfalab/core-components-badge/modern';
 import { Typography } from '@alfalab/core-components-typography/modern';
 
-const styles = {"component":"tab-bar__component_1js6c","selected":"tab-bar__selected_1js6c","icon":"tab-bar__icon_1js6c","label":"tab-bar__label_1js6c","labelSelected":"tab-bar__labelSelected_1js6c","indicator":"tab-bar__indicator_1js6c"};
+const styles = {"component":"tab-bar__component_lg08x","selected":"tab-bar__selected_lg08x","icon":"tab-bar__icon_lg08x","label":"tab-bar__label_lg08x","labelSelected":"tab-bar__labelSelected_lg08x","indicator":"tab-bar__indicator_lg08x"};
 require('./index.css')
 
 const TabComponent = forwardRef(({ showIndicator, indicatorProps, label, icon, id, selected, onChange, onClick, tabClassNames = {}, dataTestId, className, labelClassName, selectedClassName, iconClassName, href, Component = href ? 'a' : 'button', ...restProps }, ref) => {

package/modern/components/tab/index.css

@@ -1,4 +1,4 @@
-/* hash: okzse */
+/* hash: 1ov0x */
 :root {
 } /* deprecated */ :root {
     --color-light-accent-primary: #ef3124;
@@ -19,7 +19,7 @@
     --gap-xs: 8px;
 } :root {
 } :root {
-} .tab-bar__component_1js6c {
+} .tab-bar__component_lg08x {
     box-sizing: border-box;
     background-color: transparent;
     -webkit-tap-highlight-color: transparent;
@@ -43,15 +43,15 @@
     align-items: center;
     padding: var(--gap-xs) 0;
     color: var(--color-light-neutral-translucent-700);
-} .tab-bar__selected_1js6c {
+} .tab-bar__selected_lg08x {
     color: var(--color-light-accent-primary);
-} .tab-bar__icon_1js6c {
+} .tab-bar__icon_lg08x {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-grow: 1;
     width: 100%;
-} .tab-bar__label_1js6c {
+} .tab-bar__label_lg08x {
     -webkit-line-clamp: 1;
     display: -webkit-box;
     -webkit-box-orient: vertical;
@@ -60,9 +60,9 @@
     flex-shrink: 0;
 
     color: var(--color-light-text-secondary);
-} .tab-bar__labelSelected_1js6c {
+} .tab-bar__labelSelected_lg08x {
     color: inherit;
-} .tab-bar__indicator_1js6c {
+} .tab-bar__indicator_lg08x {
     position: absolute;
     top: var(--gap-2xs);
     left: calc(50% + var(--gap-2xs));

package/modern/components/tab/index.js

@@ -1,5 +1 @@
 export { Tab } from './Component.js';
-import 'react';
-import 'classnames';
-import '@alfalab/core-components-badge/modern';
-import '@alfalab/core-components-typography/modern';

package/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: ftaot */
+/* hash: 1y5xt */
 :root {
 } /* deprecated */ :root {
     --color-light-base-bg-primary: #fff;
@@ -18,7 +18,7 @@
 } :root {
 } :root {
     --tab-bar-bg-color: var(--color-light-base-bg-primary);
-} .tab-bar__component_15pc1 {
+} .tab-bar__component_16z03 {
     display: flex;
     justify-content: center;
     height: 64px;
@@ -27,6 +27,6 @@
     box-sizing: border-box;
     overflow: hidden;
     transition: box-shadow 0.2s ease;
-} .tab-bar__border_15pc1 {
+} .tab-bar__border_16z03 {
     box-shadow: 0 -1px 0 0 var(--color-light-neutral-300);
 }

package/modern/index.js

@@ -1,7 +1 @@
 export { TabBar } from './Component.js';
-import 'react';
-import 'classnames';
-import '@alfalab/core-components-shared/modern';
-import './components/tab/Component.js';
-import '@alfalab/core-components-badge/modern';
-import '@alfalab/core-components-typography/modern';

package/modern/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTabBarTestIds } from "../utils";

package/modern/shared/index.js

@@ -0,0 +1 @@
+export { getTabBarTestIds } from '../utils.js';

package/modern/utils.d.ts

@@ -0,0 +1,5 @@
+declare function getTabBarTestIds(dataTestId: string): {
+    tabBar: string;
+    tab: string;
+};
+export { getTabBarTestIds };

package/modern/utils.js

@@ -0,0 +1,10 @@
+import { getDataTestId } from '@alfalab/core-components-shared/modern';
+
+function getTabBarTestIds(dataTestId) {
+    return {
+        tabBar: dataTestId,
+        tab: getDataTestId(dataTestId, 'tab'),
+    };
+}
+
+export { getTabBarTestIds };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-tab-bar",
-    "version": "1.0.3",
+    "version": "1.1.0",
     "description": "",
     "keywords": [],
     "license": "MIT",
@@ -15,7 +15,7 @@
         "react-dom": ">=16.8.0"
     },
     "dependencies": {
-        "@alfalab/core-components-typography": "^4.4.0",
+        "@alfalab/core-components-typography": "^4.5.0",
         "@alfalab/core-components-badge": "^5.5.1",
         "@alfalab/core-components-shared": "^0.9.1",
         "classnames": "^2.3.1",

package/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTabBarTestIds } from "../utils";

package/shared/index.js

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var utils = require('../utils.js');
+
+
+
+exports.getTabBarTestIds = utils.getTabBarTestIds;

package/shared/package.json

@@ -0,0 +1,3 @@
+{
+    "module": "../esm/shared/index.js"
+}

package/src/shared/index.ts

@@ -0,0 +1 @@
+export { getTabBarTestIds } from '../utils';

package/src/shared/package.json

@@ -0,0 +1,3 @@
+{
+    "module": "../esm/shared/index.js"
+}

package/src/utils.ts

@@ -0,0 +1,8 @@
+import { getDataTestId } from '@alfalab/core-components-shared';
+
+export function getTabBarTestIds(dataTestId: string) {
+    return {
+        tabBar: dataTestId,
+        tab: getDataTestId(dataTestId, 'tab'),
+    };
+}

package/utils.d.ts

@@ -0,0 +1,5 @@
+declare function getTabBarTestIds(dataTestId: string): {
+    tabBar: string;
+    tab: string;
+};
+export { getTabBarTestIds };

package/utils.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var coreComponentsShared = require('@alfalab/core-components-shared');
+
+function getTabBarTestIds(dataTestId) {
+    return {
+        tabBar: dataTestId,
+        tab: coreComponentsShared.getDataTestId(dataTestId, 'tab'),
+    };
+}
+
+exports.getTabBarTestIds = getTabBarTestIds;