@byline/ui 2.5.2 → 2.6.1

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 (218) hide show
  1. package/dist/components/shimmer/shimmer.d.ts +13 -1
  2. package/dist/components/shimmer/shimmer.js +29 -20
  3. package/dist/components/shimmer/shimmer_module.css +4 -4
  4. package/dist/dnd/draggable-sortable/demo/draggable-list-demo.js +1 -1
  5. package/dist/react.d.ts +18 -54
  6. package/dist/react.js +0 -35
  7. package/dist/styles/styles.css +3 -0
  8. package/dist/uikit.d.ts +1 -0
  9. package/dist/uikit.js +1 -0
  10. package/package.json +2 -8
  11. package/src/components/shimmer/shimmer.module.css +8 -4
  12. package/src/components/shimmer/shimmer.tsx +34 -9
  13. package/src/dnd/draggable-sortable/demo/draggable-list-demo.tsx +1 -1
  14. package/src/react.ts +20 -68
  15. package/src/styles/functional/surfaces.css +13 -1
  16. package/src/uikit.ts +1 -0
  17. package/dist/admin/group.d.ts +0 -27
  18. package/dist/admin/group.js +0 -14
  19. package/dist/admin/group.module.js +0 -6
  20. package/dist/admin/group_module.css +0 -19
  21. package/dist/admin/row.d.ts +0 -25
  22. package/dist/admin/row.js +0 -8
  23. package/dist/admin/row.module.js +0 -5
  24. package/dist/admin/row_module.css +0 -18
  25. package/dist/admin/tabs.d.ts +0 -25
  26. package/dist/admin/tabs.js +0 -35
  27. package/dist/admin/tabs.module.js +0 -10
  28. package/dist/admin/tabs_module.css +0 -68
  29. package/dist/fields/array/array-field.d.ts +0 -14
  30. package/dist/fields/array/array-field.js +0 -176
  31. package/dist/fields/array/array-field.module.js +0 -11
  32. package/dist/fields/array/array-field_module.css +0 -32
  33. package/dist/fields/blocks/blocks-field.d.ts +0 -13
  34. package/dist/fields/blocks/blocks-field.js +0 -244
  35. package/dist/fields/blocks/blocks-field.module.js +0 -26
  36. package/dist/fields/blocks/blocks-field_module.css +0 -107
  37. package/dist/fields/checkbox/checkbox-field.d.ts +0 -16
  38. package/dist/fields/checkbox/checkbox-field.js +0 -28
  39. package/dist/fields/checkbox/checkbox-field.module.js +0 -6
  40. package/dist/fields/checkbox/checkbox-field_module.css +0 -4
  41. package/dist/fields/column-formatter.d.ts +0 -20
  42. package/dist/fields/column-formatter.js +0 -15
  43. package/dist/fields/date-time-formatter.d.ts +0 -16
  44. package/dist/fields/date-time-formatter.js +0 -8
  45. package/dist/fields/datetime/datetime-field.d.ts +0 -16
  46. package/dist/fields/datetime/datetime-field.js +0 -37
  47. package/dist/fields/datetime/datetime-field.module.js +0 -5
  48. package/dist/fields/datetime/datetime-field_module.css +0 -4
  49. package/dist/fields/draggable-context-menu.d.ts +0 -6
  50. package/dist/fields/draggable-context-menu.js +0 -83
  51. package/dist/fields/draggable-context-menu.module.js +0 -15
  52. package/dist/fields/draggable-context-menu_module.css +0 -91
  53. package/dist/fields/field-helpers.d.ts +0 -26
  54. package/dist/fields/field-helpers.js +0 -50
  55. package/dist/fields/field-renderer.d.ts +0 -37
  56. package/dist/fields/field-renderer.js +0 -206
  57. package/dist/fields/field-renderer.module.js +0 -8
  58. package/dist/fields/field-renderer_module.css +0 -11
  59. package/dist/fields/file/file-field.d.ts +0 -19
  60. package/dist/fields/file/file-field.js +0 -226
  61. package/dist/fields/file/file-field.module.js +0 -18
  62. package/dist/fields/file/file-field_module.css +0 -131
  63. package/dist/fields/file/file-upload-field.d.ts +0 -21
  64. package/dist/fields/file/file-upload-field.js +0 -128
  65. package/dist/fields/file/file-upload-field.module.js +0 -15
  66. package/dist/fields/file/file-upload-field_module.css +0 -74
  67. package/dist/fields/group/group-field.d.ts +0 -15
  68. package/dist/fields/group/group-field.js +0 -59
  69. package/dist/fields/group/group-field.module.js +0 -9
  70. package/dist/fields/group/group-field_module.css +0 -27
  71. package/dist/fields/image/image-field.d.ts +0 -19
  72. package/dist/fields/image/image-field.js +0 -242
  73. package/dist/fields/image/image-field.module.js +0 -22
  74. package/dist/fields/image/image-field_module.css +0 -121
  75. package/dist/fields/image/image-upload-field.d.ts +0 -21
  76. package/dist/fields/image/image-upload-field.js +0 -187
  77. package/dist/fields/image/image-upload-field.module.js +0 -19
  78. package/dist/fields/image/image-upload-field_module.css +0 -92
  79. package/dist/fields/local-date-time.d.ts +0 -27
  80. package/dist/fields/local-date-time.js +0 -49
  81. package/dist/fields/locale-badge.d.ts +0 -18
  82. package/dist/fields/locale-badge.js +0 -10
  83. package/dist/fields/locale-badge.module.js +0 -5
  84. package/dist/fields/locale-badge_module.css +0 -27
  85. package/dist/fields/numerical/numerical-field.d.ts +0 -18
  86. package/dist/fields/numerical/numerical-field.js +0 -74
  87. package/dist/fields/relation/relation-display.d.ts +0 -40
  88. package/dist/fields/relation/relation-display.js +0 -58
  89. package/dist/fields/relation/relation-display.module.js +0 -9
  90. package/dist/fields/relation/relation-display_module.css +0 -21
  91. package/dist/fields/relation/relation-field.d.ts +0 -18
  92. package/dist/fields/relation/relation-field.js +0 -146
  93. package/dist/fields/relation/relation-field.module.js +0 -13
  94. package/dist/fields/relation/relation-field_module.css +0 -62
  95. package/dist/fields/relation/relation-picker.d.ts +0 -49
  96. package/dist/fields/relation/relation-picker.js +0 -233
  97. package/dist/fields/relation/relation-picker.module.js +0 -26
  98. package/dist/fields/relation/relation-picker_module.css +0 -124
  99. package/dist/fields/relation/relation-summary.d.ts +0 -31
  100. package/dist/fields/relation/relation-summary.js +0 -50
  101. package/dist/fields/relation/relation-summary.module.js +0 -11
  102. package/dist/fields/relation/relation-summary_module.css +0 -37
  103. package/dist/fields/select/select-field.d.ts +0 -16
  104. package/dist/fields/select/select-field.js +0 -50
  105. package/dist/fields/select/select-field.module.js +0 -5
  106. package/dist/fields/select/select-field_module.css +0 -4
  107. package/dist/fields/sortable-item.d.ts +0 -15
  108. package/dist/fields/sortable-item.js +0 -80
  109. package/dist/fields/sortable-item.module.js +0 -22
  110. package/dist/fields/sortable-item_module.css +0 -124
  111. package/dist/fields/text/text-field.d.ts +0 -20
  112. package/dist/fields/text/text-field.js +0 -104
  113. package/dist/fields/text/text-field.module.js +0 -6
  114. package/dist/fields/text/text-field_module.css +0 -5
  115. package/dist/fields/text-area/text-area-field.d.ts +0 -20
  116. package/dist/fields/text-area/text-area-field.js +0 -105
  117. package/dist/fields/text-area/text-area-field.module.js +0 -6
  118. package/dist/fields/text-area/text-area-field_module.css +0 -5
  119. package/dist/fields/use-field-change-handler.d.ts +0 -23
  120. package/dist/fields/use-field-change-handler.js +0 -52
  121. package/dist/forms/document-actions.d.ts +0 -48
  122. package/dist/forms/document-actions.js +0 -469
  123. package/dist/forms/document-actions.module.js +0 -34
  124. package/dist/forms/document-actions_module.css +0 -118
  125. package/dist/forms/form-context.d.ts +0 -89
  126. package/dist/forms/form-context.js +0 -466
  127. package/dist/forms/form-renderer.d.ts +0 -98
  128. package/dist/forms/form-renderer.js +0 -591
  129. package/dist/forms/form-renderer.module.js +0 -46
  130. package/dist/forms/form-renderer_module.css +0 -245
  131. package/dist/forms/navigation-guard.d.ts +0 -54
  132. package/dist/forms/navigation-guard.js +0 -22
  133. package/dist/forms/path-widget.d.ts +0 -36
  134. package/dist/forms/path-widget.js +0 -107
  135. package/dist/forms/path-widget.module.js +0 -8
  136. package/dist/forms/path-widget_module.css +0 -29
  137. package/dist/forms/upload-executor.d.ts +0 -57
  138. package/dist/forms/upload-executor.js +0 -92
  139. package/dist/services/field-services-context.d.ts +0 -16
  140. package/dist/services/field-services-context.js +0 -13
  141. package/dist/services/field-services-types.d.ts +0 -63
  142. package/dist/services/field-services-types.js +0 -1
  143. package/dist/widgets/diff-viewer/diff-modal.d.ts +0 -22
  144. package/dist/widgets/diff-viewer/diff-modal.js +0 -146
  145. package/dist/widgets/diff-viewer/diff-modal.module.js +0 -14
  146. package/dist/widgets/diff-viewer/diff-modal_module.css +0 -56
  147. package/dist/widgets/status-badge/status-badge.d.ts +0 -25
  148. package/dist/widgets/status-badge/status-badge.js +0 -35
  149. package/dist/widgets/status-badge/status-badge.module.js +0 -7
  150. package/dist/widgets/status-badge/status-badge_module.css +0 -20
  151. package/src/admin/group.module.css +0 -41
  152. package/src/admin/group.tsx +0 -40
  153. package/src/admin/row.module.css +0 -32
  154. package/src/admin/row.tsx +0 -33
  155. package/src/admin/tabs.module.css +0 -107
  156. package/src/admin/tabs.tsx +0 -82
  157. package/src/fields/array/array-field.module.css +0 -48
  158. package/src/fields/array/array-field.tsx +0 -266
  159. package/src/fields/blocks/blocks-field.module.css +0 -148
  160. package/src/fields/blocks/blocks-field.tsx +0 -312
  161. package/src/fields/checkbox/checkbox-field.module.css +0 -4
  162. package/src/fields/checkbox/checkbox-field.tsx +0 -54
  163. package/src/fields/column-formatter.tsx +0 -31
  164. package/src/fields/date-time-formatter.tsx +0 -22
  165. package/src/fields/datetime/datetime-field.module.css +0 -13
  166. package/src/fields/datetime/datetime-field.tsx +0 -54
  167. package/src/fields/draggable-context-menu.module.css +0 -127
  168. package/src/fields/draggable-context-menu.tsx +0 -85
  169. package/src/fields/field-helpers.ts +0 -69
  170. package/src/fields/field-renderer.module.css +0 -22
  171. package/src/fields/field-renderer.tsx +0 -288
  172. package/src/fields/file/file-field.module.css +0 -153
  173. package/src/fields/file/file-field.tsx +0 -271
  174. package/src/fields/file/file-upload-field.module.css +0 -101
  175. package/src/fields/file/file-upload-field.tsx +0 -183
  176. package/src/fields/group/group-field.module.css +0 -43
  177. package/src/fields/group/group-field.tsx +0 -84
  178. package/src/fields/image/image-field.module.css +0 -155
  179. package/src/fields/image/image-field.tsx +0 -291
  180. package/src/fields/image/image-upload-field.module.css +0 -123
  181. package/src/fields/image/image-upload-field.tsx +0 -270
  182. package/src/fields/local-date-time.tsx +0 -88
  183. package/src/fields/locale-badge.module.css +0 -37
  184. package/src/fields/locale-badge.tsx +0 -32
  185. package/src/fields/numerical/numerical-field.tsx +0 -114
  186. package/src/fields/relation/relation-display.module.css +0 -36
  187. package/src/fields/relation/relation-display.tsx +0 -130
  188. package/src/fields/relation/relation-field.module.css +0 -83
  189. package/src/fields/relation/relation-field.tsx +0 -206
  190. package/src/fields/relation/relation-picker.module.css +0 -168
  191. package/src/fields/relation/relation-picker.tsx +0 -325
  192. package/src/fields/relation/relation-summary.module.css +0 -55
  193. package/src/fields/relation/relation-summary.tsx +0 -123
  194. package/src/fields/select/select-field.module.css +0 -13
  195. package/src/fields/select/select-field.tsx +0 -61
  196. package/src/fields/sortable-item.module.css +0 -167
  197. package/src/fields/sortable-item.tsx +0 -101
  198. package/src/fields/text/text-field.module.css +0 -13
  199. package/src/fields/text/text-field.tsx +0 -146
  200. package/src/fields/text-area/text-area-field.module.css +0 -13
  201. package/src/fields/text-area/text-area-field.tsx +0 -147
  202. package/src/fields/use-field-change-handler.ts +0 -112
  203. package/src/forms/document-actions.module.css +0 -160
  204. package/src/forms/document-actions.tsx +0 -487
  205. package/src/forms/form-context.tsx +0 -704
  206. package/src/forms/form-renderer.module.css +0 -321
  207. package/src/forms/form-renderer.tsx +0 -888
  208. package/src/forms/navigation-guard.tsx +0 -98
  209. package/src/forms/path-widget.module.css +0 -41
  210. package/src/forms/path-widget.test.tsx +0 -217
  211. package/src/forms/path-widget.tsx +0 -181
  212. package/src/forms/upload-executor.ts +0 -190
  213. package/src/services/field-services-context.tsx +0 -35
  214. package/src/services/field-services-types.ts +0 -68
  215. package/src/widgets/diff-viewer/diff-modal.module.css +0 -79
  216. package/src/widgets/diff-viewer/diff-modal.tsx +0 -184
  217. package/src/widgets/status-badge/status-badge.module.css +0 -31
  218. package/src/widgets/status-badge/status-badge.tsx +0 -69
