@licklist/design 0.78.45 → 0.78.46

package/dist/index.d.ts

@@ -51,5 +51,7 @@ export * from './v2/dashboard-analytics';
 export * from './v2/navigation/DashboardLayout';
 export * from './v2/pages/Settings';
 export * from './v2/pages/ZonesResources';
+export * from './v2/pages/SettingsSubPage';
+export * from './v2/pages/DeleteEntity';
 export * from './v2/components';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA;AACtB,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,UAAU,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAChC,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAA;AAC1D,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,aAAa,CAAA;AAC3B,cAAc,wBAAwB,CAAA;AACtC,cAAc,cAAc,CAAA;AAC5B,cAAc,qBAAqB,CAAA;AACnC,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,SAAS,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAA;AACxE,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,0BAA0B,CAAA;AACxC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA;AACtB,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,oBAAoB,CAAA;AAClC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,UAAU,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAChC,cAAc,aAAa,CAAA;AAC3B,cAAc,oBAAoB,CAAA;AAClC,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAA;AAC1D,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,aAAa,CAAA;AAC3B,cAAc,wBAAwB,CAAA;AACtC,cAAc,cAAc,CAAA;AAC5B,cAAc,qBAAqB,CAAA;AACnC,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,YAAY,CAAA;AAC1B,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,SAAS,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAA;AACxE,cAAc,gBAAgB,CAAA;AAC9B,cAAc,oBAAoB,CAAA;AAClC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,0BAA0B,CAAA;AACxC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,yBAAyB,CAAA;AACvC,cAAc,iBAAiB,CAAA"}

package/dist/index.js

@@ -237,6 +237,8 @@ export { ZoneContainer } from './v2/components/ZoneCard/ZoneContainer.js';
 export { ZoneHeader } from './v2/components/ZoneCard/ZoneHeader.js';
 export { ResourceRow } from './v2/components/ZoneCard/ResourceRow.js';
 export { AddResourceButton } from './v2/components/ZoneCard/AddResourceButton.js';
+export { PeriodCard, PeriodCardSection, PeriodCardTimeRange } from './v2/components/PeriodCard/PeriodCard.js';
+export { ReorderRow } from './v2/components/ReorderRow/ReorderRow.js';
 export { ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, BookingTypesIcon, BookingsIcon, CalendarIcon, CircleIcon, ClearIcon, ClockIcon, CloseIcon, DeleteIcon, EditIcon, EllipsisIcon, ExportIcon, ExternalLinkIcon, GripVerticalIcon, InfoIcon, LocationIcon, PadlockIcon, PlusIcon, RefreshIcon, ReorderIcon, SearchIcon, SendIcon, SettingsPageDashboardIcon, SettingsPageWaiversIcon, TableHeaderArrowDownIcon, TableHeaderArrowUpIcon, VenueIcon } from './v2/icons/index.js';
 export { MetricCard } from './v2/dashboard-analytics/metric-card/MetricCard.js';
 export { VenueCard } from './v2/dashboard-analytics/venue-card/VenueCard.js';
@@ -254,6 +256,8 @@ export { SettingsTabs } from './v2/pages/Settings/SettingsTabs.js';
 export { SidebarCustomisation, defaultSidebarItems } from './v2/pages/Settings/components/SidebarCustomisation.js';
 export { SidebarNavItem } from './v2/pages/Settings/components/SidebarNavItem.js';
 export { ZonesResourcesPage } from './v2/pages/ZonesResources/ZonesResourcesPage.js';
+export { SettingsSubPage } from './v2/pages/SettingsSubPage/SettingsSubPage.js';
+export { DeleteEntityPage } from './v2/pages/DeleteEntity/DeleteEntityPage.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/components/PeriodCard/PeriodCard.d.ts

