@aquera/ngx-smart-table 0.0.17-patch-0.4 → 0.0.17-patch-0.6
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.
- package/esm2020/lib/editors/index.mjs +2 -1
- package/esm2020/lib/editors/nile-chip-editor.mjs +293 -0
- package/esm2020/lib/editors/nile-code-editor.mjs +9 -10
- package/esm2020/lib/formatters/formatter-registry.mjs +21 -0
- package/esm2020/lib/formatters/index.mjs +3 -0
- package/esm2020/lib/formatters/ou-formatter.mjs +96 -0
- package/esm2020/lib/models/base-column-config.class.mjs +13 -6
- package/esm2020/lib/models/column-config.interface.mjs +1 -1
- package/esm2020/lib/renderer/components/st-table/st-table.component.mjs +2 -3
- package/esm2020/lib/renderer/models/cell.class.mjs +14 -8
- package/esm2020/public-api.mjs +5 -1
- package/fesm2015/aquera-ngx-smart-table.mjs +453 -25
- package/fesm2015/aquera-ngx-smart-table.mjs.map +1 -1
- package/fesm2020/aquera-ngx-smart-table.mjs +442 -23
- package/fesm2020/aquera-ngx-smart-table.mjs.map +1 -1
- package/lib/editors/index.d.ts +1 -0
- package/lib/editors/nile-chip-editor.d.ts +94 -0
- package/lib/formatters/formatter-registry.d.ts +13 -0
- package/lib/formatters/index.d.ts +2 -0
- package/lib/formatters/ou-formatter.d.ts +45 -0
- package/lib/models/base-column-config.class.d.ts +1 -1
- package/lib/models/column-config.interface.d.ts +4 -2
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -2211,6 +2211,125 @@ class WorkbookState {
|
|
|
2211
2211
|
}
|
|
2212
2212
|
}
|
|
2213
2213
|
|
|
2214
|
+
/**
|
|
2215
|
+
* Convert an LDAP Distinguished Name (DN) string to a human-readable path.
|
|
2216
|
+
*
|
|
2217
|
+
* @example
|
|
2218
|
+
* "OU=Engineering,OU=India,DC=company,DC=com"
|
|
2219
|
+
* → "Engineering / India (company.com)"
|
|
2220
|
+
*
|
|
2221
|
+
* "CN=John Smith,OU=Admins,OU=Engineering,DC=company,DC=com"
|
|
2222
|
+
* → "John Smith / Admins / Engineering (company.com)"
|
|
2223
|
+
*
|
|
2224
|
+
* "OU=R\\,D,OU=Teams,DC=example,DC=org"
|
|
2225
|
+
* → "R,D / Teams (example.org)"
|
|
2226
|
+
*/
|
|
2227
|
+
function dnToHumanReadable(dn) {
|
|
2228
|
+
if (!/^\s*\S/.test(dn)) {
|
|
2229
|
+
return '';
|
|
2230
|
+
}
|
|
2231
|
+
const pathParts = [];
|
|
2232
|
+
const domainParts = [];
|
|
2233
|
+
for (const match of dn.matchAll(/(?:^|(?<!\\),)\s*(CN|OU|DC)=((?:\\.|[^,])+)/g)) {
|
|
2234
|
+
const key = match[1];
|
|
2235
|
+
const value = match[2]
|
|
2236
|
+
.trim()
|
|
2237
|
+
.replace(/\\([,\\#+<>;"=])/g, '$1');
|
|
2238
|
+
if (/^(?:CN|OU)$/.test(key)) {
|
|
2239
|
+
pathParts.push(value);
|
|
2240
|
+
}
|
|
2241
|
+
else if (/^DC$/.test(key)) {
|
|
2242
|
+
domainParts.push(value);
|
|
2243
|
+
}
|
|
2244
|
+
}
|
|
2245
|
+
const path = pathParts.join(' / ');
|
|
2246
|
+
const domain = domainParts.join('.');
|
|
2247
|
+
return path && domain
|
|
2248
|
+
? `${path} (${domain})`
|
|
2249
|
+
: path || domain || dn;
|
|
2250
|
+
}
|
|
2251
|
+
/**
|
|
2252
|
+
* Cell formatter that converts LDAP Distinguished Name (DN) strings
|
|
2253
|
+
* into human-readable OU paths with optional domain suffix.
|
|
2254
|
+
*
|
|
2255
|
+
* @example
|
|
2256
|
+
* // In column config:
|
|
2257
|
+
* formatter: new OUFormatter()
|
|
2258
|
+
*
|
|
2259
|
+
* // With options:
|
|
2260
|
+
* formatter: new OUFormatter({ separator: ' > ', showDomain: false })
|
|
2261
|
+
*
|
|
2262
|
+
* // Handles arrays from multiselect:
|
|
2263
|
+
* // ['OU=Eng,DC=co,DC=com', 'OU=HR,DC=co,DC=com'] → "Eng (co.com), HR (co.com)"
|
|
2264
|
+
*/
|
|
2265
|
+
class OUFormatter {
|
|
2266
|
+
constructor(options) {
|
|
2267
|
+
this.options = options;
|
|
2268
|
+
}
|
|
2269
|
+
format(value) {
|
|
2270
|
+
var _a, _b;
|
|
2271
|
+
if (Array.isArray(value)) {
|
|
2272
|
+
return value
|
|
2273
|
+
.map(v => this.formatSingle(v))
|
|
2274
|
+
.filter(v => !!v)
|
|
2275
|
+
.join((_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.arraySeparator) !== null && _b !== void 0 ? _b : ', ');
|
|
2276
|
+
}
|
|
2277
|
+
return this.formatSingle(value);
|
|
2278
|
+
}
|
|
2279
|
+
formatSingle(value) {
|
|
2280
|
+
var _a, _b, _c, _d, _e;
|
|
2281
|
+
if (value === null || value === undefined || typeof value !== 'string' || !/^\s*\S/.test(value)) {
|
|
2282
|
+
return (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.emptyText) !== null && _b !== void 0 ? _b : '';
|
|
2283
|
+
}
|
|
2284
|
+
const separator = (_d = (_c = this.options) === null || _c === void 0 ? void 0 : _c.separator) !== null && _d !== void 0 ? _d : ' / ';
|
|
2285
|
+
const showDomain = ((_e = this.options) === null || _e === void 0 ? void 0 : _e.showDomain) !== false;
|
|
2286
|
+
const pathParts = [];
|
|
2287
|
+
const domainParts = [];
|
|
2288
|
+
for (const match of value.matchAll(/(?:^|(?<!\\),)\s*(CN|OU|DC)=((?:\\.|[^,])+)/g)) {
|
|
2289
|
+
const key = match[1];
|
|
2290
|
+
const val = match[2]
|
|
2291
|
+
.trim()
|
|
2292
|
+
.replace(/\\([,\\#+<>;"=])/g, '$1');
|
|
2293
|
+
if (/^(?:CN|OU)$/.test(key)) {
|
|
2294
|
+
pathParts.push(val);
|
|
2295
|
+
}
|
|
2296
|
+
else if (/^DC$/.test(key)) {
|
|
2297
|
+
domainParts.push(val);
|
|
2298
|
+
}
|
|
2299
|
+
}
|
|
2300
|
+
const path = pathParts.join(separator);
|
|
2301
|
+
const domain = domainParts.join('.');
|
|
2302
|
+
if (path && domain && showDomain)
|
|
2303
|
+
return `${path} (${domain})`;
|
|
2304
|
+
if (path)
|
|
2305
|
+
return path;
|
|
2306
|
+
if (domain && showDomain)
|
|
2307
|
+
return domain;
|
|
2308
|
+
return value;
|
|
2309
|
+
}
|
|
2310
|
+
}
|
|
2311
|
+
|
|
2312
|
+
const BUILTIN_FORMATTERS = {
|
|
2313
|
+
ouFormatter: () => new OUFormatter(),
|
|
2314
|
+
};
|
|
2315
|
+
const customFormatters = {};
|
|
2316
|
+
/**
|
|
2317
|
+
* Resolve a formatter by name. Looks up custom formatters first, then built-in.
|
|
2318
|
+
* Returns undefined if the name is not registered.
|
|
2319
|
+
*/
|
|
2320
|
+
function resolveFormatter(name) {
|
|
2321
|
+
var _a;
|
|
2322
|
+
const factory = (_a = customFormatters[name]) !== null && _a !== void 0 ? _a : BUILTIN_FORMATTERS[name];
|
|
2323
|
+
return factory ? factory() : undefined;
|
|
2324
|
+
}
|
|
2325
|
+
/**
|
|
2326
|
+
* Register a custom formatter so it can be referenced by string name
|
|
2327
|
+
* in column configs (e.g. `formatter: 'myFormatter'`).
|
|
2328
|
+
*/
|
|
2329
|
+
function registerFormatter(name, factory) {
|
|
2330
|
+
customFormatters[name] = factory;
|
|
2331
|
+
}
|
|
2332
|
+
|
|
2214
2333
|
/**
|
|
2215
2334
|
* Cell class - represents individual cell instances
|
|
2216
2335
|
* Combines ColumnConfig (Flyweight) with CellState (unique per instance)
|
|
@@ -2276,19 +2395,24 @@ class Cell {
|
|
|
2276
2395
|
* Render cell value as formatted string (delegates to formatter strategy)
|
|
2277
2396
|
*/
|
|
2278
2397
|
render() {
|
|
2279
|
-
var _a, _b;
|
|
2280
|
-
|
|
2398
|
+
var _a, _b, _c;
|
|
2399
|
+
let formatter = this.columnConfig.formatter;
|
|
2400
|
+
if (!formatter) {
|
|
2281
2401
|
return String((_a = this.state.value) !== null && _a !== void 0 ? _a : '');
|
|
2282
2402
|
}
|
|
2283
|
-
if (
|
|
2284
|
-
|
|
2403
|
+
if (typeof formatter === 'string') {
|
|
2404
|
+
formatter = resolveFormatter(formatter);
|
|
2405
|
+
if (!formatter) {
|
|
2406
|
+
return String((_b = this.state.value) !== null && _b !== void 0 ? _b : '');
|
|
2407
|
+
}
|
|
2408
|
+
}
|
|
2409
|
+
if (formatter.formatWithContext) {
|
|
2410
|
+
return formatter.formatWithContext(this.state.value, this.rowData, this.columnConfig.key);
|
|
2285
2411
|
}
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
return this.columnConfig.formatter.format(this.state.value);
|
|
2412
|
+
if (formatter.format) {
|
|
2413
|
+
return formatter.format(this.state.value);
|
|
2289
2414
|
}
|
|
2290
|
-
|
|
2291
|
-
return String((_b = this.state.value) !== null && _b !== void 0 ? _b : '');
|
|
2415
|
+
return String((_c = this.state.value) !== null && _c !== void 0 ? _c : '');
|
|
2292
2416
|
}
|
|
2293
2417
|
/**
|
|
2294
2418
|
* Validate cell value (delegates to validator strategy)
|
|
@@ -2738,7 +2862,9 @@ class BaseColumnConfig {
|
|
|
2738
2862
|
this.key = merged.key;
|
|
2739
2863
|
this.header = merged.header;
|
|
2740
2864
|
this.dataType = merged.dataType;
|
|
2741
|
-
this.formatter = merged.formatter
|
|
2865
|
+
this.formatter = typeof merged.formatter === 'string'
|
|
2866
|
+
? resolveFormatter(merged.formatter)
|
|
2867
|
+
: merged.formatter;
|
|
2742
2868
|
this.validator = merged.validator;
|
|
2743
2869
|
this.editor = merged.editor;
|
|
2744
2870
|
this.parser = merged.parser;
|
|
@@ -2902,11 +3028,15 @@ class BaseColumnConfig {
|
|
|
2902
3028
|
* Format value for display (can be overridden)
|
|
2903
3029
|
*/
|
|
2904
3030
|
formatValue(value, rowData) {
|
|
2905
|
-
|
|
2906
|
-
|
|
2907
|
-
|
|
3031
|
+
let formatter = this.formatter;
|
|
3032
|
+
if (typeof formatter === 'string') {
|
|
3033
|
+
formatter = resolveFormatter(formatter);
|
|
3034
|
+
}
|
|
3035
|
+
if (formatter) {
|
|
3036
|
+
if (formatter.formatWithContext && rowData) {
|
|
3037
|
+
return formatter.formatWithContext(value, rowData, this.key);
|
|
2908
3038
|
}
|
|
2909
|
-
return
|
|
3039
|
+
return formatter.format(value);
|
|
2910
3040
|
}
|
|
2911
3041
|
return String(value !== null && value !== void 0 ? value : '');
|
|
2912
3042
|
}
|
|
@@ -4713,6 +4843,305 @@ class NileDatePickerEditor {
|
|
|
4713
4843
|
}
|
|
4714
4844
|
}
|
|
4715
4845
|
|
|
4846
|
+
/**
|
|
4847
|
+
* Custom editor using NileChip from @aquera/nile-elements
|
|
4848
|
+
* Renders the chip input in a floating popover below the cell to avoid row height mismatch.
|
|
4849
|
+
*
|
|
4850
|
+
* @see https://nile.aqueralabs.com/1.6.3/chip?theme=enterprise
|
|
4851
|
+
*/
|
|
4852
|
+
let chipStylesInjected = false;
|
|
4853
|
+
function injectChipStyles() {
|
|
4854
|
+
if (chipStylesInjected)
|
|
4855
|
+
return;
|
|
4856
|
+
chipStylesInjected = true;
|
|
4857
|
+
const styleId = 'nile-chip-editor-styles';
|
|
4858
|
+
if (document.getElementById(styleId))
|
|
4859
|
+
return;
|
|
4860
|
+
const style = document.createElement('style');
|
|
4861
|
+
style.id = styleId;
|
|
4862
|
+
style.textContent = `
|
|
4863
|
+
.st-chip-popover {
|
|
4864
|
+
position: fixed;
|
|
4865
|
+
z-index: 10000;
|
|
4866
|
+
background: var(--nile-colors-white-base, #fff);
|
|
4867
|
+
border: 1px solid var(--nile-colors-neutral-200, #e2e8f0);
|
|
4868
|
+
border-radius: 6px;
|
|
4869
|
+
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
|
|
4870
|
+
padding: 8px;
|
|
4871
|
+
box-sizing: border-box;
|
|
4872
|
+
max-height: 200px;
|
|
4873
|
+
overflow-y: auto;
|
|
4874
|
+
}
|
|
4875
|
+
.st-chip-popover nile-chip {
|
|
4876
|
+
width: 100%;
|
|
4877
|
+
}
|
|
4878
|
+
.st-chip-popover nile-chip::part(base) {
|
|
4879
|
+
border: none !important;
|
|
4880
|
+
box-shadow: none !important;
|
|
4881
|
+
min-height: 32px;
|
|
4882
|
+
}
|
|
4883
|
+
.st-chip-popover nile-chip::part(input) {
|
|
4884
|
+
font-size: var(--nile-font-size-small, 13px);
|
|
4885
|
+
}
|
|
4886
|
+
`;
|
|
4887
|
+
document.head.appendChild(style);
|
|
4888
|
+
}
|
|
4889
|
+
/**
|
|
4890
|
+
* Custom editor that uses NileChip (tag input) component.
|
|
4891
|
+
* Renders in a floating popover below the cell to avoid expanding row height.
|
|
4892
|
+
*
|
|
4893
|
+
* Cell value is expected to be `string[]` (array of tag strings).
|
|
4894
|
+
*/
|
|
4895
|
+
class NileChipEditor {
|
|
4896
|
+
constructor(options) {
|
|
4897
|
+
this.options = options;
|
|
4898
|
+
this.acceptsInitialKeypress = false;
|
|
4899
|
+
this.eventListeners = [];
|
|
4900
|
+
this.trackedValues = [];
|
|
4901
|
+
}
|
|
4902
|
+
edit(context) {
|
|
4903
|
+
var _a, _b;
|
|
4904
|
+
if (!context.container) {
|
|
4905
|
+
console.warn('NileChipEditor requires a container element');
|
|
4906
|
+
return;
|
|
4907
|
+
}
|
|
4908
|
+
injectChipStyles();
|
|
4909
|
+
this.cellContainer = context.container;
|
|
4910
|
+
// Create the floating popover
|
|
4911
|
+
this.popover = document.createElement('div');
|
|
4912
|
+
this.popover.className = 'st-chip-popover';
|
|
4913
|
+
// Create nile-chip inside the popover
|
|
4914
|
+
this.chip = document.createElement('nile-chip');
|
|
4915
|
+
this.chip.className = 'st-cell-editor st-nile-chip-editor';
|
|
4916
|
+
this.setInitialValue(context.value);
|
|
4917
|
+
this.applyOptions();
|
|
4918
|
+
this.popover.appendChild(this.chip);
|
|
4919
|
+
// Apply custom max-height if provided
|
|
4920
|
+
if ((_a = this.options) === null || _a === void 0 ? void 0 : _a.popoverMaxHeight) {
|
|
4921
|
+
this.popover.style.maxHeight = `${this.options.popoverMaxHeight}px`;
|
|
4922
|
+
}
|
|
4923
|
+
// Append popover to body and position it
|
|
4924
|
+
document.body.appendChild(this.popover);
|
|
4925
|
+
this.positionPopover();
|
|
4926
|
+
this.setupEventListeners(context);
|
|
4927
|
+
if (((_b = this.options) === null || _b === void 0 ? void 0 : _b.autoFocus) !== false) {
|
|
4928
|
+
setTimeout(() => {
|
|
4929
|
+
var _a;
|
|
4930
|
+
try {
|
|
4931
|
+
(_a = this.chip) === null || _a === void 0 ? void 0 : _a.focus();
|
|
4932
|
+
}
|
|
4933
|
+
catch ( /* ignore */_b) { /* ignore */ }
|
|
4934
|
+
}, 0);
|
|
4935
|
+
}
|
|
4936
|
+
}
|
|
4937
|
+
positionPopover() {
|
|
4938
|
+
var _a, _b;
|
|
4939
|
+
if (!this.popover || !this.cellContainer)
|
|
4940
|
+
return;
|
|
4941
|
+
const rect = this.cellContainer.getBoundingClientRect();
|
|
4942
|
+
const minWidth = (_b = (_a = this.options) === null || _a === void 0 ? void 0 : _a.popoverMinWidth) !== null && _b !== void 0 ? _b : rect.width;
|
|
4943
|
+
const popoverWidth = Math.max(minWidth, rect.width);
|
|
4944
|
+
this.popover.style.top = `${rect.bottom + 2}px`;
|
|
4945
|
+
this.popover.style.left = `${rect.left}px`;
|
|
4946
|
+
this.popover.style.width = `${popoverWidth}px`;
|
|
4947
|
+
// After rendering, check if it goes off-screen bottom and flip above if needed
|
|
4948
|
+
requestAnimationFrame(() => {
|
|
4949
|
+
if (!this.popover)
|
|
4950
|
+
return;
|
|
4951
|
+
const popRect = this.popover.getBoundingClientRect();
|
|
4952
|
+
if (popRect.bottom > window.innerHeight) {
|
|
4953
|
+
this.popover.style.top = `${rect.top - popRect.height - 2}px`;
|
|
4954
|
+
}
|
|
4955
|
+
});
|
|
4956
|
+
}
|
|
4957
|
+
setInitialValue(value) {
|
|
4958
|
+
if (!this.chip)
|
|
4959
|
+
return;
|
|
4960
|
+
if (Array.isArray(value)) {
|
|
4961
|
+
this.trackedValues = [...value];
|
|
4962
|
+
this.chip.value = this.trackedValues;
|
|
4963
|
+
}
|
|
4964
|
+
else if (typeof value === 'string' && value) {
|
|
4965
|
+
this.trackedValues = [value];
|
|
4966
|
+
this.chip.value = this.trackedValues;
|
|
4967
|
+
}
|
|
4968
|
+
else {
|
|
4969
|
+
this.trackedValues = [];
|
|
4970
|
+
this.chip.value = [];
|
|
4971
|
+
}
|
|
4972
|
+
}
|
|
4973
|
+
applyOptions() {
|
|
4974
|
+
if (!this.chip || !this.options)
|
|
4975
|
+
return;
|
|
4976
|
+
if (this.options.placeholder) {
|
|
4977
|
+
this.chip.placeholder = this.options.placeholder;
|
|
4978
|
+
}
|
|
4979
|
+
if (this.options.label) {
|
|
4980
|
+
this.chip.label = this.options.label;
|
|
4981
|
+
}
|
|
4982
|
+
if (this.options.helpText) {
|
|
4983
|
+
this.chip.helpText = this.options.helpText;
|
|
4984
|
+
}
|
|
4985
|
+
if (this.options.disabled !== undefined) {
|
|
4986
|
+
this.chip.disabled = this.options.disabled;
|
|
4987
|
+
}
|
|
4988
|
+
if (this.options.readonly !== undefined) {
|
|
4989
|
+
this.chip.readonly = this.options.readonly;
|
|
4990
|
+
}
|
|
4991
|
+
if (this.options.acceptUserInput !== undefined) {
|
|
4992
|
+
this.chip.acceptUserInput = this.options.acceptUserInput;
|
|
4993
|
+
}
|
|
4994
|
+
if (this.options.noDuplicates !== undefined) {
|
|
4995
|
+
this.chip.noDuplicates = this.options.noDuplicates;
|
|
4996
|
+
}
|
|
4997
|
+
if (this.options.clearable !== undefined) {
|
|
4998
|
+
this.chip.clearable = this.options.clearable;
|
|
4999
|
+
}
|
|
5000
|
+
if (this.options.noWrap !== undefined) {
|
|
5001
|
+
this.chip.noWrap = this.options.noWrap;
|
|
5002
|
+
}
|
|
5003
|
+
if (this.options.noAutoComplete !== undefined) {
|
|
5004
|
+
this.chip.noAutoComplete = this.options.noAutoComplete;
|
|
5005
|
+
}
|
|
5006
|
+
if (this.options.enableVirtualScroll !== undefined) {
|
|
5007
|
+
this.chip.enableVirtualScroll = this.options.enableVirtualScroll;
|
|
5008
|
+
}
|
|
5009
|
+
if (this.options.openDropdownOnFocus !== undefined) {
|
|
5010
|
+
this.chip.openDropdownOnFocus = this.options.openDropdownOnFocus;
|
|
5011
|
+
}
|
|
5012
|
+
if (this.options.loading !== undefined) {
|
|
5013
|
+
this.chip.loading = this.options.loading;
|
|
5014
|
+
}
|
|
5015
|
+
// Visual states
|
|
5016
|
+
if (this.options.warning !== undefined) {
|
|
5017
|
+
this.chip.warning = this.options.warning;
|
|
5018
|
+
}
|
|
5019
|
+
if (this.options.error !== undefined) {
|
|
5020
|
+
this.chip.error = this.options.error;
|
|
5021
|
+
}
|
|
5022
|
+
if (this.options.success !== undefined) {
|
|
5023
|
+
this.chip.success = this.options.success;
|
|
5024
|
+
}
|
|
5025
|
+
if (this.options.errorMessage) {
|
|
5026
|
+
this.chip.errorMessage = this.options.errorMessage;
|
|
5027
|
+
}
|
|
5028
|
+
if (this.options.errorIndexes) {
|
|
5029
|
+
this.chip.errorIndexes = this.options.errorIndexes;
|
|
5030
|
+
}
|
|
5031
|
+
// Autocomplete options
|
|
5032
|
+
if (this.options.autoCompleteOptions) {
|
|
5033
|
+
const opts = this.options.autoCompleteOptions;
|
|
5034
|
+
const stringOpts = opts.map(o => { var _a; return typeof o === 'string' ? o : ((_a = o.label) !== null && _a !== void 0 ? _a : o.value); });
|
|
5035
|
+
this.chip.autoCompleteOptions = stringOpts;
|
|
5036
|
+
}
|
|
5037
|
+
if (this.options.filterFunction) {
|
|
5038
|
+
this.chip.filterFunction = this.options.filterFunction;
|
|
5039
|
+
}
|
|
5040
|
+
if (this.options.renderItemFunction) {
|
|
5041
|
+
this.chip.renderItemFunction = this.options.renderItemFunction;
|
|
5042
|
+
}
|
|
5043
|
+
}
|
|
5044
|
+
addListener(element, event, handler, capture) {
|
|
5045
|
+
element.addEventListener(event, handler, capture);
|
|
5046
|
+
this.eventListeners.push({ element, event, handler, capture });
|
|
5047
|
+
}
|
|
5048
|
+
setupEventListeners(context) {
|
|
5049
|
+
if (!this.chip)
|
|
5050
|
+
return;
|
|
5051
|
+
// Track chip changes
|
|
5052
|
+
this.addListener(this.chip, 'nile-chip-change', (e) => {
|
|
5053
|
+
var _a;
|
|
5054
|
+
const detail = e.detail;
|
|
5055
|
+
const newValue = Array.isArray(detail === null || detail === void 0 ? void 0 : detail.value) ? [...detail.value] : (((_a = this.chip) === null || _a === void 0 ? void 0 : _a.value) ? [...this.chip.value] : []);
|
|
5056
|
+
this.trackedValues = newValue;
|
|
5057
|
+
context.onChange(newValue);
|
|
5058
|
+
});
|
|
5059
|
+
// Keyboard handling on the chip element
|
|
5060
|
+
this.addListener(this.chip, 'keydown', (e) => {
|
|
5061
|
+
const keyEvent = e;
|
|
5062
|
+
if (keyEvent.key === 'Enter') {
|
|
5063
|
+
keyEvent.stopPropagation();
|
|
5064
|
+
}
|
|
5065
|
+
else if (keyEvent.key === 'Escape') {
|
|
5066
|
+
keyEvent.preventDefault();
|
|
5067
|
+
keyEvent.stopPropagation();
|
|
5068
|
+
context.onCancel();
|
|
5069
|
+
}
|
|
5070
|
+
else if (keyEvent.key === 'Tab') {
|
|
5071
|
+
keyEvent.preventDefault();
|
|
5072
|
+
keyEvent.stopPropagation();
|
|
5073
|
+
context.onSave(this.getCurrentValue());
|
|
5074
|
+
}
|
|
5075
|
+
});
|
|
5076
|
+
// Click-outside: save when clicking anywhere outside the popover
|
|
5077
|
+
let saveTriggered = false;
|
|
5078
|
+
const mousedownHandler = (e) => {
|
|
5079
|
+
var _a;
|
|
5080
|
+
if (saveTriggered)
|
|
5081
|
+
return;
|
|
5082
|
+
if (!this.popover)
|
|
5083
|
+
return;
|
|
5084
|
+
const path = e.composedPath();
|
|
5085
|
+
for (const el of path) {
|
|
5086
|
+
if (el === this.popover)
|
|
5087
|
+
return;
|
|
5088
|
+
if (el === this.chip)
|
|
5089
|
+
return;
|
|
5090
|
+
if (el instanceof HTMLElement) {
|
|
5091
|
+
if (((_a = el.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'nile-chip')
|
|
5092
|
+
return;
|
|
5093
|
+
if (el.className && typeof el.className === 'string' && el.className.includes('nile-chip'))
|
|
5094
|
+
return;
|
|
5095
|
+
}
|
|
5096
|
+
}
|
|
5097
|
+
saveTriggered = true;
|
|
5098
|
+
context.onSave(this.getCurrentValue());
|
|
5099
|
+
};
|
|
5100
|
+
document.addEventListener('mousedown', mousedownHandler, true);
|
|
5101
|
+
this._documentMousedownHandler = mousedownHandler;
|
|
5102
|
+
// Reposition on scroll/resize so popover stays aligned with the cell
|
|
5103
|
+
const reposition = () => this.positionPopover();
|
|
5104
|
+
this.addListener(window, 'resize', reposition);
|
|
5105
|
+
this.addListener(window, 'scroll', reposition, true);
|
|
5106
|
+
}
|
|
5107
|
+
destroy() {
|
|
5108
|
+
// Remove document mousedown handler
|
|
5109
|
+
if (this._documentMousedownHandler) {
|
|
5110
|
+
document.removeEventListener('mousedown', this._documentMousedownHandler, true);
|
|
5111
|
+
delete this._documentMousedownHandler;
|
|
5112
|
+
}
|
|
5113
|
+
// Remove all tracked listeners
|
|
5114
|
+
for (const { element, event, handler, capture } of this.eventListeners) {
|
|
5115
|
+
element.removeEventListener(event, handler, capture);
|
|
5116
|
+
}
|
|
5117
|
+
this.eventListeners = [];
|
|
5118
|
+
// Remove the popover from the DOM
|
|
5119
|
+
if (this.popover) {
|
|
5120
|
+
this.popover.remove();
|
|
5121
|
+
this.popover = undefined;
|
|
5122
|
+
}
|
|
5123
|
+
this.chip = undefined;
|
|
5124
|
+
this.cellContainer = undefined;
|
|
5125
|
+
this.trackedValues = [];
|
|
5126
|
+
}
|
|
5127
|
+
focus() {
|
|
5128
|
+
var _a;
|
|
5129
|
+
try {
|
|
5130
|
+
(_a = this.chip) === null || _a === void 0 ? void 0 : _a.focus();
|
|
5131
|
+
}
|
|
5132
|
+
catch ( /* ignore */_b) { /* ignore */ }
|
|
5133
|
+
}
|
|
5134
|
+
getCurrentValue() {
|
|
5135
|
+
if (this.trackedValues.length > 0) {
|
|
5136
|
+
return [...this.trackedValues];
|
|
5137
|
+
}
|
|
5138
|
+
if (!this.chip)
|
|
5139
|
+
return [];
|
|
5140
|
+
const val = this.chip.value;
|
|
5141
|
+
return Array.isArray(val) ? [...val] : [];
|
|
5142
|
+
}
|
|
5143
|
+
}
|
|
5144
|
+
|
|
4716
5145
|
/**
|
|
4717
5146
|
* Custom editor using NileCodeEditor from @aquera/nile-elements
|
|
4718
5147
|
* This provides code editing capabilities with syntax highlighting for table cells
|
|
@@ -4854,7 +5283,7 @@ class NileCodeEditor {
|
|
|
4854
5283
|
this.syncingFromDialog = false; // Flag to prevent inline editor from overwriting multiline content
|
|
4855
5284
|
this.userEditedInline = false; // Flag to track if user has typed in inline editor
|
|
4856
5285
|
this.dialogOriginalValue = ''; // Store original value when dialog opens
|
|
4857
|
-
this.dialogCurrentValue =
|
|
5286
|
+
this.dialogCurrentValue = null; // Track current value in dialog
|
|
4858
5287
|
}
|
|
4859
5288
|
edit(context) {
|
|
4860
5289
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
@@ -5136,7 +5565,7 @@ class NileCodeEditor {
|
|
|
5136
5565
|
getDialogEditorValue() {
|
|
5137
5566
|
var _a;
|
|
5138
5567
|
// Use tracked value from change events (most reliable)
|
|
5139
|
-
if (this.dialogCurrentValue) {
|
|
5568
|
+
if (this.dialogCurrentValue !== null && this.dialogCurrentValue !== undefined) {
|
|
5140
5569
|
return this.dialogCurrentValue.replace(/\n+$/, '');
|
|
5141
5570
|
}
|
|
5142
5571
|
if (!this.dialogEditor)
|
|
@@ -5166,10 +5595,9 @@ class NileCodeEditor {
|
|
|
5166
5595
|
var _a, _b;
|
|
5167
5596
|
if (!this.dialogOpen)
|
|
5168
5597
|
return;
|
|
5169
|
-
//
|
|
5598
|
+
// Always read live dialog editor state to avoid stale tracked values from debounced updates
|
|
5170
5599
|
let dialogValue = this.dialogCurrentValue;
|
|
5171
|
-
|
|
5172
|
-
if (!dialogValue && this.dialogEditor) {
|
|
5600
|
+
if (this.dialogEditor) {
|
|
5173
5601
|
try {
|
|
5174
5602
|
const shadowRoot = this.dialogEditor.shadowRoot;
|
|
5175
5603
|
if (shadowRoot) {
|
|
@@ -5183,12 +5611,12 @@ class NileCodeEditor {
|
|
|
5183
5611
|
// Fall through
|
|
5184
5612
|
}
|
|
5185
5613
|
// Fallback to value property
|
|
5186
|
-
if (
|
|
5614
|
+
if (dialogValue === null || dialogValue === undefined) {
|
|
5187
5615
|
dialogValue = (_b = this.dialogEditor.value) !== null && _b !== void 0 ? _b : '';
|
|
5188
5616
|
}
|
|
5189
5617
|
}
|
|
5190
5618
|
// Strip trailing newlines
|
|
5191
|
-
dialogValue = (dialogValue
|
|
5619
|
+
dialogValue = (dialogValue !== null && dialogValue !== void 0 ? dialogValue : '').replace(/\n+$/, '');
|
|
5192
5620
|
// Update tracked value and inline editor
|
|
5193
5621
|
this.trackedValue = dialogValue;
|
|
5194
5622
|
this.userEditedInline = false;
|
|
@@ -5230,7 +5658,7 @@ class NileCodeEditor {
|
|
|
5230
5658
|
*/
|
|
5231
5659
|
closeDialogUI() {
|
|
5232
5660
|
this.dialogOpen = false;
|
|
5233
|
-
this.dialogCurrentValue =
|
|
5661
|
+
this.dialogCurrentValue = null;
|
|
5234
5662
|
if (this.dialog) {
|
|
5235
5663
|
this.dialog.open = false;
|
|
5236
5664
|
const dialogRef = this.dialog;
|
|
@@ -5482,7 +5910,7 @@ class NileCodeEditor {
|
|
|
5482
5910
|
this.trackedValue = null;
|
|
5483
5911
|
this.userEditedInline = false;
|
|
5484
5912
|
this.dialogOriginalValue = '';
|
|
5485
|
-
this.dialogCurrentValue =
|
|
5913
|
+
this.dialogCurrentValue = null;
|
|
5486
5914
|
}
|
|
5487
5915
|
focus() {
|
|
5488
5916
|
var _a;
|
|
@@ -8785,7 +9213,7 @@ class StTableComponent {
|
|
|
8785
9213
|
const oldGrid = this.internalCellGrid;
|
|
8786
9214
|
this.internalCellGrid = this.data.map((rowData, rowIndex) => columns.map((column, colIndex) => {
|
|
8787
9215
|
var _a;
|
|
8788
|
-
const newCell =
|
|
9216
|
+
const newCell = column.createCell(rowData, rowIndex);
|
|
8789
9217
|
const oldCell = (_a = oldGrid === null || oldGrid === void 0 ? void 0 : oldGrid[rowIndex]) === null || _a === void 0 ? void 0 : _a[colIndex];
|
|
8790
9218
|
if (oldCell && oldCell.getColumnConfig().key === column.key) {
|
|
8791
9219
|
oldCell.setReplacement(newCell);
|
|
@@ -13210,5 +13638,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
13210
13638
|
* Generated bundle index. Do not edit.
|
|
13211
13639
|
*/
|
|
13212
13640
|
|
|
13213
|
-
export { ArrayFormatter, AutosaveService, BaseColumnConfig, BooleanEditor, BooleanFormatter, BuilderPreviewComponent, BuilderToolbarComponent, Cell, CellAlignment, CellDataType, CellLifecycleState, CellVerticalAlignment, ChainValidator, ClickOutsideDirective, ColumnConfigFactory, ColumnEditorComponent, ColumnListComponent, Columns, CurrencyFormatter, DEFAULT_AUTOSAVE_CONFIG, DEFAULT_COLUMN_CONFIG, DEFAULT_TABLE_CONFIG, DateEditor, DateFormatter, DateRangeValidator, DefaultFormatter, DefinitionBuilderComponent, DefinitionBuilderModule, DefinitionBuilderService, DefinitionExportService, DefinitionImportService, EditMode, EmailValidator, FilterOperator, FunctionFormatter, FunctionValidator, JsonSchemaValidatorService, LengthValidator, NavigationDirection, NavigationKey, NileAutoCompleteEditor, NileCalendarEditor, NileCodeEditor, NileDatePickerEditor, NileInputEditor, NileSelectEditor, NumberEditor, NumberFormatter, PatternValidators, PercentageFormatter, RangeValidator, RegexValidator, RequiredValidator, RowValidationService, SampleDataGeneratorService, SelectEditor, SharedTableComponentsModule, SheetState, SimpleColumnConfig, SmartTableModule, SortDirection, StAddColumnButtonComponent, StCellComponent, StColumnEditorModalComponent, StColumnFilterComponent, StColumnMenuDropdownComponent, StColumnResizeDirective, StColumnVisibilityComponent, StHeaderComponent, StKeyboardNavigationDirective, StPaginationComponent, StRowActionsDropdownComponent, StSheetActionsComponent, StSheetComponent, StTableActionsComponent, StTableComponent, StWorkbookComponent, StringFormatter, TableConfigEditorComponent, TableState, TableZIndex, TemplateFormatter, TextAreaEditor, TextEditor, UrlValidator, ValidationLoggerService, VirtualScrollService, WorkbookState, canEdit, createCellState, createMemento, isCellValid, isDisplayMode, isNullOrUndefined, isValidDate, isValidationSuccess, mergeTableConfig, restoreFromMemento };
|
|
13641
|
+
export { ArrayFormatter, AutosaveService, BaseColumnConfig, BooleanEditor, BooleanFormatter, BuilderPreviewComponent, BuilderToolbarComponent, Cell, CellAlignment, CellDataType, CellLifecycleState, CellVerticalAlignment, ChainValidator, ClickOutsideDirective, ColumnConfigFactory, ColumnEditorComponent, ColumnListComponent, Columns, CurrencyFormatter, DEFAULT_AUTOSAVE_CONFIG, DEFAULT_COLUMN_CONFIG, DEFAULT_TABLE_CONFIG, DateEditor, DateFormatter, DateRangeValidator, DefaultFormatter, DefinitionBuilderComponent, DefinitionBuilderModule, DefinitionBuilderService, DefinitionExportService, DefinitionImportService, EditMode, EmailValidator, FilterOperator, FunctionFormatter, FunctionValidator, JsonSchemaValidatorService, LengthValidator, NavigationDirection, NavigationKey, NileAutoCompleteEditor, NileCalendarEditor, NileChipEditor, NileCodeEditor, NileDatePickerEditor, NileInputEditor, NileSelectEditor, NumberEditor, NumberFormatter, OUFormatter, PatternValidators, PercentageFormatter, RangeValidator, RegexValidator, RequiredValidator, RowValidationService, SampleDataGeneratorService, SelectEditor, SharedTableComponentsModule, SheetState, SimpleColumnConfig, SmartTableModule, SortDirection, StAddColumnButtonComponent, StCellComponent, StColumnEditorModalComponent, StColumnFilterComponent, StColumnMenuDropdownComponent, StColumnResizeDirective, StColumnVisibilityComponent, StHeaderComponent, StKeyboardNavigationDirective, StPaginationComponent, StRowActionsDropdownComponent, StSheetActionsComponent, StSheetComponent, StTableActionsComponent, StTableComponent, StWorkbookComponent, StringFormatter, TableConfigEditorComponent, TableState, TableZIndex, TemplateFormatter, TextAreaEditor, TextEditor, UrlValidator, ValidationLoggerService, VirtualScrollService, WorkbookState, canEdit, createCellState, createMemento, dnToHumanReadable, isCellValid, isDisplayMode, isNullOrUndefined, isValidDate, isValidationSuccess, mergeTableConfig, registerFormatter, resolveFormatter, restoreFromMemento };
|
|
13214
13642
|
//# sourceMappingURL=aquera-ngx-smart-table.mjs.map
|