@extrachill/components 0.4.7 → 0.4.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,10 @@
1
1
  # Changelog
2
2
 
3
+ ## [0.4.8] - 2026-03-25
4
+
5
+ ### Changed
6
+ - Refine shell tabs as a grouped header region
7
+
3
8
  ## [0.4.7] - 2026-03-25
4
9
 
5
10
  ### Changed
@@ -7,6 +7,7 @@ export interface ShellTabsProps {
7
7
  classPrefix?: string;
8
8
  tabsClassName?: string;
9
9
  tabsClassPrefix?: string;
10
+ showDivider?: boolean;
10
11
  }
11
- export declare function ShellTabs({ tabs, active, onChange, className, classPrefix, tabsClassName, tabsClassPrefix, }: ShellTabsProps): import("react/jsx-runtime").JSX.Element;
12
+ export declare function ShellTabs({ tabs, active, onChange, className, classPrefix, tabsClassName, tabsClassPrefix, showDivider, }: ShellTabsProps): import("react/jsx-runtime").JSX.Element;
12
13
  //# sourceMappingURL=ShellTabs.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ShellTabs.d.ts","sourceRoot":"","sources":["../src/ShellTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAElD,MAAM,WAAW,cAAc;IAC9B,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC5B,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,wBAAgB,SAAS,CAAE,EAC1B,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAc,EACd,WAA6B,EAC7B,aAAkB,EAClB,eAA2B,GAC3B,EAAE,cAAc,2CAYhB"}
1
+ {"version":3,"file":"ShellTabs.d.ts","sourceRoot":"","sources":["../src/ShellTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAElD,MAAM,WAAW,cAAc;IAC9B,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC5B,QAAQ,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,SAAS,CAAE,EAC1B,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,SAAc,EACd,WAA6B,EAC7B,aAAkB,EAClB,eAA2B,EAC3B,WAAkB,GAClB,EAAE,cAAc,2CAkBhB"}
package/dist/ShellTabs.js CHANGED
@@ -1,5 +1,9 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { Tabs } from "./Tabs.js";
3
- export function ShellTabs({ tabs, active, onChange, className = '', classPrefix = 'ec-shell-tabs', tabsClassName = '', tabsClassPrefix = 'ec-tabs', }) {
4
- return (_jsx("div", { className: [classPrefix, className].filter(Boolean).join(' '), children: _jsx(Tabs, { tabs: tabs, active: active, onChange: onChange, className: tabsClassName, classPrefix: tabsClassPrefix }) }));
3
+ export function ShellTabs({ tabs, active, onChange, className = '', classPrefix = 'ec-shell-tabs', tabsClassName = '', tabsClassPrefix = 'ec-tabs', showDivider = true, }) {
4
+ return (_jsx("div", { className: [
5
+ classPrefix,
6
+ showDivider ? `${classPrefix}--with-divider` : `${classPrefix}--without-divider`,
7
+ className,
8
+ ].filter(Boolean).join(' '), children: _jsx(Tabs, { tabs: tabs, active: active, onChange: onChange, className: tabsClassName, classPrefix: tabsClassPrefix }) }));
5
9
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@extrachill/components",
3
- "version": "0.4.7",
3
+ "version": "0.4.8",
4
4
  "description": "Shared React components for the Extra Chill Platform.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
package/src/ShellTabs.tsx CHANGED
@@ -8,6 +8,7 @@ export interface ShellTabsProps {
8
8
  classPrefix?: string;
9
9
  tabsClassName?: string;
10
10
  tabsClassPrefix?: string;
11
+ showDivider?: boolean;
11
12
  }
12
13
 
13
14
  export function ShellTabs( {
@@ -18,9 +19,16 @@ export function ShellTabs( {
18
19
  classPrefix = 'ec-shell-tabs',
19
20
  tabsClassName = '',
20
21
  tabsClassPrefix = 'ec-tabs',
22
+ showDivider = true,
21
23
  }: ShellTabsProps ) {
22
24
  return (
23
- <div className={ [ classPrefix, className ].filter( Boolean ).join( ' ' ) }>
25
+ <div
26
+ className={ [
27
+ classPrefix,
28
+ showDivider ? `${ classPrefix }--with-divider` : `${ classPrefix }--without-divider`,
29
+ className,
30
+ ].filter( Boolean ).join( ' ' ) }
31
+ >
24
32
  <Tabs
25
33
  tabs={ tabs }
26
34
  active={ active }
@@ -132,10 +132,18 @@
132
132
  display: grid;
133
133
  gap: var(--spacing-sm, 0.5rem);
134
134
  padding-bottom: var(--spacing-md, 1rem);
135
- border-bottom: 1px solid var(--border-color, #ddd);
136
135
  background: var(--card-background, #f1f5f9);
137
136
  }
138
137
 
138
+ .ec-shell-tabs--with-divider {
139
+ border-bottom: 1px solid var(--border-color, #ddd);
140
+ }
141
+
142
+ .ec-shell-tabs--without-divider {
143
+ border-bottom: 0;
144
+ padding-bottom: 0;
145
+ }
146
+
139
147
  // Panel
140
148
  .ec-panel {
141
149
  border: 1px solid var(--border-color, #ddd);