@licklist/design 0.78.35 → 0.78.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/dist/index.d.ts +4 -1
  2. package/dist/index.d.ts.map +1 -1
  3. package/dist/index.js +8 -2
  4. package/dist/v2/components/ActionMenu/ActionMenu.d.ts.map +1 -1
  5. package/dist/v2/components/ActionMenu/ActionMenu.js +6 -16
  6. package/dist/v2/components/ActionMenu/ActionMenu.scss.js +1 -1
  7. package/dist/v2/components/Button/Button.scss.js +1 -1
  8. package/dist/v2/components/Checkbox/Checkbox.scss.js +1 -1
  9. package/dist/v2/components/FormField/FormField.d.ts +3 -0
  10. package/dist/v2/components/FormField/FormField.d.ts.map +1 -1
  11. package/dist/v2/components/FormField/FormField.js +14 -3
  12. package/dist/v2/components/FormField/FormField.scss.js +1 -1
  13. package/dist/v2/components/IconButton/IconButton.d.ts +9 -0
  14. package/dist/v2/components/IconButton/IconButton.d.ts.map +1 -0
  15. package/dist/v2/components/IconButton/IconButton.js +137 -0
  16. package/dist/v2/components/IconButton/IconButton.scss.js +6 -0
  17. package/dist/v2/components/IconButton/index.d.ts +3 -0
  18. package/dist/v2/components/IconButton/index.d.ts.map +1 -0
  19. package/dist/v2/components/NewInput/NewInput.d.ts +1 -0
  20. package/dist/v2/components/NewInput/NewInput.d.ts.map +1 -1
  21. package/dist/v2/components/NewInput/NewInput.js +7 -4
  22. package/dist/v2/components/NewPageHeader/NewPageHeader.scss.js +1 -1
  23. package/dist/v2/components/ZoneCard/AddResourceButton.d.ts +8 -0
  24. package/dist/v2/components/ZoneCard/AddResourceButton.d.ts.map +1 -0
  25. package/dist/v2/components/ZoneCard/AddResourceButton.js +17 -0
  26. package/dist/v2/components/ZoneCard/ResourceRow.d.ts +28 -0
  27. package/dist/v2/components/ZoneCard/ResourceRow.d.ts.map +1 -0
  28. package/dist/v2/components/ZoneCard/ResourceRow.js +191 -0
  29. package/dist/v2/components/ZoneCard/ZoneCard.d.ts +25 -0
  30. package/dist/v2/components/ZoneCard/ZoneCard.d.ts.map +1 -0
  31. package/dist/v2/components/ZoneCard/ZoneCard.js +43 -0
  32. package/dist/v2/components/ZoneCard/ZoneCard.scss.js +6 -0
  33. package/dist/v2/components/ZoneCard/ZoneContainer.d.ts +12 -0
  34. package/dist/v2/components/ZoneCard/ZoneContainer.d.ts.map +1 -0
  35. package/dist/v2/components/ZoneCard/ZoneContainer.js +16 -0
  36. package/dist/v2/components/ZoneCard/ZoneHeader.d.ts +20 -0
  37. package/dist/v2/components/ZoneCard/ZoneHeader.d.ts.map +1 -0
  38. package/dist/v2/components/ZoneCard/ZoneHeader.js +149 -0
  39. package/dist/v2/components/ZoneCard/index.d.ts +11 -0
  40. package/dist/v2/components/ZoneCard/index.d.ts.map +1 -0
  41. package/dist/v2/components/index.d.ts +5 -1
  42. package/dist/v2/components/index.d.ts.map +1 -1
  43. package/dist/v2/icons/index.js +57 -1
  44. package/dist/v2/index.d.ts +10 -0
  45. package/dist/v2/index.d.ts.map +1 -1
  46. package/dist/v2/pages/Settings/components/SidebarCustomisation.js +5 -0
  47. package/dist/v2/pages/Settings/components/SidebarNavItem.js +5 -0
  48. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.d.ts +12 -0
  49. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.d.ts.map +1 -0
  50. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.js +47 -0
  51. package/dist/v2/pages/ZonesResources/ZonesResourcesPage.scss.js +6 -0
  52. package/dist/v2/pages/ZonesResources/index.d.ts +3 -0
  53. package/dist/v2/pages/ZonesResources/index.d.ts.map +1 -0
  54. package/dist/v2/styles/form/NewInput.scss.js +1 -1
  55. package/package.json +1 -1
  56. package/src/index.ts +4 -1
  57. package/src/v2/components/ActionMenu/ActionMenu.scss +7 -20
  58. package/src/v2/components/ActionMenu/ActionMenu.stories.tsx +58 -0
  59. package/src/v2/components/ActionMenu/ActionMenu.tsx +3 -6
  60. package/src/v2/components/Checkbox/Checkbox.scss +3 -3
  61. package/src/v2/components/FormField/FormField.scss +20 -1
  62. package/src/v2/components/FormField/FormField.tsx +33 -19
  63. package/src/v2/components/IconButton/IconButton.scss +81 -0
  64. package/src/v2/components/IconButton/IconButton.stories.tsx +51 -0
  65. package/src/v2/components/IconButton/IconButton.tsx +50 -0
  66. package/src/v2/components/IconButton/index.ts +2 -0
  67. package/src/v2/components/NewInput/NewInput.tsx +5 -2
  68. package/src/v2/components/NewPageHeader/NewPageHeader.scss +1 -5
  69. package/src/v2/components/NewPageHeader/NewPageHeader.stories.tsx +28 -0
  70. package/src/v2/components/ZoneCard/AddResourceButton.tsx +20 -0
  71. package/src/v2/components/ZoneCard/ResourceRow.tsx +115 -0
  72. package/src/v2/components/ZoneCard/ZoneCard.scss +226 -0
  73. package/src/v2/components/ZoneCard/ZoneCard.stories.tsx +137 -0
  74. package/src/v2/components/ZoneCard/ZoneCard.tsx +69 -0
  75. package/src/v2/components/ZoneCard/ZoneContainer.tsx +26 -0
  76. package/src/v2/components/ZoneCard/ZoneHeader.tsx +84 -0
  77. package/src/v2/components/ZoneCard/index.ts +14 -0
  78. package/src/v2/components/index.ts +11 -1
  79. package/src/v2/index.ts +21 -0
  80. package/src/v2/pages/ZonesResources/ZonesResourcesPage.scss +43 -0
  81. package/src/v2/pages/ZonesResources/ZonesResourcesPage.stories.tsx +46 -0
  82. package/src/v2/pages/ZonesResources/ZonesResourcesPage.tsx +49 -0
  83. package/src/v2/pages/ZonesResources/index.ts +2 -0
  84. package/src/v2/styles/components/Button.scss +1 -0
  85. package/src/v2/styles/form/NewInput.scss +39 -6
