@extrachill/components 0.4.34 → 0.4.35

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## [0.4.35] - 2026-03-26
+
+### Changed
+- unify shared card vertical padding
+- remove shell divider variants
+
 ## [0.4.34] - 2026-03-26
 
 ### Fixed

package/dist/BlockShellHeader.d.ts

@@ -5,7 +5,6 @@ export interface BlockShellHeaderProps {
     actions?: ReactNode;
     className?: string;
     classPrefix?: string;
-    showDivider?: boolean;
 }
-export declare function BlockShellHeader({ title, description, actions, className, classPrefix, showDivider, }: BlockShellHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function BlockShellHeader({ title, description, actions, className, classPrefix, }: BlockShellHeaderProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=BlockShellHeader.d.ts.map

package/dist/BlockShellHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BlockShellHeader.d.ts","sourceRoot":"","sources":["../src/BlockShellHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,qBAAqB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,wBAAgB,gBAAgB,CAAE,EACjC,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAc,EACd,WAAqC,EACrC,WAAkB,GAClB,EAAE,qBAAqB,2CAiBvB"}
+{"version":3,"file":"BlockShellHeader.d.ts","sourceRoot":"","sources":["../src/BlockShellHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,qBAAqB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,gBAAgB,CAAE,EACjC,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAc,EACd,WAAqC,GACrC,EAAE,qBAAqB,2CAgBvB"}

package/dist/BlockShellHeader.js

@@ -1,9 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function BlockShellHeader({ title, description, actions, className = '', classPrefix = 'ec-block-shell-header', showDivider = true, }) {
+export function BlockShellHeader({ title, description, actions, className = '', classPrefix = 'ec-block-shell-header', }) {
     return (_jsxs("div", { className: [
             classPrefix,
             'ec-edge-gutter',
-            showDivider ? `${classPrefix}--with-divider` : `${classPrefix}--without-divider`,
             className,
         ].filter(Boolean).join(' '), children: [_jsxs("div", { className: `${classPrefix}__main`, children: [title && _jsx("div", { className: `${classPrefix}__title`, children: title }), description && _jsx("div", { className: `${classPrefix}__description`, children: description })] }), actions && _jsx("div", { className: `${classPrefix}__actions`, children: actions })] }));
 }

package/dist/ShellTabs.d.ts

@@ -7,7 +7,6 @@ export interface ShellTabsProps {
     classPrefix?: string;
     tabsClassName?: string;
     tabsClassPrefix?: string;
-    showDivider?: boolean;
 }
-export declare function ShellTabs({ tabs, active, onChange, className, classPrefix, tabsClassName, tabsClassPrefix, showDivider, }: ShellTabsProps): import("react/jsx-runtime").JSX.Element;
+export declare function ShellTabs({ tabs, active, onChange, className, classPrefix, tabsClassName, tabsClassPrefix, }: ShellTabsProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ShellTabs.d.ts.map

package/dist/ShellTabs.d.ts.map

@@ -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;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"}
+{"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,2CAiBhB"}

package/dist/ShellTabs.js

@@ -1,9 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Tabs } from "./Tabs.js";
-export function ShellTabs({ tabs, active, onChange, className = '', classPrefix = 'ec-shell-tabs', tabsClassName = '', tabsClassPrefix = 'ec-tabs', showDivider = true, }) {
+export function ShellTabs({ tabs, active, onChange, className = '', classPrefix = 'ec-shell-tabs', tabsClassName = '', tabsClassPrefix = 'ec-tabs', }) {
     return (_jsx("div", { className: [
             classPrefix,
-            showDivider ? `${classPrefix}--with-divider` : `${classPrefix}--without-divider`,
             className,
         ].filter(Boolean).join(' '), children: _jsx(Tabs, { tabs: tabs, active: active, onChange: onChange, className: tabsClassName, classPrefix: tabsClassPrefix }) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@extrachill/components",
-  "version": "0.4.34",
+  "version": "0.4.35",
   "description": "Shared React components for the Extra Chill Platform.",
   "type": "module",
   "main": "./dist/index.js",

package/src/BlockShellHeader.tsx

@@ -6,7 +6,6 @@ export interface BlockShellHeaderProps {
 	actions?: ReactNode;
 	className?: string;
 	classPrefix?: string;
-	showDivider?: boolean;
 }
 
 export function BlockShellHeader( {
@@ -15,14 +14,12 @@ export function BlockShellHeader( {
 	actions,
 	className = '',
 	classPrefix = 'ec-block-shell-header',
-	showDivider = true,
 }: BlockShellHeaderProps ) {
 	return (
 		<div
 			className={ [
 				classPrefix,
 				'ec-edge-gutter',
-				showDivider ? `${ classPrefix }--with-divider` : `${ classPrefix }--without-divider`,
 				className,
 			].filter( Boolean ).join( ' ' ) }
 		>

package/src/ShellTabs.tsx

@@ -8,7 +8,6 @@ export interface ShellTabsProps {
 	classPrefix?: string;
 	tabsClassName?: string;
 	tabsClassPrefix?: string;
-	showDivider?: boolean;
 }
 
 export function ShellTabs( {
@@ -19,13 +18,11 @@ export function ShellTabs( {
 	classPrefix = 'ec-shell-tabs',
 	tabsClassName = '',
 	tabsClassPrefix = 'ec-tabs',
-	showDivider = true,
 }: ShellTabsProps ) {
 	return (
 		<div
 			className={ [
 				classPrefix,
-				showDivider ? `${ classPrefix }--with-divider` : `${ classPrefix }--without-divider`,
 				className,
 			].filter( Boolean ).join( ' ' ) }
 		>

package/styles/components.scss

@@ -131,19 +131,9 @@
 .ec-shell-tabs {
 	display: grid;
 	gap: var(--spacing-sm, 0.5rem);
-	padding-bottom: var(--spacing-md, 1rem);
 	background: var(--card-background, #f1f5f9);
 }
 
-.ec-shell-tabs--with-divider {
-	border-bottom: 1px solid var(--border-color, #ddd);
-}
-
-.ec-shell-tabs--without-divider {
-	border-bottom: 0;
-	padding-bottom: 0;
-}
-
 .ec-responsive-tabs {
 	display: grid;
 	gap: var(--spacing-md, 1rem);
@@ -283,6 +273,13 @@
 	gap: var(--spacing-md, 1rem);
 }
 
+.ec-panel,
+.ec-section,
+.ec-surface-card {
+	padding-top: var(--spacing-md, 1rem);
+	padding-bottom: var(--spacing-md, 1rem);
+}
+
 // Block shell / top-level wrapper
 .ec-block-shell {
 	background: transparent;
@@ -357,16 +354,6 @@
 	align-items: center;
 	gap: var(--spacing-md, 1rem);
 	flex-wrap: wrap;
-	padding-bottom: var(--spacing-md, 1rem);
-}
-
-.ec-block-shell-header--with-divider {
-	border-bottom: 1px solid var(--border-color, #ddd);
-}
-
-.ec-block-shell-header--without-divider {
-	border-bottom: 0;
-	padding-bottom: 0;
 }
 
 .ec-block-shell-header__main {
@@ -503,6 +490,39 @@
 	gap: var(--spacing-xs, 0.25rem);
 }
 
+.ec-field-group__control > input:not([type='checkbox']):not([type='radio']):not([type='file']),
+.ec-field-group__control > select,
+.ec-field-group__control > textarea {
+	width: 100%;
+	padding: var(--spacing-sm, 0.5rem);
+	border: 1px solid var(--border-color, #ddd);
+	border-radius: var(--border-radius-sm, 4px);
+	background: var(--background-color, #fff);
+	color: var(--text-color, #111);
+	font: inherit;
+	font-size: var(--font-size-base, 1rem);
+	box-sizing: border-box;
+	max-width: 100%;
+}
+
+.ec-field-group__control > textarea {
+	min-height: 120px;
+	resize: vertical;
+	font-family: inherit;
+}
+
+.ec-field-group__control > input[disabled],
+.ec-field-group__control > select[disabled],
+.ec-field-group__control > textarea[disabled] {
+	cursor: not-allowed;
+	opacity: 0.6;
+}
+
+.ec-field-group__control > input[type='checkbox'],
+.ec-field-group__control > input[type='radio'] {
+	margin: 0;
+}
+
 .ec-field-group__help {
 	font-size: var(--font-size-sm, 0.875rem);
 	color: var(--muted-text, #666);
@@ -554,7 +574,10 @@
 		border-radius: 0;
 		border-left: 0;
 		border-right: 0;
-		padding: var(--spacing-sm, 0.5rem) 0;
+		padding-top: var(--spacing-md, 1rem);
+		padding-bottom: var(--spacing-md, 1rem);
+		padding-left: 0;
+		padding-right: 0;
 		margin-left: calc(var(--spacing-md, 1rem) * -1);
 		margin-right: calc(var(--spacing-md, 1rem) * -1);
 		padding-left: var(--spacing-md, 1rem);