@licklist/design 0.78.5-dev.62 → 0.78.5-dev.63

package/dist/v2/icons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/icons/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/icons/index.tsx"],"names":[],"mappings":"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"}

package/dist/v2/icons/index.js

@@ -343,34 +343,30 @@ var InfoIcon = function() {
     });
 };
 var ArrowUpIcon = function() {
+    var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_width = _ref.width, width = _ref_width === void 0 ? 20 : _ref_width, _ref_height = _ref.height, height = _ref_height === void 0 ? 20 : _ref_height;
     return /*#__PURE__*/ jsx("svg", {
-        width: "11",
-        height: "6",
-        viewBox: "0 0 11 6",
+        width: width,
+        height: height,
+        viewBox: "0 0 32 32",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
         children: /*#__PURE__*/ jsx("path", {
-            d: "M10 5L5.5 1L1 5",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
+            d: "M14.9999 11.8283L9.63589 17.1923L8.22168 15.7781L15.9999 7.99988L23.778 15.7781L22.3638 17.1923L16.9999 11.8283L16.9999 23.9999L14.9999 23.9999L14.9999 11.8283Z",
+            fill: "currentColor"
         })
     });
 };
 var ArrowDownIcon = function() {
+    var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_width = _ref.width, width = _ref_width === void 0 ? 20 : _ref_width, _ref_height = _ref.height, height = _ref_height === void 0 ? 20 : _ref_height;
     return /*#__PURE__*/ jsx("svg", {
-        width: "11",
-        height: "6",
-        viewBox: "0 0 11 6",
+        width: width,
+        height: height,
+        viewBox: "0 0 32 32",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
         children: /*#__PURE__*/ jsx("path", {
-            d: "M1 1L5.5 5L10 1",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
+            d: "M16.9999 20.1715L22.3639 14.8075L23.7781 16.2217L15.9999 23.9999L8.22176 16.2217L9.63596 14.8075L14.9999 20.1715L14.9999 7.99988L16.9999 7.99988L16.9999 20.1715Z",
+            fill: "currentColor"
         })
     });
 };
@@ -383,7 +379,7 @@ var GripVerticalIcon = function() {
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
         children: /*#__PURE__*/ jsx("path", {
-            d: "M14 10C14 11.1046 13.1046 12 12 12C10.8954 12 10 11.1046 10 10C10 8.89543 10.8954 8 12 8C13.1046 8 14 8.89543 14 10ZM14 16C14 17.1046 13.1046 18 12 18C10.8954 18 10 17.1046 10 16C10 14.8954 10.8954 14 12 14C13.1046 14 14 14.8954 14 16ZM14 22C14 23.1046 13.1046 24 12 24C10.8954 24 10 23.1046 10 22C10 20.8954 10.8954 20 12 20C13.1046 20 14 20.8954 14 22ZM22 10C22 11.1046 21.1046 12 20 12C18.8954 12 18 11.1046 18 10C18 8.89543 18.8954 8 20 8C21.1046 8 22 8.89543 22 10ZM22 16C22 17.1046 21.1046 18 20 18C18.8954 18 18 17.1046 18 16C18 14.8954 18.8954 14 20 14C21.1046 14 22 14.8954 22 16ZM22 22C22 23.1046 21.1046 24 20 24C18.8954 24 18 23.1046 18 22C18 20.8954 18.8954 20 20 20C21.1046 20 22 20.8954 22 22Z",
+            d: "M13 20C14.1046 20 15 20.8954 15 22C15 23.1046 14.1046 24 13 24C11.8954 24 11 23.1046 11 22C11 20.8954 11.8954 20 13 20ZM19 20C20.1046 20 21 20.8954 21 22C21 23.1046 20.1046 24 19 24C17.8954 24 17 23.1046 17 22C17 20.8954 17.8954 20 19 20ZM13 14C14.1046 14 15 14.8954 15 16C15 17.1046 14.1046 18 13 18C11.8954 18 11 17.1046 11 16C11 14.8954 11.8954 14 13 14ZM19 14C20.1046 14 21 14.8954 21 16C21 17.1046 20.1046 18 19 18C17.8954 18 17 17.1046 17 16C17 14.8954 17.8954 14 19 14ZM13 8C14.1046 8 15 8.89543 15 10C15 11.1046 14.1046 12 13 12C11.8954 12 11 11.1046 11 10C11 8.89543 11.8954 8 13 8ZM19 8C20.1046 8 21 8.89543 21 10C21 11.1046 20.1046 12 19 12C17.8954 12 17 11.1046 17 10C17 8.89543 17.8954 8 19 8Z",
             fill: "currentColor"
         })
     });