@@ -0,0 +1,149 @@
1
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
+ import 'react';
3
+ import { ActionMenu } from '../ActionMenu/ActionMenu.js';
4
+ import { GripVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '../../icons/index.js';
5
+ import './ZoneCard.scss.js';
6
+
7
+ function _define_property(obj, key, value) {
8
+ if (key in obj) {
9
+ Object.defineProperty(obj, key, {
10
+ value: value,
11
+ enumerable: true,
12
+ configurable: true,
13
+ writable: true
14
+ });
15
+ } else {
16
+ obj[key] = value;
17
+ }
18
+ return obj;
19
+ }
20
+ function _object_spread(target) {
21
+ for(var i = 1; i < arguments.length; i++){
22
+ var source = arguments[i] != null ? arguments[i] : {};
23
+ var ownKeys = Object.keys(source);
24
+ if (typeof Object.getOwnPropertySymbols === "function") {
25
+ ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
26
+ return Object.getOwnPropertyDescriptor(source, sym).enumerable;
27
+ }));
28
+ }
29
+ ownKeys.forEach(function(key) {
30
+ _define_property(target, key, source[key]);
31
+ });
32
+ }
33
+ return target;
34
+ }
35
+ function ownKeys(object, enumerableOnly) {
36
+ var keys = Object.keys(object);
37
+ if (Object.getOwnPropertySymbols) {
38
+ var symbols = Object.getOwnPropertySymbols(object);
39
+ if (enumerableOnly) {
40
+ symbols = symbols.filter(function(sym) {
41
+ return Object.getOwnPropertyDescriptor(object, sym).enumerable;
42
+ });
43
+ }
44
+ keys.push.apply(keys, symbols);
45
+ }
46
+ return keys;
47
+ }
48
+ function _object_spread_props(target, source) {
49
+ source = source != null ? source : {};
50
+ if (Object.getOwnPropertyDescriptors) {
51
+ Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
52
+ } else {
53
+ ownKeys(Object(source)).forEach(function(key) {
54
+ Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
55
+ });
56
+ }
57
+ return target;
58
+ }
59
+ var ZoneHeader = function(param) {
60
+ var name = param.name, totalCapacity = param.totalCapacity, _param_totalLabel = param.totalLabel, totalLabel = _param_totalLabel === void 0 ? 'Total' : _param_totalLabel, _param_menuItems = param.menuItems, menuItems = _param_menuItems === void 0 ? [] : _param_menuItems, _param_draggable = param.draggable, draggable = _param_draggable === void 0 ? true : _param_draggable, dragHandleProps = param.dragHandleProps, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, _param_isMobile = param.isMobile, isMobile = _param_isMobile === void 0 ? false : _param_isMobile, _param_isFirst = param.isFirst, isFirst = _param_isFirst === void 0 ? false : _param_isFirst, _param_isLast = param.isLast, isLast = _param_isLast === void 0 ? false : _param_isLast, onMoveUp = param.onMoveUp, onMoveDown = param.onMoveDown;
61
+ return /*#__PURE__*/ jsxs("div", {
62
+ className: "zone-card__header ".concat(className),
63
+ children: [
64
+ draggable && !isMobile && /*#__PURE__*/ jsx("div", _object_spread_props(_object_spread({
65
+ className: "zone-card__drag-handle"
66
+ }, dragHandleProps), {
67
+ children: GripVerticalIcon({
68
+ width: 20,
69
+ height: 20
70
+ })
71
+ })),
72
+ draggable && isMobile && /*#__PURE__*/ jsxs("div", {
73
+ className: "zone-card__reorder-arrows",
74
+ children: [
75
+ /*#__PURE__*/ jsx("button", {
76
+ className: "zone-card__arrow-btn",
77
+ disabled: isFirst,
78
+ onClick: function(e) {
79
+ e.stopPropagation();
80
+ onMoveUp === null || onMoveUp === void 0 ? void 0 : onMoveUp();
81
+ },
82
+ children: /*#__PURE__*/ jsx(ArrowUpIcon, {})
83
+ }),
84
+ /*#__PURE__*/ jsx("button", {
85
+ className: "zone-card__arrow-btn",
86
+ disabled: isLast,
87
+ onClick: function(e) {
88
+ e.stopPropagation();
89
+ onMoveDown === null || onMoveDown === void 0 ? void 0 : onMoveDown();
90
+ },
91
+ children: /*#__PURE__*/ jsx(ArrowDownIcon, {})
92
+ })
93
+ ]
94
+ }),
95
+ isMobile ? /*#__PURE__*/ jsxs(Fragment, {
96
+ children: [
97
+ /*#__PURE__*/ jsxs("div", {
98
+ className: "zone-card__header-info",
99
+ children: [
100
+ /*#__PURE__*/ jsx("span", {
101
+ className: "zone-card__name",
102
+ children: name
103
+ }),
104
+ /*#__PURE__*/ jsxs("span", {
105
+ className: "zone-card__total",
106
+ children: [
107
+ totalLabel,
108
+ ": ",
109
+ totalCapacity
110
+ ]
111
+ })
112
+ ]
113
+ }),
114
+ menuItems.length > 0 && /*#__PURE__*/ jsx("div", {
115
+ className: "zone-card__header-right",
116
+ children: /*#__PURE__*/ jsx(ActionMenu, {
117
+ items: menuItems
118
+ })
119
+ })
120
+ ]
121
+ }) : /*#__PURE__*/ jsxs(Fragment, {
122
+ children: [
123
+ /*#__PURE__*/ jsx("span", {
124
+ className: "zone-card__name",
125
+ children: name
126
+ }),
127
+ /*#__PURE__*/ jsxs("div", {
128
+ className: "zone-card__header-right",
129
+ children: [
130
+ /*#__PURE__*/ jsxs("span", {
131
+ className: "zone-card__total",
132
+ children: [
133
+ totalLabel,
134
+ ": ",
135
+ totalCapacity
136
+ ]
137
+ }),
138
+ menuItems.length > 0 && /*#__PURE__*/ jsx(ActionMenu, {
139
+ items: menuItems
140
+ })
141
+ ]
142
+ })
143
+ ]
144
+ })
145
+ ]
146
+ });
147
+ };
148
+
149
+ export { ZoneHeader };
@@ -0,0 +1,11 @@
1
+ export { ZoneCard } from './ZoneCard';
2
+ export type { ZoneCardProps, ZoneResource } from './ZoneCard';
3
+ export { ZoneContainer } from './ZoneContainer';
4
+ export type { ZoneContainerProps, DragHandleProps } from './ZoneContainer';
5
+ export { ZoneHeader } from './ZoneHeader';
6
+ export type { ZoneHeaderProps } from './ZoneHeader';
7
+ export { ResourceRow } from './ResourceRow';
8
+ export type { ResourceRowProps, ResourceRowLabels } from './ResourceRow';
9
+ export { AddResourceButton } from './AddResourceButton';
10
+ export type { AddResourceButtonProps } from './AddResourceButton';
11
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/ZoneCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAE7D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAE1E,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,YAAY,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAExE,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,YAAY,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA"}
@@ -1,3 +1,5 @@
1
+ export { IconButton } from './IconButton';
2
+ export type { IconButtonProps } from './IconButton';
1
3
  export { Badge } from './Badge';
