photon-grid-core 0.0.1 → 0.0.3

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 (142) hide show
  1. package/README.md +305 -0
  2. package/icons/icon-sets/core-icons.js +1 -1
  3. package/icons/icon-sets/core-icons.js.map +1 -1
  4. package/index.d.ts +1 -0
  5. package/index.d.ts.map +1 -1
  6. package/package.json +22 -16
  7. package/renderer/body-renderer.d.ts.map +1 -1
  8. package/renderer/body-renderer.js +21 -4
  9. package/renderer/body-renderer.js.map +1 -1
  10. package/renderer/cell-renderer.js +1 -1
  11. package/renderer/cell-renderer.js.map +1 -1
  12. package/renderer/column-menu.js +24 -25
  13. package/renderer/column-menu.js.map +1 -1
  14. package/renderer/column-style-manager.d.ts.map +1 -1
  15. package/renderer/column-style-manager.js +11 -2
  16. package/renderer/column-style-manager.js.map +1 -1
  17. package/renderer/grid-renderer.js +1 -1
  18. package/renderer/grid-renderer.js.map +1 -1
  19. package/renderer/header-renderer.d.ts.map +1 -1
  20. package/renderer/header-renderer.js +17 -3
  21. package/renderer/header-renderer.js.map +1 -1
  22. package/renderer/row-drag-renderer.d.ts +18 -0
  23. package/renderer/row-drag-renderer.d.ts.map +1 -1
  24. package/renderer/row-drag-renderer.js +53 -0
  25. package/renderer/row-drag-renderer.js.map +1 -1
  26. package/styles/base/cells.css.d.ts +9 -0
  27. package/styles/base/cells.css.d.ts.map +1 -0
  28. package/styles/base/cells.css.js +233 -0
  29. package/styles/base/cells.css.js.map +1 -0
  30. package/styles/base/chart-panel.css.d.ts +9 -0
  31. package/styles/base/chart-panel.css.d.ts.map +1 -0
  32. package/styles/base/chart-panel.css.js +140 -0
  33. package/styles/base/chart-panel.css.js.map +1 -0
  34. package/styles/base/column-context-menu.css.d.ts +9 -0
  35. package/styles/base/column-context-menu.css.d.ts.map +1 -0
  36. package/styles/base/column-context-menu.css.js +153 -0
  37. package/styles/base/column-context-menu.css.js.map +1 -0
  38. package/styles/base/column-group-header.css.d.ts +9 -0
  39. package/styles/base/column-group-header.css.d.ts.map +1 -0
  40. package/styles/base/column-group-header.css.js +270 -0
  41. package/styles/base/column-group-header.css.js.map +1 -0
  42. package/styles/base/context-menu.css.d.ts +9 -0
  43. package/styles/base/context-menu.css.d.ts.map +1 -0
  44. package/styles/base/context-menu.css.js +103 -0
  45. package/styles/base/context-menu.css.js.map +1 -0
  46. package/styles/base/editors.css.d.ts +9 -0
  47. package/styles/base/editors.css.d.ts.map +1 -0
  48. package/styles/base/editors.css.js +291 -0
  49. package/styles/base/editors.css.js.map +1 -0
  50. package/styles/base/filter.css.d.ts +9 -0
  51. package/styles/base/filter.css.d.ts.map +1 -0
  52. package/styles/base/filter.css.js +312 -0
  53. package/styles/base/filter.css.js.map +1 -0
  54. package/styles/base/footer.css.d.ts +9 -0
  55. package/styles/base/footer.css.d.ts.map +1 -0
  56. package/styles/base/footer.css.js +78 -0
  57. package/styles/base/footer.css.js.map +1 -0
  58. package/styles/base/group-bar-search.css.d.ts +9 -0
  59. package/styles/base/group-bar-search.css.d.ts.map +1 -0
  60. package/styles/base/group-bar-search.css.js +86 -0
  61. package/styles/base/group-bar-search.css.js.map +1 -0
  62. package/styles/base/group-drop-zone.css.d.ts +9 -0
  63. package/styles/base/group-drop-zone.css.d.ts.map +1 -0
  64. package/styles/base/group-drop-zone.css.js +173 -0
  65. package/styles/base/group-drop-zone.css.js.map +1 -0
  66. package/styles/base/header.css.d.ts +9 -0
  67. package/styles/base/header.css.d.ts.map +1 -0
  68. package/styles/base/header.css.js +206 -0
  69. package/styles/base/header.css.js.map +1 -0
  70. package/styles/base/master-detail.css.d.ts +9 -0
  71. package/styles/base/master-detail.css.d.ts.map +1 -0
  72. package/styles/base/master-detail.css.js +202 -0
  73. package/styles/base/master-detail.css.js.map +1 -0
  74. package/styles/base/misc.css.d.ts +9 -0
  75. package/styles/base/misc.css.d.ts.map +1 -0
  76. package/styles/base/misc.css.js +65 -0
  77. package/styles/base/misc.css.js.map +1 -0
  78. package/styles/base/panels.css.d.ts +9 -0
  79. package/styles/base/panels.css.d.ts.map +1 -0
  80. package/styles/base/panels.css.js +162 -0
  81. package/styles/base/panels.css.js.map +1 -0
  82. package/styles/base/photon-ai.css.d.ts +9 -0
  83. package/styles/base/photon-ai.css.d.ts.map +1 -0
  84. package/styles/base/photon-ai.css.js +200 -0
  85. package/styles/base/photon-ai.css.js.map +1 -0
  86. package/styles/base/root.css.d.ts +9 -0
  87. package/styles/base/root.css.d.ts.map +1 -0
  88. package/styles/base/root.css.js +56 -0
  89. package/styles/base/root.css.js.map +1 -0
  90. package/styles/base/row-drag.css.d.ts +9 -0
  91. package/styles/base/row-drag.css.d.ts.map +1 -0
  92. package/styles/base/row-drag.css.js +93 -0
  93. package/styles/base/row-drag.css.js.map +1 -0
  94. package/styles/base/row-group.css.d.ts +9 -0
  95. package/styles/base/row-group.css.d.ts.map +1 -0
  96. package/styles/base/row-group.css.js +79 -0
  97. package/styles/base/row-group.css.js.map +1 -0
  98. package/styles/base/rows.css.d.ts +9 -0
  99. package/styles/base/rows.css.d.ts.map +1 -0
  100. package/styles/base/rows.css.js +83 -0
  101. package/styles/base/rows.css.js.map +1 -0
  102. package/styles/base/scrollbars.css.d.ts +9 -0
  103. package/styles/base/scrollbars.css.d.ts.map +1 -0
  104. package/styles/base/scrollbars.css.js +56 -0
  105. package/styles/base/scrollbars.css.js.map +1 -0
  106. package/styles/base/sparkline.css.d.ts +9 -0
  107. package/styles/base/sparkline.css.d.ts.map +1 -0
  108. package/styles/base/sparkline.css.js +109 -0
  109. package/styles/base/sparkline.css.js.map +1 -0
  110. package/styles/base/tooltip.css.d.ts +9 -0
  111. package/styles/base/tooltip.css.d.ts.map +1 -0
  112. package/styles/base/tooltip.css.js +39 -0
  113. package/styles/base/tooltip.css.js.map +1 -0
  114. package/styles/base/tree.css.d.ts +9 -0
  115. package/styles/base/tree.css.d.ts.map +1 -0
  116. package/styles/base/tree.css.js +78 -0
  117. package/styles/base/tree.css.js.map +1 -0
  118. package/styles/base-styles.d.ts.map +1 -1
  119. package/styles/base-styles.js +56 -3026
  120. package/styles/base-styles.js.map +1 -1
  121. package/styles/themes/theme-alpine.d.ts +1 -1
  122. package/styles/themes/theme-alpine.d.ts.map +1 -1
  123. package/styles/themes/theme-alpine.js +1 -1
  124. package/styles/themes/theme-balham.d.ts +1 -1
  125. package/styles/themes/theme-balham.d.ts.map +1 -1
  126. package/styles/themes/theme-balham.js +0 -1
  127. package/styles/themes/theme-balham.js.map +1 -1
  128. package/styles/themes/theme-dark.d.ts +1 -1
  129. package/styles/themes/theme-dark.d.ts.map +1 -1
  130. package/styles/themes/theme-dark.js +1 -1
  131. package/styles/themes/theme-material.d.ts +1 -1
  132. package/styles/themes/theme-material.d.ts.map +1 -1
  133. package/styles/themes/theme-material.js +0 -1
  134. package/styles/themes/theme-material.js.map +1 -1
  135. package/styles/themes/theme-quartz.d.ts +1 -1
  136. package/styles/themes/theme-quartz.d.ts.map +1 -1
  137. package/styles/themes/theme-quartz.js +1 -1
  138. package/LICENSE +0 -1
  139. package/chart/chart-analyzer.d.ts +0 -12
  140. package/chart/chart-analyzer.d.ts.map +0 -1
  141. package/chart/chart-analyzer.js +0 -77
  142. package/chart/chart-analyzer.js.map +0 -1
