@licklist/design 0.78.27 → 0.78.28

package/dist/index.js

@@ -213,6 +213,7 @@ export { AnalyticsIcon, CustomersIcon, FlowsIcon, HomeIcon, InventoryIcon, Loyal
 export { AdminSidebar } from './v2/navigation/DashboardLayout/AdminSidebar.js';
 export { TopNavigation } from './v2/navigation/DashboardLayout/TopNavigation.js';
 export { DashboardFooter } from './v2/navigation/DashboardLayout/DashboardFooter.js';
+export { BookingTypesIcon, BookingsIcon, CalendarIcon, EditIcon } from './v2/icons/index.js';
 export { default as CountrySelect } from './static/CountrySelect.js';
 export { default as FormCard } from './static/FormCard.js';
 export { default as Image } from './static/Image.js';

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

@@ -0,0 +1,18 @@
+export declare const DashboardIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const CompanyIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const VenueIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const MarketingIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const AdminIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const ProfileIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const CustomersIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const ReportsIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const AnalyticsIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const PaymentsIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const SettingsIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const LoyaltyIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const WaiversIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const CalendarIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const BookingsIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const BookingTypesIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const EditIcon: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/icons/index.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa,+CAOzB,CAAA;AAED,eAAO,MAAM,WAAW,+CAIvB,CAAA;AAED,eAAO,MAAM,SAAS,+CAKrB,CAAA;AAED,eAAO,MAAM,aAAa,+CAIzB,CAAA;AAED,eAAO,MAAM,SAAS,+CAIrB,CAAA;AAED,eAAO,MAAM,WAAW,+CAIvB,CAAA;AAED,eAAO,MAAM,aAAa,+CAIzB,CAAA;AAED,eAAO,MAAM,WAAW,+CAIvB,CAAA;AAED,eAAO,MAAM,aAAa,+CAIzB,CAAA;AAED,eAAO,MAAM,YAAY,+CAIxB,CAAA;AAED,eAAO,MAAM,YAAY,+CAIxB,CAAA;AAED,eAAO,MAAM,WAAW,+CAIvB,CAAA;AAED,eAAO,MAAM,WAAW,+CAIvB,CAAA;AAED,eAAO,MAAM,YAAY,+CAIxB,CAAA;AAED,eAAO,MAAM,YAAY,+CAIxB,CAAA;AAED,eAAO,MAAM,gBAAgB,+CAI5B,CAAA;AAED,eAAO,MAAM,QAAQ,+CAIpB,CAAA"}

package/dist/v2/icons/index.js

@@ -0,0 +1,53 @@
+import { jsx } from 'react/jsx-runtime';
+
+var CalendarIcon = function() {
+    return /*#__PURE__*/ jsx("svg", {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 32 32",
+        fill: "none",
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M13 6V8H19V6H21V8H25C25.5523 8 26 8.44772 26 9V25C26 25.5523 25.5523 26 25 26H7C6.44772 26 6 25.5523 6 25V9C6 8.44772 6.44772 8 7 8H11V6H13ZM24 16H8V24H24V16ZM15 18V22H10V18H15ZM11 10H8V14H24V10H21V12H19V10H13V12H11V10Z",
+            fill: "currentColor"
+        })
+    });
+};
+var BookingsIcon = function() {
+    return /*#__PURE__*/ jsx("svg", {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 32 32",
+        fill: "none",
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M24 6C24.5523 6 25 6.44772 25 7V25C25 25.5523 24.5523 26 24 26H10C9.44772 26 9 25.5523 9 25V23H7V21H9V19H7V17H9V15H7V13H9V11H7V9H9V7C9 6.44772 9.44772 6 10 6H24ZM23 8H11V24H23V8ZM18 12V15H21V17H17.999L18 20H16L15.999 17H13V15H16V12H18Z",
+            fill: "currentColor"
+        })
+    });
+};
+var BookingTypesIcon = function() {
+    return /*#__PURE__*/ jsx("svg", {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 32 32",
+        fill: "none",
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M9 22H6V20H9V22ZM26 22H12V20H26V22ZM9 17H6V15H9V17ZM26 17H12V15H26V17ZM9 12H6V10H9V12ZM26 12H12V10H26V12Z",
+            fill: "currentColor"
+        })
+    });
+};
+var EditIcon = function() {
+    return /*#__PURE__*/ jsx("svg", {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 32 32",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M9 22.89H10.4142L19.7279 13.5763L18.3137 12.1621L9 21.4758V22.89ZM25 24.89H7V20.6473L20.435 7.21232C20.8256 6.8218 21.4587 6.8218 21.8492 7.21232L24.6777 10.0408C25.0682 10.4313 25.0682 11.0644 24.6777 11.455L13.2426 22.89H25V24.89ZM19.7279 10.7479L21.1421 12.1621L22.5563 10.7479L21.1421 9.33364L19.7279 10.7479Z",
+            fill: "var(--fills-main-fill-primary, #14215A)"
+        })
+    });
+};
+
+export { BookingTypesIcon, BookingsIcon, CalendarIcon, EditIcon };