2
4
  export type { BadgeProps } from './Badge';
3
5
  export { QuickFilter } from './QuickFilter';
@@ -33,5 +35,7 @@ export { Alert } from './Alert';
33
35
  export { NPSScore } from './NPSScore';
34
36
  export { Pagination } from './Pagination';
35
37
  export type { PaginationProps } from './Pagination';
36
- export { InfoIcon, TableHeaderArrowUpIcon, TableHeaderArrowDownIcon, ArrowUpIcon, ArrowDownIcon, EditIcon, ArrowLeftIcon, ArrowRightIcon, SearchIcon, RefreshIcon, SendIcon, ExternalLinkIcon, ExportIcon, ClearIcon, CloseIcon, EllipsisIcon, CircleIcon } from '../icons';
38
+ export { ZoneCard, ZoneContainer, ZoneHeader, ResourceRow, AddResourceButton } from './ZoneCard';
39
+ export type { ZoneCardProps, ZoneResource, ZoneContainerProps, DragHandleProps, ZoneHeaderProps, ResourceRowProps, AddResourceButtonProps } from './ZoneCard';
40
+ export { InfoIcon, TableHeaderArrowUpIcon, TableHeaderArrowDownIcon, ArrowUpIcon, ArrowDownIcon, EditIcon, ArrowLeftIcon, ArrowRightIcon, SearchIcon, RefreshIcon, SendIcon, ExternalLinkIcon, ExportIcon, ClearIcon, CloseIcon, EllipsisIcon, CircleIcon, GripVerticalIcon, PlusIcon, DeleteIcon, ClockIcon } from '../icons';
37
41
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,YAAY,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAA;AAExE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,YAAY,CAAA;AAE/D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAGzD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AACrC,YAAY,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAG/C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAGzD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAC1D,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAE9E,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAEnC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAEzC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAG7C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAGnD,OAAO,EACL,QAAQ,EACR,sBAAsB,EACtB,wBAAwB,EACxB,WAAW,EACX,aAAa,EACb,QAAQ,EACR,aAAa,EACb,cAAc,EACd,UAAU,EACV,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,SAAS,EACT,SAAS,EACT,YAAY,EACZ,UAAU,EACX,MAAM,UAAU,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/v2/components/index.ts"],"names":[],"mappings":"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"}
@@ -402,6 +402,34 @@ var ArrowDownIcon = function() {
402
402
  })