@@ -0,0 +1,78 @@
1
+ /**
2
+ * Photon Grid base styles — footer section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export const footerCss = `/* ──────────────────── Footer ──────────────────── */
9
+ .pg-grid__footer {
10
+ flex-shrink: 0;
11
+ border-top: 1px solid var(--pg-colors-footer-border, #e2e8f0);
12
+ background: var(--pg-colors-footer-background, #f8fafc);
13
+ }
14
+ .pg-footer {
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: space-between;
18
+ padding: 0 16px;
19
+ height: 44px;
20
+ gap: 16px;
21
+ }
22
+ .pg-pagination {
23
+ display: flex;
24
+ align-items: center;
25
+ gap: 4px;
26
+ }
27
+ .pg-pagination__info {
28
+ font-size: var(--pg-typography-font-size-sm, 12px);
29
+ color: var(--pg-colors-text-secondary, #475569);
30
+ min-width: 100px;
31
+ text-align: center;
32
+ }
33
+ .pg-pagination__btn {
34
+ display: inline-flex;
35
+ align-items: center;
36
+ justify-content: center;
37
+ width: 30px;
38
+ height: 30px;
39
+ border: 1px solid var(--pg-colors-border, #e2e8f0);
40
+ border-radius: var(--pg-borders-radius-sm, 4px);
41
+ background: var(--pg-colors-surface, #fff);
42
+ color: var(--pg-colors-text-primary, #0f172a);
43
+ cursor: pointer;
44
+ transition: all var(--pg-transitions-duration-fast, 100ms);
45
+ }
46
+ .pg-pagination__btn:hover:not(:disabled) { background: var(--pg-colors-background-alt, #f1f5f9); border-color: var(--pg-colors-border-strong, #cbd5e1); }
47
+ .pg-pagination__btn:disabled { opacity: 0.38; cursor: not-allowed; }
48
+ .pg-pagination__page-input {
49
+ width: 54px;
50
+ height: 30px;
51
+ padding: 0 8px;
52
+ border: 1px solid var(--pg-colors-border, #e2e8f0);
53
+ border-radius: var(--pg-borders-radius-sm, 4px);
54
+ font-size: var(--pg-typography-font-size-sm, 12px);
55
+ font-family: inherit;
56
+ background: var(--pg-colors-surface, #fff);
57
+ color: inherit;
58
+ text-align: center;
59
+ outline: none;
60
+ }
61
+ .pg-pagination__page-input:focus { border-color: var(--pg-colors-border-focus, #2563eb); }
62
+ .pg-pagination__size { display: flex; align-items: center; gap: 8px; }
63
+ .pg-pagination__size-label { font-size: var(--pg-typography-font-size-sm, 12px); color: var(--pg-colors-text-secondary, #475569); white-space: nowrap; }
64
+ .pg-pagination__size-select {
65
+ height: 30px;
66
+ padding: 0 6px;
67
+ border: 1px solid var(--pg-colors-border, #e2e8f0);
68
+ border-radius: var(--pg-borders-radius-sm, 4px);
69
+ font-size: var(--pg-typography-font-size-sm, 12px);
70
+ font-family: inherit;
71
+ background: var(--pg-colors-surface, #fff);
72
+ color: inherit;
73
+ cursor: pointer;
74
+ outline: none;
75
+ }
76
+
77
+ `;
78
+ //# sourceMappingURL=footer.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"footer.css.js","sourceRoot":"","sources":["../../../src/styles/base/footer.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqExB,CAAC"}
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Photon Grid base styles — group-bar-search section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export declare const groupBarSearchCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Group bar quick-filter search \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-group-search {\n display: flex;\n align-items: center;\n padding: 0 10px;\n flex-shrink: 0;\n height: 100%;\n}\n.pg-group-drop-zone--left .pg-group-search,\n.pg-group-drop-zone--right .pg-group-search { display: none; }\n\n/* Field wrapper: position:relative so icon + clear button can overlay the input */\n.pg-group-search__field {\n position: relative;\n display: flex;\n align-items: center;\n}\n.pg-group-search__icon {\n position: absolute;\n left: 9px;\n top: 50%;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n color: var(--pg-colors-text-disabled, #94a3b8);\n pointer-events: none;\n transition: color 150ms;\n z-index: 1;\n}\n.pg-group-search__field:focus-within .pg-group-search__icon {\n color: var(--pg-colors-primary, #2563eb);\n}\n.pg-group-search__input {\n width: 210px;\n height: 32px;\n padding: 0 28px 0 30px;\n font-size: var(--pg-typography-font-size-sm, 12px);\n font-family: inherit;\n color: var(--pg-colors-text-primary, #0f172a);\n background: var(--pg-colors-surface, #ffffff);\n border: 1px solid var(--pg-colors-border, #e2e8f0);\n border-radius: var(--pg-borders-radius-sm, 4px);\n outline: none;\n transition: border-color 150ms, box-shadow 150ms;\n appearance: none;\n}\n.pg-group-search__input::placeholder { color: var(--pg-colors-text-disabled, #94a3b8); }\n.pg-group-search__input:focus {\n border-color: var(--pg-colors-border-focus, #2563eb);\n box-shadow: 0 0 0 3px var(--pg-colors-selection-background, rgba(37, 99, 235, 0.12));\n}\n.pg-group-search__clear {\n position: absolute;\n right: 6px;\n top: 50%;\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n cursor: pointer;\n color: var(--pg-colors-text-secondary, #64748b);\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms, background 100ms;\n}\n.pg-group-search__clear--visible {\n opacity: 0.55;\n pointer-events: auto;\n}\n.pg-group-search__clear--visible:hover {\n opacity: 1;\n background: var(--pg-colors-background-alt, #f1f5f9);\n}\n\n";
9
+ //# sourceMappingURL=group-bar-search.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"group-bar-search.css.d.ts","sourceRoot":"","sources":["../../../src/styles/base/group-bar-search.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,q3EA6E7B,CAAC"}
@@ -0,0 +1,86 @@
1
+ /**
2
+ * Photon Grid base styles — group-bar-search section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export const groupBarSearchCss = `/* ──────────────────── Group bar quick-filter search ──────────────────── */
9
+ .pg-group-search {
10
+ display: flex;
11
+ align-items: center;
12
+ padding: 0 10px;
13
+ flex-shrink: 0;
14
+ height: 100%;
15
+ }
16
+ .pg-group-drop-zone--left .pg-group-search,
17
+ .pg-group-drop-zone--right .pg-group-search { display: none; }
18
+
19
+ /* Field wrapper: position:relative so icon + clear button can overlay the input */
20
+ .pg-group-search__field {
21
+ position: relative;
22
+ display: flex;
23
+ align-items: center;
24
+ }
25
+ .pg-group-search__icon {
26
+ position: absolute;
27
+ left: 9px;
28
+ top: 50%;
29
+ transform: translateY(-50%);
30
+ display: flex;
31
+ align-items: center;
32
+ color: var(--pg-colors-text-disabled, #94a3b8);
33
+ pointer-events: none;
34
+ transition: color 150ms;
35
+ z-index: 1;
36
+ }
37
+ .pg-group-search__field:focus-within .pg-group-search__icon {
38
+ color: var(--pg-colors-primary, #2563eb);
39
+ }
40
+ .pg-group-search__input {
41
+ width: 210px;
42
+ height: 32px;
43
+ padding: 0 28px 0 30px;
44
+ font-size: var(--pg-typography-font-size-sm, 12px);
45
+ font-family: inherit;
46
+ color: var(--pg-colors-text-primary, #0f172a);
47
+ background: var(--pg-colors-surface, #ffffff);
48
+ border: 1px solid var(--pg-colors-border, #e2e8f0);
49
+ border-radius: var(--pg-borders-radius-sm, 4px);
50
+ outline: none;
51
+ transition: border-color 150ms, box-shadow 150ms;
52
+ appearance: none;
53
+ }
54
+ .pg-group-search__input::placeholder { color: var(--pg-colors-text-disabled, #94a3b8); }
55
+ .pg-group-search__input:focus {
56
+ border-color: var(--pg-colors-border-focus, #2563eb);
57
+ box-shadow: 0 0 0 3px var(--pg-colors-selection-background, rgba(37, 99, 235, 0.12));
58
+ }
59
+ .pg-group-search__clear {
60
+ position: absolute;
61
+ right: 6px;
62
+ top: 50%;
63
+ transform: translateY(-50%);
64
+ display: flex;
65
+ align-items: center;
66
+ justify-content: center;
67
+ width: 18px;
68
+ height: 18px;
69
+ border-radius: 50%;
70
+ cursor: pointer;
71
+ color: var(--pg-colors-text-secondary, #64748b);
72
+ opacity: 0;
73
+ pointer-events: none;
74
+ transition: opacity 150ms, background 100ms;
75
+ }
76
+ .pg-group-search__clear--visible {
77
+ opacity: 0.55;
78
+ pointer-events: auto;
79
+ }
80
+ .pg-group-search__clear--visible:hover {
81
+ opacity: 1;
82
+ background: var(--pg-colors-background-alt, #f1f5f9);
83
+ }
84
+
85
+ `;
86
+ //# sourceMappingURL=group-bar-search.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"group-bar-search.css.js","sourceRoot":"","sources":["../../../src/styles/base/group-bar-search.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6EhC,CAAC"}
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Photon Grid base styles — group-drop-zone section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export declare const groupDropZoneCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Group drop zone \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-group-drop-zone--top {\n display: flex;\n flex-direction: row;\n align-items: center;\n flex-shrink: 0;\n height: var(--pg-header-row-height, 44px);\n background: var(--pg-colors-header-background, #f8fafc);\n border-bottom: 1px solid var(--pg-colors-border, #e2e8f0);\n overflow: hidden;\n}\n.pg-group-drop-zone--left {\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n width: 160px;\n background: var(--pg-colors-header-background, #f8fafc);\n border-right: 1px solid var(--pg-colors-border, #e2e8f0);\n overflow: hidden;\n position: relative;\n}\n.pg-group-drop-zone--right {\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n width: 160px;\n background: var(--pg-colors-header-background, #f8fafc);\n border-left: 1px solid var(--pg-colors-border, #e2e8f0);\n overflow: hidden;\n position: relative;\n}\n\n/* Zone header row (grip + \"Groups\" label) */\n.pg-group-zone-header {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px 4px 8px;\n flex-shrink: 0;\n border-bottom: 1px solid var(--pg-colors-border, #e2e8f0);\n user-select: none;\n}\n.pg-group-zone-grip {\n display: flex;\n align-items: center;\n cursor: grab;\n opacity: 0.45;\n padding: 2px 3px;\n border-radius: 3px;\n color: var(--pg-colors-text-secondary, #64748b);\n flex-shrink: 0;\n transition: opacity 100ms, background 100ms;\n}\n.pg-group-zone-grip:hover { opacity: 0.85; background: rgba(0,0,0,0.06); }\n.pg-group-zone-grip:active { cursor: grabbing; }\n.pg-group-zone-label {\n flex: 1;\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--pg-colors-text-secondary, #64748b);\n user-select: none;\n}\n\n/* Chips area (the actual drop target) */\n.pg-group-zone-chips {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: 6px;\n padding: 6px 10px;\n min-height: 38px;\n flex: 1;\n overflow: auto;\n}\n.pg-group-drop-zone--left .pg-group-zone-chips,\n.pg-group-drop-zone--right .pg-group-zone-chips {\n flex-direction: column;\n align-items: flex-start;\n overflow-y: auto;\n overflow-x: hidden;\n}\n.pg-group-zone-chips--over {\n background: var(--pg-colors-group-zone-over, #eff6ff);\n outline: 1px dashed var(--pg-colors-primary, #2563eb);\n outline-offset: -2px;\n}\n\n/* Resize handle */\n.pg-group-drop-zone--top .pg-group-zone-resize {\n height: 4px;\n flex-shrink: 0;\n cursor: ns-resize;\n background: transparent;\n transition: background 100ms;\n}\n.pg-group-drop-zone--top .pg-group-zone-resize:hover { background: var(--pg-colors-primary, #2563eb); opacity: 0.35; }\n.pg-group-drop-zone--left .pg-group-zone-resize {\n position: absolute;\n top: 0; right: 0; bottom: 0;\n width: 4px;\n cursor: ew-resize;\n background: transparent;\n transition: background 100ms;\n}\n.pg-group-drop-zone--right .pg-group-zone-resize {\n position: absolute;\n top: 0; left: 0; bottom: 0;\n width: 4px;\n cursor: ew-resize;\n background: transparent;\n transition: background 100ms;\n}\n.pg-group-drop-zone--left .pg-group-zone-resize:hover,\n.pg-group-drop-zone--right .pg-group-zone-resize:hover { background: var(--pg-colors-primary, #2563eb); opacity: 0.35; }\n\n/* Hint text */\n.pg-group-drop-zone__hint {\n font-size: var(--pg-typography-font-size-sm, 12px);\n color: var(--pg-colors-text-disabled, #94a3b8);\n pointer-events: none;\n user-select: none;\n}\n\n/* Chips */\n.pg-group-chip {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n padding: 3px 6px 3px 10px;\n border-radius: var(--pg-borders-radius-pill, 9999px);\n background: var(--pg-colors-chip-background, #e0e7ff);\n color: var(--pg-colors-chip-text, #1e40af);\n font-size: var(--pg-typography-font-size-sm, 12px);\n font-weight: var(--pg-typography-font-weight-medium, 500);\n user-select: none;\n white-space: nowrap;\n transition: opacity 120ms;\n}\n.pg-group-chip--ghost {\n cursor: grabbing;\n}\n.pg-group-chip__label { line-height: 1.2; }\n.pg-group-chip__close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n cursor: pointer;\n opacity: 0.55;\n transition: opacity 100ms, background 100ms;\n flex-shrink: 0;\n}\n.pg-group-chip__close:hover { opacity: 1; background: rgba(30,64,175,0.18); }\n.pg-group-chip__sep {\n display: inline-flex;\n align-items: center;\n color: var(--pg-colors-text-disabled, #94a3b8);\n flex-shrink: 0;\n}\n\n";
9
+ //# sourceMappingURL=group-drop-zone.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"group-drop-zone.css.d.ts","sourceRoot":"","sources":["../../../src/styles/base/group-drop-zone.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,yqJAoK5B,CAAC"}
@@ -0,0 +1,173 @@
1
+ /**
2
+ * Photon Grid base styles — group-drop-zone section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export const groupDropZoneCss = `/* ──────────────────── Group drop zone ──────────────────── */
9
+ .pg-group-drop-zone--top {
10
+ display: flex;
11
+ flex-direction: row;
12
+ align-items: center;
13
+ flex-shrink: 0;
14
+ height: var(--pg-header-row-height, 44px);
15
+ background: var(--pg-colors-header-background, #f8fafc);
16
+ border-bottom: 1px solid var(--pg-colors-border, #e2e8f0);
17
+ overflow: hidden;
18
+ }
19
+ .pg-group-drop-zone--left {
20
+ display: flex;
21
+ flex-direction: column;
22
+ flex-shrink: 0;
23
+ width: 160px;
24
+ background: var(--pg-colors-header-background, #f8fafc);
25
+ border-right: 1px solid var(--pg-colors-border, #e2e8f0);
26
+ overflow: hidden;
27
+ position: relative;
28
+ }
29
+ .pg-group-drop-zone--right {
30
+ display: flex;
31
+ flex-direction: column;
32
+ flex-shrink: 0;
33
+ width: 160px;
34
+ background: var(--pg-colors-header-background, #f8fafc);
35
+ border-left: 1px solid var(--pg-colors-border, #e2e8f0);
36
+ overflow: hidden;
37
+ position: relative;
38
+ }
39
+
40
+ /* Zone header row (grip + "Groups" label) */
41
+ .pg-group-zone-header {
42
+ display: flex;
43
+ align-items: center;
44
+ gap: 6px;
45
+ padding: 4px 10px 4px 8px;
46
+ flex-shrink: 0;
47
+ border-bottom: 1px solid var(--pg-colors-border, #e2e8f0);
48
+ user-select: none;
49
+ }
50
+ .pg-group-zone-grip {
51
+ display: flex;
52
+ align-items: center;
53
+ cursor: grab;
54
+ opacity: 0.45;
55
+ padding: 2px 3px;
56
+ border-radius: 3px;
57
+ color: var(--pg-colors-text-secondary, #64748b);
58
+ flex-shrink: 0;
59
+ transition: opacity 100ms, background 100ms;
60
+ }
61
+ .pg-group-zone-grip:hover { opacity: 0.85; background: rgba(0,0,0,0.06); }
62
+ .pg-group-zone-grip:active { cursor: grabbing; }
63
+ .pg-group-zone-label {
64
+ flex: 1;
65
+ font-size: 11px;
66
+ font-weight: 600;
67
+ text-transform: uppercase;
68
+ letter-spacing: 0.04em;
69
+ color: var(--pg-colors-text-secondary, #64748b);
70
+ user-select: none;
71
+ }
72
+
73
+ /* Chips area (the actual drop target) */
74
+ .pg-group-zone-chips {
75
+ display: flex;
76
+ align-items: center;
77
+ flex-wrap: wrap;
78
+ gap: 6px;
79
+ padding: 6px 10px;
80
+ min-height: 38px;
81
+ flex: 1;
82
+ overflow: auto;
83
+ }
84
+ .pg-group-drop-zone--left .pg-group-zone-chips,
85
+ .pg-group-drop-zone--right .pg-group-zone-chips {
86
+ flex-direction: column;
87
+ align-items: flex-start;
88
+ overflow-y: auto;
89
+ overflow-x: hidden;
90
+ }
91
+ .pg-group-zone-chips--over {
92
+ background: var(--pg-colors-group-zone-over, #eff6ff);
93
+ outline: 1px dashed var(--pg-colors-primary, #2563eb);
94
+ outline-offset: -2px;
95
+ }
96
+
97
+ /* Resize handle */
98
+ .pg-group-drop-zone--top .pg-group-zone-resize {
99
+ height: 4px;
100
+ flex-shrink: 0;
101
+ cursor: ns-resize;
102
+ background: transparent;
103
+ transition: background 100ms;
104
+ }
105
+ .pg-group-drop-zone--top .pg-group-zone-resize:hover { background: var(--pg-colors-primary, #2563eb); opacity: 0.35; }
106
+ .pg-group-drop-zone--left .pg-group-zone-resize {
107
+ position: absolute;
108
+ top: 0; right: 0; bottom: 0;
109
+ width: 4px;
110
+ cursor: ew-resize;
111
+ background: transparent;
112
+ transition: background 100ms;
113
+ }
114
+ .pg-group-drop-zone--right .pg-group-zone-resize {
115
+ position: absolute;
116
+ top: 0; left: 0; bottom: 0;
117
+ width: 4px;
118
+ cursor: ew-resize;
119
+ background: transparent;
120
+ transition: background 100ms;
121
+ }
122
+ .pg-group-drop-zone--left .pg-group-zone-resize:hover,
123
+ .pg-group-drop-zone--right .pg-group-zone-resize:hover { background: var(--pg-colors-primary, #2563eb); opacity: 0.35; }
124
+
125
+ /* Hint text */
126
+ .pg-group-drop-zone__hint {
127
+ font-size: var(--pg-typography-font-size-sm, 12px);
128
+ color: var(--pg-colors-text-disabled, #94a3b8);
129
+ pointer-events: none;
130
+ user-select: none;
131
+ }
132
+
133
+ /* Chips */
134
+ .pg-group-chip {
135
+ display: inline-flex;
136
+ align-items: center;
137
+ gap: 5px;
138
+ padding: 3px 6px 3px 10px;
139
+ border-radius: var(--pg-borders-radius-pill, 9999px);
140
+ background: var(--pg-colors-chip-background, #e0e7ff);
141
+ color: var(--pg-colors-chip-text, #1e40af);
142
+ font-size: var(--pg-typography-font-size-sm, 12px);
143
+ font-weight: var(--pg-typography-font-weight-medium, 500);
144
+ user-select: none;
145
+ white-space: nowrap;
146
+ transition: opacity 120ms;
147
+ }
148
+ .pg-group-chip--ghost {
149
+ cursor: grabbing;
150
+ }
151
+ .pg-group-chip__label { line-height: 1.2; }
152
+ .pg-group-chip__close {
153
+ display: inline-flex;
154
+ align-items: center;
155
+ justify-content: center;
156
+ width: 16px;
157
+ height: 16px;
158
+ border-radius: 50%;
159
+ cursor: pointer;
160
+ opacity: 0.55;
161
+ transition: opacity 100ms, background 100ms;
162
+ flex-shrink: 0;
163
+ }
164
+ .pg-group-chip__close:hover { opacity: 1; background: rgba(30,64,175,0.18); }
165
+ .pg-group-chip__sep {
166
+ display: inline-flex;
167
+ align-items: center;
168
+ color: var(--pg-colors-text-disabled, #94a3b8);
169
+ flex-shrink: 0;
170
+ }
171
+
172
+ `;
173
+ //# sourceMappingURL=group-drop-zone.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"group-drop-zone.css.js","sourceRoot":"","sources":["../../../src/styles/base/group-drop-zone.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoK/B,CAAC"}
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Photon Grid base styles — header section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export declare const headerCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Header rows \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-header-row, .pg-filter-row {\n display: flex;\n align-items: stretch;\n}\n.pg-header-row { height: var(--pg-header-row-height, 44px); }\n.pg-filter-row {\n height: var(--pg-filter-row-height, 36px);\n border-top: 1px solid var(--pg-colors-border, #e2e8f0);\n background: var(--pg-colors-filter-background, #fff);\n}\n.pg-th {\n display: flex;\n align-items: center;\n position: relative;\n flex-shrink: 0;\n padding: 0;\n color: var(--pg-colors-header-text, #374151);\n font-weight: var(--pg-typography-font-weight-semi-bold, 600);\n font-size: var(--pg-typography-font-size-sm, 12px);\n letter-spacing: var(--pg-typography-letter-spacing-wide, 0.025em);\n text-transform: uppercase;\n border-right: 1px solid var(--pg-colors-header-border, #e2e8f0);\n user-select: none;\n cursor: default;\n transition: background var(--pg-transitions-duration-fast, 100ms);\n overflow: hidden;\n min-width: var(--pg-sizing-column-min-width, 40px);\n}\n.pg-th:last-child { border-right: none; }\n.pg-th--sortable { cursor: pointer; }\n// .pg-th:hover, .pg-th.pg-th--sortable:hover { background: var(--pg-colors-header-hover, #f1f5f9); }\n// .pg-th.pg-th--sorted { background: var(--pg-colors-header-hover, #f1f5f9); }\n.pg-th.pg-th--sort-asc .pg-th__sort-icon,\n.pg-th.pg-th--sort-desc .pg-th__sort-icon { color: var(--pg-colors-primary, #2563eb); }\n.pg-th.pg-th--filter-active .pg-th__label { color: var(--pg-colors-primary, #2563eb); }\n.pg-th--checkbox {\n width: 44px;\n min-width: 44px;\n max-width: 44px;\n justify-content: center;\n flex-shrink: 0;\n}\n.pg-th--serial {\n width: 52px;\n min-width: 52px;\n max-width: 52px;\n justify-content: center;\n flex-shrink: 0;\n}\n.pg-th--auto-group {\n flex-shrink: 0;\n background: var(--pg-colors-header-background, #f8fafc);\n border-right: 1px solid var(--pg-colors-border, #e2e8f0);\n font-weight: var(--pg-typography-font-weight-semi-bold, 600);\n font-size: var(--pg-typography-font-size-xs, 11px);\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--pg-colors-text-secondary, #64748b);\n}\n.pg-cell--auto-group-spacer {\n flex-shrink: 0;\n border-right: 1px solid var(--pg-colors-border, #e2e8f0);\n background: transparent;\n}\n.pg-th__content {\n display: flex;\n align-items: center;\n gap: 10px;\n flex: 1;\n min-width: 0;\n padding: 0 10px 0 12px;\n height: 100%;\n}\n.pg-th__label {\n flex: 0 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.pg-th__sort-icon { flex-shrink: 0; opacity: 0; color: var(--pg-colors-text-secondary, #475569); }\n/* Aligned column headers */\n.pg-th--align-right .pg-th__label { text-align: right; }\n.pg-th--align-center .pg-th__label { text-align: center; }\n.pg-th--align-center .pg-th__content,\n.pg-th--no-group .pg-th__content {\n justify-content: center;\n}\n.pg-th--no-group .pg-th__label {\n text-align: center;\n}\n/* Reversed header layout for numeric/currency columns: icons LEFT, text RIGHT */\n.pg-th--reverse { flex-direction: row-reverse; }\n.pg-th--reverse .pg-th__content { flex-direction: row-reverse; padding: 0 12px 0 10px; }\n.pg-th--reverse .pg-th__label { flex: 1 1 auto; }\n.pg-th--reverse .pg-th__filter-btn { margin-right: 0; margin-left: 2px; }\n.pg-th--reverse .pg-th__menu-btn { margin-right: 0; margin-left: 4px; }\n.pg-th--sort-asc .pg-th__sort-icon,\n.pg-th--sort-desc .pg-th__sort-icon { opacity: 1; color: var(--pg-colors-primary, #2563eb); }\n/* \u2500\u2500\u2500 Column header filter button \u2500\u2500\u2500 */\n.pg-th__filter-btn {\n flex-shrink: 0;\n display: none;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n padding: 4px;\n margin-right: 2px;\n border-radius: var(--pg-borders-radius-sm, 4px);\n color: var(--pg-colors-text-secondary, #475569);\n opacity: 0.7;\n transition: opacity var(--pg-transitions-duration-fast, 100ms),\n color var(--pg-transitions-duration-fast, 100ms),\n background var(--pg-transitions-duration-fast, 100ms);\n}\n.pg-th:hover .pg-th__filter-btn,\n.pg-th__filter-btn--active { display: flex; }\n.pg-th__filter-btn:hover { opacity: 1; background: var(--pg-colors-background-alt, #f1f5f9); }\n.pg-th__filter-btn--active {\n opacity: 1;\n color: var(--pg-colors-primary, #2563eb);\n}\n.pg-th__filter-icon { flex-shrink: 0; color: var(--pg-colors-primary, #2563eb); }\n.pg-th__menu-btn {\n flex-shrink: 0;\n display: none;\n cursor: pointer;\n padding: 6px;\n margin-right: 4px;\n border-radius: var(--pg-borders-radius-sm, 4px);\n color: var(--pg-colors-text-secondary, #475569);\n opacity: 0.6;\n transition: opacity var(--pg-transitions-duration-fast, 100ms);\n}\n.pg-th:hover .pg-th__menu-btn,\n.pg-th__menu-btn--active { display: flex; }\n.pg-th__menu-btn:hover { opacity: 1; background: var(--pg-colors-background-alt, #f1f5f9); }\n.pg-th__menu-btn--active { opacity: 1; background: var(--pg-colors-border, #e2e8f0); }\n.pg-th__resize-handle {\n position: absolute;\n right: -1px;\n top: 0;\n width: 6px;\n height: 50%;\n top: 25%;\n cursor: ew-resize;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--pg-colors-resize-handle-color, #d9d9db);\n background: transparent;\n transition: background var(--pg-transitions-duration-fast, 100ms);\n z-index: 5;\n font-size: 10px;\n user-select: none;\n background: #d6d6d6;\n width: 2px;\n}\n.pg-th__resize-handle:hover,\n.pg-th.pg-resizing .pg-th__resize-handle,\n.pg-th--resizing .pg-th__resize-handle {\n // background: var(--pg-colors-resize-handle-active-color, #2563eb);\n}\n\n/* No vertical-borders mode: completely remove the 1px border slot from both headers and cells */\n.pg-grid--no-v-borders .pg-th { border-right: none; }\n.pg-grid--no-v-borders .pg-cell { border-right: none; }\n// .pg-grid--no-v-borders .pg-th__resize-handle {\n// background: var(--pg-colors-resize-handle-color, #e2e8f0);\n// }\n.pg-grid--no-v-borders .pg-th__resize-handle:hover,\n.pg-grid--no-v-borders .pg-th.pg-resizing .pg-th__resize-handle,\n.pg-grid--no-v-borders .pg-th--resizing .pg-th__resize-handle {\n // background: var(--pg-colors-resize-handle-active-color, #2563eb);\n}\n.pg-th__drag-handle {\n position: absolute;\n left: 2px;\n top: 50%;\n transform: translateY(-50%);\n display: none;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 24px;\n cursor: grab;\n color: var(--pg-colors-text-secondary, #475569);\n z-index: 2;\n border-radius: 3px;\n}\n.pg-th:hover .pg-th__drag-handle { display: flex; opacity: 0.5; }\n.pg-th__drag-handle:hover { opacity: 1 !important; background: var(--pg-colors-background-alt, #f1f5f9); }\n.pg-th--dragging { opacity: 0.72; cursor: grabbing !important; }\n.pg-th__serial-label { font-size: 11px; opacity: 0.45; }\n.pg-header-checkbox { cursor: pointer; width: 16px; height: 16px; }\n\n";
9
+ //# sourceMappingURL=header.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"header.css.d.ts","sourceRoot":"","sources":["../../../src/styles/base/header.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,SAAS,yiOAqMrB,CAAC"}
@@ -0,0 +1,206 @@
1
+ /**
2
+ * Photon Grid base styles — header section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export const headerCss = `/* ──────────────────── Header rows ──────────────────── */
9
+ .pg-header-row, .pg-filter-row {
10
+ display: flex;
11
+ align-items: stretch;
12
+ }
13
+ .pg-header-row { height: var(--pg-header-row-height, 44px); }
14
+ .pg-filter-row {
15
+ height: var(--pg-filter-row-height, 36px);
16
+ border-top: 1px solid var(--pg-colors-border, #e2e8f0);
17
+ background: var(--pg-colors-filter-background, #fff);
18
+ }
19
+ .pg-th {
20
+ display: flex;
21
+ align-items: center;
22
+ position: relative;
23
+ flex-shrink: 0;
24
+ padding: 0;
25
+ color: var(--pg-colors-header-text, #374151);
26
+ font-weight: var(--pg-typography-font-weight-semi-bold, 600);
27
+ font-size: var(--pg-typography-font-size-sm, 12px);
28
+ letter-spacing: var(--pg-typography-letter-spacing-wide, 0.025em);
29
+ text-transform: uppercase;
30
+ border-right: 1px solid var(--pg-colors-header-border, #e2e8f0);
31
+ user-select: none;
32
+ cursor: default;
33
+ transition: background var(--pg-transitions-duration-fast, 100ms);
34
+ overflow: hidden;
35
+ min-width: var(--pg-sizing-column-min-width, 40px);
36
+ }
37
+ .pg-th:last-child { border-right: none; }
38
+ .pg-th--sortable { cursor: pointer; }
39
+ // .pg-th:hover, .pg-th.pg-th--sortable:hover { background: var(--pg-colors-header-hover, #f1f5f9); }
40
+ // .pg-th.pg-th--sorted { background: var(--pg-colors-header-hover, #f1f5f9); }
41
+ .pg-th.pg-th--sort-asc .pg-th__sort-icon,
42
+ .pg-th.pg-th--sort-desc .pg-th__sort-icon { color: var(--pg-colors-primary, #2563eb); }
43
+ .pg-th.pg-th--filter-active .pg-th__label { color: var(--pg-colors-primary, #2563eb); }
44
+ .pg-th--checkbox {
45
+ width: 44px;
46
+ min-width: 44px;
47
+ max-width: 44px;
48
+ justify-content: center;
49
+ flex-shrink: 0;
50
+ }
51
+ .pg-th--serial {
52
+ width: 52px;
53
+ min-width: 52px;
54
+ max-width: 52px;
55
+ justify-content: center;
56
+ flex-shrink: 0;
57
+ }
58
+ .pg-th--auto-group {
59
+ flex-shrink: 0;
60
+ background: var(--pg-colors-header-background, #f8fafc);
61
+ border-right: 1px solid var(--pg-colors-border, #e2e8f0);
62
+ font-weight: var(--pg-typography-font-weight-semi-bold, 600);
63
+ font-size: var(--pg-typography-font-size-xs, 11px);
64
+ text-transform: uppercase;
65
+ letter-spacing: 0.04em;
66
+ color: var(--pg-colors-text-secondary, #64748b);
67
+ }
68
+ .pg-cell--auto-group-spacer {
69
+ flex-shrink: 0;
70
+ border-right: 1px solid var(--pg-colors-border, #e2e8f0);
71
+ background: transparent;
72
+ }
73
+ .pg-th__content {
74
+ display: flex;
75
+ align-items: center;
76
+ gap: 10px;
77
+ flex: 1;
78
+ min-width: 0;
79
+ padding: 0 10px 0 12px;
80
+ height: 100%;
81
+ }
82
+ .pg-th__label {
83
+ flex: 0 1 auto;
84
+ min-width: 0;
85
+ overflow: hidden;
86
+ text-overflow: ellipsis;
87
+ white-space: nowrap;
88
+ }
89
+ .pg-th__sort-icon { flex-shrink: 0; opacity: 0; color: var(--pg-colors-text-secondary, #475569); }
90
+ /* Aligned column headers */
91
+ .pg-th--align-right .pg-th__label { text-align: right; }
92
+ .pg-th--align-center .pg-th__label { text-align: center; }
93
+ .pg-th--align-center .pg-th__content,
94
+ .pg-th--no-group .pg-th__content {
95
+ justify-content: center;
96
+ }
97
+ .pg-th--no-group .pg-th__label {
98
+ text-align: center;
99
+ }
100
+ /* Reversed header layout for numeric/currency columns: icons LEFT, text RIGHT */
101
+ .pg-th--reverse { flex-direction: row-reverse; }
102
+ .pg-th--reverse .pg-th__content { flex-direction: row-reverse; padding: 0 12px 0 10px; }
103
+ .pg-th--reverse .pg-th__label { flex: 1 1 auto; }
104
+ .pg-th--reverse .pg-th__filter-btn { margin-right: 0; margin-left: 2px; }
105
+ .pg-th--reverse .pg-th__menu-btn { margin-right: 0; margin-left: 4px; }
106
+ .pg-th--sort-asc .pg-th__sort-icon,
107
+ .pg-th--sort-desc .pg-th__sort-icon { opacity: 1; color: var(--pg-colors-primary, #2563eb); }
108
+ /* ─── Column header filter button ─── */
109
+ .pg-th__filter-btn {
110
+ flex-shrink: 0;
111
+ display: none;
112
+ align-items: center;
113
+ justify-content: center;
114
+ cursor: pointer;
115
+ padding: 4px;
116
+ margin-right: 2px;
117
+ border-radius: var(--pg-borders-radius-sm, 4px);
118
+ color: var(--pg-colors-text-secondary, #475569);
119
+ opacity: 0.7;
120
+ transition: opacity var(--pg-transitions-duration-fast, 100ms),
121
+ color var(--pg-transitions-duration-fast, 100ms),
122
+ background var(--pg-transitions-duration-fast, 100ms);
123
+ }
124
+ .pg-th:hover .pg-th__filter-btn,
125
+ .pg-th__filter-btn--active { display: flex; }
126
+ .pg-th__filter-btn:hover { opacity: 1; background: var(--pg-colors-background-alt, #f1f5f9); }
127
+ .pg-th__filter-btn--active {
128
+ opacity: 1;
129
+ color: var(--pg-colors-primary, #2563eb);
130
+ }
131
+ .pg-th__filter-icon { flex-shrink: 0; color: var(--pg-colors-primary, #2563eb); }
132
+ .pg-th__menu-btn {
133
+ flex-shrink: 0;
134
+ display: none;
135
+ cursor: pointer;
136
+ padding: 6px;
137
+ margin-right: 4px;
138
+ border-radius: var(--pg-borders-radius-sm, 4px);
139
+ color: var(--pg-colors-text-secondary, #475569);
140
+ opacity: 0.6;
141
+ transition: opacity var(--pg-transitions-duration-fast, 100ms);
142
+ }
143
+ .pg-th:hover .pg-th__menu-btn,
144
+ .pg-th__menu-btn--active { display: flex; }
145
+ .pg-th__menu-btn:hover { opacity: 1; background: var(--pg-colors-background-alt, #f1f5f9); }
146
+ .pg-th__menu-btn--active { opacity: 1; background: var(--pg-colors-border, #e2e8f0); }
147
+ .pg-th__resize-handle {
148
+ position: absolute;
149
+ right: -1px;
150
+ top: 0;
151
+ width: 6px;
152
+ height: 50%;
153
+ top: 25%;
154
+ cursor: ew-resize;
155
+ display: flex;
156
+ align-items: center;
157
+ justify-content: center;
158
+ color: var(--pg-colors-resize-handle-color, #d9d9db);
159
+ background: transparent;
160
+ transition: background var(--pg-transitions-duration-fast, 100ms);
161
+ z-index: 5;
162
+ font-size: 10px;
163
+ user-select: none;
164
+ background: #d6d6d6;
165
+ width: 2px;
166
+ }
167
+ .pg-th__resize-handle:hover,
168
+ .pg-th.pg-resizing .pg-th__resize-handle,
169
+ .pg-th--resizing .pg-th__resize-handle {
170
+ // background: var(--pg-colors-resize-handle-active-color, #2563eb);
171
+ }
172
+
173
+ /* No vertical-borders mode: completely remove the 1px border slot from both headers and cells */
174
+ .pg-grid--no-v-borders .pg-th { border-right: none; }
175
+ .pg-grid--no-v-borders .pg-cell { border-right: none; }
176
+ // .pg-grid--no-v-borders .pg-th__resize-handle {
177
+ // background: var(--pg-colors-resize-handle-color, #e2e8f0);
178
+ // }
179
+ .pg-grid--no-v-borders .pg-th__resize-handle:hover,
180
+ .pg-grid--no-v-borders .pg-th.pg-resizing .pg-th__resize-handle,
181
+ .pg-grid--no-v-borders .pg-th--resizing .pg-th__resize-handle {
182
+ // background: var(--pg-colors-resize-handle-active-color, #2563eb);
183
+ }
184
+ .pg-th__drag-handle {
185
+ position: absolute;
186
+ left: 2px;
187
+ top: 50%;
188
+ transform: translateY(-50%);
189
+ display: none;
190
+ align-items: center;
191
+ justify-content: center;
192
+ width: 16px;
193
+ height: 24px;
194
+ cursor: grab;
195
+ color: var(--pg-colors-text-secondary, #475569);
196
+ z-index: 2;
197
+ border-radius: 3px;
198
+ }
199
+ .pg-th:hover .pg-th__drag-handle { display: flex; opacity: 0.5; }
200
+ .pg-th__drag-handle:hover { opacity: 1 !important; background: var(--pg-colors-background-alt, #f1f5f9); }
201
+ .pg-th--dragging { opacity: 0.72; cursor: grabbing !important; }
202
+ .pg-th__serial-label { font-size: 11px; opacity: 0.45; }
203
+ .pg-header-checkbox { cursor: pointer; width: 16px; height: 16px; }
204
+
205
+ `;
206
+ //# sourceMappingURL=header.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"header.css.js","sourceRoot":"","sources":["../../../src/styles/base/header.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqMxB,CAAC"}
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Photon Grid base styles — master-detail section.
3
+ *
4
+ * Auto-split from base-styles.ts. Concatenated back (in order) by
5
+ * base-styles.ts; edit here, not there. Order is preserved because CSS
6
+ * cascade depends on it.
7
+ */
8
+ export declare const masterDetailCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Master/Detail \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n The detail layer is a sibling of the left/center/right body panels, not a\n child of any of them \u2014 that is what lets a detail row span the full grid\n width regardless of pinned columns. Its content wrapper receives only the\n vertical scroll transform (never the horizontal one center columns use),\n so it structurally cannot shift when the user scrolls horizontally. */\n.pg-detail-layer {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n /* Stops short of the vertical scrollbar's *current* column width (0 when\n it's hidden) instead of a blanket inset:0 \u2014 otherwise an expanded\n detail row's opaque background paints over the native scrollbar\n whenever one is showing. See ScrollController.syncScrollbars. */\n right: var(--pg-scrollbar-v-live-width, 0px);\n overflow: hidden;\n pointer-events: none;\n /* Tied with .pg-panel--left/--right's z-index (2, base-styles.ts ~line\n 335) rather than below it \u2014 this layer is a later DOM sibling of the\n panels (mounted after them in GridRenderer.buildLayout), so an equal\n z-index still paints on top per normal stacking-order tie-breaking.\n This is what lets an expanded detail row's opaque background cover the\n pinned panels' own edge box-shadow instead of that shadow bleeding\n across the full-width detail content underneath (the panels are\n full-viewport-height flex items, so their shadow would otherwise span\n every detail row too, not just their own pinned cells). Sticky Master/\n Detail rows are unaffected by this ordering \u2014 they live in the\n independent, always-on-top .pg-sticky-layer below, not here. */\n z-index: 2;\n}\n.pg-detail-layer__content {\n position: relative;\n width: 100%;\n height: 100%;\n transform: translateY(var(--pg-scroll-y, 0px));\n}\n/* Sticky Master/Detail row layer \u2014 a TOP-LEVEL sibling of the left/center/\n right panels and of .pg-detail-layer (not nested inside any of them).\n .pg-panel--left/--right set their own explicit z-index for pinned-column\n elevation, which makes each one its own stacking context \u2014 anything\n nested inside is trapped there and can never out-rank a sibling like\n .pg-detail-layer merely by having a higher z-index of its own. Living at\n this same top level lets one z-index correctly out-rank everything, in\n every pinned/non-pinned column, with no stacking-context surprises.\n The container itself is pointer-events:none (so empty space with no\n sticky row never blocks clicks through to what's underneath); the actual\n row element re-enables pointer-events at the default (auto). */\n.pg-sticky-layer {\n position: absolute;\n top: 0;\n left: 0;\n right: var(--pg-scrollbar-v-live-width, 0px);\n bottom: 0;\n pointer-events: none;\n z-index: 3;\n}\n/* Mirrors .pg-panel--left's own pinned-edge shadow. That shadow lives on the\n panel container itself, which a stuck row's own background paints over\n for its own height once moved into this overlay \u2014 without repeating it\n here, the pinned-edge shadow has a visible gap wherever a sticky row\n currently sits.\n z-index: 2 (matching .pg-panel--left/--right's own z-index, base-styles.ts\n ~line 334) is required, not optional \u2014 this shadow bleeds *rightward*,\n into the center region's own horizontal space, and .pg-sticky-layer__center\n is appended after it in the DOM (see GridRenderer.buildStickyLayer); on\n equal stacking contexts a later sibling paints over an earlier one, so\n without an explicit z-index center's own background silently covers the\n bled-through part of this shadow, while the right shadow (appended last)\n was never affected \u2014 z-index makes both sides correct regardless of\n append order instead of depending on it. */\n.pg-sticky-layer__left {\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: var(--pg-left-panel-width, 0px);\n overflow: hidden;\n box-shadow: 2px 0 4px rgba(0,0,0,0.06);\n z-index: 2;\n}\n.pg-sticky-layer__center {\n position: absolute;\n top: 0;\n left: var(--pg-left-panel-width, 0px);\n right: var(--pg-right-panel-width, 0px);\n height: 100%;\n overflow: hidden;\n z-index: 1;\n}\n/* Mirrors .pg-panel--center .pg-panel__content's horizontal-scroll transform\n so a stuck row's center cells track the user's horizontal scroll exactly\n like the real (non-sticky) center panel does. */\n.pg-sticky-layer__center-inner {\n position: relative;\n height: 100%;\n width: var(--pg-center-content-width, 100%);\n transform: translateX(var(--pg-scroll-x, 0px));\n}\n/* Mirrors .pg-panel--right's own pinned-edge shadow \u2014 see .pg-sticky-layer__left above. */\n.pg-sticky-layer__right {\n position: absolute;\n top: 0;\n right: 0;\n height: 100%;\n width: var(--pg-right-panel-width, 0px);\n overflow: hidden;\n box-shadow: -2px 0 4px rgba(0,0,0,0.06);\n}\n.pg-row--sticky {\n /* The sticky layer container above is pointer-events:none (so empty space\n with no sticky row never blocks clicks through to whatever's underneath)\n \u2014 pointer-events inherits, so without this the row itself, and every\n interactive thing inside it (cells, the tree/group toggle, checkboxes),\n would silently inherit \"none\" and stop responding to clicks entirely. */\n pointer-events: auto;\n}\n.pg-row--detail-container {\n position: absolute;\n left: 0;\n width: 100%;\n box-sizing: border-box;\n overflow: hidden;\n pointer-events: auto;\n padding: 20px;\n background: var(--pg-colors-surface, #fff);\n border-bottom: 1px solid var(--pg-colors-border, #e2e8f0);\n opacity: 1;\n /* Deliberately not tied to the theme's --pg-transitions-duration-* tokens \u2014\n those are tuned for snappy hover/focus feedback elsewhere; expand/collapse\n reads better slightly slower and more deliberate. */\n transition:\n height 340ms cubic-bezier(0.4, 0, 0.2, 1),\n opacity 260ms ease;\n}\n/* Expand: fades in on first mount; height grows for free once RowPositionSheet\n updates from the initial min/cached height to the auto-measured one. */\n.pg-row--detail-container.pg-row--detail-entering {\n opacity: 0;\n}\n/* Collapse: DetailRowRenderer.beginCollapse freezes top/height as inline\n styles first (the RowPositionSheet rule for this row is about to disappear\n for good), then this class plus height: 0 (set in JS) drives the shrink. */\n.pg-row--detail-container.pg-row--detail-collapsing {\n opacity: 0;\n border-bottom-color: transparent;\n}\n.pg-detail-nested-grid-host {\n width: 100%;\n height: 100%;\n}\n.pg-detail-loading {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n color: var(--pg-colors-text-secondary, #64748b);\n}\n.pg-detail-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--pg-group-toggle-size, 24px);\n height: var(--pg-group-toggle-size, 24px);\n margin-left: 8px;\n margin-right: 4px;\n border-radius: var(--pg-borders-radius-sm, 4px);\n color: var(--pg-colors-text-secondary, #64748b);\n cursor: pointer;\n transition:\n background var(--pg-transitions-duration-fast, 100ms),\n color var(--pg-transitions-duration-fast, 100ms);\n}\n.pg-detail-toggle:hover {\n background: var(--pg-colors-row-hover, #f0f7ff);\n color: var(--pg-colors-text-primary, #1e293b);\n}\n.pg-detail-resize-handle {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n height: 6px;\n cursor: row-resize;\n background: transparent;\n transition: background var(--pg-transitions-duration-fast, 100ms);\n}\n.pg-detail-resize-handle:hover {\n background: var(--pg-colors-resize-handle-color, #e2e8f0);\n}\n\n";
9
+ //# sourceMappingURL=master-detail.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"master-detail.css.d.ts","sourceRoot":"","sources":["../../../src/styles/base/master-detail.css.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,02PAiM3B,CAAC"}