@@ -0,0 +1,66 @@
+import React from 'react';
+import './PeriodCard.scss';
+export interface PeriodCardValue {
+    days: string[];
+    is24Hours: boolean;
+    startTime?: string;
+    endTime?: string;
+    maxCapacity: number;
+    minCapacity: number | null;
+}
+export interface PeriodCardLabels {
+    badge?: string;
+    sectionTitle?: string;
+    minValue?: string;
+    maxValue?: string;
+    days?: string;
+    time?: string;
+    alignToggle?: string;
+    startTime?: string;
+    endTime?: string;
+}
+export interface PeriodCardProps {
+    /** Controlled value for built-in sections. Not needed when using children. */
+    value?: PeriodCardValue;
+    /** Called when built-in sections change. Not needed when using children. */
+    onChange?: (value: PeriodCardValue) => void;
+    onDelete?: () => void;
+    labels?: PeriodCardLabels;
+    dayLabels?: string[];
+    /** Plain text title rendered at the top (e.g. "Period 1"). Mutually exclusive with badge header. */
+    title?: string;
+    /** Hide the badge + delete header row (useful with title) */
+    hideHeader?: boolean;
+    /** Hide the min/max capacity section */
+    hideCapacity?: boolean;
+    /** Hide the days selection section */
+    hideDays?: boolean;
+    /** Hide the time section */
+    hideTime?: boolean;
+    /** Make the min value field optional (shows "(optional)" label) */
+    minOptional?: boolean;
+    /** Custom icon for the badge. Defaults to ClockIcon */
+    badgeIcon?: React.ReactNode;
+    /** Custom content. When provided, built-in sections (capacity, days, time) are not rendered. */
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare const PeriodCard: React.FC<PeriodCardProps>;
+export interface PeriodCardSectionProps {
+    label?: string;
+    children: React.ReactNode;
+    className?: string;
+}
+export declare const PeriodCardSection: React.FC<PeriodCardSectionProps>;
+export interface PeriodCardTimeRangeProps {
+    startTime: string;
+    endTime: string;
+    onStartTimeChange: (value: string) => void;
+    onEndTimeChange: (value: string) => void;
+    startLabel?: string;
+    endLabel?: string;
+    separator?: string;
+    className?: string;
+}
+export declare const PeriodCardTimeRange: React.FC<PeriodCardTimeRangeProps>;
+//# sourceMappingURL=PeriodCard.d.ts.map

package/dist/v2/components/PeriodCard/PeriodCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PeriodCard.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/PeriodCard/PeriodCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,mBAAmB,CAAA;AAE1B,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,MAAM,EAAE,CAAA;IACd,SAAS,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,MAAM,GAAG,IAAI,CAAA;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAwBD,MAAM,WAAW,eAAe;IAC9B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,eAAe,CAAA;IACvB,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAA;IAC3C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IACrB,MAAM,CAAC,EAAE,gBAAgB,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,oGAAoG;IACpG,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,wCAAwC;IACxC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mEAAmE;IACnE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,uDAAuD;IACvD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,gGAAgG;IAChG,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA0LhD,CAAA;AAID,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAW9D,CAAA;AAID,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,MAAM,CAAA;IACf,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACxC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAyBlE,CAAA"}

package/dist/v2/components/PeriodCard/PeriodCard.js

@@ -0,0 +1,351 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import 'react';
+import { NewInput } from '../NewInput/NewInput.js';
+import { Checkbox } from '../Checkbox/Checkbox.js';
+import { IconButton } from '../IconButton/IconButton.js';
+import { ClockIcon } from '../../icons/index.js';
+import './PeriodCard.scss.js';
+
+function _array_like_to_array(arr, len) {
+    if (len == null || len > arr.length) len = arr.length;
+    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
+    return arr2;
+}
+function _array_without_holes(arr) {
+    if (Array.isArray(arr)) return _array_like_to_array(arr);
+}
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _iterable_to_array(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _non_iterable_spread() {
+    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function _to_consumable_array(arr) {
+    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
+}
+function _unsupported_iterable_to_array(o, minLen) {
+    if (!o) return;
+    if (typeof o === "string") return _array_like_to_array(o, minLen);
+    var n = Object.prototype.toString.call(o).slice(8, -1);
+    if (n === "Object" && o.constructor) n = o.constructor.name;
+    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
+}
+var DEFAULT_LABELS = {
+    badge: 'Period',
+    sectionTitle: 'Override',
+    minValue: 'Min',
+    maxValue: 'Max',
+    days: 'Days',
+    time: 'Time',
+    alignToggle: 'Align with Opening Hours',
+    startTime: 'Start Time',
+    endTime: 'End Time'
+};
+var DAY_OPTIONS = [
+    'Monday',
+    'Tuesday',
+    'Wednesday',
+    'Thursday',
+    'Friday',
+    'Saturday',
+    'Sunday'
+];
+var PeriodCard = function(param) {
+    var value = param.value, onChange = param.onChange, onDelete = param.onDelete, labelsProp = param.labels, dayLabels = param.dayLabels, title = param.title, _param_hideHeader = param.hideHeader, hideHeader = _param_hideHeader === void 0 ? false : _param_hideHeader, _param_hideCapacity = param.hideCapacity, hideCapacity = _param_hideCapacity === void 0 ? false : _param_hideCapacity, _param_hideDays = param.hideDays, hideDays = _param_hideDays === void 0 ? false : _param_hideDays, _param_hideTime = param.hideTime, hideTime = _param_hideTime === void 0 ? false : _param_hideTime, _param_minOptional = param.minOptional, minOptional = _param_minOptional === void 0 ? true : _param_minOptional, badgeIcon = param.badgeIcon, children = param.children, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className;
+    var labels = _object_spread({}, DEFAULT_LABELS, labelsProp);
+    var days = dayLabels || DAY_OPTIONS;
+    var hasChildren = !!children;
+    var updateField = function(updates) {
+        if (value && onChange) {
+            onChange(_object_spread({}, value, updates));
+        }
+    };
+    var toggleDay = function(day) {
+        if (!value) return;
+        var current = value.days || [];
+        var updated = current.includes(day) ? current.filter(function(d) {
+            return d !== day;
+        }) : _to_consumable_array(current).concat([
+            day
+        ]);
+        updateField({
+            days: updated
+        });
+    };
+    var toggleAlignHours = function(checked) {
+        if (checked) {
+            updateField({
+                is24Hours: true,
+                startTime: undefined,
+                endTime: undefined
+            });
+        } else {
+            updateField({
+                is24Hours: false,
+                startTime: '09:00',
+                endTime: '17:00'
+            });
+        }
+    };
+    var leftDays = days.slice(0, 4);
+    var rightDays = days.slice(4);
+    var _value_is24Hours;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "period-card ".concat(className),
+        children: [
+            title && /*#__PURE__*/ jsxs("div", {
+                className: "period-card__title-row",
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        className: "period-card__title",
+                        children: title
+                    }),
+                    onDelete && /*#__PURE__*/ jsx(IconButton, {
+                        icon: "delete",
+                        onClick: onDelete
+                    })
+                ]
+            }),
+            !hideHeader && !title && /*#__PURE__*/ jsxs("div", {
+                className: "period-card__header",
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        className: "period-card__badge-group",
+                        children: [
+                            badgeIcon || /*#__PURE__*/ jsx(ClockIcon, {
+                                width: 20,
+                                height: 20
+                            }),
+                            /*#__PURE__*/ jsx("span", {
+                                className: "period-card__badge",
+                                children: labels.badge
+                            })
+                        ]
+                    }),
+                    onDelete && /*#__PURE__*/ jsx(IconButton, {
+                        icon: "delete",
+                        onClick: onDelete
+                    })
+                ]
+            }),
+            hasChildren ? children : /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    !hideCapacity && value && /*#__PURE__*/ jsxs("div", {
+                        className: "period-card__section",
+                        children: [
+                            /*#__PURE__*/ jsx("label", {
+                                className: "period-card__section-label",
+                                children: labels.sectionTitle
+                            }),
+                            /*#__PURE__*/ jsxs("div", {
+                                className: "period-card__row",
+                                children: [
+                                    /*#__PURE__*/ jsx(NewInput, {
+                                        label: labels.minValue,
+                                        optional: minOptional,
+                                        type: "number",
+                                        min: 0,
+                                        value: value.minCapacity === null || value.minCapacity === 0 ? '' : value.minCapacity,
+                                        onChange: function(e) {
+                                            return updateField({
+                                                minCapacity: e.target.value === '' ? null : parseInt(e.target.value, 10) || 0
+                                            });
+                                        }
+                                    }),
+                                    /*#__PURE__*/ jsx(NewInput, {
+                                        label: labels.maxValue,
+                                        type: "number",
+                                        min: 1,
+                                        value: value.maxCapacity === 0 ? '' : value.maxCapacity,
+                                        onChange: function(e) {
+                                            return updateField({
+                                                maxCapacity: e.target.value === '' ? 0 : parseInt(e.target.value, 10) || 0
+                                            });
+                                        }
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    !hideDays && value && /*#__PURE__*/ jsxs("div", {
+                        className: "period-card__section",
+                        children: [
+                            /*#__PURE__*/ jsx("label", {
+                                className: "period-card__section-label",
+                                children: labels.days
+                            }),
+                            /*#__PURE__*/ jsxs("div", {
+                                className: "period-card__days-grid",
+                                children: [
+                                    /*#__PURE__*/ jsx("div", {
+                                        className: "period-card__days-col",
+                                        children: leftDays.map(function(day) {
+                                            var _value_days;
+                                            return /*#__PURE__*/ jsx(DayCheckbox, {
+                                                label: day,
+                                                checked: ((_value_days = value.days) === null || _value_days === void 0 ? void 0 : _value_days.includes(day)) || false,
+                                                onChange: function() {
+                                                    return toggleDay(day);
+                                                }
+                                            }, day);
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsx("div", {
+                                        className: "period-card__days-col",
+                                        children: rightDays.map(function(day) {
+                                            var _value_days;
+                                            return /*#__PURE__*/ jsx(DayCheckbox, {
+                                                label: day,
+                                                checked: ((_value_days = value.days) === null || _value_days === void 0 ? void 0 : _value_days.includes(day)) || false,
+                                                onChange: function() {
+                                                    return toggleDay(day);
+                                                }
+                                            }, day);
+                                        })
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    !hideTime && value && /*#__PURE__*/ jsxs("div", {
+                        className: "period-card__section",
+                        children: [
+                            /*#__PURE__*/ jsx("label", {
+                                className: "period-card__section-label",
+                                children: labels.time
+                            }),
+                            /*#__PURE__*/ jsx(Checkbox, {
+                                label: labels.alignToggle,
+                                checked: (_value_is24Hours = value.is24Hours) !== null && _value_is24Hours !== void 0 ? _value_is24Hours : true,
+                                onChange: function(e) {
+                                    return toggleAlignHours(e.target.checked);
+                                }
+                            }),
+                            !value.is24Hours && /*#__PURE__*/ jsxs("div", {
+                                className: "period-card__row period-card__row--time",
+                                children: [
+                                    /*#__PURE__*/ jsx(NewInput, {
+                                        label: labels.startTime,
+                                        type: "time",
+                                        value: value.startTime || '09:00',
+                                        onChange: function(e) {
+                                            return updateField({
+                                                startTime: e.target.value
+                                            });
+                                        }
+                                    }),
+                                    /*#__PURE__*/ jsx(NewInput, {
+                                        label: labels.endTime,
+                                        type: "time",
+                                        value: value.endTime || '17:00',
+                                        onChange: function(e) {
+                                            return updateField({
+                                                endTime: e.target.value
+                                            });
+                                        }
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
+var PeriodCardSection = function(param) {
+    var label = param.label, children = param.children, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "period-card__section ".concat(className),
+        children: [
+            label && /*#__PURE__*/ jsx("label", {
+                className: "period-card__section-label",
+                children: label
+            }),
+            children
+        ]
+    });
+};
+PeriodCardSection.displayName = 'PeriodCardSection';
+var PeriodCardTimeRange = function(param) {
+    var startTime = param.startTime, endTime = param.endTime, onStartTimeChange = param.onStartTimeChange, onEndTimeChange = param.onEndTimeChange, startLabel = param.startLabel, endLabel = param.endLabel, _param_separator = param.separator, separator = _param_separator === void 0 ? 'to' : _param_separator, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "period-card__time-range ".concat(className),
+        children: [
+            /*#__PURE__*/ jsx(NewInput, {
+                label: startLabel,
+                type: "time",
+                value: startTime,
+                onChange: function(e) {
+                    return onStartTimeChange(e.target.value);
+                }
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "period-card__time-separator",
+                children: separator
+            }),
+            /*#__PURE__*/ jsx(NewInput, {
+                label: endLabel,
+                type: "time",
+                value: endTime,
+                onChange: function(e) {
+                    return onEndTimeChange(e.target.value);
+                }
+            })
+        ]
+    });
+};
+PeriodCardTimeRange.displayName = 'PeriodCardTimeRange';
+var DayCheckbox = function(param) {
+    var label = param.label, checked = param.checked, onChange = param.onChange;
+    return /*#__PURE__*/ jsxs("label", {
+        className: "day-checkbox",
+        children: [
+            /*#__PURE__*/ jsx("input", {
+                type: "checkbox",
+                className: "day-checkbox__input",
+                checked: checked,
+                onChange: onChange
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "day-checkbox__box"
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "day-checkbox__label",
+                children: label
+            })
+        ]
+    });
+};
+PeriodCard.displayName = 'PeriodCard';
+
+export { PeriodCard, PeriodCardSection, PeriodCardTimeRange };

package/dist/v2/components/PeriodCard/PeriodCard.scss.js

@@ -0,0 +1,6 @@
+import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".period-card{background:var(--surface-secondary,#f5f6fa);border-radius:8px;display:flex;flex-direction:column;gap:16px;padding:16px}.period-card__title-row{align-items:center;display:flex;justify-content:space-between}.period-card__title{color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans);font-size:16px;font-weight:600}.period-card__header{align-items:center;display:flex;justify-content:space-between}.period-card__badge-group{align-items:center;color:var(--label-secondary,#6b7a99);display:flex;gap:8px}.period-card__badge{border:1px solid var(--border-primary,#e2e2e2);border-radius:999px;color:var(--label-secondary,#6b7a99);font-family:var(--font-family-sans);font-size:12px;padding:2px 10px}.period-card__section{display:flex;flex-direction:column;gap:8px}.period-card__section-label{color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans);font-size:14px;font-weight:600}.period-card__row{display:grid;gap:16px;grid-template-columns:1fr 1fr}@media (max-width:768px){.period-card__row{gap:12px;grid-template-columns:1fr}}.period-card__row--time{margin-top:8px}.period-card__days-grid{display:grid;gap:8px;grid-template-columns:1fr 1fr}.period-card__days-col{display:flex;flex-direction:column;gap:8px}.period-card__time-range{align-items:end;display:grid;gap:12px;grid-template-columns:1fr auto 1fr}@media (max-width:768px){.period-card__time-range{gap:8px;grid-template-columns:1fr}}.period-card__time-separator{color:var(--label-secondary,#6b7a99);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:14px;padding-bottom:10px}.day-checkbox{align-items:center;cursor:pointer;display:flex;gap:6px;-webkit-user-select:none;user-select:none}.day-checkbox__input{height:0;opacity:0;position:absolute;width:0}.day-checkbox__box{background:var(--surface-primary,#fff);border:1px solid var(--border-primary,#e2e2e2);border-radius:3px;height:16px;min-width:16px;position:relative;transition:all .15s ease;width:16px}.day-checkbox__box:after{border:solid #fff;border-width:0 2px 2px 0;content:\"\";height:9px;left:4.5px;opacity:0;position:absolute;top:1px;transform:rotate(45deg);width:5px}.day-checkbox__input:checked+.day-checkbox__box{background:var(--fill-selected,#14215a);border-color:var(--fill-selected,#14215a)}.day-checkbox__input:checked+.day-checkbox__box:after{opacity:1}.day-checkbox__label{color:var(--label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:14px}";
+styleInject(css_248z);
+
+export { css_248z as default };

package/dist/v2/components/PeriodCard/index.d.ts

@@ -0,0 +1,3 @@
+export { PeriodCard, PeriodCardSection, PeriodCardTimeRange } from './PeriodCard';
+export type { PeriodCardProps, PeriodCardValue, PeriodCardLabels, PeriodCardSectionProps, PeriodCardTimeRangeProps, } from './PeriodCard';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/PeriodCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AACjF,YAAY,EACV,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,sBAAsB,EACtB,wBAAwB,GACzB,MAAM,cAAc,CAAA"}

package/dist/v2/components/ReorderRow/ReorderRow.d.ts

@@ -0,0 +1,24 @@
+import React, { HTMLAttributes } from 'react';
+import './ReorderRow.scss';
+export interface DragHandleRenderProps {
+    /** Spread onto the drag handle element for dnd-kit or similar */
+    attributes?: HTMLAttributes<HTMLElement>;
+    listeners?: Record<string, Function> | undefined;
+}
+export interface ReorderRowProps {
+    label: string;
+    subtitle?: string;
+    /** Render prop for the drag handle — receives attributes/listeners to spread */
+    dragHandleProps?: DragHandleRenderProps;
+    /** Hide the drag handle (e.g. when not in reorder mode) */
+    hideDragHandle?: boolean;
+    /** Content between the drag handle and label (e.g. color dot, icon) */
+    leftContent?: React.ReactNode;
+    /** Right-side content (e.g. action menu, capacity badge) */
+    rightContent?: React.ReactNode;
+    onClick?: () => void;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const ReorderRow: React.ForwardRefExoticComponent<ReorderRowProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=ReorderRow.d.ts.map

package/dist/v2/components/ReorderRow/ReorderRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReorderRow.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ReorderRow/ReorderRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE7C,OAAO,mBAAmB,CAAA;AAE1B,MAAM,WAAW,qBAAqB;IACpC,iEAAiE;IACjE,UAAU,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;IAExC,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAA;CACjD;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gFAAgF;IAChF,eAAe,CAAC,EAAE,qBAAqB,CAAA;IACvC,2DAA2D;IAC3D,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,uEAAuE;IACvE,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,4DAA4D;IAC5D,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B;AAED,eAAO,MAAM,UAAU,wFA0DtB,CAAA"}

package/dist/v2/components/ReorderRow/ReorderRow.js

@@ -0,0 +1,109 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React__default from 'react';
+import { GripVerticalIcon } from '../../icons/index.js';
+import './ReorderRow.scss.js';
+
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+var ReorderRow = /*#__PURE__*/ React__default.forwardRef(function(param, ref) {
+    var label = param.label, subtitle = param.subtitle, dragHandleProps = param.dragHandleProps, _param_hideDragHandle = param.hideDragHandle, hideDragHandle = _param_hideDragHandle === void 0 ? false : _param_hideDragHandle, leftContent = param.leftContent, rightContent = param.rightContent, onClick = param.onClick, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, style = param.style;
+    var handleKeyDown = onClick ? function(e) {
+        if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            onClick();
+        }
+    } : undefined;
+    return /*#__PURE__*/ jsxs("div", {
+        ref: ref,
+        style: style,
+        className: "reorder-row ".concat(onClick ? 'reorder-row--clickable' : '', " ").concat(className),
+        onClick: onClick,
+        onKeyDown: handleKeyDown,
+        role: onClick ? 'button' : undefined,
+        tabIndex: onClick ? 0 : undefined,
+        children: [
+            !hideDragHandle && /*#__PURE__*/ jsx("div", _object_spread_props(_object_spread({
+                className: "reorder-row__drag-handle"
+            }, dragHandleProps === null || dragHandleProps === void 0 ? void 0 : dragHandleProps.attributes, dragHandleProps === null || dragHandleProps === void 0 ? void 0 : dragHandleProps.listeners), {
+                children: GripVerticalIcon({
+                    width: 20,
+                    height: 20
+                })
+            })),
+            leftContent && /*#__PURE__*/ jsx("div", {
+                className: "reorder-row__left",
+                children: leftContent
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "reorder-row__content",
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        className: "reorder-row__label",
+                        children: label
+                    }),
+                    subtitle && /*#__PURE__*/ jsx("span", {
+                        className: "reorder-row__subtitle",
+                        children: subtitle
+                    })
+                ]
+            }),
+            rightContent && /*#__PURE__*/ jsx("div", {
+                className: "reorder-row__right",
+                children: rightContent
+            })
+        ]
+    });
+});
+ReorderRow.displayName = 'ReorderRow';
+
+export { ReorderRow };

package/dist/v2/components/ReorderRow/ReorderRow.scss.js

@@ -0,0 +1,6 @@
+import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".reorder-row{align-items:center;background:var(--surface-secondary,#f5f6fa);border-radius:8px;display:flex;gap:12px;padding:12px 16px}.reorder-row--clickable{cursor:pointer}.reorder-row--clickable:hover{background:var(--surface-secondary-hover,#edeef3)}.reorder-row__drag-handle{align-items:center;color:var(--label-secondary,#6b7a99);cursor:grab;display:flex;flex-shrink:0}.reorder-row__drag-handle:active{cursor:grabbing}.reorder-row__left{align-items:center;display:flex;flex-shrink:0}.reorder-row__content{display:flex;flex:1;flex-direction:column;min-width:0}.reorder-row__label{color:var(--label-primary,#121e52);font-size:14px;font-weight:600;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reorder-row__label,.reorder-row__subtitle{font-family:var(--font-family-sans,\"Geist\",system-ui,sans-serif)}.reorder-row__subtitle{color:var(--label-secondary,#6b7a99);font-size:13px;font-weight:400;line-height:16px;margin-top:2px}.reorder-row__right{align-items:center;display:flex;flex-shrink:0;gap:8px}";
+styleInject(css_248z);
+
+export { css_248z as default };

package/dist/v2/components/ReorderRow/index.d.ts

@@ -0,0 +1,3 @@
+export { ReorderRow } from './ReorderRow';
+export type { ReorderRowProps, DragHandleRenderProps } from './ReorderRow';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ReorderRow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAA"}

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

@@ -41,5 +41,9 @@ export { Pagination } from './Pagination';
 export type { PaginationProps } from './Pagination';
 export { ZoneCard, ZoneContainer, ZoneHeader, ResourceRow, AddResourceButton } from './ZoneCard';
 export type { ZoneCardProps, ZoneResource, ZoneContainerProps, DragHandleProps, ZoneHeaderProps, ResourceRowProps, AddResourceButtonProps } from './ZoneCard';
+export { PeriodCard, PeriodCardSection, PeriodCardTimeRange } from './PeriodCard';
+export { ReorderRow } from './ReorderRow';
+export type { ReorderRowProps, DragHandleRenderProps } from './ReorderRow';
+export type { PeriodCardProps, PeriodCardValue, PeriodCardLabels, PeriodCardSectionProps, PeriodCardTimeRangeProps } from './PeriodCard';
 export { InfoIcon, TableHeaderArrowUpIcon, TableHeaderArrowDownIcon, ArrowUpIcon, ArrowDownIcon, EditIcon, ArrowLeftIcon, ArrowRightIcon, SearchIcon, RefreshIcon, SendIcon, ExternalLinkIcon, ExportIcon, ClearIcon, CloseIcon, EllipsisIcon, CircleIcon, GripVerticalIcon, ReorderIcon, PlusIcon, DeleteIcon, ClockIcon, LocationIcon, PadlockIcon, SettingsPageDashboardIcon, SettingsPageWaiversIcon, VenueIcon, } from '../icons';
 //# sourceMappingURL=index.d.ts.map