403
403
  });
404
404
  };
405
+ var GripVerticalIcon = function() {
406
+ var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_width = _ref.width, width = _ref_width === void 0 ? 16 : _ref_width, _ref_height = _ref.height, height = _ref_height === void 0 ? 16 : _ref_height;
407
+ return /*#__PURE__*/ jsx("svg", {
408
+ width: width,
409
+ height: height,
410
+ viewBox: "0 0 32 32",
411
+ fill: "none",
412
+ xmlns: "http://www.w3.org/2000/svg",
413
+ children: /*#__PURE__*/ jsx("path", {
414
+ 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",
415
+ fill: "currentColor"
416
+ })
417
+ });
418
+ };
419
+ var PlusIcon = function() {
420
+ var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_width = _ref.width, width = _ref_width === void 0 ? 16 : _ref_width, _ref_height = _ref.height, height = _ref_height === void 0 ? 16 : _ref_height;
421
+ return /*#__PURE__*/ jsx("svg", {
422
+ width: width,
423
+ height: height,
424
+ viewBox: "0 0 32 32",
425
+ fill: "none",
426
+ xmlns: "http://www.w3.org/2000/svg",
427
+ children: /*#__PURE__*/ jsx("path", {
428
+ d: "M17 14.5H24.5V17.5H17V25H14V17.5H6.5V14.5H14V7H17V14.5Z",
429
+ fill: "currentColor"
430
+ })
431
+ });
432
+ };
405
433
  var CloseIcon = function(_param) {
406
434
  var _param_width = _param.width, width = _param_width === void 0 ? 24 : _param_width, _param_height = _param.height, height = _param_height === void 0 ? 24 : _param_height, props = _object_without_properties(_param, [
407
435
  "width",
@@ -475,5 +503,33 @@ var CircleIcon = function() {
475
503
  })
476
504
  }));
477
505
  };
506
+ var DeleteIcon = function() {
507
+ var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_width = _ref.width, width = _ref_width === void 0 ? 24 : _ref_width, _ref_height = _ref.height, height = _ref_height === void 0 ? 24 : _ref_height;
508
+ return /*#__PURE__*/ jsx("svg", {
509
+ width: width,
510
+ height: height,
511
+ viewBox: "0 0 32 32",
512
+ fill: "none",
513
+ xmlns: "http://www.w3.org/2000/svg",
514
+ children: /*#__PURE__*/ jsx("path", {
515
+ d: "M21 10H26V12H24V25C24 25.5523 23.5523 26 23 26H9C8.44772 26 8 25.5523 8 25V12H6V10H11V7C11 6.44772 11.4477 6 12 6H20C20.5523 6 21 6.44772 21 7V10ZM22 12H10V24H22V12ZM13 15H15V21H13V15ZM17 15H19V21H17V15ZM13 8V10H19V8H13Z",
516
+ fill: "currentColor"
517
+ })
518
+ });
519
+ };
520
+ var ClockIcon = function() {
521
+ 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;
522
+ return /*#__PURE__*/ jsx("svg", {
523
+ width: width,
524
+ height: height,
525
+ viewBox: "0 0 32 32",
526
+ fill: "none",
527
+ xmlns: "http://www.w3.org/2000/svg",
528
+ children: /*#__PURE__*/ jsx("path", {
529
+ d: "M16 28C9.37258 28 4 22.6274 4 16C4 9.37258 9.37258 4 16 4C22.6274 4 28 9.37258 28 16C28 22.6274 22.6274 28 16 28ZM16 26C21.5228 26 26 21.5228 26 16C26 10.4772 21.5228 6 16 6C10.4772 6 6 10.4772 6 16C6 21.5228 10.4772 26 16 26ZM17 9V15.5858L21.2426 19.8284L19.8284 21.2426L15 16.4142V9H17Z",
530
+ fill: "currentColor"
531
+ })
532
+ });
533
+ };
478
534
 
479
- export { ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, BookingTypesIcon, BookingsIcon, CalendarIcon, CircleIcon, ClearIcon, CloseIcon, CustomersIcon, EditIcon, EllipsisIcon, ExportIcon, ExternalLinkIcon, InfoIcon, LoyaltyIcon, MarketingIcon, RefreshIcon, SearchIcon, SendIcon, SettingsIcon, TableHeaderArrowDownIcon, TableHeaderArrowUpIcon, WaiversIcon };
535
+ export { ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowUpIcon, BookingTypesIcon, BookingsIcon, CalendarIcon, CircleIcon, ClearIcon, ClockIcon, CloseIcon, CustomersIcon, DeleteIcon, EditIcon, EllipsisIcon, ExportIcon, ExternalLinkIcon, GripVerticalIcon, InfoIcon, LoyaltyIcon, MarketingIcon, PlusIcon, RefreshIcon, SearchIcon, SendIcon, SettingsIcon, TableHeaderArrowDownIcon, TableHeaderArrowUpIcon, WaiversIcon };
@@ -12,6 +12,12 @@ export { Alert } from './components/Alert';
12
12
  export type { AlertProps, AlertVariant } from './components/Alert';