package/dist/v2/navigation/DashboardLayout/index.d.ts

@@ -4,4 +4,5 @@ export { AdminSidebar, type AdminSidebarProps } from './AdminSidebar';
 export { TopNavigation, type TopNavigationProps } from './TopNavigation';
 export { DashboardFooter, type DashboardFooterProps } from './DashboardFooter';
 export { default } from './DashboardLayout';
+export { CalendarIcon, BookingsIcon, BookingTypesIcon, EditIcon } from '../../icons';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACpG,OAAO,EACH,eAAe,EACf,KAAK,oBAAoB,EACzB,KAAK,OAAO,EACZ,QAAQ,EACR,SAAS,EACT,aAAa,EACb,WAAW,EACX,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACrE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACxE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAA;AAC9E,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACpG,OAAO,EACH,eAAe,EACf,KAAK,oBAAoB,EACzB,KAAK,OAAO,EACZ,QAAQ,EACR,SAAS,EACT,aAAa,EACb,WAAW,EACX,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACrE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACxE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAA;AAC9E,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAG3C,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA"}

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

@@ -19,5 +19,5 @@ export type { SidebarUserElementProps } from './SidebarUserElement';
 export { SidebarWithAuth } from './SidebarWithAuth';
 export type { SidebarWithAuthProps } from './SidebarWithAuth';
 export { NAVIGATION_ITEMS } from './config';
-export * from './icons';
+export * from '../icons';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/navigation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAC3C,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/navigation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAC3C,cAAc,UAAU,CAAA"}

package/dist/v2/pages/Settings/components/SidebarCustomisation.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './SidebarCustomisation.scss';
+export interface SidebarItem {
+    id: string;
+    label: string;
+    icon: React.ReactNode;
+    visible: boolean;
+    locked?: boolean;
+}
+export interface SidebarCustomisationProps {
+    items: SidebarItem[];
+    onItemsChange?: (items: SidebarItem[]) => void;
+    onSave?: (items: SidebarItem[]) => void;
+    onReset?: () => void;
+    onCancel?: () => void;
+}
+export declare const defaultSidebarItems: SidebarItem[];
+export declare const SidebarCustomisation: React.FC<SidebarCustomisationProps>;
+export default SidebarCustomisation;
+//# sourceMappingURL=SidebarCustomisation.d.ts.map

package/dist/v2/pages/Settings/components/SidebarCustomisation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarCustomisation.d.ts","sourceRoot":"","sources":["../../../../../src/v2/pages/Settings/components/SidebarCustomisation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,6BAA6B,CAAA;AAapC,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,WAAW,EAAE,CAAA;IACpB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,IAAI,CAAA;IAC9C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,IAAI,CAAA;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB;AAGD,eAAO,MAAM,mBAAmB,EAAE,WAAW,EAS5C,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CA8HpE,CAAA;AAED,eAAe,oBAAoB,CAAA"}

package/package.json

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

package/src/v2/icons/index.tsx

