x4js 2.0.7 → 2.0.8

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 (112) hide show
  1. package/lib/types/x4.d.ts +6144 -178
  2. package/package.json +5 -1
  3. package/build/x4.css +0 -1
  4. package/build/x4.js +0 -1
  5. package/scripts/build.mjs +0 -362
  6. package/scripts/prepack.mjs +0 -51
  7. package/src/components/base.scss +0 -26
  8. package/src/components/boxes/boxes.module.scss +0 -37
  9. package/src/components/boxes/boxes.ts +0 -125
  10. package/src/components/btngroup/btngroup.module.scss +0 -29
  11. package/src/components/btngroup/btngroup.ts +0 -106
  12. package/src/components/button/button.module.scss +0 -154
  13. package/src/components/button/button.ts +0 -117
  14. package/src/components/calendar/calendar-check-sharp-light.svg +0 -1
  15. package/src/components/calendar/calendar.module.scss +0 -163
  16. package/src/components/calendar/calendar.ts +0 -326
  17. package/src/components/calendar/chevron-left-sharp-light.svg +0 -1
  18. package/src/components/calendar/chevron-right-sharp-light.svg +0 -1
  19. package/src/components/checkbox/check.svg +0 -4
  20. package/src/components/checkbox/checkbox.module.scss +0 -142
  21. package/src/components/checkbox/checkbox.ts +0 -125
  22. package/src/components/colorinput/colorinput.module.scss +0 -65
  23. package/src/components/colorinput/colorinput.ts +0 -88
  24. package/src/components/colorinput/crosshairs-simple-sharp-light.svg +0 -1
  25. package/src/components/colorpicker/colorpicker.module.scss +0 -133
  26. package/src/components/colorpicker/colorpicker.ts +0 -477
  27. package/src/components/combobox/combobox.module.scss +0 -121
  28. package/src/components/combobox/combobox.ts +0 -190
  29. package/src/components/combobox/updown.svg +0 -4
  30. package/src/components/dialog/dialog.module.scss +0 -71
  31. package/src/components/dialog/dialog.ts +0 -91
  32. package/src/components/dialog/xmark-sharp-light.svg +0 -1
  33. package/src/components/form/form.module.scss +0 -34
  34. package/src/components/form/form.ts +0 -36
  35. package/src/components/header/header.module.scss +0 -40
  36. package/src/components/header/header.ts +0 -124
  37. package/src/components/icon/icon.module.scss +0 -30
  38. package/src/components/icon/icon.ts +0 -134
  39. package/src/components/image/image.module.scss +0 -21
  40. package/src/components/image/image.ts +0 -67
  41. package/src/components/input/input.module.scss +0 -69
  42. package/src/components/input/input.ts +0 -274
  43. package/src/components/label/label.module.scss +0 -52
  44. package/src/components/label/label.ts +0 -55
  45. package/src/components/listbox/listbox.module.scss +0 -103
  46. package/src/components/listbox/listbox.ts +0 -427
  47. package/src/components/menu/caret-right-solid.svg +0 -1
  48. package/src/components/menu/menu.module.scss +0 -108
  49. package/src/components/menu/menu.ts +0 -168
  50. package/src/components/messages/circle-exclamation.svg +0 -1
  51. package/src/components/messages/messages.module.scss +0 -47
  52. package/src/components/messages/messages.ts +0 -64
  53. package/src/components/normalize.scss +0 -386
  54. package/src/components/notification/circle-check-solid.svg +0 -1
  55. package/src/components/notification/circle-exclamation-solid.svg +0 -1
  56. package/src/components/notification/circle-notch-light.svg +0 -1
  57. package/src/components/notification/notification.module.scss +0 -82
  58. package/src/components/notification/notification.ts +0 -108
  59. package/src/components/notification/xmark-sharp-light.svg +0 -1
  60. package/src/components/panel/panel.module.scss +0 -48
  61. package/src/components/panel/panel.ts +0 -57
  62. package/src/components/popup/popup.module.scss +0 -43
  63. package/src/components/popup/popup.ts +0 -395
  64. package/src/components/progress/progress.module.scss +0 -57
  65. package/src/components/progress/progress.ts +0 -43
  66. package/src/components/rating/rating.module.scss +0 -23
  67. package/src/components/rating/rating.ts +0 -125
  68. package/src/components/rating/star-sharp-light.svg +0 -1
  69. package/src/components/rating/star-sharp-solid.svg +0 -1
  70. package/src/components/shared.scss +0 -76
  71. package/src/components/sizers/sizer.module.scss +0 -90
  72. package/src/components/sizers/sizer.ts +0 -120
  73. package/src/components/slider/slider.module.scss +0 -71
  74. package/src/components/slider/slider.ts +0 -143
  75. package/src/components/switch/switch.module.scss +0 -127
  76. package/src/components/switch/switch.ts +0 -56
  77. package/src/components/tabs/tabs.module.scss +0 -46
  78. package/src/components/tabs/tabs.ts +0 -157
  79. package/src/components/textarea/textarea.module.scss +0 -59
  80. package/src/components/textarea/textarea.ts +0 -54
  81. package/src/components/textedit/textedit.module.scss +0 -114
  82. package/src/components/textedit/textedit.ts +0 -82
  83. package/src/components/themes.scss +0 -77
  84. package/src/components/tooltips/circle-info-sharp-light.svg +0 -1
  85. package/src/components/tooltips/tooltips.scss +0 -51
  86. package/src/components/tooltips/tooltips.ts +0 -103
  87. package/src/components/treeview/chevron-down-light.svg +0 -1
  88. package/src/components/treeview/treeview.module.scss +0 -116
  89. package/src/components/treeview/treeview.ts +0 -403
  90. package/src/components/viewport/viewport.module.scss +0 -25
  91. package/src/components/viewport/viewport.ts +0 -38
  92. package/src/core/component.ts +0 -979
  93. package/src/core/core_colors.ts +0 -250
  94. package/src/core/core_dom.ts +0 -471
  95. package/src/core/core_dragdrop.ts +0 -201
  96. package/src/core/core_element.ts +0 -98
  97. package/src/core/core_events.ts +0 -149
  98. package/src/core/core_i18n.ts +0 -377
  99. package/src/core/core_router.ts +0 -221
  100. package/src/core/core_styles.ts +0 -215
  101. package/src/core/core_svg.ts +0 -550
  102. package/src/core/core_tools.ts +0 -673
  103. package/src/demo/assets/house-light.svg +0 -1
  104. package/src/demo/assets/radio.svg +0 -4
  105. package/src/demo/index.html +0 -12
  106. package/src/demo/main.scss +0 -21
  107. package/src/demo/main.tsx +0 -323
  108. package/src/x4.scss +0 -19
  109. package/tsconfig.json +0 -14
  110. package/types/scss.d.ts +0 -4
  111. package/types/svg.d.ts +0 -4
  112. package/types/x4react.d.ts +0 -9