13
13
  export { Button } from './components/Button';
14
14
  export type { ButtonProps } from './components/Button';
15
+ export { NewInput } from './components/NewInput';
16
+ export type { NewInputProps } from './components/NewInput';
17
+ export { Checkbox } from './components/Checkbox';
18
+ export type { CheckboxProps } from './components/Checkbox';
19
+ export { NewPageHeader } from './components/NewPageHeader';
20
+ export type { NewPageHeaderProps } from './components/NewPageHeader';
15
21
  export { EntityHeader } from './components/EntityHeader';
16
22
  export type { EntityHeaderProps } from './components/EntityHeader';
17
23
  export { Tooltip } from './components/Tooltip';
@@ -20,6 +26,10 @@ export { NPSScore } from './components/NPSScore';
20
26
  export type { NPSScoreProps, NPSSubmitData } from './components/NPSScore';
21
27
  export { UserPanel } from './components/UserPanel';
22
28
  export type { UserPanelProps } from './components/UserPanel';
29
+ export { ZoneCard, ZoneContainer, ZoneHeader, ResourceRow, AddResourceButton } from './components/ZoneCard';
30
+ export type { ZoneCardProps, ZoneResource, ZoneContainerProps, DragHandleProps, ZoneHeaderProps, ResourceRowProps, ResourceRowLabels, AddResourceButtonProps } from './components/ZoneCard';
31
+ export { ZonesResourcesPage } from './pages/ZonesResources';
32
+ export type { ZonesResourcesPageProps } from './pages/ZonesResources';
23
33
  export { Navigation } from './navigation/Navigation';
24
34
  export type { NavigationProps } from './navigation/Navigation';
25
35
  export { NavigationItem } from './navigation/NavigationItem';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/v2/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/v2/index.ts"],"names":[],"mappings":"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"}
@@ -3,6 +3,7 @@ import { useState, useEffect } from 'react';
3
3
  import { SidebarNavItem } from './SidebarNavItem.js';
4
4
  import './SidebarCustomisation.scss.js';
5
5
  import { CalendarIcon, BookingsIcon, BookingTypesIcon, LoyaltyIcon, CustomersIcon, MarketingIcon, WaiversIcon, SettingsIcon, EditIcon } from '../../../icons/index.js';
6
+ import '../../../components/IconButton/IconButton.scss.js';
6
7
  import '../../../components/Badge/Badge.scss.js';
7
8
  import { Button } from '../../../components/Button/Button.js';
8
9
  import { GhostButton } from '../../../components/Button/GhostButton.js';
@@ -24,6 +25,10 @@ import '../../../components/EntityHeader/EntityHeader.scss.js';
24
25
  import '../../../components/Alert/Alert.scss.js';
25
26
  import '../../../components/NPSScore/NPSScore.scss.js';
26
27
  import '../../../components/Pagination/Pagination.scss.js';
28
+ import '../../../components/ZoneCard/ZoneCard.js';
29
+ import '../../../components/ZoneCard/ZoneContainer.js';
30
+ import '../../../components/ZoneCard/ZoneCard.scss.js';
31
+ import '../../../components/ZoneCard/ResourceRow.js';
27
32
 