@@ -0,0 +1,105 @@
+export const DashboardIcon = () => (
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path
+            fill="var(--fills-main-fill-primary, #14215A)"
+            d="M17.727 20.118H6.273a.83.83 0 0 1-.818-.84v-7.557H3l8.45-7.884a.803.803 0 0 1 1.1 0L21 11.72h-2.454v7.557a.83.83 0 0 1-.819.84Zm-10.636-1.68h9.818v-8.265L12 5.593l-4.91 4.58v8.266Z"
+        />
+    </svg>
+)
+
+export const CompanyIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M19.5 18.75H4.5V17.25H5.25V6C5.25 5.58579 5.58579 5.25 6 5.25H16.5C16.9142 5.25 17.25 5.58579 17.25 6V9.75H18.75V17.25H19.5V18.75ZM15.75 17.25H17.25V11.25H12.75V17.25H14.25V12.75H15.75V17.25ZM15.75 9.75V6.75H6.75V17.25H11.25V9.75H15.75ZM8.25 11.25H9.75V12.75H8.25V11.25ZM8.25 14.25H9.75V15.75H8.25V14.25ZM8.25 8.25H9.75V9.75H8.25V8.25Z" fill="var(--fills-main-fill-primary, #14215A)" />
+    </svg>
+)
+
+export const VenueIcon = () => (
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+        <path fill="#000" fillOpacity=".1" d="m6 7.5 6.75-2.625V18H6V7.5Z" />
+        <path fill="var(--fills-main-fill-primary, #14215A)" d="M5.25 17.25V7.275a.75.75 0 0 1 .494-.704l7.253-2.638a.375.375 0 0 1 .503.353V8l4.737 1.58a.75.75 0 0 1 .513.71v6.96h1.5v1.5H3.75v-1.5h1.5Zm1.5 0H12V5.892L6.75 7.8v9.45Zm10.5 0v-6.419l-3.75-1.25v7.67h3.75Z" />
+    </svg>
+)
+
+export const MarketingIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path d="M10.7195 16.3629C10.7195 16.3629 15.9848 15.7286 18.7404 17.3195L19.4649 17.1254C19.865 17.0182 20.1024 16.607 19.9952 16.2069L18.8183 11.8146C19.4001 11.4863 19.7099 10.7953 19.529 10.1201C19.3481 9.44504 18.7343 9.00145 18.0663 9.00807L16.8894 4.61576C16.7822 4.21567 16.3709 3.97822 15.9708 4.08543L15.2464 4.27955C13.6554 7.03522 8.7784 9.11847 8.7784 9.11847L5.88062 9.89492C5.08042 10.1093 4.60555 10.9318 4.81996 11.732L5.98464 16.0787C6.19906 16.8789 7.02156 17.3538 7.82176 17.1394L8.54621 16.9453L10.2412 20.3734L11.6901 19.9851L10.7195 16.3629ZM10.5497 9.93369C11.0163 9.69484 11.5885 9.38415 12.197 9.01286C13.317 8.32952 14.7109 7.3523 15.7461 6.14469L18.2407 15.4544C16.7403 14.9262 15.0445 14.7769 13.733 14.7451C13.0204 14.7278 12.3694 14.7448 11.846 14.7712L10.5497 9.93369ZM6.26885 11.3438L9.16662 10.5674L10.3313 14.914L7.43353 15.6905L6.26885 11.3438Z" fill="currentColor" />
+    </svg>
+)
+
+export const AdminIcon = () => (
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+        <path fill="var(--fills-main-fill-primary, #14215A)" d="M12 13.5V15a4.5 4.5 0 0 0-4.5 4.5H6a6 6 0 0 1 6-6Zm0-.75a4.499 4.499 0 0 1-4.5-4.5c0-2.486 2.014-4.5 4.5-4.5s4.5 2.014 4.5 4.5-2.014 4.5-4.5 4.5Zm0-1.5a3 3 0 1 0 0-6 3 3 0 1 0 0 6Zm4.5 7.875-2.204 1.159.42-2.455-1.782-1.738 2.464-.358L16.5 13.5l1.102 2.233 2.465.358-1.784 1.738.421 2.455-2.204-1.159Z" />
+    </svg>
+)
+
+export const ProfileIcon = () => (
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+        <path fill="var(--fills-main-fill-primary, #14215A)" d="M6 19.5a6 6 0 0 1 12 0h-1.5a4.5 4.5 0 1 0-9 0H6Zm6-6.75a4.499 4.499 0 0 1-4.5-4.5c0-2.486 2.014-4.5 4.5-4.5s4.5 2.014 4.5 4.5-2.014 4.5-4.5 4.5Zm0-1.5a3 3 0 1 0 0-6 3 3 0 1 0 0 6Z" />
+    </svg>
+)
+
+export const CustomersIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path d="M4.5 19.5C4.5 16.1863 7.18629 13.5 10.5 13.5C13.8137 13.5 16.5 16.1863 16.5 19.5H15C15 17.0147 12.9853 15 10.5 15C8.01472 15 6 17.0147 6 19.5H4.5ZM10.5 12.75C8.01375 12.75 6 10.7362 6 8.25C6 5.76375 8.01375 3.75 10.5 3.75C12.9862 3.75 15 5.76375 15 8.25C15 10.7362 12.9862 12.75 10.5 12.75ZM10.5 11.25C12.1575 11.25 13.5 9.9075 13.5 8.25C13.5 6.5925 12.1575 5.25 10.5 5.25C8.8425 5.25 7.5 6.5925 7.5 8.25C7.5 9.9075 8.8425 11.25 10.5 11.25ZM16.7128 14.0271C18.7983 14.9671 20.25 17.064 20.25 19.5H18.75C18.75 17.673 17.6612 16.1003 16.0971 15.3953L16.7128 14.0271ZM16.1972 5.55991C17.6958 6.17777 18.75 7.65271 18.75 9.375C18.75 11.5276 17.1032 13.2939 15 13.4832V11.9734C16.2725 11.7916 17.25 10.698 17.25 9.375C17.25 8.33951 16.6512 7.44452 15.7808 7.01726L16.1972 5.55991Z" fill="currentColor" />
+    </svg>
+)
+
+export const ReportsIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path d="M11.25 8.25H12.75V15.75H11.25V8.25ZM14.25 11.25H15.75V15.75H14.25V11.25ZM8.25 12.75H9.75V15.75H8.25V12.75ZM14.25 6H6.75V18H17.25V9H14.25V6ZM5.25 5.24385C5.25 4.83304 5.58562 4.5 5.99888 4.5H15L18.7498 8.25L18.75 18.7444C18.75 19.1617 18.4163 19.5 18.0049 19.5H5.99505C5.58357 19.5 5.25 19.1585 5.25 18.7561V5.24385Z" fill="currentColor" />
+    </svg>
+)
+
+export const AnalyticsIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path d="M6.75 5.25V17.25H18.75V18.75H5.25V5.25H6.75ZM18.2197 7.71967L19.2803 8.78033L15 13.0606L12.75 10.8112L9.53033 14.0303L8.46967 12.9697L12.75 8.68934L15 10.9388L18.2197 7.71967Z" fill="currentColor" />
+    </svg>
+)
+
+export const PaymentsIcon = () => (
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none">
+        <path fill="var(--fills-main-fill-primary, #14215A)" d="M12.004 19.502a7.5 7.5 0 1 1 0-15 7.5 7.5 0 0 1 0 15Zm0-1.5a6 6 0 1 0 0-12 6 6 0 0 0 0 12Zm-2.25-5.25h-.75v-1.5h.75v-.75a2.625 2.625 0 0 1 5.06-.984l-1.49.373a1.124 1.124 0 0 0-2.07.61v.75h2.25v1.5h-2.25v1.5h3.75v1.5h-6v-1.5h.75v-1.5Z" />
+    </svg>
+)
+
+export const SettingsIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none">
+        <path d="M6 15.6385C6 14.774 6.1097 13.9351 6.31595 13.135C7.40622 13.1915 8.48848 12.6488 9.0718 11.6385C9.65467 10.6289 9.58406 9.42138 8.99121 8.50568C10.1835 7.33396 11.6683 6.45889 13.326 6C13.8222 6.97252 14.8333 7.63849 16 7.63849C17.1667 7.63849 18.1778 6.97252 18.674 6C20.3317 6.45889 21.8165 7.33396 23.0088 8.50568C22.4159 9.42138 22.3453 10.6289 22.9282 11.6385C23.5115 12.6488 24.5938 13.1915 25.6841 13.135C25.8903 13.9351 26 14.774 26 15.6385C26 16.503 25.8903 17.3419 25.6841 18.142C24.5938 18.0855 23.5115 18.6282 22.9282 19.6385C22.3453 20.6481 22.4159 21.8556 23.0088 22.7713C21.8165 23.943 20.3317 24.8181 18.674 25.277C18.1778 24.3045 17.1667 23.6385 16 23.6385C14.8333 23.6385 13.8222 24.3045 13.326 25.277C11.6683 24.8181 10.1835 23.943 8.99121 22.7713C9.58406 21.8556 9.65467 20.6481 9.0718 19.6385C8.48848 18.6282 7.40622 18.0855 6.31595 18.142C6.1097 17.3419 6 16.503 6 15.6385ZM10.8039 18.6385C11.434 19.7299 11.6146 20.9846 11.3682 22.1623C11.776 22.4525 12.2101 22.7039 12.6649 22.9128C13.5618 22.1099 14.7392 21.6385 16 21.6385C17.2608 21.6385 18.4382 22.1099 19.3351 22.9128C19.7899 22.7039 20.224 22.4525 20.6318 22.1623C20.3854 20.9846 20.566 19.7299 21.1962 18.6385C21.8262 17.5472 22.8225 16.7635 23.9655 16.388C23.9884 16.1402 24 15.8903 24 15.6385C24 15.3868 23.9884 15.1368 23.9655 14.8891C22.8225 14.5136 21.8262 13.7299 21.1962 12.6385C20.566 11.5471 20.3854 10.2924 20.6318 9.11472C20.224 8.82455 19.7899 8.57314 19.3351 8.36419C18.4382 9.16711 17.2608 9.63849 16 9.63849C14.7392 9.63849 13.5618 9.16711 12.6649 8.36419C12.2101 8.57314 11.776 8.82455 11.3682 9.11472C11.6146 10.2924 11.434 11.5471 10.8039 12.6385C10.1738 13.7299 9.17754 14.5136 8.03451 14.8891C8.01157 15.1368 8 15.3868 8 15.6385C8 15.8903 8.01157 16.1402 8.03451 16.388C9.17754 16.7635 10.1738 17.5472 10.8039 18.6385ZM16 18.6385C14.3431 18.6385 13 17.2954 13 15.6385C13 13.9817 14.3431 12.6385 16 12.6385C17.6569 12.6385 19 13.9817 19 15.6385C19 17.2954 17.6569 18.6385 16 18.6385ZM16 16.6385C16.5523 16.6385 17 16.1908 17 15.6385C17 15.0862 16.5523 14.6385 16 14.6385C15.4477 14.6385 15 15.0862 15 15.6385C15 16.1908 15.4477 16.6385 16 16.6385Z" fill="currentColor" />
+    </svg>
+)
+
+export const LoyaltyIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none">
+        <path d="M12.0005 16.695L6.71036 19.6562L7.89186 13.7099L3.44092 9.59385L9.4612 8.88004L12.0005 3.375L14.5396 8.88004L20.5599 9.59385L16.109 13.7099L17.2905 19.6562L12.0005 16.695ZM12.0005 14.976L15.1855 16.7588L14.4741 13.1788L17.1539 10.7006L13.5292 10.2708L12.0005 6.95626L10.4716 10.2708L6.84691 10.7006L9.52673 13.1788L8.81537 16.7588L12.0005 14.976Z" fill="currentColor" />
+    </svg>
+)
+
+export const WaiversIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none">
+        <path d="M19.5771 18.5563C20.9411 17.6264 22.718 17.1662 25.1523 17.4449L25.6484 17.5104L25.749 17.5309C26.2398 17.6564 26.5658 18.1363 26.4893 18.6481C26.4124 19.1602 25.9595 19.523 25.4531 19.4987L25.3516 19.4889L24.9297 19.4323C22.8719 19.1952 21.596 19.6007 20.7041 20.2086C19.7063 20.8889 19.0536 21.9054 18.3594 23.0729C17.718 24.1516 16.9733 25.5059 15.7871 26.2936C14.5585 27.1092 13.0355 27.2399 11.0518 26.5787L10.6484 26.4362L10.5547 26.3951C10.1007 26.17 9.88172 25.6328 10.0635 25.1481C10.2455 24.6636 10.7639 24.4027 11.2539 24.5319L11.3516 24.5631L11.6816 24.6803C13.2821 25.216 14.1232 24.9983 14.6816 24.6276C15.4013 24.1496 15.9073 23.2847 16.6406 22.0514C17.3213 20.9067 18.1691 19.5164 19.5771 18.5563ZM14.6758 4.54749C14.9256 4.0552 15.5271 3.85842 16.0195 4.10803L20.5703 6.41467L20.6582 6.46545C21.085 6.73909 21.2439 7.29752 21.0098 7.7594L14.4189 20.7594C14.3389 20.9171 14.2179 21.0511 14.0693 21.1471L9.81738 23.8932C9.51875 24.0861 9.14038 24.1056 8.82324 23.9449C8.50608 23.7842 8.29737 23.4669 8.27637 23.1119L7.97852 18.0592C7.96811 17.8825 8.00497 17.7053 8.08496 17.5475L14.6758 4.54749ZM9.99121 18.2106L10.1719 21.2819L12.7578 19.6129L18.7734 7.7467L16.0068 6.34436L9.99121 18.2106Z" fill="currentColor" />
+    </svg>
+)
+
+export const CalendarIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none">
+        <path d="M13 6V8H19V6H21V8H25C25.5523 8 26 8.44772 26 9V25C26 25.5523 25.5523 26 25 26H7C6.44772 26 6 25.5523 6 25V9C6 8.44772 6.44772 8 7 8H11V6H13ZM24 16H8V24H24V16ZM15 18V22H10V18H15ZM11 10H8V14H24V10H21V12H19V10H13V12H11V10Z" fill="currentColor" />
+    </svg>
+)
+
+export const BookingsIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none">
+        <path d="M24 6C24.5523 6 25 6.44772 25 7V25C25 25.5523 24.5523 26 24 26H10C9.44772 26 9 25.5523 9 25V23H7V21H9V19H7V17H9V15H7V13H9V11H7V9H9V7C9 6.44772 9.44772 6 10 6H24ZM23 8H11V24H23V8ZM18 12V15H21V17H17.999L18 20H16L15.999 17H13V15H16V12H18Z" fill="currentColor" />
+    </svg>
+)
+
+export const BookingTypesIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none">
+        <path d="M9 22H6V20H9V22ZM26 22H12V20H26V22ZM9 17H6V15H9V17ZM26 17H12V15H26V17ZM9 12H6V10H9V12ZM26 12H12V10H26V12Z" fill="currentColor" />
+    </svg>
+)
+
+export const EditIcon = () => (
+    <svg width="24" height="24" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M9 22.89H10.4142L19.7279 13.5763L18.3137 12.1621L9 21.4758V22.89ZM25 24.89H7V20.6473L20.435 7.21232C20.8256 6.8218 21.4587 6.8218 21.8492 7.21232L24.6777 10.0408C25.0682 10.4313 25.0682 11.0644 24.6777 11.455L13.2426 22.89H25V24.89ZM19.7279 10.7479L21.1421 12.1621L22.5563 10.7479L21.1421 9.33364L19.7279 10.7479Z" fill="var(--fills-main-fill-primary, #14215A)"/>
+    </svg>
+)

package/src/v2/navigation/DashboardLayout/index.ts

@@ -18,3 +18,6 @@ export { AdminSidebar, type AdminSidebarProps } from './AdminSidebar'
 export { TopNavigation, type TopNavigationProps } from './TopNavigation'
 export { DashboardFooter, type DashboardFooterProps } from './DashboardFooter'
 export { default } from './DashboardLayout'
+
+// Additional icons from v2/icons
+export { CalendarIcon, BookingsIcon, BookingTypesIcon, EditIcon } from '../../icons'

package/src/v2/navigation/Navigation/Navigation.tsx

@@ -13,7 +13,7 @@ import {
     AnalyticsIcon,
     PaymentsIcon,
     SettingsIcon,
-} from '../icons'
+} from '../../icons'
 import './Navigation.scss'
 
 export interface NavigationProps {

package/src/v2/navigation/NavigationItem/NavigationItem.stories.tsx

@@ -1,7 +1,7 @@
 import { Meta, StoryObj } from '@storybook/react'
 import React from 'react'
 import { NavigationItem } from './NavigationItem'
-import { DashboardIcon, CompanyIcon, SettingsIcon } from '../icons'
+import { DashboardIcon, CompanyIcon, SettingsIcon } from '../../icons'
 
 export default {
     title: 'v2/Navigation/NavigationItem',

package/src/v2/navigation/index.ts

@@ -19,5 +19,5 @@ export type { SidebarUserElementProps } from './SidebarUserElement'
 export { SidebarWithAuth } from './SidebarWithAuth'
 export type { SidebarWithAuthProps } from './SidebarWithAuth'
 export { NAVIGATION_ITEMS } from './config'
-export * from './icons'
+export * from '../icons'
 

package/src/v2/pages/Settings/components/SidebarCustomisation.scss

@@ -0,0 +1,204 @@
+@import '../../../styles/tokens/typography';
+@import '../../../styles/tokens/colors';
+
+.sidebar-customisation {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  width: 100%;
+  font-family: var(--font-family-sans);
+
+  &__header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  &__title {
+    font-size: 1rem;
+    font-weight: 600;
+    line-height: 1.2;
+    color: var(--label-primary);
+    margin: 0;
+  }
+
+  &__cancel-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    height: 36px;
+    padding: 0 12px;
+    border-radius: 6px;
+    border: none;
+    background: transparent;
+    color: var(--label-danger);
+    font-size: 14px;
+    font-weight: 500;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+
+    &:hover {
+      background-color: var(--surface-danger-soft, rgba(239, 68, 68, 0.1));
+    }
+
+    &:focus-visible {
+      outline: 2px solid var(--border-action);
+      outline-offset: 2px;
+    }
+  }
+
+  &__edit-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 6px;
+    height: 36px;
+    padding: 0 12px 0 4px;
+    border-radius: 6px;
+    border: none;
+    background: transparent;
+    color: var(--label-primary);
+    font-size: 14px;
+    font-weight: 500;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+
+    svg {
+      width: 20px;
+      height: 20px;
+      flex-shrink: 0;
+      fill: var(--fill-primary);
+    }
+
+    &:hover {
+      background-color: var(--surface-tertiary);
+    }
+
+    &:focus-visible {
+      outline: 2px solid var(--border-action);
+      outline-offset: 2px;
+    }
+  }
+
+  // Edit mode grid - responsive columns
+  &__grid {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 16px;
+    width: 100%;
+
+    @media (min-width: 768px) {
+      grid-template-columns: repeat(2, 1fr);
+    }
+
+    @media (min-width: 1024px) {
+      grid-template-columns: repeat(3, 1fr);
+    }
+
+    @media (min-width: 1536px) {
+      grid-template-columns: repeat(4, 1fr);
+    }
+  }
+
+  // View mode grid - responsive columns
+  &__view-grid {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 12px;
+    width: 100%;
+
+    @media (min-width: 768px) {
+      grid-template-columns: repeat(2, 1fr);
+    }
+
+    @media (min-width: 1024px) {
+      grid-template-columns: repeat(3, 1fr);
+    }
+
+    @media (min-width: 1536px) {
+      grid-template-columns: repeat(4, 1fr);
+    }
+  }
+
+  &__view-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 12px;
+    border: 1px solid var(--border-primary);
+    border-radius: 8px;
+    background-color: var(--surface-secondary);
+    min-width: 0;
+
+    &--hidden {
+      opacity: 0.5;
+    }
+  }
+
+  &__view-icon {
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--fill-primary);
+    flex-shrink: 0;
+
+    svg {
+      width: 24px;
+      height: 24px;
+    }
+  }
+
+  &__view-label {
+    @include typography('text.small.emphasis');
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__actions {
+    display: flex;
+    align-items: center;
+    gap: 24px;
+    margin-top: 8px;
+  }
+
+  &__save-btn {
+    @include typography('text.regular');
+    font-weight: 600;
+    padding: 10px 20px;
+    border-radius: 8px;
+    border: none;
+    background-color: var(--fill-action);
+    color: var(--label-white);
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+
+    &:hover {
+      background-color: var(--actions-dark);
+    }
+
+    &:focus-visible {
+      outline: 2px solid var(--border-action);
+      outline-offset: 2px;
+    }
+  }
+
+  &__reset-btn {
+    @include typography('text.small');
+    font-weight: 500;
+    color: var(--label-secondary);
+    background: none;
+    border: none;
+    cursor: pointer;
+    padding: 0;
+
+    &:hover {
+      color: var(--label-primary);
+      text-decoration: underline;
+    }
+  }
+}