@@ -433,38 +429,22 @@ var CloseIcon = function(_param) {
 };
 var EllipsisIcon = function() {
     var _param = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
-    var _param_width = _param.width, width = _param_width === void 0 ? 32 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 32 : _param_height, _param_fill = _param.fill, fill = _param_fill === void 0 ? 'black' : _param_fill, props = _object_without_properties(_param, [
+    var _param_width = _param.width, width = _param_width === void 0 ? 18 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 4 : _param_height, _param_fill = _param.fill, fill = _param_fill === void 0 ? 'currentColor' : _param_fill, props = _object_without_properties(_param, [
         "width",
         "height",
         "fill"
     ]);
-    return /*#__PURE__*/ jsxs("svg", _object_spread_props(_object_spread({
+    return /*#__PURE__*/ jsx("svg", _object_spread_props(_object_spread({
         width: width,
         height: height,
-        viewBox: "0 0 32 32",
+        viewBox: "0 0 18 4",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
     }, props), {
-        children: [
-            /*#__PURE__*/ jsx("circle", {
-                cx: "8",
-                cy: "16",
-                r: "3",
-                fill: fill
-            }),
-            /*#__PURE__*/ jsx("circle", {
-                cx: "16",
-                cy: "16",
-                r: "3",
-                fill: fill
-            }),
-            /*#__PURE__*/ jsx("circle", {
-                cx: "24",
-                cy: "16",
-                r: "3",
-                fill: fill
-            })
-        ]
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M2 0C3.10457 0 4 0.895431 4 2C4 3.10457 3.10457 4 2 4C0.895431 4 0 3.10457 0 2C0 0.895431 0.895431 0 2 0ZM9 0C10.1046 0 11 0.895431 11 2C11 3.10457 10.1046 4 9 4C7.89543 4 7 3.10457 7 2C7 0.895431 7.89543 0 9 0ZM16 0C17.1046 0 18 0.895431 18 2C18 3.10457 17.1046 4 16 4C14.8954 4 14 3.10457 14 2C14 0.895431 14.8954 0 16 0Z",
+            fill: fill
+        })
     }));
 };
 var CircleIcon = function() {

package/dist/v2/index.d.ts

@@ -27,7 +27,7 @@ export type { NPSScoreProps, NPSSubmitData } from './components/NPSScore';
 export { UserPanel } from './components/UserPanel';
 export type { UserPanelProps } from './components/UserPanel';
 export { ZoneCard, ZoneContainer, ZoneHeader, ResourceRow, AddResourceButton } from './components/ZoneCard';
-export type { ZoneCardProps, ZoneResource, ZoneContainerProps, DragHandleProps, ZoneHeaderProps, ResourceRowProps, AddResourceButtonProps } from './components/ZoneCard';
+export type { ZoneCardProps, ZoneResource, ZoneContainerProps, DragHandleProps, ZoneHeaderProps, ResourceRowProps, ResourceRowLabels, AddResourceButtonProps } from './components/ZoneCard';
 export { ZonesResourcesPage } from './pages/ZonesResources';
 export type { ZonesResourcesPageProps } from './pages/ZonesResources';
 export { Navigation } from './navigation/Navigation';

package/dist/v2/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/v2/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/v2/index.ts"],"names":[],"mappings":"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"}

package/dist/v2/pages/ZonesResources/ZonesResourcesPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ZonesResourcesPage.d.ts","sourceRoot":"","sources":["../../../../src/v2/pages/ZonesResources/ZonesResourcesPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,2BAA2B,CAAA;AAElC,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA6BhE,CAAA"}
+{"version":3,"file":"ZonesResourcesPage.d.ts","sourceRoot":"","sources":["../../../../src/v2/pages/ZonesResources/ZonesResourcesPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,2BAA2B,CAAA;AAElC,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+BhE,CAAA"}

package/dist/v2/pages/ZonesResources/ZonesResourcesPage.js

@@ -1,13 +1,14 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react';
 import { IconButton } from '../../components/IconButton/IconButton.js';
+import '../../components/Button/Button.scss.js';
+import { GhostButton } from '../../components/Button/GhostButton.js';
 import { NewPageHeader } from '../../components/NewPageHeader/NewPageHeader.js';
-import { Button, ButtonText } from '../../components/Button/Button.js';
-import '../../components/Button/GhostButton.scss.js';
+import { PlusIcon } from '../../icons/index.js';
 import './ZonesResourcesPage.scss.js';
 
 var ZonesResourcesPage = function(param) {
-    var _param_title = param.title, title = _param_title === void 0 ? 'Zones & Resources' : _param_title, _param_backLabel = param.backLabel, backLabel = _param_backLabel === void 0 ? 'Back to Settings' : _param_backLabel, onBack = param.onBack, _param_actionLabel = param.actionLabel, actionLabel = _param_actionLabel === void 0 ? '+ Add Zone' : _param_actionLabel, onAction = param.onAction, children = param.children;
+    var _param_title = param.title, title = _param_title === void 0 ? 'Zones & Resources' : _param_title, _param_backLabel = param.backLabel, backLabel = _param_backLabel === void 0 ? 'Back to Settings' : _param_backLabel, onBack = param.onBack, _param_actionLabel = param.actionLabel, actionLabel = _param_actionLabel === void 0 ? 'Add Zone' : _param_actionLabel, onAction = param.onAction, children = param.children;
     return /*#__PURE__*/ jsxs("div", {
         className: "zones-resources-page",
         children: [
@@ -20,21 +21,24 @@ var ZonesResourcesPage = function(param) {
             }),
             /*#__PURE__*/ jsx(NewPageHeader, {
                 title: title,
-                showDivider: true,
-                renderRight: onAction ? function() {
-                    return /*#__PURE__*/ jsx(Button, {
-                        variant: "primary",
-                        onClick: onAction,
-                        children: /*#__PURE__*/ jsx(ButtonText, {
-                            color: "white",
-                            children: actionLabel
-                        })
-                    });
-                } : undefined
+                showDivider: true
             }),
-            /*#__PURE__*/ jsx("div", {
+            /*#__PURE__*/ jsxs("div", {
                 className: "zones-resources-page__content",
-                children: children
+                children: [
+                    onAction && /*#__PURE__*/ jsx("div", {
+                        className: "zones-resources-page__action",
+                        children: /*#__PURE__*/ jsx(GhostButton, {
+                            onClick: onAction,
+                            icon: /*#__PURE__*/ jsx(PlusIcon, {
+                                width: 16,
+                                height: 16
+                            }),
+                            children: actionLabel
+                        })
+                    }),
+                    children
+                ]
             })
         ]
     });

package/dist/v2/pages/ZonesResources/ZonesResourcesPage.scss.js

@@ -1,6 +1,6 @@
 import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
 
-var css_248z = ".zones-resources-page{align-self:stretch;display:flex;flex-direction:column}.zones-resources-page__back{align-self:flex-start;padding:24px 32px 0}@media (max-width:768px){.zones-resources-page__back{padding:16px 16px 0}}.zones-resources-page__content{padding:24px 32px}@media (max-width:768px){.zones-resources-page__content{padding:16px}}";
+var css_248z = ".zones-resources-page{align-self:stretch;display:flex;flex-direction:column}.zones-resources-page__back{align-self:flex-start;padding:24px 32px 0}.zones-resources-page__back .icon-button{border-color:#0000}.zones-resources-page__back .icon-button:hover{background:var(--surface-action-soft,#f4f4fe);border-color:#0000}.zones-resources-page__back .icon-button:hover .icon-button__icon,.zones-resources-page__back .icon-button:hover .icon-button__label,.zones-resources-page__back .icon-button__icon,.zones-resources-page__back .icon-button__label{color:var(--fill-action,#5d5bf4)}@media (max-width:768px){.zones-resources-page__back{padding:16px 16px 0}}.zones-resources-page__content{padding:24px 32px}@media (max-width:768px){.zones-resources-page__content{padding:16px}}.zones-resources-page__action{display:flex;justify-content:flex-end;margin-bottom:16px}";
 styleInject(css_248z);
 
 export { css_248z as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.78.5-dev.62",
+  "version": "0.78.5-dev.63",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/bookedit-licklist/licklist_design.git"

package/src/v2/components/ActionMenu/ActionMenu.scss

@@ -7,46 +7,33 @@
 
   &__trigger {
     display: flex;
-    width: 40px;
-    height: 40px;
-    padding: 8px;
+    width: 32px;
+    height: 32px;
+    padding: 0;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
-    border: 1px solid var(--border-primary, #E8E9EF);
+    border: none;
     background: var(--surface-action-soft);
     color: var(--actions-regular, #5D5BF4);
     cursor: pointer;
     transition: all 0.2s ease;
+    position: relative;
 
     &:hover {
-      background: var(--surface-action-soft);
+      opacity: 0.8;
     }
 
     &--close {
       border-radius: 50%;
       background: #F4F4FE;
-      border: 1px solid #F4F4FE;
 
       &:hover {
         background: #E8E8FD;
+        opacity: 1;
       }
     }
 
-    svg {
-      width: 28px;
-      height: 28px;
-    }
-
-    .action-menu__circle {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      width: 32px;
-      height: 32px;
-      z-index: -1;
-    }
   }
 
   &__dropdown {

package/src/v2/components/ActionMenu/ActionMenu.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect, useLayoutEffect } from 'react'
-import { CloseIcon, EllipsisIcon, CircleIcon } from '../../icons'
+import { CloseIcon, EllipsisIcon } from '../../icons'
 import './ActionMenu.scss'
 
 export interface ActionMenuItem {
@@ -83,10 +83,7 @@ export const ActionMenu: React.FC<ActionMenuProps> = ({ items, className = '', i
         {isOpen ? (
           <CloseIcon width={18} height={18} />
         ) : (
-          <>
-            <CircleIcon width={32} height={32} className="action-menu__circle" fill="var(--surface-action-soft)" />
-            <EllipsisIcon width={18} height={18} fill="var(--fill-action)" />
-          </>
+          <EllipsisIcon width={18} height={4} fill="var(--fill-action)" />
         )}
       </button>
 

package/src/v2/components/FormField/FormField.scss

@@ -33,7 +33,7 @@
     padding: 8px 10px;
     height: 40px;
     font-family: var(--font-family-sans, 'Geist', sans-serif);
-    font-size: var(--text-regular-size, 15px);
+    font-size: var(--text-regular-size, 16px);
     line-height: var(--text-regular-line, 20px);
     color: var(--label-primary, #121e52);
     background-color: var(--surface-secondary, #f8f8fa);

package/src/v2/components/NewPageHeader/NewPageHeader.scss

@@ -7,13 +7,9 @@
     padding: 32px 32px 0px 32px;
 
     @media (max-width: 768px) {
-        padding: 16px 16px 0px 16px;
+        padding: 16px 0 0 0;
         gap: 0;
     }
-
-    @media (max-width: 480px) {
-        padding: 16px 12px 0px 12px;
-    }
 }
 
 .new-page-header {

package/src/v2/components/ZoneCard/ResourceRow.tsx

@@ -1,57 +1,104 @@
 import React from 'react'
 import { ActionMenu, ActionMenuItem } from '../ActionMenu'
-import { GripVerticalIcon } from '../../icons'
+import { GripVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '../../icons'
 import { DragHandleProps } from './ZoneContainer'
 import './ZoneCard.scss'
 
+export interface ResourceRowLabels {
+  quantity?: string
+  capacity?: string
+  total?: string
+}
+
 export interface ResourceRowProps {
   name: string
   quantity: number
   capacity: number
+  labels?: ResourceRowLabels
   menuItems?: ActionMenuItem[]
   draggable?: boolean
   dragHandleProps?: DragHandleProps
   onClick?: () => void
   className?: string
   style?: React.CSSProperties
+  isMobile?: boolean
+  isFirst?: boolean
+  isLast?: boolean
+  onMoveUp?: () => void
+  onMoveDown?: () => void
 }
 
 export const ResourceRow = React.forwardRef<HTMLDivElement, ResourceRowProps>(({
   name,
   quantity,
   capacity,
+  labels = {},
   menuItems = [],
   draggable = true,
   dragHandleProps,
   onClick,
   className = '',
   style,
+  isMobile = false,
+  isFirst = false,
+  isLast = false,
+  onMoveUp,
+  onMoveDown,
 }, ref) => {
+  const qtyLabel = labels.quantity ?? 'Qty'
+  const capLabel = labels.capacity ?? 'Cap'
+  const totalLabel = labels.total ?? 'Total'
   const classes = [
     'zone-card__resource',
     onClick ? 'zone-card__resource--clickable' : '',
+    isMobile ? 'zone-card__resource--mobile' : '',
     className,
   ].filter(Boolean).join(' ')
 
   return (
     <div ref={ref} className={classes} style={style} onClick={onClick}>
-      {draggable && (
+      {draggable && !isMobile && (
         <div
           className="zone-card__drag-handle zone-card__drag-handle--resource"
           {...dragHandleProps}
           onClick={(e) => e.stopPropagation()}
         >
-          {GripVerticalIcon({ width: 14, height: 14 })}
+          {GripVerticalIcon({ width: 16, height: 16 })}
+        </div>
+      )}
+      {draggable && isMobile && (
+        <div className="zone-card__reorder-arrows zone-card__reorder-arrows--resource" onClick={(e) => e.stopPropagation()}>
+          <button
+            className="zone-card__arrow-btn"
+            disabled={isFirst}
+            onClick={(e) => { e.stopPropagation(); onMoveUp?.() }}
+          >
+            <ArrowUpIcon />
+          </button>
+          <button
+            className="zone-card__arrow-btn"
+            disabled={isLast}
+            onClick={(e) => { e.stopPropagation(); onMoveDown?.() }}
+          >
+            <ArrowDownIcon />
+          </button>
         </div>
       )}
       <span className="zone-card__resource-name">{name}</span>
-      <div className="zone-card__resource-stats">
-        <span className="zone-card__resource-stat">Qty: {quantity}</span>
-        <span className="zone-card__resource-stat">Cap: {capacity}</span>
-        <span className="zone-card__resource-stat zone-card__resource-stat--total">
-          Total: {quantity * capacity}
+      {!isMobile && (
+        <div className="zone-card__resource-stats">
+          <span className="zone-card__resource-stat">{qtyLabel}: {quantity}</span>
+          <span className="zone-card__resource-stat">{capLabel}: {capacity}</span>
+          <span className="zone-card__resource-stat zone-card__resource-stat--total">
+            {totalLabel}: {quantity * capacity}
+          </span>
+        </div>
+      )}
+      {isMobile && (
+        <span className="zone-card__resource-stats-mobile">
+          {qtyLabel}: {quantity} &middot; {capLabel}: {capacity} &middot; {totalLabel}: {quantity * capacity}
         </span>
-      </div>
+      )}
       {menuItems.length > 0 && (
         <div className="zone-card__resource-actions" onClick={(e) => e.stopPropagation()}>
           <ActionMenu items={menuItems} />

package/src/v2/components/ZoneCard/ZoneCard.scss

@@ -7,7 +7,7 @@
   &__header {
     display: flex;
     align-items: center;
-    gap: 12px;
+    gap: 16px;
     padding: 12px 16px;
     background: var(--surface-secondary);
   }
@@ -15,14 +15,15 @@
   &__drag-handle {
     display: flex;
     align-items: center;
-    padding: 4px;
-    border-radius: 4px;
+    padding: 6px;
+    border-radius: 6px;
     cursor: grab;
-    color: var(--label-secondary);
+    color: var(--label-tertiary, var(--label-secondary));
     transition: all 0.2s ease;
+    flex-shrink: 0;
 
     &:hover {
-      color: var(--label-primary);
+      color: var(--label-secondary);
       background: var(--surface-primary);
     }
 
@@ -31,7 +32,44 @@
     }
 
     &--resource {
+      color: var(--label-tertiary, var(--label-secondary));
+    }
+  }
+
+  // Mobile reorder arrows (replaces drag handles)
+  &__reorder-arrows {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    flex-shrink: 0;
+
+    &--resource {
+      margin-right: 0;
+    }
+  }
+
+  &__arrow-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    border: none;
+    border-radius: 4px;
+    background: transparent;
+    color: var(--label-tertiary, var(--label-secondary));
+    cursor: pointer;
+    transition: all 0.2s ease;
+    padding: 0;
+
+    &:hover:not(:disabled) {
       color: var(--label-secondary);
+      background: var(--surface-primary);
+    }
+
+    &:disabled {
+      opacity: 0.25;
+      pointer-events: none;
     }
   }
 
@@ -48,7 +86,7 @@
   &__header-right {
     display: flex;
     align-items: center;
-    gap: 12px;
+    gap: 16px;
     flex-shrink: 0;
   }
 
@@ -59,13 +97,15 @@
     line-height: 16px;
     color: var(--label-secondary);
     white-space: nowrap;
+    min-width: 72px;
+    text-align: right;
   }
 
   // Resource rows
   &__resource {
     display: flex;
     align-items: center;
-    gap: 12px;
+    gap: 16px;
     padding: 10px 16px 10px 32px;
     border-top: 1px solid var(--border-primary);
     transition: background 0.2s ease;
@@ -77,6 +117,11 @@
         background: var(--surface-secondary);
       }
     }
+
+    &--mobile {
+      flex-wrap: wrap;
+      padding-left: 16px;
+    }
   }
 
   &__resource-name {
@@ -103,14 +148,24 @@
     line-height: 16px;
     color: var(--label-secondary);
     white-space: nowrap;
-    min-width: 56px;
+    min-width: 72px;
 
     &--total {
-      min-width: 56px;
+      min-width: 72px;
       text-align: right;
     }
   }
 
+  // Mobile-only compact stats line
+  &__resource-stats-mobile {
+    font-family: var(--font-family-sans, 'Geist', sans-serif);
+    font-size: 12px;
+    font-weight: 400;
+    line-height: 16px;
+    color: var(--label-secondary);
+    white-space: nowrap;
+  }
+
   &__resource-actions {
     flex-shrink: 0;
     width: 32px;
@@ -127,8 +182,13 @@
 
 @media (max-width: 768px) {
   .zone-card {
+    &__header {
+      padding: 10px 12px;
+    }
+
     &__resource {
-      padding-left: 16px;
+      padding: 10px 12px 10px 12px;
+      gap: 12px;
     }
 
     &__resource-stats {
@@ -138,5 +198,9 @@
     &__resource-stat {
       min-width: auto;
     }
+
+    &__add-resource-wrapper {
+      padding: 10px 12px;
+    }
   }
 }

package/src/v2/components/ZoneCard/ZoneCard.stories.tsx

@@ -30,7 +30,7 @@ const resourceMenuItems = [
 export const Default: Story = {
   args: {
     name: 'Bowling',
-    status: 'active',
+
     totalCapacity: 2,
     menuItems: zoneMenuItems,
     onAddResource: () => alert('Add Resource'),
@@ -41,10 +41,9 @@ export const Default: Story = {
   },
 }
 
-export const DisabledZone: Story = {
+export const EmptyZone: Story = {
   args: {
     name: 'VIP Lounge',
-    status: 'disabled',
     totalCapacity: 0,
     menuItems: zoneMenuItems,
     onAddResource: () => alert('Add Resource'),
@@ -58,7 +57,6 @@ export const ComposedManually: Story = {
     <ZoneContainer>
       <ZoneHeader
         name="Bowling"
-        status="active"
         totalCapacity={2}
         menuItems={zoneMenuItems}
       />
@@ -87,7 +85,6 @@ export const StandaloneHeader: Story = {
     <ZoneContainer>
       <ZoneHeader
         name="Main Floor"
-        status="active"
         totalCapacity={50}
         menuItems={zoneMenuItems}
       />