28
33
  function _array_like_to_array(arr, len) {
29
34
  if (len == null || len > arr.length) len = arr.length;
@@ -1,5 +1,6 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import 'react';
3
+ import '../../../components/IconButton/IconButton.scss.js';
3
4
  import '../../../components/Badge/Badge.scss.js';
4
5
  import '../../../components/Button/Button.scss.js';
5
6
  import '../../../components/Button/GhostButton.scss.js';
@@ -21,6 +22,10 @@ import '../../../components/EntityHeader/EntityHeader.scss.js';
21
22
  import '../../../components/Alert/Alert.scss.js';
22
23
  import '../../../components/NPSScore/NPSScore.scss.js';
23
24
  import '../../../components/Pagination/Pagination.scss.js';
25
+ import '../../../components/ZoneCard/ZoneCard.js';
26
+ import '../../../components/ZoneCard/ZoneContainer.js';
27
+ import '../../../components/ZoneCard/ZoneCard.scss.js';
28
+ import '../../../components/ZoneCard/ResourceRow.js';
24
29
  import './SidebarNavItem.scss.js';
25
30
 
26
31
  var SidebarNavItem = function(param) {
@@ -0,0 +1,12 @@
1
+ import React from 'react';
2
+ import './ZonesResourcesPage.scss';
3
+ export interface ZonesResourcesPageProps {
4
+ title?: string;
5
+ backLabel?: string;
6
+ onBack?: () => void;
7
+ actionLabel?: string;
8
+ onAction?: () => void;
9
+ children?: React.ReactNode;
10
+ }
11
+ export declare const ZonesResourcesPage: React.FC<ZonesResourcesPageProps>;
12
+ //# sourceMappingURL=ZonesResourcesPage.d.ts.map
@@ -0,0 +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,CAiChE,CAAA"}
@@ -0,0 +1,47 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import 'react';
3
+ import '../../components/Button/Button.scss.js';
4
+ import { GhostButton } from '../../components/Button/GhostButton.js';
5
+ import { NewPageHeader } from '../../components/NewPageHeader/NewPageHeader.js';
6
+ import { ArrowLeftIcon, PlusIcon } from '../../icons/index.js';
7
+ import './ZonesResourcesPage.scss.js';
8
+
9
+ var ZonesResourcesPage = function(param) {
10
+ 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;
11
+ return /*#__PURE__*/ jsxs("div", {
12
+ className: "zones-resources-page",
13
+ children: [
14
+ onBack && /*#__PURE__*/ jsx("div", {
15
+ className: "zones-resources-page__back",
16
+ children: /*#__PURE__*/ jsx(GhostButton, {
17
+ onClick: onBack,
18
+ icon: /*#__PURE__*/ jsx(ArrowLeftIcon, {}),
19
+ children: backLabel
20
+ })
21
+ }),
22
+ /*#__PURE__*/ jsx(NewPageHeader, {
23
+ title: title,
24
+ showDivider: true
25
+ }),
26
+ /*#__PURE__*/ jsxs("div", {
27
+ className: "zones-resources-page__content",
28
+ children: [
29
+ onAction && /*#__PURE__*/ jsx("div", {
30
+ className: "zones-resources-page__action",
31
+ children: /*#__PURE__*/ jsx(GhostButton, {
32
+ onClick: onAction,
33
+ icon: /*#__PURE__*/ jsx(PlusIcon, {
34
+ width: 16,
35
+ height: 16
36
+ }),
37
+ children: actionLabel
38
+ })
39
+ }),
40
+ children
41
+ ]
42
+ })
43
+ ]
44
+ });
45
+ };
46
+
47
+ export { ZonesResourcesPage };
@@ -0,0 +1,6 @@
1
+ import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
+
3
+ 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 .ghost-button{border-color:var(--borders-main-border-primary,#e8e9ef);color:var(--fill-action,#5d5bf4)}.zones-resources-page__back .ghost-button:not(.active):hover:not(:disabled){background-color:var(--surface-action-soft,#f4f4fe);color:var(--fill-action,#5d5bf4)}.zones-resources-page__back .ghost-button .ghost-button__icon svg{height:24px;width:24px}@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:0}}.zones-resources-page__action{display:flex;justify-content:flex-end;margin-bottom:16px}";
4
+ styleInject(css_248z);
5
+
6
+ export { css_248z as default };
@@ -0,0 +1,3 @@
1
+ export { ZonesResourcesPage } from './ZonesResourcesPage';
2
+ export type { ZonesResourcesPageProps } from './ZonesResourcesPage';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/pages/ZonesResources/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AACzD,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAA"}
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ":root{--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.new-form-input{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}.new-form-input__label{display:block;font-style:normal}.new-form-input__label,.new-form-input__label-optional{color:var(--label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:15px;font-weight:600;line-height:20px}.new-form-input__input{background-color:var(--surfaces-main-background-secondary);background:var(--surface-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-md);color:var(--labels-main-label-primary,#121e52);flex:1 0 0;font-family:var(--font-family-sans);font-size:var(--text-regular-size);font-weight:var(--text-regular-weight);line-height:var(--text-regular-line);min-height:40px;padding:8px 10px;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__input{font-size:16px}}.new-form-input__input:focus{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__textarea{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:1px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px);min-height:120px;padding:8px 10px;resize:vertical;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__textarea{font-size:16px}}.new-form-input__textarea:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__textarea::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon{align-items:center;background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);display:flex;gap:var(--spacing-sm,8px);min-height:52px;padding:8px 10px;transition:all .2s ease;width:70%}.new-form-input__input-with-icon:focus-within{border-color:var(--border-selected,#6200ee)}.new-form-input__input-with-icon .icon{align-items:center;display:flex;flex-shrink:0;height:24px;justify-content:center;order:-1;width:24px}.new-form-input__input-with-icon--right .icon{order:1}.new-form-input__input-with-icon input{background:#0000;border:none;color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}@media (max-width:768px){.new-form-input__input-with-icon input{font-size:16px}}.new-form-input__input-with-icon input:focus{outline:none}.new-form-input__input-with-icon input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon input[type=date]::-webkit-calendar-picker-indicator{-webkit-appearance:none;display:none}.new-form-input__input-with-icon input[type=date]::-webkit-inner-spin-button,.new-form-input__input-with-icon input[type=date]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.new-form-input__verification-code{display:flex;gap:var(--spacing-sm,8px);height:62px}.new-form-input__verification-code .code-input{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-lg-size,18px);font-weight:var(--heading-h3-weight,600);text-align:center;transition:all .2s ease}.new-form-input__verification-code .code-input:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__helper-text{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);font-style:normal;font-weight:400;line-height:var(--text-regular-line,20px);margin-top:2px;min-width:max-content;white-space:nowrap}@media (max-width:768px){.new-form-input__helper-text{word-wrap:break-word;min-width:unset;white-space:normal}}.new-form-input__error-text{color:var(--labels-status-label-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:11px;font-style:normal;font-weight:400;line-height:14px;margin-top:2px}.new-form-input--active .new-form-input__input{border-color:var(--border-selected,#6200ee)}.new-form-input--error .new-form-input__input{border-color:var(--borders-status-border-error,#ef4444)}.new-form-input--disabled{opacity:var(--opacity-50,.5);pointer-events:none}.new-form-input.dob-input .new-form-input__label{color:var(--label-secondary,#626a90)}";
3
+ var css_248z = ":root{--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.new-form-input{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column;gap:var(--spacing-sm);width:100%}.new-form-input__label{align-items:center;color:var(--label-primary);display:flex;font-size:15px;font-weight:600;justify-content:space-between;line-height:20px;width:100%}.new-form-input__label,.new-form-input__label-optional{font-family:var(--font-family-sans,\"Geist\",sans-serif);font-style:normal}.new-form-input__label-optional{color:var(--label-secondary);font-size:13px;font-weight:400;line-height:16px}.new-form-input__input{background-color:var(--surfaces-main-background-secondary);background:var(--surface-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-md);color:var(--labels-main-label-primary,#121e52);flex:1 0 0;font-family:var(--font-family-sans);font-size:var(--text-regular-size);font-weight:var(--text-regular-weight);line-height:var(--text-regular-line);min-height:40px;padding:8px 10px;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__input{font-size:16px}}.new-form-input__input:focus{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__textarea{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:1px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px);min-height:120px;padding:8px 10px;resize:vertical;transition:all .2s ease;width:100%}@media (max-width:768px){.new-form-input__textarea{font-size:16px}}.new-form-input__textarea:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__textarea::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon{align-items:center;background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--border-primary,#e8e9ef);border-radius:var(--radius-md,4px);display:flex;gap:var(--spacing-sm,8px);min-height:52px;padding:8px 10px;transition:all .2s ease;width:70%}.new-form-input__input-with-icon:focus-within{border-color:var(--border-selected,#6200ee)}.new-form-input__input-with-icon .icon{align-items:center;display:flex;flex-shrink:0;height:24px;justify-content:center;order:-1;width:24px}.new-form-input__input-with-icon--right .icon{order:1}.new-form-input__input-with-icon input{background:#0000;border:none;color:var(--label-primary);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);line-height:var(--text-regular-line,20px)}@media (max-width:768px){.new-form-input__input-with-icon input{font-size:16px}}.new-form-input__input-with-icon input:focus{outline:none}.new-form-input__input-with-icon input::placeholder{color:var(--labels-main-label-secondary,#626a90)}.new-form-input__input-with-icon input[type=date]::-webkit-calendar-picker-indicator{-webkit-appearance:none;display:none}.new-form-input__input-with-icon input[type=date]::-webkit-inner-spin-button,.new-form-input__input-with-icon input[type=date]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.new-form-input__verification-code{display:flex;gap:var(--spacing-sm,8px);height:62px}.new-form-input__verification-code .code-input{background-color:var(--surfaces-main-background-secondary,#f8f8fa);border:2px solid var(--borders-main-border-primary,#e8e9ef);border-radius:var(--radius-md,4px);color:var(--labels-main-label-primary,#121e52);flex:1;font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-lg-size,18px);font-weight:var(--heading-h3-weight,600);text-align:center;transition:all .2s ease}.new-form-input__verification-code .code-input:focus{border-color:var(--border-selected,#6200ee);outline:none}.new-form-input__helper-text{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:var(--text-regular-size,15px);font-style:normal;font-weight:400;line-height:var(--text-regular-line,20px);margin-top:2px;min-width:max-content;white-space:nowrap}@media (max-width:768px){.new-form-input__helper-text{word-wrap:break-word;min-width:unset;white-space:normal}}.new-form-input__error-text{color:var(--labels-status-label-error,#ef4444);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:11px;font-style:normal;font-weight:400;line-height:14px;margin-top:2px}.new-form-input--active .new-form-input__input{border-color:var(--border-selected,#6200ee)}.new-form-input--error .new-form-input__input{border-color:var(--borders-status-border-error,#ef4444)}.new-form-input--disabled{opacity:var(--opacity-50,.5);pointer-events:none}.new-form-input--on-surface .new-form-input__input,.new-form-input--on-surface .new-form-input__input-with-icon,.new-form-input--on-surface .new-form-input__textarea{background-color:var(--surface-primary,#fff);background:var(--surface-primary,#fff)}.new-form-input--on-surface .new-form-input__input-with-icon:focus,.new-form-input--on-surface .new-form-input__input-with-icon:focus-within,.new-form-input--on-surface .new-form-input__input:focus,.new-form-input--on-surface .new-form-input__input:focus-within,.new-form-input--on-surface .new-form-input__textarea:focus,.new-form-input--on-surface .new-form-input__textarea:focus-within{background-color:var(--surface-primary,#fff)}.new-form-input.dob-input .new-form-input__label{color:var(--label-secondary,#626a90)}.surface-context--secondary .new-form-input__input,.surface-context--secondary .new-form-input__input-with-icon,.surface-context--secondary .new-form-input__textarea{background-color:var(--surface-primary,#fff);background:var(--surface-primary,#fff)}.surface-context--secondary .new-form-input__input-with-icon:focus,.surface-context--secondary .new-form-input__input-with-icon:focus-within,.surface-context--secondary .new-form-input__input:focus,.surface-context--secondary .new-form-input__input:focus-within,.surface-context--secondary .new-form-input__textarea:focus,.surface-context--secondary .new-form-input__textarea:focus-within{background-color:var(--surface-primary,#fff)}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@licklist/design",
3
- "version": "0.78.35",
3
+ "version": "0.78.36",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/bookedit-licklist/licklist_design.git"
package/src/index.ts CHANGED
@@ -29,7 +29,8 @@ export * from './report'
29
29
  export * from './venue-map-sets'
30
30
  export * from './affiliate'
31
31
  export * from './typeahead-helper'
32
- export * from './zone'
32
+ export { ZoneForm } from './zone/form'
33
+ export type { ZoneFormProps } from './zone/form'
33
34
  export * from './resource'
34
35
  export * from './virtualized'
35
36
  export * from './customers'
@@ -50,3 +51,5 @@ export * from './v2/components'
50
51
  export * from './v2/dashboard-analytics'
51
52
  export * from './v2/navigation/DashboardLayout'
52
53
  export * from './v2/pages/Settings'
54
+ export * from './v2/pages/ZonesResources'
55
+ export * from './v2/components'
@@ -7,46 +7,33 @@
7
7
 
8
8
  &__trigger {
9
9
  display: flex;
10
- width: 40px;
11
- height: 40px;
12
- padding: 8px;
10
+ width: 32px;
11
+ height: 32px;
12
+ padding: 0;
13
13
  justify-content: center;
14
14
  align-items: center;
15
15
  border-radius: 50%;
16
- border: 1px solid var(--border-primary, #E8E9EF);
16
+ border: none;
17
17
  background: var(--surface-action-soft);
18
18
  color: var(--actions-regular, #5D5BF4);
19
19
  cursor: pointer;
20
20
  transition: all 0.2s ease;
21
+ position: relative;
21
22
 
22
23
  &:hover {
23
- background: var(--surface-action-soft);
24
+ opacity: 0.8;
24
25
  }
25
26
 
26
27
  &--close {
27
28
  border-radius: 50%;
28
29
  background: #F4F4FE;
29
- border: 1px solid #F4F4FE;
30
30
 
31
31
  &:hover {
32
32
  background: #E8E8FD;
33
+ opacity: 1;
33
34
  }
34
35
  }
35
36
 
36
- svg {
37
- width: 28px;
38
- height: 28px;
39
- }
40
-
41
- .action-menu__circle {
42
- position: absolute;
43
- top: 50%;
44
- left: 50%;
45
- transform: translate(-50%, -50%);
46
- width: 32px;
47
- height: 32px;
48
- z-index: -1;
49
- }
50
37
  }
51
38
 
52
39
  &__dropdown {
@@ -0,0 +1,58 @@
1
+ import React from 'react'
2
+ import { Meta, StoryObj } from '@storybook/react'
3
+ import { ActionMenu } from './ActionMenu'
4
+
5
+ export default {
6
+ title: 'v2/Components/ActionMenu',
7
+ component: ActionMenu,
8
+ } as Meta<typeof ActionMenu>
9
+
10
+ type Story = StoryObj<typeof ActionMenu>
11
+
12
+ const defaultItems = [
13
+ { label: 'Edit', onClick: () => console.log('Edit') },
14
+ { label: 'Duplicate', onClick: () => console.log('Duplicate') },
15
+ { label: 'Delete', onClick: () => console.log('Delete'), variant: 'danger' as const },
16
+ ]
17
+
18
+ export const Default: Story = {
19
+ args: {
20
+ items: defaultItems,
21
+ },
22
+ decorators: [
23
+ (Story) => (
24
+ <div style={{ display: 'flex', justifyContent: 'flex-end', paddingTop: 200 }}>
25
+ <Story />
26
+ </div>
27
+ ),
28
+ ],
29
+ }
30
+
31
+ export const OpenDown: Story = {
32
+ args: {
33
+ items: defaultItems,
34
+ direction: 'down',
35
+ },
36
+ decorators: [
37
+ (Story) => (
38
+ <div style={{ display: 'flex', justifyContent: 'flex-end', paddingTop: 20 }}>
39
+ <Story />
40
+ </div>
41
+ ),
42
+ ],
43
+ }
44
+
45
+ export const WithCustomIconColour: Story = {
46
+ args: {
47
+ items: defaultItems,
48
+ iconColour: '#E0423A',
49
+ direction: 'down',
50
+ },
51
+ }
52
+
53
+ export const SingleItem: Story = {
54
+ args: {
55
+ items: [{ label: 'Edit', onClick: () => console.log('Edit') }],
56
+ direction: 'down',
57
+ },
58
+ }
@@ -1,5 +1,5 @@
1
1
  import React, { useState, useRef, useEffect, useLayoutEffect } from 'react'
2
- import { CloseIcon, EllipsisIcon, CircleIcon } from '../../icons'
2
+ import { CloseIcon, EllipsisIcon } from '../../icons'
3
3
  import './ActionMenu.scss'
4
4
 
5
5
  export interface ActionMenuItem {
@@ -83,10 +83,7 @@ export const ActionMenu: React.FC<ActionMenuProps> = ({ items, className = '', i
83
83
  {isOpen ? (
84
84
  <CloseIcon width={18} height={18} />
85
85
  ) : (
86
- <>
87
- <CircleIcon width={32} height={32} className="action-menu__circle" fill="var(--surface-action-soft)" />
88
- <EllipsisIcon width={18} height={18} fill="var(--fill-action)" />
89
- </>
86
+ <EllipsisIcon width={18} height={4} fill="var(--fill-action)" />
90
87
  )}
91
88
  </button>
92
89
 
@@ -112,4 +109,4 @@ export const ActionMenu: React.FC<ActionMenuProps> = ({ items, className = '', i
112
109
  )}
113
110
  </div>
114
111
  )
115
- }
112
+ }