package/src/v2/pages/Settings/components/SidebarCustomisation.tsx

@@ -0,0 +1,172 @@
+import React, { useEffect, useState } from 'react'
+import { SidebarNavItem } from './SidebarNavItem'
+import './SidebarCustomisation.scss'
+import {
+  CalendarIcon,
+  BookingsIcon,
+  BookingTypesIcon,
+  LoyaltyIcon,
+  CustomersIcon,
+  MarketingIcon,
+  WaiversIcon,
+  SettingsIcon,
+  EditIcon,
+} from '../../../icons'
+
+export interface SidebarItem {
+  id: string
+  label: string
+  icon: React.ReactNode
+  visible: boolean
+  locked?: boolean
+}
+
+export interface SidebarCustomisationProps {
+  items: SidebarItem[]
+  onItemsChange?: (items: SidebarItem[]) => void
+  onSave?: (items: SidebarItem[]) => void
+  onReset?: () => void
+  onCancel?: () => void
+}
+
+// Default sidebar items - IDs must match useProviderNavigation.tsx
+export const defaultSidebarItems: SidebarItem[] = [
+  { id: 'events', label: 'Dates & Events', icon: <CalendarIcon />, visible: true },
+  { id: 'sales', label: 'Bookings & Enquiries', icon: <BookingsIcon />, visible: true },
+  { id: 'product-sets', label: 'Booking Types', icon: <BookingTypesIcon />, visible: true },
+  { id: 'loyalty', label: 'Loyalty', icon: <LoyaltyIcon />, visible: true },
+  { id: 'customers', label: 'Customers', icon: <CustomersIcon />, visible: true },
+  { id: 'emails', label: 'Email & SMS', icon: <MarketingIcon />, visible: true },
+  { id: 'waivers', label: 'Waivers', icon: <WaiversIcon />, visible: true },
+  { id: 'settings', label: 'Settings', icon: <SettingsIcon />, visible: true, locked: true },
+]
+
+export const SidebarCustomisation: React.FC<SidebarCustomisationProps> = ({
+  items: initialItems,
+  onItemsChange,
+  onSave,
+  onReset,
+  onCancel,
+}) => {
+  const [items, setItems] = useState<SidebarItem[]>(initialItems)
+  const [itemsBeforeEdit, setItemsBeforeEdit] = useState<SidebarItem[]>(initialItems)
+  const [isEditing, setIsEditing] = useState(false)
+
+  useEffect(() => {
+    setItems(initialItems)
+    if (!isEditing) {
+      setItemsBeforeEdit(initialItems)
+    }
+  }, [initialItems, isEditing])
+
+  const handleLabelChange = (id: string, newLabel: string) => {
+    const updatedItems = items.map((item) =>
+      item.id === id ? { ...item, label: newLabel } : item
+    )
+    setItems(updatedItems)
+  }
+
+  const handleSave = () => {
+    onItemsChange?.(items)
+    onSave?.(items)
+    setItemsBeforeEdit(items)
+    setIsEditing(false)
+  }
+
+  const handleReset = () => {
+    // Reset to defaults in UI - parent handles the actual default values
+    onReset?.()
+  }
+
+  const handleCancel = () => {
+    setItems(itemsBeforeEdit)
+    onCancel?.()
+    setIsEditing(false)
+  }
+
+  const handleEdit = () => {
+    setItemsBeforeEdit(items)
+    setIsEditing(true)
+  }
+
+  return (
+    <div className="sidebar-customisation">
+      <div className="sidebar-customisation__header">
+        <h3 className="sidebar-customisation__title">Sidebar Customisation</h3>
+        {isEditing ? (
+          <button
+            type="button"
+            className="sidebar-customisation__cancel-btn"
+            onClick={handleCancel}
+          >
+            Cancel
+          </button>
+        ) : (
+          <button
+            type="button"
+            className="sidebar-customisation__edit-btn"
+            onClick={handleEdit}
+          >
+            <EditIcon />
+            <span>Edit Side Bar</span>
+          </button>
+        )}
+      </div>
+
+      {isEditing ? (
+        <>
+          <div className="sidebar-customisation__grid">
+            {items.map((item) => {
+              const defaultItem = defaultSidebarItems.find(d => d.id === item.id)
+              return (
+                <SidebarNavItem
+                  key={item.id}
+                  id={item.id}
+                  label={item.label}
+                  defaultLabel={defaultItem?.label || item.label}
+                  icon={item.icon}
+                  onLabelChange={handleLabelChange}
+                />
+              )
+            })}
+          </div>
+
+          <div className="sidebar-customisation__actions">
+            <button
+              type="button"
+              className="sidebar-customisation__save-btn"
+              onClick={handleSave}
+            >
+              Save Changes
+            </button>
+            <button
+              type="button"
+              className="sidebar-customisation__reset-btn"
+              onClick={handleReset}
+            >
+              Reset to defaults
+            </button>
+          </div>
+        </>
+      ) : (
+        <div className="sidebar-customisation__view-grid">
+          {items.map((item) => (
+            <div
+              key={item.id}
+              className={`sidebar-customisation__view-item ${!item.visible ? 'sidebar-customisation__view-item--hidden' : ''}`}
+            >
+              <span className="sidebar-customisation__view-icon">
+                {item.icon}
+              </span>
+              <span className="sidebar-customisation__view-label">
+                {item.label}
+              </span>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  )
+}
+
+export default SidebarCustomisation