@panneau/fields 5.0.0-alpha.1 → 5.0.0-alpha.2

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 (19) hide show
  1. package/dist/color/ColorField.css +5 -5
  2. package/dist/color/ColorField.module.js +3 -3
  3. package/dist/group/GroupField.css +2 -2
  4. package/dist/group/GroupField.module.js +1 -1
  5. package/dist/localized/LocalizedField.css +2 -2
  6. package/dist/localized/LocalizedField.module.js +2 -2
  7. package/dist/missing/MissingField.css +4 -3
  8. package/dist/missing/MissingField.module.js +3 -3
  9. package/dist/missing/MissingField.module.js.map +1 -1
  10. package/dist/relation/RelationField.css +7 -7
  11. package/dist/relation/RelationField.module.js +6 -6
  12. package/dist/repeater/RepeaterField.css +12 -11
  13. package/dist/repeater/RepeaterField.module.js +9 -9
  14. package/dist/repeater/RepeaterField.module.js.map +1 -1
  15. package/dist/select/SelectField.css +1 -1
  16. package/dist/select/SelectField.module.js +1 -1
  17. package/dist/url/UrlField.css +2 -2
  18. package/dist/url/UrlField.module.js +1 -1
  19. package/package.json +4 -4
package/dist/color/ColorField.css CHANGED
@@ -1,4 +1,4 @@
1
- .panneau-swatch-J24Ak3 {
1
+ .panneau-color-field-swatch {
2
2
  position: relative;
3
3
  display: inline-flex;
4
4
  width: 1.5rem;
@@ -8,12 +8,12 @@
8
8
  border-radius: var(--panneau-radius-sm);
9
9
  }
10
10
 
11
- .panneau-swatch-J24Ak3:focus-within {
11
+ .panneau-color-field-swatch:focus-within {
12
12
  outline: var(--panneau-focus-width) solid var(--panneau-color-focus);
13
13
  outline-offset: 2px;
14
14
  }
15
15
 
16
- .panneau-picker-b7gdnM {
16
+ .panneau-color-field-picker {
17
17
  position: absolute;
18
18
  inset: -0.5rem;
19
19
  width: calc(100% + 1rem);
@@ -24,10 +24,10 @@
24
24
  border: 0;
25
25
  }
26
26
 
27
- .panneau-picker-b7gdnM:disabled {
27
+ .panneau-color-field-picker:disabled {
28
28
  cursor: not-allowed;
29
29
  }
30
30
 
31
- .panneau-input-1t8LLx {
31
+ .panneau-color-field-input {
32
32
  font-family: var(--panneau-font-family-mono);
33
33
  }
package/dist/color/ColorField.module.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import "./ColorField.css";
2
2
  //#region src/color/ColorField.module.css
3
- var swatch = "panneau-swatch-J24Ak3";
4
- var picker = "panneau-picker-b7gdnM";
5
- var input = "panneau-input-1t8LLx";
3
+ var swatch = "panneau-color-field-swatch";
4
+ var picker = "panneau-color-field-picker";
5
+ var input = "panneau-color-field-input";
6
6
  var ColorField_module_default = {
7
7
  swatch,
8
8
  picker,
package/dist/group/GroupField.css CHANGED
@@ -1,4 +1,4 @@
1
- .panneau-fields-YVfYCM {
1
+ .panneau-group-field-fields {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-4);
@@ -8,7 +8,7 @@
8
8
  }
9
9
 
10
10
  @media (max-width: 30rem) {
11
- .panneau-fields-YVfYCM {
11
+ .panneau-group-field-fields {
12
12
  padding: var(--panneau-space-3);
13
13
  }
14
14
  }
package/dist/group/GroupField.module.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import "./GroupField.css";
2
2
  //#region src/group/GroupField.module.css
3
- var fields = "panneau-fields-YVfYCM";
3
+ var fields = "panneau-group-field-fields";
4
4
  var GroupField_module_default = { fields };
5
5
  //#endregion
6
6
  export { GroupField_module_default as default, fields };
package/dist/localized/LocalizedField.css CHANGED
@@ -1,9 +1,9 @@
1
- .panneau-locales-TQodj- {
1
+ .panneau-localized-field-locales {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-3);
5
5
  }
6
6
 
7
- .panneau-locale-NSOW2A {
7
+ .panneau-localized-field-locale {
8
8
  min-width: 0;
9
9
  }
package/dist/localized/LocalizedField.module.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import "./LocalizedField.css";
2
2
  //#region src/localized/LocalizedField.module.css
3
- var locales = "panneau-locales-TQodj-";
4
- var locale = "panneau-locale-NSOW2A";
3
+ var locales = "panneau-localized-field-locales";
4
+ var locale = "panneau-localized-field-locale";
5
5
  var LocalizedField_module_default = {
6
6
  locales,
7
7
  locale
package/dist/missing/MissingField.css CHANGED
@@ -1,18 +1,19 @@
1
- .panneau-missing-w-xDO3 {
1
+ .panneau-missing-field-missing {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-1);
5
5
  }
6
6
 
7
- .panneau-notice-uaGWZE {
7
+ .panneau-missing-field-notice {
8
8
  padding: var(--panneau-space-2) var(--panneau-space-3);
9
9
  font-size: var(--panneau-font-size-sm);
10
10
  color: var(--panneau-color-text-muted);
11
11
  background-color: var(--panneau-color-surface-sunken);
12
12
  border: var(--panneau-border-width) dashed var(--panneau-color-border-control);
13
13
  border-radius: var(--panneau-radius-md);
14
+ margin: 0;
14
15
  }
15
16
 
16
- .panneau-label-5coKrn {
17
+ .panneau-missing-field-label {
17
18
  font-weight: var(--panneau-font-weight-medium);
18
19
  }
package/dist/missing/MissingField.module.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import "./MissingField.css";
2
2
  //#region src/missing/MissingField.module.css
3
- var missing = "panneau-missing-w-xDO3";
4
- var notice = "panneau-notice-uaGWZE";
5
- var label = "panneau-label-5coKrn";
3
+ var missing = "panneau-missing-field-missing";
4
+ var notice = "panneau-missing-field-notice";
5
+ var label = "panneau-missing-field-label";
6
6
  var MissingField_module_default = {
7
7
  missing,
8
8
  notice,
package/dist/missing/MissingField.module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MissingField.module.js","names":[],"sources":["../../src/missing/MissingField.module.css"],"sourcesContent":[".missing {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-1);\n}\n\n.notice {\n padding: var(--panneau-space-2) var(--panneau-space-3);\n font-size: var(--panneau-font-size-sm);\n color: var(--panneau-color-text-muted);\n background-color: var(--panneau-color-surface-sunken);\n border: var(--panneau-border-width) dashed var(--panneau-color-border-control);\n border-radius: var(--panneau-radius-md);\n}\n\n.label {\n font-weight: var(--panneau-font-weight-medium);\n}\n"],"mappings":""}
1
+ {"version":3,"file":"MissingField.module.js","names":[],"sources":["../../src/missing/MissingField.module.css"],"sourcesContent":[".missing {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-1);\n}\n\n.notice {\n padding: var(--panneau-space-2) var(--panneau-space-3);\n font-size: var(--panneau-font-size-sm);\n color: var(--panneau-color-text-muted);\n background-color: var(--panneau-color-surface-sunken);\n border: var(--panneau-border-width) dashed var(--panneau-color-border-control);\n border-radius: var(--panneau-radius-md);\n margin: 0;\n}\n\n.label {\n font-weight: var(--panneau-font-weight-medium);\n}\n"],"mappings":""}
package/dist/relation/RelationField.css CHANGED
@@ -1,10 +1,10 @@
1
- .panneau-multiple-u9IXr- {
1
+ .panneau-relation-field-multiple {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-2);
5
5
  }
6
6
 
7
- .panneau-selected-PL7VcQ {
7
+ .panneau-relation-field-selected {
8
8
  display: flex;
9
9
  flex-wrap: wrap;
10
10
  gap: var(--panneau-space-1) var(--panneau-space-2);
@@ -13,7 +13,7 @@
13
13
  list-style: none;
14
14
  }
15
15
 
16
- .panneau-reference-J8YpaW {
16
+ .panneau-relation-field-reference {
17
17
  display: inline-flex;
18
18
  align-items: center;
19
19
  gap: var(--panneau-space-1);
@@ -26,18 +26,18 @@
26
26
  border-radius: var(--panneau-radius-full);
27
27
  }
28
28
 
29
- .panneau-reference-J8YpaW:only-child,
30
- .panneau-readOnly-UunIK0 .panneau-reference-J8YpaW {
29
+ .panneau-relation-field-reference:only-child,
30
+ .panneau-relation-field-read-only .panneau-relation-field-reference {
31
31
  padding-inline-end: var(--panneau-space-3);
32
32
  }
33
33
 
34
- .panneau-referenceLabel-ydQ0bU {
34
+ .panneau-relation-field-reference-label {
35
35
  overflow: hidden;
36
36
  text-overflow: ellipsis;
37
37
  white-space: nowrap;
38
38
  }
39
39
 
40
- .panneau-none-niMk7v {
40
+ .panneau-relation-field-none {
41
41
  font-size: var(--panneau-font-size-md);
42
42
  color: var(--panneau-color-text-muted);
43
43
  }
package/dist/relation/RelationField.module.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import "./RelationField.css";
2
2
  //#region src/relation/RelationField.module.css
3
- var multiple = "panneau-multiple-u9IXr-";
4
- var selected = "panneau-selected-PL7VcQ";
5
- var reference = "panneau-reference-J8YpaW";
6
- var readOnly = "panneau-readOnly-UunIK0";
7
- var referenceLabel = "panneau-referenceLabel-ydQ0bU";
8
- var none = "panneau-none-niMk7v";
3
+ var multiple = "panneau-relation-field-multiple";
4
+ var selected = "panneau-relation-field-selected";
5
+ var reference = "panneau-relation-field-reference";
6
+ var readOnly = "panneau-relation-field-read-only";
7
+ var referenceLabel = "panneau-relation-field-reference-label";
8
+ var none = "panneau-relation-field-none";
9
9
  var RelationField_module_default = {
10
10
  multiple,
11
11
  selected,
package/dist/repeater/RepeaterField.css CHANGED
@@ -1,4 +1,4 @@
1
- .panneau-items-B5uTq4 {
1
+ .panneau-repeater-field-items {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-3);
@@ -7,7 +7,7 @@
7
7
  list-style: none;
8
8
  }
9
9
 
10
- .panneau-item-cNAgol {
10
+ .panneau-repeater-field-item {
11
11
  display: flex;
12
12
  flex-direction: column;
13
13
  min-width: 0;
@@ -16,7 +16,7 @@
16
16
  border-radius: var(--panneau-radius-md);
17
17
  }
18
18
 
19
- .panneau-header-QLqgvh {
19
+ .panneau-repeater-field-header {
20
20
  display: flex;
21
21
  align-items: center;
22
22
  gap: var(--panneau-space-2);
@@ -29,7 +29,7 @@
29
29
  border-start-end-radius: inherit;
30
30
  }
31
31
 
32
- .panneau-title-0eDHTu {
32
+ .panneau-repeater-field-title {
33
33
  flex: 1 1 auto;
34
34
  min-width: 0;
35
35
  overflow: hidden;
@@ -39,42 +39,43 @@
39
39
  white-space: nowrap;
40
40
  }
41
41
 
42
- .panneau-index-IrOBUU {
42
+ .panneau-repeater-field-index {
43
43
  margin-inline-end: var(--panneau-space-2);
44
- font-variant-numeric: tabular-nums;
44
+ font-variant-numeric: var(--panneau-font-numeric);
45
45
  color: var(--panneau-color-text-muted);
46
46
  }
47
47
 
48
- .panneau-tools-zbGiq2 {
48
+ .panneau-repeater-field-tools {
49
49
  display: flex;
50
50
  flex: 0 0 auto;
51
51
  gap: var(--panneau-space-1);
52
52
  }
53
53
 
54
- .panneau-body-iQtLK9 {
54
+ .panneau-repeater-field-body {
55
55
  display: flex;
56
56
  flex-direction: column;
57
57
  gap: var(--panneau-space-4);
58
58
  padding: var(--panneau-space-4);
59
59
  }
60
60
 
61
- .panneau-empty-MST5Cj {
61
+ .panneau-repeater-field-empty {
62
62
  padding: var(--panneau-space-3);
63
63
  font-size: var(--panneau-font-size-sm);
64
64
  color: var(--panneau-color-text-muted);
65
65
  text-align: center;
66
66
  border: var(--panneau-border-width) dashed var(--panneau-color-border-control);
67
67
  border-radius: var(--panneau-radius-md);
68
+ margin: 0;
68
69
  }
69
70
 
70
- .panneau-footer-5jeHXH {
71
+ .panneau-repeater-field-footer {
71
72
  display: flex;
72
73
  flex-wrap: wrap;
73
74
  gap: var(--panneau-space-2);
74
75
  }
75
76
 
76
77
  @media (max-width: 30rem) {
77
- .panneau-body-iQtLK9 {
78
+ .panneau-repeater-field-body {
78
79
  padding: var(--panneau-space-3);
79
80
  }
80
81
  }
package/dist/repeater/RepeaterField.module.js CHANGED
@@ -1,14 +1,14 @@
1
1
  import "./RepeaterField.css";
2
2
  //#region src/repeater/RepeaterField.module.css
3
- var items = "panneau-items-B5uTq4";
4
- var item = "panneau-item-cNAgol";
5
- var header = "panneau-header-QLqgvh";
6
- var title = "panneau-title-0eDHTu";
7
- var index = "panneau-index-IrOBUU";
8
- var tools = "panneau-tools-zbGiq2";
9
- var body = "panneau-body-iQtLK9";
10
- var empty = "panneau-empty-MST5Cj";
11
- var footer = "panneau-footer-5jeHXH";
3
+ var items = "panneau-repeater-field-items";
4
+ var item = "panneau-repeater-field-item";
5
+ var header = "panneau-repeater-field-header";
6
+ var title = "panneau-repeater-field-title";
7
+ var index = "panneau-repeater-field-index";
8
+ var tools = "panneau-repeater-field-tools";
9
+ var body = "panneau-repeater-field-body";
10
+ var empty = "panneau-repeater-field-empty";
11
+ var footer = "panneau-repeater-field-footer";
12
12
  var RepeaterField_module_default = {
13
13
  items,
14
14
  item,
package/dist/repeater/RepeaterField.module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RepeaterField.module.js","names":[],"sources":["../../src/repeater/RepeaterField.module.css"],"sourcesContent":[".items {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-3);\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n.item {\n display: flex;\n flex-direction: column;\n min-width: 0;\n background-color: var(--panneau-color-surface);\n border: var(--panneau-border-width) solid var(--panneau-color-border);\n border-radius: var(--panneau-radius-md);\n}\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--panneau-space-2);\n min-height: var(--panneau-control-height);\n padding: var(--panneau-space-1) var(--panneau-space-1) var(--panneau-space-1)\n var(--panneau-space-3);\n background-color: var(--panneau-color-surface-sunken);\n border-bottom: var(--panneau-border-width) solid var(--panneau-color-border);\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n}\n\n.title {\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n font-size: var(--panneau-font-size-sm);\n font-weight: var(--panneau-font-weight-medium);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.index {\n margin-inline-end: var(--panneau-space-2);\n font-variant-numeric: tabular-nums;\n color: var(--panneau-color-text-muted);\n}\n\n.tools {\n display: flex;\n flex: 0 0 auto;\n gap: var(--panneau-space-1);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-4);\n padding: var(--panneau-space-4);\n}\n\n.empty {\n padding: var(--panneau-space-3);\n font-size: var(--panneau-font-size-sm);\n color: var(--panneau-color-text-muted);\n text-align: center;\n border: var(--panneau-border-width) dashed var(--panneau-color-border-control);\n border-radius: var(--panneau-radius-md);\n}\n\n.footer {\n display: flex;\n flex-wrap: wrap;\n gap: var(--panneau-space-2);\n}\n\n@media (max-width: 30rem) {\n .body {\n padding: var(--panneau-space-3);\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"RepeaterField.module.js","names":[],"sources":["../../src/repeater/RepeaterField.module.css"],"sourcesContent":[".items {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-3);\n margin: 0;\n padding: 0;\n list-style: none;\n}\n\n.item {\n display: flex;\n flex-direction: column;\n min-width: 0;\n background-color: var(--panneau-color-surface);\n border: var(--panneau-border-width) solid var(--panneau-color-border);\n border-radius: var(--panneau-radius-md);\n}\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--panneau-space-2);\n min-height: var(--panneau-control-height);\n padding: var(--panneau-space-1) var(--panneau-space-1) var(--panneau-space-1)\n var(--panneau-space-3);\n background-color: var(--panneau-color-surface-sunken);\n border-bottom: var(--panneau-border-width) solid var(--panneau-color-border);\n border-start-start-radius: inherit;\n border-start-end-radius: inherit;\n}\n\n.title {\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n font-size: var(--panneau-font-size-sm);\n font-weight: var(--panneau-font-weight-medium);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.index {\n margin-inline-end: var(--panneau-space-2);\n font-variant-numeric: var(--panneau-font-numeric);\n color: var(--panneau-color-text-muted);\n}\n\n.tools {\n display: flex;\n flex: 0 0 auto;\n gap: var(--panneau-space-1);\n}\n\n.body {\n display: flex;\n flex-direction: column;\n gap: var(--panneau-space-4);\n padding: var(--panneau-space-4);\n}\n\n.empty {\n padding: var(--panneau-space-3);\n font-size: var(--panneau-font-size-sm);\n color: var(--panneau-color-text-muted);\n text-align: center;\n border: var(--panneau-border-width) dashed var(--panneau-color-border-control);\n border-radius: var(--panneau-radius-md);\n margin: 0;\n}\n\n.footer {\n display: flex;\n flex-wrap: wrap;\n gap: var(--panneau-space-2);\n}\n\n@media (max-width: 30rem) {\n .body {\n padding: var(--panneau-space-3);\n }\n}\n"],"mappings":""}
package/dist/select/SelectField.css CHANGED
@@ -1,4 +1,4 @@
1
- .panneau-checkboxes-To0J7N {
1
+ .panneau-select-field-checkboxes {
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  gap: var(--panneau-space-1);
package/dist/select/SelectField.module.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import "./SelectField.css";
2
2
  //#region src/select/SelectField.module.css
3
- var checkboxes = "panneau-checkboxes-To0J7N";
3
+ var checkboxes = "panneau-select-field-checkboxes";
4
4
  var SelectField_module_default = { checkboxes };
5
5
  //#endregion
6
6
  export { checkboxes, SelectField_module_default as default };
package/dist/url/UrlField.css CHANGED
@@ -1,4 +1,4 @@
1
- .panneau-open-bOtJNo {
1
+ .panneau-url-field-open {
2
2
  display: inline-flex;
3
3
  align-items: center;
4
4
  padding: var(--panneau-space-1);
@@ -6,6 +6,6 @@
6
6
  border-radius: var(--panneau-radius-sm);
7
7
  }
8
8
 
9
- .panneau-open-bOtJNo:hover {
9
+ .panneau-url-field-open:hover {
10
10
  color: var(--panneau-color-text);
11
11
  }
package/dist/url/UrlField.module.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import "./UrlField.css";
2
2
  //#region src/url/UrlField.module.css
3
- var open = "panneau-open-bOtJNo";
3
+ var open = "panneau-url-field-open";
4
4
  var UrlField_module_default = { open };
5
5
  //#endregion
6
6
  export { UrlField_module_default as default, open };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/fields",
3
- "version": "5.0.0-alpha.1",
3
+ "version": "5.0.0-alpha.2",
4
4
  "description": "Controlled field components of Panneau for the protocol's built-in field types, one subpath per field.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -122,9 +122,9 @@
122
122
  },
123
123
  "dependencies": {
124
124
  "@internationalized/date": "^3.12.4",
125
- "@panneau/intl": "5.0.0-alpha.1",
126
- "@panneau/protocol": "5.0.0-alpha.1",
127
- "@panneau/ui": "5.0.0-alpha.1",
125
+ "@panneau/intl": "5.0.0-alpha.2",
126
+ "@panneau/protocol": "5.0.0-alpha.2",
127
+ "@panneau/ui": "5.0.0-alpha.2",
128
128
  "lucide-react": "^1.57.0"
129
129
  }
130
130
  }