x4js 2.0.11 → 2.0.13

package/lib/types/x4js.d.ts

@@ -12,7 +12,7 @@
  * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
  *
  * AUTOGENERATED CODE, DO NOT MODIFY
- * generated on Fri Oct 04 2024
+ * generated on Wed Oct 09 2024
  */
 
 
@@ -285,14 +285,16 @@ declare module 'x4js' {
 	export interface ComponentEvents extends EventMap {
 	}
 
-	export class Component<P extends ComponentProps = ComponentProps, E extends ComponentEvents = ComponentEvents> extends CoreElement<E> {
+	@class_ns( "x4" ) export class Component<P extends ComponentProps = ComponentProps, E extends ComponentEvents = ComponentEvents> extends CoreElement<E> {
 		dom: Element;
 		props: P;
+		clsprefix: string;
 		store: Map<string|Symbol,any>;
 		constructor( props: P );
 		hasClass( cls: string ): void;
 		addClass( cls: string ): void;
 		removeClass( cls: string ): void;
+		removeClassEx( re: RegExp ): void;
 		toggleClass( cls: string ): void;
 		setClass( cls: string, set: boolean ): void;
 		setAttributes( attrs: ComponentAttributes ): void;
@@ -570,13 +572,13 @@ declare module 'x4js' {
 	export interface BoxProps extends ComponentProps {
 	}
 
-	export class Box<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Component<P,E> {
+	@class_ns( "x4" ) export class Box<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Component<P,E> {
 	}
 
-	export class HBox<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Box<P,E> {
+	@class_ns( "x4" ) export class HBox<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Box<P,E> {
 	}
 
-	export class VBox<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Box<P,E> {
+	@class_ns( "x4" ) export class VBox<P extends BoxProps=BoxProps, E extends ComponentEvents=ComponentEvents> extends Box<P,E> {
 		constructor( p: P );
 	}
 
@@ -594,13 +596,35 @@ declare module 'x4js' {
 		page: Component;
 	}
 
-	export class StackBox extends Box<StackedLayoutProps> {
+	@class_ns( "x4" ) export class StackBox extends Box<StackedLayoutProps> {
 		_items: _StackItem[];
 		constructor( props: StackedLayoutProps );
 		select( name: string ): void;
 		_createPage( page: _StackItem ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/components/breadcrumb/breadcrumb.ts
+
+	interface BreadcrumbEvents extends ComponentEvents {
+		click: EvClick;
+	}
+
+	interface BreadcrumbElement  {
+		icon?: string;
+		name: string;
+		label: string;
+	}
+
+	interface BreadcrumbsProps extends BoxProps {
+		items: BreadcrumbElement[];
+		click?: EventCallback<EvClick>;
+	}
+
+	@class_ns( "x4" ) export class Breadcrumbs extends HBox<BreadcrumbsProps,BreadcrumbEvents> {
+		constructor( props: BreadcrumbsProps );
+	}
+
 	// ---------------------------------------
 	// from /src/components/icon/icon.ts
 
@@ -618,7 +642,7 @@ declare module 'x4js' {
 		iconId?: string;
 	}
 
-	export class Icon extends Component<IconProps> {
+	@class_ns( "x4" ) export class Icon extends Component<IconProps> {
 		constructor( props: IconProps );
 		setIcon( iconId: string ): void;
 	}
@@ -636,7 +660,7 @@ declare module 'x4js' {
 		click?: EventCallback<EvClick>;
 	}
 
-	export class Button extends Component<ButtonProps,ButtonEvents> {
+	@class_ns( "x4" ) export class Button extends Component<ButtonProps,ButtonEvents> {
 		constructor( props: ButtonProps );
 		_on_click( ev: MouseEvent ): void;
 		setText( text: string | UnsafeHtml ): void;
@@ -646,13 +670,14 @@ declare module 'x4js' {
 	// ---------------------------------------
 	// from /src/components/label/label.ts
 
-	interface LabelProps extends ComponentProps {
+	export interface LabelProps extends ComponentProps {
 		text?: string | UnsafeHtml;
 		icon?: string;
 		labelFor?: string;
 	}
 
-	export class Label extends Component<LabelProps> {
+	@class_ns( "x4" ) export class Label extends Component<LabelProps> {
+		#text: Component;
 		constructor( p: LabelProps );
 		setText( text: string | UnsafeHtml ): void;
 		setIcon( icon: string ): void;
@@ -665,7 +690,10 @@ declare module 'x4js' {
 
 	type FormValues = Record<string,FormValue>;
 
-	export class Form extends Box {
+	export interface FormProps extends BoxProps {
+	}
+
+	@class_ns( "x4" ) export class Form<P extends FormProps = FormProps> extends Box<P> {
 		setValues( values: FormValues ): void;
 		getValues(  ): FormValues;
 	}
@@ -681,7 +709,7 @@ declare module 'x4js' {
 		resize: EvSizeChange;
 	}
 
-	export class CSizer extends Component<ComponentProps,CSizerEvent> {
+	@class_ns( "x4" ) export class CSizer extends Component<ComponentProps,CSizerEvent> {
 		_type: string;
 		_ref: Component;
 		_delta: Point;
@@ -704,7 +732,7 @@ declare module 'x4js' {
 		movable?: boolean;
 	}
 
-	export class Popup<P extends PopupProps = PopupProps, E extends PopupEvents = PopupEvents> extends Component<P,E> {
+	@class_ns( "x4" ) export class Popup<P extends PopupProps = PopupProps, E extends PopupEvents = PopupEvents> extends Component<P,E> {
 		_isopen: any;
 		_isshown: any;
 		constructor( props: P );
@@ -750,7 +778,7 @@ declare module 'x4js' {
 		close: ComponentEvent;
 	}
 
-	export class Dialog<P extends DialogProps = DialogProps, E extends DialogEvents = DialogEvents> extends Popup<P,E> {
+	@class_ns( "x4" ) export class Dialog<P extends DialogProps = DialogProps, E extends DialogEvents = DialogEvents> extends Popup<P,E> {
 		constructor( props: P );
 		display(  ): void;
 		close(  ): void;
@@ -759,7 +787,7 @@ declare module 'x4js' {
 	// ---------------------------------------
 	// from /src/components/btngroup/btngroup.ts
 
-	type predefined = "ok" | "cancel" | "yes" | "no" | "retry" | "abort" | "-";
+	type predefined = `ok${ "" | `.${string}`}` | `cancel${ "" | `.${string}`}` | `yes${ "" | `.${string}`}` | `no${ "" | `.${string}`}` | `retry${ "" | `.${string}`}` | `abort${ "" | `.${string}`}` | "-";
 
 	type BtnGroupItem = predefined | Button | Label;
 
@@ -775,7 +803,7 @@ declare module 'x4js' {
 		btnclick?: EventCallback<EvBtnClick>;
 	}
 
-	export class BtnGroup extends Box<BtnGroupProps,BtnGroupEvents> {
+	@class_ns( "x4" ) export class BtnGroup extends Box<BtnGroupProps,BtnGroupEvents> {
 		constructor( props: BtnGroupProps );
 		setButtons( btns: BtnGroupItem[] ): void;
 	}
@@ -798,11 +826,11 @@ declare module 'x4js' {
 		items: MenuElement[];
 	}
 
-	 class CMenuSep extends Component {
+	@class_ns( "x4" ) class CMenuSep extends Component {
 		constructor(  );
 	}
 
-	 class CMenuItem extends Component {
+	@class_ns( "x4" ) class CMenuItem extends Component {
 		menu: Menu;
 		constructor( itm: MenuItem );
 		dismiss( after: boolean ): void;
@@ -810,7 +838,7 @@ declare module 'x4js' {
 		closeSub(  ): void;
 	}
 
-	export class Menu extends Popup {
+	@class_ns( "x4" ) export class Menu extends Popup {
 		constructor( props: MenuProps );
 	}
 
@@ -828,7 +856,7 @@ declare module 'x4js' {
 		change?: EventCallback<EvChange>;
 	}
 
-	export class Calendar extends VBox<CalendarProps, CalendarEventMap> {
+	@class_ns( "x4" ) export class Calendar extends VBox<CalendarProps, CalendarEventMap> {
 		m_date: Date;
 		constructor( props: CalendarProps );
 		_update(  ): void;
@@ -900,7 +928,7 @@ declare module 'x4js' {
 
 	type InputProps = CheckboxProps | RadioProps | TextInputProps | RangeProps | DateProps | NumberProps | FileProps;
 
-	export class Input extends Component<InputProps> {
+	@class_ns( "x4" ) export class Input extends Component<InputProps> {
 		constructor( props: InputProps );
 		getValue(  ): void;
 		setValue( value: string ): void;
@@ -927,7 +955,7 @@ declare module 'x4js' {
 		change?: EventCallback<EvChange>;
 	}
 
-	export class Checkbox extends Component<CheckboxProps,CheckBoxEvents> {
+	@class_ns( "x4" ) export class Checkbox extends Component<CheckboxProps,CheckBoxEvents> {
 		_input: Input;
 		constructor( props: CheckboxProps );
 		_on_change(  ): void;
@@ -944,7 +972,8 @@ declare module 'x4js' {
 		color: Color | string;
 	}
 
-	export class ColorInput extends HBox<ColorInputProps> {
+	@class_ns( "x4" ) export class ColorInput extends HBox<ColorInputProps> {
+		"$cls-ns": any;
 		constructor( props: ColorInputProps );
 	}
 
@@ -974,7 +1003,7 @@ declare module 'x4js' {
 		sat_change: SatChangeEvent;
 	}
 
-	export class Saturation extends Box<BoxProps,CommonEvents> {
+	@class_ns( "x4" ) export class Saturation extends Box<BoxProps,CommonEvents> {
 		mdown: any;
 		irect: Rect;
 		hsv: Hsv;
@@ -989,7 +1018,7 @@ declare module 'x4js' {
 		move( sens: string, delta: number ): void;
 	}
 
-	 class HueSlider extends Box<BoxProps,CommonEvents> {
+	@class_ns( "x4" ) class HueSlider extends Box<BoxProps,CommonEvents> {
 		thumb: Component;
 		hsv: Hsv;
 		mdown: any;
@@ -1002,7 +1031,7 @@ declare module 'x4js' {
 		move( delta: number ): void;
 	}
 
-	 class AlphaSlider extends Box<BoxProps,CommonEvents> {
+	@class_ns( "x4" ) class AlphaSlider extends Box<BoxProps,CommonEvents> {
 		thumb: Component;
 		color: Component;
 		hsv: Hsv;
@@ -1026,7 +1055,7 @@ declare module 'x4js' {
 		change: ChangeEvent;
 	}
 
-	export class ColorPicker extends VBox<ColorPickerProps,ColorPickerChangeEvents> {
+	@class_ns( "x4" ) export class ColorPicker extends VBox<ColorPickerProps,ColorPickerChangeEvents> {
 		_base: Color;
 		_sat: Saturation;
 		_swatch: Component;
@@ -1039,11 +1068,11 @@ declare module 'x4js' {
 	// ---------------------------------------
 	// from /src/components/viewport/viewport.ts
 
-	export class Viewport extends Component {
+	@class_ns( "x4" ) export class Viewport extends Component {
 		constructor( props: ComponentProps );
 	}
 
-	export class ScrollView extends Component {
+	@class_ns( "x4" ) export class ScrollView extends Component {
 		constructor( props: ComponentProps );
 		getViewport(  ): void;
 	}
@@ -1082,7 +1111,7 @@ declare module 'x4js' {
 		checkable?: true;
 	}
 
-	export class Listbox extends Component<ListboxProps,ListboxEvents> {
+	@class_ns( "x4" ) export class Listbox extends Component<ListboxProps,ListboxEvents> {
 		_view: Viewport;
 		_selection: ListboxID;
 		_selitem: Component;
@@ -1116,7 +1145,7 @@ declare module 'x4js' {
 		items: ListItem[];
 	}
 
-	 class Dropdown extends Popup<DropdownProps,DropdownEvents> {
+	@class_ns( "x4" ) class Dropdown extends Popup<DropdownProps,DropdownEvents> {
 		_list: Listbox;
 		constructor( props: DropdownProps, content: ListItem[] );
 		getList(  ): void;
@@ -1129,7 +1158,7 @@ declare module 'x4js' {
 		items: ListItem[];
 	}
 
-	export class Combobox extends Component<ComboboxProps> {
+	@class_ns( "x4" ) export class Combobox extends Component<ComboboxProps> {
 		_dropdown: Dropdown;
 		_label: Label;
 		_input: Input;
@@ -1158,7 +1187,7 @@ declare module 'x4js' {
 		items: HeaderItem[];
 	}
 
-	export class Header extends HBox<HeaderProps> {
+	@class_ns( "x4" ) export class Header extends HBox<HeaderProps> {
 		_els: Component[];
 		_vwp: Component;
 		constructor( props: HeaderProps );
@@ -1178,12 +1207,31 @@ declare module 'x4js' {
 		draggable?: boolean;
 	}
 
-	export class Image extends Component<ImageProps> {
+	@class_ns( "x4" ) export class Image extends Component<ImageProps> {
 		_img: Component;
 		constructor( props: ImageProps );
 		setImage( src: string ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/components/link/link.ts
+
+	interface LinkEvents extends ComponentEvents {
+		click: EvClick;
+	}
+
+	interface LinkProps extends ComponentProps {
+		href: string;
+		text: string | UnsafeHtml;
+		click?: EventCallback<EvClick>;
+	}
+
+	@class_ns( "x4" ) export class Link extends Component<LinkProps,LinkEvents> {
+		constructor( props: LinkProps );
+		setText( text: string | UnsafeHtml ): void;
+		_on_click( ev: MouseEvent ): void;
+	}
+
 	// ---------------------------------------
 	// from /src/components/messages/messages.ts
 
@@ -1192,7 +1240,7 @@ declare module 'x4js' {
 		click: (button: string) => void;
 	}
 
-	export class MessageBox extends Dialog<DialogProps> {
+	@class_ns( "x4" ) export class MessageBox extends Dialog<DialogProps> {
 		m_label: Label;
 		constructor( props: DialogProps );
 		setText( txt: string | UnsafeHtml ): void;
@@ -1211,7 +1259,7 @@ declare module 'x4js' {
 		text: string | UnsafeHtml;
 	}
 
-	export class Notification extends Popup {
+	@class_ns( "x4" ) export class Notification extends Popup {
 		constructor( props: NotificationProps );
 		close(  ): void;
 		display( time_in_s: any ): void;
@@ -1226,7 +1274,7 @@ declare module 'x4js' {
 		bodyModel?: Constructor<Component>;
 	}
 
-	export class Panel extends VBox<PanelProps> {
+	@class_ns( "x4" ) export class Panel extends VBox<PanelProps> {
 		_title: Component;
 		_body: Component;
 		constructor( props: PanelProps );
@@ -1243,7 +1291,7 @@ declare module 'x4js' {
 		max: number;
 	}
 
-	export class Progress extends Component<ProgressProps> {
+	@class_ns( "x4" ) export class Progress extends Component<ProgressProps> {
 		_bar: Component;
 		constructor( props: ProgressProps );
 		setValue( value: number ): void;
@@ -1264,7 +1312,7 @@ declare module 'x4js' {
 		change?: EventCallback<EvChange>;
 	}
 
-	export class Rating extends HBox<RatingProps,RatingEventMap> {
+	@class_ns( "x4" ) export class Rating extends HBox<RatingProps,RatingEventMap> {
 		m_els: Component[];
 		m_input: Input;
 		constructor( props: RatingProps );
@@ -1294,7 +1342,7 @@ declare module 'x4js' {
 		step?: number;
 	}
 
-	export class Slider extends Component<SliderProps,SliderEvents> {
+	@class_ns( "x4" ) export class Slider extends Component<SliderProps,SliderEvents> {
 		_mdown: any;
 		_irect: Rect;
 		_thumb: Component;
@@ -1317,7 +1365,7 @@ declare module 'x4js' {
 		value?: string;
 	}
 
-	export class Switch extends HBox<SwitchProps> {
+	@class_ns( "x4" ) export class Switch extends HBox<SwitchProps> {
 		constructor( props: SwitchProps );
 	}
 
@@ -1331,7 +1379,7 @@ declare module 'x4js' {
 		tab: Component;
 	}
 
-	 class CTab extends Button {
+	@class_ns( "x4" ) class CTab extends Button {
 		constructor( props: ButtonProps, item: TabItem );
 	}
 
@@ -1347,7 +1395,7 @@ declare module 'x4js' {
 		click: TablistClickEvent;
 	}
 
-	 class CTabList extends HBox<TablistProps,TablistEvents> {
+	@class_ns( "x4" ) class CTabList extends HBox<TablistProps,TablistEvents> {
 		_selitem: Button;
 		_selection: string;
 		constructor( props: TablistProps, content: TabItem[] );
@@ -1360,7 +1408,7 @@ declare module 'x4js' {
 		items: TabItem[];
 	}
 
-	export class Tabs extends VBox<TabsProps> {
+	@class_ns( "x4" ) export class Tabs extends VBox<TabsProps> {
 		_list: CTabList;
 		_stack: StackBox;
 		constructor( props: TabsProps );
@@ -1377,7 +1425,7 @@ declare module 'x4js' {
 		resize?: boolean;
 	}
 
-	export class TextArea extends VBox {
+	@class_ns( "x4" ) export class TextArea extends VBox {
 		_input: Component;
 		constructor( props: TextAreaProps );
 	}
@@ -1397,14 +1445,14 @@ declare module 'x4js' {
 		inputGadgets?: Component[];
 	}
 
-	export class TextEdit extends HBox {
+	@class_ns( "x4" ) export class TextEdit extends HBox {
 		constructor( props: TextEditProps );
 	}
 
 	// ---------------------------------------
 	// from /src/components/tooltips/tooltips.ts
 
-	 class Tooltip extends Popup {
+	@class_ns( "x4" ) class Tooltip extends Popup {
 		constructor( props: PopupProps );
 		setText( text: string|UnsafeHtml ): void;
 	}
@@ -1441,7 +1489,7 @@ declare module 'x4js' {
 		change: ChangeEvent;
 	}
 
-	 class CTreeViewItem extends Box {
+	@class_ns( "x4" ) class CTreeViewItem extends Box {
 		_item: TreeItem;
 		_label: Component;
 		_icon: Icon;
@@ -1452,7 +1500,7 @@ declare module 'x4js' {
 		setItems( items: TreeItem[ ] ): void;
 	}
 
-	export class Treeview extends Component<TreeviewProps,TreeviewEvents> {
+	@class_ns( "x4" ) export class Treeview extends Component<TreeviewProps,TreeviewEvents> {
 		_selection: ListboxID;
 		_selitem: Component;
 		_items: TreeItem[];
@@ -1468,5 +1516,8 @@ declare module 'x4js' {
 		clearSelection(  ): void;
 	}
 
+	// ---------------------------------------
+	// from /src/components/components.ts
+
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "x4js",
-	"version": "2.0.11",
+	"version": "2.0.13",
 	"description": "X4 framework",
 	"author": "etienne cochard",
 	"main": "src/x4.ts",
@@ -45,11 +45,10 @@
 	},
 	"devDependencies": {
 		"chalk": "^5.3",
-		"dts-generator": "^3.0",
 		"esbuild": "^0.24",
 		"esbuild-plugin-d.ts": "^1.3",
 		"esbuild-sass-plugin": "^3.3",
-		"typescript": "^5.6",
+		"typescript": "^5.6.3",
 		"watcher": "^2.3",
 		"ws": "^8.18"
 	},

package/src/x4.ts

@@ -1,60 +1,31 @@
-/** 
- *  ___  ___ __
- *  \  \/  /  / _
- *   \    /  /_| |_
- *   /    \____   _|  
- *  /__/\__\   |_|
- * 
- * @file x4.ts
- * @author Etienne Cochard 
- * 
- * @copyright (c) 2024 R-libre ingenierie
- *
- * Use of this source code is governed by an MIT-style license 
- * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
- **/
-
-export * from "./core/component"
-export * from "./core/core_colors"
-export * from "./core/core_dom"
-export * from "./core/core_dragdrop"
-export * from "./core/core_element"
-export * from "./core/core_events"
-export * from "./core/core_i18n"
-export * from "./core/core_router"
-export * from "./core/core_styles"
-export * from "./core/core_svg"
-export * from "./core/core_tools"
-
-export * from "./components/boxes/boxes"
-export * from "./components/btngroup/btngroup"
-export * from "./components/button/button"
-export * from "./components/calendar/calendar"
-export * from "./components/checkbox/checkbox"
-export * from "./components/colorinput/colorinput"
-export * from "./components/colorpicker/colorpicker"
-export * from "./components/combobox/combobox"
-export * from "./components/dialog/dialog"
-export * from "./components/form/form"
-export * from "./components/header/header"
-export * from "./components/icon/icon"
-export * from "./components/image/image"
-export * from "./components/input/input"
-export * from "./components/label/label"
-export * from "./components/listbox/listbox"
-export * from "./components/menu/menu"
-export * from "./components/messages/messages"
-export * from "./components/notification/notification"
-export * from "./components/panel/panel"
-export * from "./components/popup/popup"
-export * from "./components/progress/progress"
-export * from "./components/rating/rating"
-export * from "./components/sizers/sizer"
-export * from "./components/slider/slider"
-export * from "./components/switch/switch"
-export * from "./components/tabs/tabs"
-export * from "./components/textarea/textarea"
-export * from "./components/textedit/textedit"
-export * from "./components/tooltips/tooltips"
-export * from "./components/treeview/treeview"
-export * from "./components/viewport/viewport"
+/** 
+ *  ___  ___ __
+ *  \  \/  /  / _
+ *   \    /  /_| |_
+ *   /    \____   _|  
+ *  /__/\__\   |_|
+ * 
+ * @file x4.ts
+ * @author Etienne Cochard 
+ * 
+ * @copyright (c) 2024 R-libre ingenierie
+ *
+ * Use of this source code is governed by an MIT-style license 
+ * that can be found in the LICENSE file or at https://opensource.org/licenses/MIT.
+ **/
+
+export * from "./core/component"
+export * from "./core/core_colors"
+export * from "./core/core_dom"
+export * from "./core/core_dragdrop"
+export * from "./core/core_element"
+export * from "./core/core_events"
+export * from "./core/core_i18n"
+export * from "./core/core_router"
+export * from "./core/core_styles"
+export * from "./core/core_svg"
+export * from "./core/core_tools"
+
+export * from "./components/components"
+
+import "./x4.scss"