@@ -1,201 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file core_dragdrop.ts
9
- * @author Etienne Cochard
10
- *
11
- * @copyright (c) 2024 R-libre ingenierie
12
- *
13
- * Use of this source code is governed by an MIT-style license
14
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
15
- **/
16
-
17
- import { Component } from './component';
18
- import { Point } from './core_tools';
19
-
20
- const x_drag_cb = Symbol( 'x-drag-cb' );
21
-
22
- interface DropInfo {
23
- pt: Point;
24
- data: DataTransfer;
25
- }
26
-
27
- type DropCallback = ( command: 'enter' | 'leave' | 'drag' | 'drop', el: Component, infos: DropInfo ) => void;
28
- type FilterCallback = ( el: Component ) => boolean;
29
-
30
- /**
31
- *
32
- */
33
-
34
-
35
- class DragManager {
36
-
37
- dragSource: Component;
38
- dragGhost: HTMLElement;
39
- dropTarget: Component;
40
-
41
- notified: Component;
42
-
43
- timer: any; // pb with name of settimeout return
44
-
45
- /**
46
- *
47
- */
48
-
49
- registerDraggableElement(el: Component) {
50
-
51
- el.addDOMEvent('dragstart', (ev: DragEvent) => {
52
-
53
- this.dragSource = el;
54
- this.dragGhost = el.dom.cloneNode(true) as HTMLElement;
55
-
56
- this.dragGhost.classList.add('dragged');
57
- document.body.appendChild(this.dragGhost);
58
-
59
- el.addClass( 'dragging' );
60
-
61
- ev.dataTransfer.setData('text/string', '1');
62
- ev.dataTransfer.setDragImage(new Image(), 0, 0);
63
-
64
- ev.stopPropagation( );
65
- });
66
-
67
- el.addDOMEvent('drag', (ev: DragEvent) => {
68
- this.dragGhost.style.left = ev.pageX + "px";
69
- this.dragGhost.style.top = ev.pageY + "px";
70
- });
71
-
72
- el.addDOMEvent('dragend', (ev: DragEvent) => {
73
- el.removeClass( 'dragging' );
74
- this.dragGhost.remove();
75
- });
76
-
77
- el.setAttribute('draggable', "true");
78
- }
79
-
80
- /**
81
- *
82
- */
83
-
84
- registerDropTarget(el: Component, cb: DropCallback, filterCB?: FilterCallback ) {
85
-
86
- const dragEnter = (ev: DragEvent) => {
87
- if( filterCB && !filterCB(this.dragSource) ) {
88
- console.log( 'reject ', el );
89
- ev.dataTransfer.dropEffect = 'none';
90
- return;
91
- }
92
-
93
- console.log( 'accepted ', el );
94
- ev.preventDefault();
95
- ev.dataTransfer.dropEffect = 'copy';
96
- };
97
-
98
- const dragOver = (ev: DragEvent) => {
99
- //console.log( "dragover", ev.target );
100
-
101
- if( filterCB && !filterCB(this.dragSource) ) {
102
- console.log( 'reject ', el );
103
- ev.dataTransfer.dropEffect = 'none';
104
- return;
105
- }
106
-
107
- ev.preventDefault();
108
-
109
- if (this.dropTarget != el) {
110
- this.dropTarget = el;
111
- this._startCheck();
112
- }
113
-
114
- if( this.dropTarget ) {
115
- const infos = {
116
- pt: { x: ev.pageX, y: ev.pageY },
117
- data: ev.dataTransfer,
118
- }
119
-
120
- cb( 'drag', this.dragSource, infos );
121
- }
122
-
123
- ev.dataTransfer.dropEffect = 'copy';
124
- };
125
-
126
- const dragLeave = (ev: DragEvent) => {
127
- //console.log( "dragleave", ev.target );
128
- this.dropTarget = null;
129
- ev.preventDefault();
130
- };
131
-
132
- const drop = (ev: DragEvent) => {
133
- const infos = {
134
- pt: { x: ev.pageX, y: ev.pageY },
135
- data: ev.dataTransfer,
136
- }
137
-
138
- cb('drop', this.dragSource, infos );
139
-
140
- this.dropTarget = null;
141
- el.removeClass('drop-over');
142
-
143
- ev.preventDefault();
144
- }
145
-
146
- el.addDOMEvent('dragenter', dragEnter);
147
- el.addDOMEvent('dragover', dragOver);
148
- el.addDOMEvent('dragleave', dragLeave);
149
- el.addDOMEvent('drop', drop);
150
-
151
- el.setInternalData( x_drag_cb, cb );
152
- }
153
-
154
- _startCheck() {
155
-
156
- if (this.timer) {
157
- clearInterval(this.timer);
158
- this._check( );
159
- }
160
-
161
- this.timer = setInterval( () => this._check(), 300 );
162
- }
163
-
164
- _check( ) {
165
-
166
- const leaving = ( x: Component ) => {
167
- x.removeClass('drop-over');
168
-
169
- const cb = x.getInternalData( x_drag_cb );
170
- cb( 'leave', this.dragSource );
171
- }
172
-
173
- const entering = ( x: Component ) => {
174
- x.addClass('drop-over');
175
- const cb = x.getInternalData( x_drag_cb );
176
- cb( 'enter', this.dragSource );
177
- }
178
-
179
- if (this.dropTarget) {
180
- if (!this.notified || this.notified != this.dropTarget) {
181
-
182
- if( this.notified ) {
183
- leaving( this.notified );
184
- }
185
-
186
- this.notified = this.dropTarget;
187
- entering( this.notified );
188
- }
189
- }
190
- else {
191
- if (this.notified) {
192
- leaving( this.notified );
193
- this.notified = null;
194
-
195
- clearInterval(this.timer);
196
- }
197
- }
198
- }
199
- }
200
-
201
- export const dragManager = new DragManager();
@@ -1,98 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file core_element.ts
9
- * @author Etienne Cochard
10
- *
11
- * @copyright (c) 2024 R-libre ingenierie
12
- *
13
- * Use of this source code is governed by an MIT-style license
14
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
15
- **/
16
-
17
- import { EventMap, EventSource } from './core_events.js';
18
-
19
- /**
20
- *
21
- */
22
-
23
- export class CoreElement<E extends EventMap = EventMap> {
24
-
25
- #events: EventSource<E>;
26
- #timers: Map<string, Function>;
27
-
28
- private __startTimer( name: string, ms: number, repeat: boolean, callback: ( ) => void ) {
29
- if (!this.#timers) {
30
- this.#timers = new Map();
31
- }
32
- else {
33
- this.__stopTimer(name);
34
- }
35
-
36
- const id = (repeat ? setInterval : setTimeout)( callback, ms );
37
-
38
- this.#timers.set(name, () => {
39
- (repeat ? clearInterval : clearTimeout)(id);
40
- this.#timers.delete(name)
41
- });
42
- }
43
-
44
- private __stopTimer( name: string ) {
45
- const clear = this.#timers.get(name);
46
- if (clear) { clear(); }
47
- }
48
-
49
- setTimeout( name: string, ms: number, callback: () => void ) {
50
- this.__startTimer( name, ms, false, callback );
51
- }
52
-
53
- clearTimeout( name: string ) {
54
- this.__stopTimer( name );
55
- }
56
-
57
- setInterval( name: string, ms: number, callback: ( ) => void ) {
58
- this.__startTimer( name, ms, true, callback );
59
- }
60
-
61
- clearInterval( name: string ) {
62
- this.__stopTimer( name );
63
- }
64
-
65
- clearTimeouts( ) {
66
- for( const [id,val] of this.#timers ) {
67
- val( );
68
- }
69
-
70
- this.#timers.clear( );
71
- }
72
-
73
- // :: EVENTS ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
74
-
75
- /**
76
- * attach to an event
77
- */
78
-
79
- on<K extends keyof E>( name: K, listener: ( ev: E[K] ) => void ) {
80
- console.assert( listener!==undefined && listener!==null );
81
-
82
- if( !this.#events ) {
83
- this.#events = new EventSource( this );
84
- }
85
-
86
- this.#events.addListener( name, listener );
87
- }
88
-
89
- /**
90
- *
91
- */
92
-
93
- fire<K extends keyof E>( name: K, ev: E[K] ) {
94
- if( this.#events ) {
95
- this.#events.fire( name, ev );
96
- }
97
- }
98
- }
@@ -1,149 +0,0 @@
1
- /**
2
- * ___ ___ __
3
- * \ \/ / / _
4
- * \ / /_| |_
5
- * / \____ _|
6
- * /__/\__\ |_|
7
- *
8
- * @file core_events.ts
9
- * @author Etienne Cochard
10
- *
11
- * @copyright (c) 2024 R-libre ingenierie
12
- *
13
- * Use of this source code is governed by an MIT-style license
14
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
15
- **/
16
-
17
- import { CoreElement } from './core_element';
18
-
19
- /**
20
- *
21
- */
22
-
23
- export interface CoreEvent {
24
- readonly type?: string; // type of the event 'click', 'change', ...
25
- readonly source?: CoreElement; // object that fires the event
26
- readonly context?: any; // contextual data, left to the user
27
-
28
- propagationStopped?: boolean; // if true, do not propagate the event
29
- defaultPrevented?: boolean; // if true, do not call default handler (if any)
30
-
31
- stopPropagation?(): void; // stop the propagation
32
- preventDefault?(): void; // prevent the default handler
33
- }
34
-
35
- // default stopPropagation implementation for Events
36
- const stopPropagation = function ( this: CoreEvent ) {
37
- this.propagationStopped = true;
38
- }
39
-
40
- // default preventDefault implementation for Events
41
- const preventDefault = function ( this: CoreEvent ) {
42
- this.defaultPrevented = true;
43
- }
44
-
45
-
46
- /**
47
- *
48
- */
49
-
50
- export interface EventMap {
51
- }
52
-
53
- /**
54
- *
55
- */
56
-
57
- export type EventCallback<T extends CoreEvent = CoreEvent> = (event: T) => any;
58
-
59
- /**
60
- *
61
- */
62
-
63
- export class EventSource<E extends EventMap = EventMap > {
64
-
65
- private _source: unknown;
66
- private _registry: Map<string,EventCallback[]>;
67
-
68
- constructor(source: unknown = null) {
69
- this._source = source ?? this;
70
- }
71
-
72
- addListener<K extends keyof E>( name: K, callback: ( ev: E[K] ) => void, capturing = false ) {
73
-
74
- if (!this._registry) {
75
- this._registry = new Map();
76
- }
77
-
78
- let listeners = this._registry.get(name as string);
79
- if (!listeners) {
80
- listeners = [];
81
- this._registry.set(name as string, listeners);
82
- }
83
-
84
- const cb = callback as EventCallback;
85
-
86
- if (listeners.indexOf(cb) == -1) {
87
- if (capturing) {
88
- listeners.unshift(cb);
89
- }
90
- else {
91
- listeners.push(cb);
92
- }
93
- }
94
- }
95
-
96
- fire<K extends keyof E>(name: K, evx: E[K]) {
97
-
98
- let listeners = this._registry?.get(name as string);
99
- //const defaultHandler = this.m_defaultHandlers?.get(eventName);
100
-
101
- if (listeners && listeners.length) {
102
- let ev = evx as CoreEvent;
103
- if (!ev) {
104
- ev = {};
105
- }
106
-
107
- if (!ev.source) {
108
- // readonly
109
- (ev as any).source = this._source;
110
- }
111
-
112
- if (!ev.type) {
113
- // readonly
114
- (ev as any).type = name;
115
- }
116
-
117
-
118
- if (!ev.preventDefault) {
119
- ev.preventDefault = preventDefault;
120
- }
121
-
122
- if (!ev.stopPropagation) {
123
- ev.stopPropagation = stopPropagation;
124
- }
125
-
126
- // small optimisation
127
- if (listeners.length == 1) {
128
- listeners[0](ev);
129
- }
130
- else {
131
- const temp = listeners.slice();
132
- for (let i = 0, n = temp.length; i < n; i++) {
133
- temp[i](ev);
134
- if (ev.propagationStopped) {
135
- break;
136
- }
137
- }
138
- }
139
- }
140
-
141
- //if (defaultHandler && defaultHandler.length && !e.defaultPrevented) {
142
- // return defaultHandler[0](e);
143
- //}
144
- }
145
- }
146
-
147
-
148
-
149
-