@@ -1,31 +0,0 @@
1
- /**
2
- * This Source Code is subject to the terms of the Mozilla Public
3
- * License, v. 2.0. If a copy of the MPL was not distributed with this
4
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
- *
6
- * Copyright (c) Infonomic Company Limited
7
- */
8
- import type { CollectionAdminConfig, CollectionDefinition } from '@byline/core';
9
- interface RelationSummaryProps {
10
- targetDefinition: CollectionDefinition;
11
- targetAdminConfig: CollectionAdminConfig | null;
12
- displayField?: string;
13
- /** The raw relation value from the form. May be a plain ref or a populated envelope. */
14
- value: {
15
- targetDocumentId: string;
16
- targetCollectionId: string;
17
- _resolved?: boolean;
18
- _cycle?: boolean;
19
- document?: Record<string, any>;
20
- };
21
- /**
22
- * A document record cached client-side from a recent picker selection.
23
- * Used when `value` is a plain ref (post-pick state) but we still want
24
- * the tile to render real display data without a refetch. Caller is
25
- * responsible for clearing/replacing this when the value's
26
- * `targetDocumentId` changes.
27
- */
28
- cachedRecord?: Record<string, any> | null;
29
- }
30
- export declare function RelationSummary({ targetDefinition, targetAdminConfig, displayField, value, cachedRecord, }: RelationSummaryProps): import("react").JSX.Element;
31
- export {};
@@ -1,50 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import classnames from "classnames";
3
- import { PickerCell, resolveFallbackDisplayField, resolveRowLabel } from "./relation-display.js";
4
- import relation_summary_module from "./relation-summary.module.js";
5
- function RelationSummary({ targetDefinition, targetAdminConfig, displayField, value, cachedRecord }) {
6
- const pickerColumns = targetAdminConfig?.picker;
7
- if (false === value._resolved) return /*#__PURE__*/ jsxs("div", {
8
- className: classnames('byline-relation-summary-stack', relation_summary_module.stack),
9
- children: [
10
- /*#__PURE__*/ jsx("span", {
11
- className: classnames('byline-relation-summary-kind', relation_summary_module.kind),
12
- children: targetDefinition.labels.singular
13
- }),
14
- /*#__PURE__*/ jsxs("span", {
15
- className: classnames('byline-relation-summary-value-mono byline-relation-summary-missing', relation_summary_module["value-mono"], relation_summary_module.missing),
16
- children: [
17
- "(target not found) ",
18
- value.targetDocumentId
19
- ]
20
- })
21
- ]
22
- });
23
- const record = true === value._resolved && !value._cycle && value.document || cachedRecord || null;
24
- if (record && pickerColumns && pickerColumns.length > 0) return /*#__PURE__*/ jsx("div", {
25
- className: classnames('byline-relation-summary-row', relation_summary_module.row),
26
- children: pickerColumns.map((col)=>/*#__PURE__*/ jsx(PickerCell, {
27
- column: col,
28
- record: record
29
- }, String(col.fieldName)))
30
- });
31
- const resolvedDisplayField = displayField ?? targetDefinition.useAsTitle ?? resolveFallbackDisplayField(targetDefinition) ?? null;
32
- const label = record ? resolveRowLabel(record, resolvedDisplayField) : null;
33
- return /*#__PURE__*/ jsxs("div", {
34
- className: classnames('byline-relation-summary-stack', relation_summary_module.stack),
35
- children: [
36
- /*#__PURE__*/ jsx("span", {
37
- className: classnames('byline-relation-summary-kind', relation_summary_module.kind),
38
- children: targetDefinition.labels.singular
39
- }),
40
- label ? /*#__PURE__*/ jsx("span", {
41
- className: classnames('byline-relation-summary-value', relation_summary_module.value),
42
- children: label
43
- }) : /*#__PURE__*/ jsx("span", {
44
- className: classnames('byline-relation-summary-value-mono', relation_summary_module["value-mono"]),
45
- children: value.targetDocumentId
46
- })
47
- ]
48
- });
49
- }
50
- export { RelationSummary };
@@ -1,11 +0,0 @@
1
- import "./relation-summary_module.css";
2
- const relation_summary_module = {
3
- stack: "stack-ITEVDV",
4
- row: "row-uUGbE4",
5
- kind: "kind-hB0ZeQ",
6
- value: "value-YXgMQf",
7
- "value-mono": "value-mono-sVr86N",
8
- valueMono: "value-mono-sVr86N",
9
- missing: "missing-HlUIIE"
10
- };
11
- export default relation_summary_module;
@@ -1,37 +0,0 @@
1
- :is(.stack-ITEVDV, .byline-relation-summary-stack) {
2
- flex-direction: column;
3
- gap: .125rem;
4
- min-width: 0;
5
- display: flex;
6
- }
7
-
8
- :is(.row-uUGbE4, .byline-relation-summary-row) {
9
- align-items: center;
10
- gap: .75rem;
11
- min-width: 0;
12
- display: flex;
13
- }
14
-
15
- :is(.kind-hB0ZeQ, .byline-relation-summary-kind) {
16
- color: var(--gray-500);
17
- }
18
-
19
- :is(.value-YXgMQf, .byline-relation-summary-value) {
20
- color: var(--gray-100);
21
- text-overflow: ellipsis;
22
- white-space: nowrap;
23
- overflow: hidden;
24
- }
25
-
26
- :is(.value-mono-sVr86N, .byline-relation-summary-value-mono) {
27
- text-overflow: ellipsis;
28
- white-space: nowrap;
29
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
30
- overflow: hidden;
31
- }
32
-
33
- :is(.missing-HlUIIE, .byline-relation-summary-missing) {
34
- font-size: var(--font-size-xs);
35
- color: var(--red-400);
36
- }
37
-
@@ -1,16 +0,0 @@
1
- /**
2
- * This Source Code is subject to the terms of the Mozilla Public
3
- * License, v. 2.0. If a copy of the MPL was not distributed with this
4
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
- *
6
- * Copyright (c) Infonomic Company Limited
7
- */
8
- import type { SelectField as FieldType } from '@byline/core';
9
- export declare const SelectField: ({ field, value, defaultValue, onChange, id, path, }: {
10
- field: FieldType;
11
- value?: string;
12
- defaultValue?: string;
13
- onChange?: (value: string) => void;
14
- id?: string;
15
- path?: string;
16
- }) => import("react").JSX.Element;
@@ -1,50 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import classnames from "classnames";
3
- import { useFieldError, useFieldValue, useIsDirty } from "../../forms/form-context.js";
4
- import { ErrorText, Label, Select } from "../../uikit.js";
5
- import select_field_module from "./select-field.module.js";
6
- const SelectField = ({ field, value, defaultValue, onChange, id, path })=>{
7
- const fieldPath = path ?? field.name;
8
- const fieldError = useFieldError(fieldPath);
9
- const isDirty = useIsDirty(fieldPath);
10
- const fieldValue = useFieldValue(fieldPath);
11
- const incomingValue = value ?? fieldValue ?? defaultValue ?? '';
12
- const htmlId = id ?? fieldPath;
13
- return /*#__PURE__*/ jsxs("div", {
14
- className: `byline-field-select ${field.name}`,
15
- children: [
16
- field.label && /*#__PURE__*/ jsx(Label, {
17
- id: htmlId,
18
- htmlFor: htmlId,
19
- label: field.label,
20
- required: !field.optional
21
- }),
22
- /*#__PURE__*/ jsx(Select, {
23
- size: "sm",
24
- id: htmlId,
25
- name: field.name,
26
- placeholder: "Select an option",
27
- required: !field.optional,
28
- value: incomingValue,
29
- ariaLabel: field.label,
30
- helpText: field.helpText,
31
- items: field.options.map((opt)=>({
32
- value: opt.value,
33
- label: opt.label
34
- })),
35
- onValueChange: (value)=>{
36
- if (null != value) onChange?.(value);
37
- },
38
- className: classnames(isDirty && [
39
- 'byline-field-select-dirty',
40
- select_field_module.dirty
41
- ])
42
- }),
43
- fieldError && /*#__PURE__*/ jsx(ErrorText, {
44
- id: `${field.name}-error`,
45
- text: fieldError
46
- })
47
- ]
48
- });
49
- };
50
- export { SelectField };
@@ -1,5 +0,0 @@
1
- import "./select-field_module.css";
2
- const select_field_module = {
3
- dirty: "dirty-aKaGZN"
4
- };
5
- export default select_field_module;
@@ -1,4 +0,0 @@
1
- :is(.dirty-aKaGZN, .byline-field-select-dirty) {
2
- border-color: var(--blue-300);
3
- }
4
-
@@ -1,15 +0,0 @@
1
- /**
2
- * This Source Code is subject to the terms of the Mozilla Public
3
- * License, v. 2.0. If a copy of the MPL was not distributed with this
4
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
- *
6
- * Copyright (c) Infonomic Company Limited
7
- */
8
- import { type ReactNode } from 'react';
9
- export declare const SortableItem: ({ id, label, children, onAddBelow, onRemove, }: {
10
- id: string;
11
- label: ReactNode;
12
- children: ReactNode;
13
- onAddBelow?: () => void;
14
- onRemove?: () => void;
15
- }) => import("react").JSX.Element;
@@ -1,80 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import { useState } from "react";
3
- import classnames from "classnames";
4
- import { useSortable } from "../dnd/draggable-sortable/index.js";
5
- import { ChevronDownIcon, GripperVerticalIcon } from "../uikit.js";
6
- import { DraggableContextMenu } from "./draggable-context-menu.js";
7
- import sortable_item_module from "./sortable-item.module.js";
8
- const SortableItem = ({ id, label, children, onAddBelow, onRemove })=>{
9
- const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
10
- id,
11
- transition: {
12
- duration: 250,
13
- easing: 'cubic-bezier(0, 0.2, 0.2, 1)'
14
- }
15
- });
16
- const [collapsed, setCollapsed] = useState(false);
17
- const style = {
18
- transform: transform ? `translate3d(${transform.x}px, ${transform.y}px, 0)` : void 0,
19
- transition,
20
- zIndex: isDragging ? 10 : 'auto'
21
- };
22
- return /*#__PURE__*/ jsxs("div", {
23
- ref: setNodeRef,
24
- style: style,
25
- className: classnames('byline-sortable', sortable_item_module.root, isDragging && [
26
- 'byline-sortable-dragging',
27
- sortable_item_module.dragging
28
- ], collapsed && [
29
- 'byline-sortable-collapsed',
30
- sortable_item_module.collapsed
31
- ]),
32
- children: [
33
- /*#__PURE__*/ jsxs("div", {
34
- className: classnames('byline-sortable-header', sortable_item_module.header, !collapsed && [
35
- 'byline-sortable-header-expanded',
36
- sortable_item_module["header-expanded"]
37
- ]),
38
- children: [
39
- /*#__PURE__*/ jsx("button", {
40
- type: "button",
41
- className: classnames('byline-sortable-grip', sortable_item_module.grip),
42
- ...attributes,
43
- ...listeners,
44
- children: /*#__PURE__*/ jsx(GripperVerticalIcon, {
45
- className: classnames('byline-sortable-grip-icon', sortable_item_module["grip-icon"])
46
- })
47
- }),
48
- /*#__PURE__*/ jsx("div", {
49
- className: classnames('byline-sortable-label', sortable_item_module.label),
50
- children: label
51
- }),
52
- /*#__PURE__*/ jsx(DraggableContextMenu, {
53
- onAddBelow: onAddBelow,
54
- onRemove: onRemove
55
- }),
56
- /*#__PURE__*/ jsx("button", {
57
- type: "button",
58
- className: classnames('byline-sortable-toggle', sortable_item_module.toggle),
59
- onClick: ()=>setCollapsed((prev)=>!prev),
60
- "aria-label": collapsed ? 'Expand item' : 'Collapse item',
61
- children: /*#__PURE__*/ jsx(ChevronDownIcon, {
62
- className: classnames('byline-sortable-toggle-icon', sortable_item_module["toggle-icon"], collapsed && [
63
- 'byline-sortable-toggle-icon-rotated',
64
- sortable_item_module["toggle-icon-rotated"]
65
- ])
66
- })
67
- })
68
- ]
69
- }),
70
- /*#__PURE__*/ jsx("div", {
71
- className: classnames('byline-sortable-content', sortable_item_module.content, collapsed && [
72
- 'byline-sortable-content-hidden',
73
- sortable_item_module["content-hidden"]
74
- ]),
75
- children: children
76
- })
77
- ]
78
- });
79
- };
80
- export { SortableItem };
@@ -1,22 +0,0 @@
1
- import "./sortable-item_module.css";
2
- const sortable_item_module = {
3
- root: "root-nYQaZT",
4
- dragging: "dragging-rtG5ct",
5
- collapsed: "collapsed-BA4JvQ",
6
- header: "header-IyXOb9",
7
- "header-expanded": "header-expanded-xwmWic",
8
- headerExpanded: "header-expanded-xwmWic",
9
- grip: "grip-XZjBQM",
10
- "grip-icon": "grip-icon-tCuFX_",
11
- gripIcon: "grip-icon-tCuFX_",
12
- label: "label-SFRtoy",
13
- toggle: "toggle-zv8W_y",
14
- "toggle-icon": "toggle-icon-vk15Bb",
15
- toggleIcon: "toggle-icon-vk15Bb",
16
- "toggle-icon-rotated": "toggle-icon-rotated-p9rEVP",
17
- toggleIconRotated: "toggle-icon-rotated-p9rEVP",
18
- content: "content-ril4mv",
19
- "content-hidden": "content-hidden-zrS2UX",
20
- contentHidden: "content-hidden-zrS2UX"
21
- };
22
- export default sortable_item_module;
@@ -1,124 +0,0 @@
1
- :is(.root-nYQaZT, .byline-sortable) {
2
- padding: var(--spacing-16);
3
- padding-top: var(--spacing-8);
4
- border: var(--border-width-thin) dashed var(--gray-600);
5
- border-radius: var(--border-radius-md);
6
- background-color: oklch(from var(--canvas-50) l c h / .5);
7
- box-shadow: 0 1px 2px #0000000d;
8
- }
9
-
10
- :is(.dragging-rtG5ct, .byline-sortable-dragging) {
11
- background-color: oklch(from var(--canvas-50) l c h / .8);
12
- box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
13
- }
14
-
15
- :is(.collapsed-BA4JvQ, .byline-sortable-collapsed) {
16
- padding-top: var(--spacing-8);
17
- padding-bottom: var(--spacing-8);
18
- }
19
-
20
- :is(.header-IyXOb9, .byline-sortable-header) {
21
- align-items: center;
22
- gap: var(--spacing-8);
23
- margin-bottom: 0;
24
- margin-left: -.75rem;
25
- display: flex;
26
- }
27
-
28
- :is(.header-expanded-xwmWic, .byline-sortable-header-expanded) {
29
- margin-bottom: var(--spacing-8);
30
- }
31
-
32
- :is(.grip-XZjBQM, .byline-sortable-grip) {
33
- border-radius: var(--border-radius-sm);
34
- color: var(--gray-400);
35
- cursor: grab;
36
- background: none;
37
- border: none;
38
- justify-content: center;
39
- align-items: center;
40
- padding: .25rem;
41
- display: flex;
42
- }
43
-
44
- :is(.grip-XZjBQM:hover, .byline-sortable-grip:hover) {
45
- background-color: var(--gray-100);
46
- }
47
-
48
- :is(.grip-XZjBQM:active, .byline-sortable-grip:active) {
49
- cursor: grabbing;
50
- }
51
-
52
- :is(.grip-icon-tCuFX_, .byline-sortable-grip-icon) {
53
- width: 1rem;
54
- height: 1rem;
55
- color: var(--primary-500);
56
- }
57
-
58
- :is(.label-SFRtoy, .byline-sortable-label) {
59
- min-width: 0;
60
- font-size: 1rem;
61
- font-weight: var(--font-weight-medium);
62
- text-overflow: ellipsis;
63
- white-space: nowrap;
64
- flex: 1;
65
- overflow: hidden;
66
- }
67
-
68
- :is(.toggle-zv8W_y, .byline-sortable-toggle) {
69
- border-radius: var(--border-radius-sm);
70
- color: var(--gray-400);
71
- cursor: pointer;
72
- background: none;
73
- border: none;
74
- justify-content: center;
75
- align-items: center;
76
- padding: .25rem;
77
- display: flex;
78
- }
79
-
80
- :is(.toggle-zv8W_y:hover, .byline-sortable-toggle:hover) {
81
- background-color: var(--gray-800);
82
- }
83
-
84
- :is(.toggle-icon-vk15Bb, .byline-sortable-toggle-icon) {
85
- width: 1rem;
86
- height: 1rem;
87
- transition: transform .15s;
88
- }
89
-
90
- :is(.toggle-icon-rotated-p9rEVP, .byline-sortable-toggle-icon-rotated) {
91
- transform: rotate(180deg);
92
- }
93
-
94
- :is(.content-ril4mv, .byline-sortable-content) {
95
- gap: var(--spacing-16);
96
- opacity: 1;
97
- flex-direction: column;
98
- transition: all .2s;
99
- display: flex;
100
- position: relative;
101
- }
102
-
103
- :is(.content-hidden-zrS2UX, .byline-sortable-content-hidden) {
104
- opacity: 0;
105
- z-index: -10;
106
- max-height: 0;
107
- }
108
-
109
- :is(:is([data-theme="dark"], .dark) .root-nYQaZT, :is([data-theme="dark"], .dark) .byline-sortable) {
110
- background-color: var(--canvas-800);
111
- }
112
-
113
- :is(:is([data-theme="dark"], .dark) .dragging-rtG5ct, :is([data-theme="dark"], .dark) .byline-sortable-dragging) {
114
- background-color: oklch(from var(--canvas-700) l c h / .3);
115
- }
116
-
117
- :is(:is([data-theme="dark"], .dark) .grip-XZjBQM:hover, :is([data-theme="dark"], .dark) .byline-sortable-grip:hover) {
118
- background-color: var(--gray-800);
119
- }
120
-
121
- :is(:is([data-theme="dark"], .dark) .grip-icon-tCuFX_, :is([data-theme="dark"], .dark) .byline-sortable-grip-icon) {
122
- color: var(--primary-200);
123
- }
124
-
@@ -1,20 +0,0 @@
1
- /**
2
- * This Source Code is subject to the terms of the Mozilla Public
3
- * License, v. 2.0. If a copy of the MPL was not distributed with this
4
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
- *
6
- * Copyright (c) Infonomic Company Limited
7
- */
8
- import type { FieldComponentSlots, TextField as FieldType } from '@byline/core';
9
- export declare const TextField: ({ field, value, defaultValue, onChange, id, path, locale, components, }: {
10
- field: FieldType;
11
- value?: string;
12
- defaultValue?: string;
13
- onChange?: (value: string) => void;
14
- id?: string;
15
- path?: string;
16
- /** When provided, renders a LocaleBadge next to the field label. */
17
- locale?: string;
18
- /** Optional UI component slot overrides from the admin config. */
19
- components?: FieldComponentSlots;
20
- }) => import("react").JSX.Element;
@@ -1,104 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import { useCallback } from "react";
3
- import classnames from "classnames";
4
- import { useFieldError, useFieldValue } from "../../forms/form-context.js";
5
- import { Input, Label } from "../../uikit.js";
6
- import { LocaleBadge } from "../locale-badge.js";
7
- import text_field_module from "./text-field.module.js";
8
- const TextField = ({ field, value, defaultValue, onChange, id, path, locale, components })=>{
9
- const fieldPath = path ?? field.name;
10
- const fieldError = useFieldError(fieldPath);
11
- const fieldValue = useFieldValue(fieldPath);
12
- const incomingValue = value ?? fieldValue ?? defaultValue ?? '';
13
- const htmlId = id ?? fieldPath;
14
- const handleChange = useCallback((value)=>{
15
- if (onChange) onChange(value);
16
- }, [
17
- onChange
18
- ]);
19
- const slots = components;
20
- const CustomLabel = slots?.Label;
21
- const CustomHelpText = slots?.HelpText;
22
- const CustomField = slots?.Field;
23
- const BeforeField = slots?.beforeField;
24
- const AfterField = slots?.afterField;
25
- const slotBaseProps = {
26
- field: field,
27
- path: fieldPath,
28
- value: incomingValue,
29
- error: fieldError,
30
- id: htmlId
31
- };
32
- const showBadge = !!locale && !!field.label;
33
- const hasCustomLabel = !!CustomLabel;
34
- const suppressInputLabel = showBadge || hasCustomLabel;
35
- const suppressInputHelpText = !!CustomHelpText;
36
- const labelRowClass = classnames('byline-field-text-label-row', text_field_module["label-row"]);
37
- const renderLabel = ()=>{
38
- if (hasCustomLabel) return /*#__PURE__*/ jsxs("div", {
39
- className: labelRowClass,
40
- children: [
41
- /*#__PURE__*/ jsx(CustomLabel, {
42
- ...slotBaseProps,
43
- label: field.label,
44
- required: !field.optional
45
- }),
46
- showBadge && /*#__PURE__*/ jsx(LocaleBadge, {
47
- locale: locale
48
- })
49
- ]
50
- });
51
- if (showBadge) return /*#__PURE__*/ jsxs("div", {
52
- className: labelRowClass,
53
- children: [
54
- /*#__PURE__*/ jsx(Label, {
55
- id: `${htmlId}-label`,
56
- htmlFor: htmlId,
57
- label: field.label,
58
- required: !field.optional
59
- }),
60
- /*#__PURE__*/ jsx(LocaleBadge, {
61
- locale: locale
62
- })
63
- ]
64
- });
65
- return null;
66
- };
67
- const renderInput = ()=>{
68
- if (CustomField) return /*#__PURE__*/ jsx(CustomField, {
69
- ...slotBaseProps,
70
- onChange: handleChange,
71
- defaultValue: defaultValue,
72
- placeholder: field.placeholder
73
- });
74
- return /*#__PURE__*/ jsx(Input, {
75
- id: htmlId,
76
- name: field.name,
77
- label: suppressInputLabel ? void 0 : field.label,
78
- required: !field.optional,
79
- helpText: suppressInputHelpText ? void 0 : field.helpText,
80
- value: incomingValue,
81
- onChange: (e)=>handleChange(e.target.value),
82
- error: null != fieldError,
83
- errorText: fieldError
84
- });
85
- };
86
- return /*#__PURE__*/ jsxs("div", {
87
- className: `byline-field-text ${field.name}`,
88
- children: [
89
- renderLabel(),
90
- BeforeField && /*#__PURE__*/ jsx(BeforeField, {
91
- ...slotBaseProps
92
- }),
93
- renderInput(),
94
- AfterField && /*#__PURE__*/ jsx(AfterField, {
95
- ...slotBaseProps
96
- }),
97
- CustomHelpText && /*#__PURE__*/ jsx(CustomHelpText, {
98
- ...slotBaseProps,
99
- helpText: field.helpText
100
- })
101
- ]
102
- });
103
- };
104
- export { TextField };
@@ -1,6 +0,0 @@
1
- import "./text-field_module.css";
2
- const text_field_module = {
3
- "label-row": "label-row-sjBuRb",
4
- labelRow: "label-row-sjBuRb"
5
- };
6
- export default text_field_module;
@@ -1,5 +0,0 @@
1
- :is(.label-row-sjBuRb, .byline-field-text-label-row) {
2
- align-items: center;
3
- display: flex;
4
- }
5
-
@@ -1,20 +0,0 @@
1
- /**
2
- * This Source Code is subject to the terms of the Mozilla Public
3
- * License, v. 2.0. If a copy of the MPL was not distributed with this
4
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
- *
6
- * Copyright (c) Infonomic Company Limited
7
- */
8
- import type { FieldComponentSlots, TextAreaField as FieldType } from '@byline/core';
9
- export declare const TextAreaField: ({ field, value, defaultValue, onChange, id, path, locale, components, }: {
10
- field: FieldType;
11
- value?: string;
12
- defaultValue?: string;
13
- onChange?: (value: string) => void;
14
- id?: string;
15
- path?: string;
16
- /** When provided, renders a LocaleBadge next to the field label. */
17
- locale?: string;
18
- /** Optional UI component slot overrides from the admin config. */
19
- components?: FieldComponentSlots;
20
- }) => import("react").JSX.Element;