oasis-editor 0.0.116 → 0.0.118
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/dist/{OasisEditorApp-DY_N4M54.js → OasisEditorApp-DxTXNB8H.js} +2148 -859
- package/dist/{index-DLKF27_V.js → index-DxemmUXw.js} +1077 -796
- package/dist/index.d.ts +2 -2
- package/dist/layoutProjection/constants.d.ts +7 -1
- package/dist/layoutProjection/footnotePagination.d.ts +0 -1
- package/dist/oasis-editor.css +1 -1
- package/dist/oasis-editor.js +63 -55
- package/dist/oasis-editor.umd.cjs +4 -4
- package/dist/ui/components/Dialogs/TablePropertiesDialog.d.ts +2 -99
- package/dist/ui/components/Dialogs/font-dialog/FontTab.d.ts +2 -1
- package/dist/ui/components/Dialogs/table-properties/AltTextTabPanel.d.ts +3 -0
- package/dist/ui/components/Dialogs/table-properties/CellTabPanel.d.ts +3 -0
- package/dist/ui/components/Dialogs/table-properties/ColumnTabPanel.d.ts +3 -0
- package/dist/ui/components/Dialogs/table-properties/RowTabPanel.d.ts +3 -0
- package/dist/ui/components/Dialogs/table-properties/TablePropertiesController.d.ts +12 -0
- package/dist/ui/components/Dialogs/table-properties/TablePropertiesTypes.d.ts +160 -0
- package/dist/ui/components/Dialogs/table-properties/TableTabPanel.d.ts +6 -0
- package/dist/ui/components/Dialogs/table-properties/fields.d.ts +9 -0
- package/dist/ui/components/Dialogs/table-properties/useTablePropertiesController.d.ts +4 -0
- package/dist/ui/components/Toolbar/primitives/useSurfaceRect.d.ts +20 -0
- package/dist/ui/public/ActionRow.d.ts +7 -0
- package/dist/ui/public/FieldGroup.d.ts +7 -0
- package/dist/ui/public/FieldRow.d.ts +13 -0
- package/dist/ui/public/FormField.d.ts +10 -0
- package/dist/ui/public/Heading.d.ts +6 -0
- package/dist/ui/public/NumberField.d.ts +13 -0
- package/dist/ui/public/Radio.d.ts +38 -0
- package/dist/ui/public/SelectField.d.ts +2 -0
- package/dist/ui/public/StatusText.d.ts +7 -0
- package/dist/ui/public/SurfaceButton.d.ts +10 -0
- package/dist/ui/public/Text.d.ts +8 -0
- package/dist/ui/public/TextAreaField.d.ts +11 -0
- package/dist/ui/public/TextField.d.ts +2 -0
- package/dist/ui/public/ToggleChip.d.ts +14 -0
- package/dist/ui/public/index.d.ts +24 -0
- package/package.json +2 -1
|
@@ -1,101 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { TablePropertiesDialogProps } from './table-properties/TablePropertiesTypes.js';
|
|
2
2
|
|
|
3
|
-
type
|
|
4
|
-
type BorderStyleValue = "none" | "solid" | "dashed" | "dotted";
|
|
5
|
-
export interface TablePropertiesDialogInitialValues {
|
|
6
|
-
activeTab?: "table" | "row" | "column" | "cell" | "altText";
|
|
7
|
-
tableWidth: string;
|
|
8
|
-
tableWidthUnit: TableWidthUnit;
|
|
9
|
-
tableAlign: "" | "left" | "center" | "right";
|
|
10
|
-
tableIndentLeft: string;
|
|
11
|
-
tableWrapping: "none" | "around";
|
|
12
|
-
floatingSummary: string;
|
|
13
|
-
floatingHorizontalAnchor: "margin" | "page" | "text";
|
|
14
|
-
floatingVerticalAnchor: "margin" | "page" | "text";
|
|
15
|
-
floatingX: string;
|
|
16
|
-
floatingY: string;
|
|
17
|
-
floatingXAlign: "" | "left" | "center" | "right" | "inside" | "outside";
|
|
18
|
-
floatingYAlign: "" | "top" | "center" | "bottom" | "inside" | "outside";
|
|
19
|
-
floatingDistanceTop: string;
|
|
20
|
-
floatingDistanceRight: string;
|
|
21
|
-
floatingDistanceBottom: string;
|
|
22
|
-
floatingDistanceLeft: string;
|
|
23
|
-
floatingOverlap: "overlap" | "never";
|
|
24
|
-
rowHeight: string;
|
|
25
|
-
rowHeightRule: EditorTableRowHeightRule | "";
|
|
26
|
-
repeatHeader: boolean;
|
|
27
|
-
allowBreakAcrossPages: boolean;
|
|
28
|
-
hiddenRow: boolean;
|
|
29
|
-
columnWidth: string;
|
|
30
|
-
cellWidth: string;
|
|
31
|
-
cellVerticalAlign: "" | "top" | "middle" | "bottom";
|
|
32
|
-
cellTextDirection: "" | "lrTb" | "tbRl" | "btLr" | "lrTbV" | "tbRlV";
|
|
33
|
-
cellNoWrap: boolean;
|
|
34
|
-
cellFitText: boolean;
|
|
35
|
-
cellHideMark: boolean;
|
|
36
|
-
marginTop: string;
|
|
37
|
-
marginRight: string;
|
|
38
|
-
marginBottom: string;
|
|
39
|
-
marginLeft: string;
|
|
40
|
-
borderStyle: BorderStyleValue;
|
|
41
|
-
borderWidth: string;
|
|
42
|
-
borderColor: string;
|
|
43
|
-
borderTop: boolean;
|
|
44
|
-
borderRight: boolean;
|
|
45
|
-
borderBottom: boolean;
|
|
46
|
-
borderLeft: boolean;
|
|
47
|
-
borderStart: boolean;
|
|
48
|
-
borderEnd: boolean;
|
|
49
|
-
borderTopLeftToBottomRight: boolean;
|
|
50
|
-
borderTopRightToBottomLeft: boolean;
|
|
51
|
-
shading: string;
|
|
52
|
-
altTitle: string;
|
|
53
|
-
altDescription: string;
|
|
54
|
-
}
|
|
55
|
-
export interface TablePropertiesDialogBorders {
|
|
56
|
-
top: EditorBorderStyle | null;
|
|
57
|
-
right: EditorBorderStyle | null;
|
|
58
|
-
bottom: EditorBorderStyle | null;
|
|
59
|
-
left: EditorBorderStyle | null;
|
|
60
|
-
start: EditorBorderStyle | null;
|
|
61
|
-
end: EditorBorderStyle | null;
|
|
62
|
-
topLeftToBottomRight: EditorBorderStyle | null;
|
|
63
|
-
topRightToBottomLeft: EditorBorderStyle | null;
|
|
64
|
-
}
|
|
65
|
-
export interface TablePropertiesDialogApplyValues {
|
|
66
|
-
tableWidth: EditorDocxWidthValue | null;
|
|
67
|
-
tableAlign: "left" | "center" | "right" | null;
|
|
68
|
-
tableIndentLeft: EditorDocxWidthValue | null;
|
|
69
|
-
tableFloating: EditorTableFloatingLayout | null;
|
|
70
|
-
tableOverlap: "overlap" | "never" | null;
|
|
71
|
-
rowHeight: EditorDocxWidthValue | null;
|
|
72
|
-
rowHeightRule: EditorTableRowHeightRule | null;
|
|
73
|
-
repeatHeader: boolean;
|
|
74
|
-
cantSplit: boolean;
|
|
75
|
-
hiddenRow: boolean;
|
|
76
|
-
columnWidth: EditorDocxWidthValue | null;
|
|
77
|
-
cellWidth: EditorDocxWidthValue | null;
|
|
78
|
-
cellVerticalAlign: "top" | "middle" | "bottom" | null;
|
|
79
|
-
cellTextDirection: "lrTb" | "tbRl" | "btLr" | "lrTbV" | "tbRlV" | null;
|
|
80
|
-
cellNoWrap: boolean | null;
|
|
81
|
-
cellFitText: boolean | null;
|
|
82
|
-
cellHideMark: boolean | null;
|
|
83
|
-
margins: {
|
|
84
|
-
top: number | null;
|
|
85
|
-
right: number | null;
|
|
86
|
-
bottom: number | null;
|
|
87
|
-
left: number | null;
|
|
88
|
-
};
|
|
89
|
-
borders: TablePropertiesDialogBorders;
|
|
90
|
-
shading: string | null;
|
|
91
|
-
altTitle: string | null;
|
|
92
|
-
altDescription: string | null;
|
|
93
|
-
}
|
|
94
|
-
export interface TablePropertiesDialogProps {
|
|
95
|
-
isOpen: boolean;
|
|
96
|
-
initial: TablePropertiesDialogInitialValues;
|
|
97
|
-
onClose: () => void;
|
|
98
|
-
onApply: (values: TablePropertiesDialogApplyValues, original: TablePropertiesDialogInitialValues) => void;
|
|
99
|
-
}
|
|
3
|
+
export type { TablePropertiesDialogInitialValues, TablePropertiesDialogBorders, TablePropertiesDialogApplyValues, TablePropertiesDialogProps, } from './table-properties/TablePropertiesTypes.js';
|
|
100
4
|
export declare function TablePropertiesDialog(props: TablePropertiesDialogProps): import("solid-js").JSX.Element;
|
|
101
|
-
export {};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
1
2
|
import { FontDialogController } from './FontDialogController.js';
|
|
2
3
|
|
|
3
4
|
export interface FontTabProps {
|
|
4
5
|
ctrl: FontDialogController;
|
|
5
6
|
}
|
|
6
|
-
export declare function FontTab(props: FontTabProps):
|
|
7
|
+
export declare function FontTab(props: FontTabProps): JSX.Element;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { SetStoreFunction } from 'solid-js/store';
|
|
2
|
+
import { TableFormState } from './TablePropertiesTypes.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* View-facing contract for the Table Properties dialog. Panels depend on this
|
|
6
|
+
* interface (not the hook implementation), mirroring `FontDialogController`.
|
|
7
|
+
*/
|
|
8
|
+
export interface TablePropertiesController {
|
|
9
|
+
form: TableFormState;
|
|
10
|
+
set: SetStoreFunction<TableFormState>;
|
|
11
|
+
handleApply: () => void;
|
|
12
|
+
}
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
import { EditorBorderStyle, EditorDocxWidthValue, EditorTableRowHeightRule, EditorTableFloatingLayout } from '../../../../core/model.js';
|
|
2
|
+
|
|
3
|
+
export type TableWidthUnit = "points" | "percent";
|
|
4
|
+
export type BorderStyleValue = "none" | "solid" | "dashed" | "dotted";
|
|
5
|
+
export interface TablePropertiesDialogInitialValues {
|
|
6
|
+
activeTab?: "table" | "row" | "column" | "cell" | "altText";
|
|
7
|
+
tableWidth: string;
|
|
8
|
+
tableWidthUnit: TableWidthUnit;
|
|
9
|
+
tableAlign: "" | "left" | "center" | "right";
|
|
10
|
+
tableIndentLeft: string;
|
|
11
|
+
tableWrapping: "none" | "around";
|
|
12
|
+
floatingSummary: string;
|
|
13
|
+
floatingHorizontalAnchor: "margin" | "page" | "text";
|
|
14
|
+
floatingVerticalAnchor: "margin" | "page" | "text";
|
|
15
|
+
floatingX: string;
|
|
16
|
+
floatingY: string;
|
|
17
|
+
floatingXAlign: "" | "left" | "center" | "right" | "inside" | "outside";
|
|
18
|
+
floatingYAlign: "" | "top" | "center" | "bottom" | "inside" | "outside";
|
|
19
|
+
floatingDistanceTop: string;
|
|
20
|
+
floatingDistanceRight: string;
|
|
21
|
+
floatingDistanceBottom: string;
|
|
22
|
+
floatingDistanceLeft: string;
|
|
23
|
+
floatingOverlap: "overlap" | "never";
|
|
24
|
+
rowHeight: string;
|
|
25
|
+
rowHeightRule: EditorTableRowHeightRule | "";
|
|
26
|
+
repeatHeader: boolean;
|
|
27
|
+
allowBreakAcrossPages: boolean;
|
|
28
|
+
hiddenRow: boolean;
|
|
29
|
+
columnWidth: string;
|
|
30
|
+
cellWidth: string;
|
|
31
|
+
cellVerticalAlign: "" | "top" | "middle" | "bottom";
|
|
32
|
+
cellTextDirection: "" | "lrTb" | "tbRl" | "btLr" | "lrTbV" | "tbRlV";
|
|
33
|
+
cellNoWrap: boolean;
|
|
34
|
+
cellFitText: boolean;
|
|
35
|
+
cellHideMark: boolean;
|
|
36
|
+
marginTop: string;
|
|
37
|
+
marginRight: string;
|
|
38
|
+
marginBottom: string;
|
|
39
|
+
marginLeft: string;
|
|
40
|
+
borderStyle: BorderStyleValue;
|
|
41
|
+
borderWidth: string;
|
|
42
|
+
borderColor: string;
|
|
43
|
+
borderTop: boolean;
|
|
44
|
+
borderRight: boolean;
|
|
45
|
+
borderBottom: boolean;
|
|
46
|
+
borderLeft: boolean;
|
|
47
|
+
borderStart: boolean;
|
|
48
|
+
borderEnd: boolean;
|
|
49
|
+
borderTopLeftToBottomRight: boolean;
|
|
50
|
+
borderTopRightToBottomLeft: boolean;
|
|
51
|
+
shading: string;
|
|
52
|
+
altTitle: string;
|
|
53
|
+
altDescription: string;
|
|
54
|
+
}
|
|
55
|
+
export interface TablePropertiesDialogBorders {
|
|
56
|
+
top: EditorBorderStyle | null;
|
|
57
|
+
right: EditorBorderStyle | null;
|
|
58
|
+
bottom: EditorBorderStyle | null;
|
|
59
|
+
left: EditorBorderStyle | null;
|
|
60
|
+
start: EditorBorderStyle | null;
|
|
61
|
+
end: EditorBorderStyle | null;
|
|
62
|
+
topLeftToBottomRight: EditorBorderStyle | null;
|
|
63
|
+
topRightToBottomLeft: EditorBorderStyle | null;
|
|
64
|
+
}
|
|
65
|
+
export interface TablePropertiesDialogApplyValues {
|
|
66
|
+
tableWidth: EditorDocxWidthValue | null;
|
|
67
|
+
tableAlign: "left" | "center" | "right" | null;
|
|
68
|
+
tableIndentLeft: EditorDocxWidthValue | null;
|
|
69
|
+
tableFloating: EditorTableFloatingLayout | null;
|
|
70
|
+
tableOverlap: "overlap" | "never" | null;
|
|
71
|
+
rowHeight: EditorDocxWidthValue | null;
|
|
72
|
+
rowHeightRule: EditorTableRowHeightRule | null;
|
|
73
|
+
repeatHeader: boolean;
|
|
74
|
+
cantSplit: boolean;
|
|
75
|
+
hiddenRow: boolean;
|
|
76
|
+
columnWidth: EditorDocxWidthValue | null;
|
|
77
|
+
cellWidth: EditorDocxWidthValue | null;
|
|
78
|
+
cellVerticalAlign: "top" | "middle" | "bottom" | null;
|
|
79
|
+
cellTextDirection: "lrTb" | "tbRl" | "btLr" | "lrTbV" | "tbRlV" | null;
|
|
80
|
+
cellNoWrap: boolean | null;
|
|
81
|
+
cellFitText: boolean | null;
|
|
82
|
+
cellHideMark: boolean | null;
|
|
83
|
+
margins: {
|
|
84
|
+
top: number | null;
|
|
85
|
+
right: number | null;
|
|
86
|
+
bottom: number | null;
|
|
87
|
+
left: number | null;
|
|
88
|
+
};
|
|
89
|
+
borders: TablePropertiesDialogBorders;
|
|
90
|
+
shading: string | null;
|
|
91
|
+
altTitle: string | null;
|
|
92
|
+
altDescription: string | null;
|
|
93
|
+
}
|
|
94
|
+
export interface TablePropertiesDialogProps {
|
|
95
|
+
isOpen: boolean;
|
|
96
|
+
initial: TablePropertiesDialogInitialValues;
|
|
97
|
+
onClose: () => void;
|
|
98
|
+
onApply: (values: TablePropertiesDialogApplyValues, original: TablePropertiesDialogInitialValues) => void;
|
|
99
|
+
}
|
|
100
|
+
/** Single reactive store shape, replacing 40+ individual signals. */
|
|
101
|
+
export interface TableFormState {
|
|
102
|
+
activeTab: string;
|
|
103
|
+
tableWidth: string;
|
|
104
|
+
tableWidthUnit: TableWidthUnit;
|
|
105
|
+
tableAlign: TablePropertiesDialogInitialValues["tableAlign"];
|
|
106
|
+
tableIndentLeft: string;
|
|
107
|
+
tableWrapping: TablePropertiesDialogInitialValues["tableWrapping"];
|
|
108
|
+
floatingHorizontalAnchor: TablePropertiesDialogInitialValues["floatingHorizontalAnchor"];
|
|
109
|
+
floatingVerticalAnchor: TablePropertiesDialogInitialValues["floatingVerticalAnchor"];
|
|
110
|
+
floatingX: string;
|
|
111
|
+
floatingY: string;
|
|
112
|
+
floatingXAlign: TablePropertiesDialogInitialValues["floatingXAlign"];
|
|
113
|
+
floatingYAlign: TablePropertiesDialogInitialValues["floatingYAlign"];
|
|
114
|
+
floatingDistanceTop: string;
|
|
115
|
+
floatingDistanceRight: string;
|
|
116
|
+
floatingDistanceBottom: string;
|
|
117
|
+
floatingDistanceLeft: string;
|
|
118
|
+
floatingOverlap: TablePropertiesDialogInitialValues["floatingOverlap"];
|
|
119
|
+
rowHeight: string;
|
|
120
|
+
rowHeightRule: TablePropertiesDialogInitialValues["rowHeightRule"];
|
|
121
|
+
repeatHeader: boolean;
|
|
122
|
+
allowBreakAcrossPages: boolean;
|
|
123
|
+
hiddenRow: boolean;
|
|
124
|
+
columnWidth: string;
|
|
125
|
+
cellWidth: string;
|
|
126
|
+
cellVerticalAlign: TablePropertiesDialogInitialValues["cellVerticalAlign"];
|
|
127
|
+
cellTextDirection: TablePropertiesDialogInitialValues["cellTextDirection"];
|
|
128
|
+
cellNoWrap: boolean;
|
|
129
|
+
cellFitText: boolean;
|
|
130
|
+
cellHideMark: boolean;
|
|
131
|
+
marginTop: string;
|
|
132
|
+
marginRight: string;
|
|
133
|
+
marginBottom: string;
|
|
134
|
+
marginLeft: string;
|
|
135
|
+
borderStyle: BorderStyleValue;
|
|
136
|
+
borderWidth: string;
|
|
137
|
+
borderColor: string;
|
|
138
|
+
borderTop: boolean;
|
|
139
|
+
borderRight: boolean;
|
|
140
|
+
borderBottom: boolean;
|
|
141
|
+
borderLeft: boolean;
|
|
142
|
+
borderStart: boolean;
|
|
143
|
+
borderEnd: boolean;
|
|
144
|
+
borderTlBr: boolean;
|
|
145
|
+
borderTrBl: boolean;
|
|
146
|
+
shading: string;
|
|
147
|
+
altTitle: string;
|
|
148
|
+
altDescription: string;
|
|
149
|
+
}
|
|
150
|
+
export declare const DEFAULT_BORDER_WIDTH_PT = 0.5;
|
|
151
|
+
export declare const DEFAULT_BORDER_COLOR = "#000000";
|
|
152
|
+
export declare function parseNumber(value: string): number | null;
|
|
153
|
+
export declare function parseWidth(value: string, unit: TableWidthUnit): EditorDocxWidthValue | null;
|
|
154
|
+
export declare function resolveBorder(style: BorderStyleValue, widthValue: string, colorValue: string): EditorBorderStyle | null;
|
|
155
|
+
/** Fresh store with empty/default values, used before the dialog opens. */
|
|
156
|
+
export declare function createDefaultFormState(): TableFormState;
|
|
157
|
+
/** Maps the public initial-values shape onto the internal store shape. */
|
|
158
|
+
export declare function formStateFromInitial(initial: TablePropertiesDialogInitialValues): TableFormState;
|
|
159
|
+
/** Pure projection from the internal store to the public apply-values shape. */
|
|
160
|
+
export declare function buildTableApplyValues(form: TableFormState): TablePropertiesDialogApplyValues;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Numeric field used across the table-properties panels. Thin composition over
|
|
5
|
+
* the public `TextField` (theme-aware) that keeps the grow layout and the
|
|
6
|
+
* string-based store contract, replacing the dialog's old hand-rolled
|
|
7
|
+
* `numericInput` helper.
|
|
8
|
+
*/
|
|
9
|
+
export declare function NumField(label: string, value: () => string, setter: (value: string) => void, testId: string, disabled?: boolean, allowNegative?: boolean): JSX.Element;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { Accessor } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface SurfaceRectApi {
|
|
4
|
+
/** The surface's bounding rect in viewport coordinates, or `null` if unmounted. */
|
|
5
|
+
rect: Accessor<DOMRect | null>;
|
|
6
|
+
/** Monotonic counter that bumps on every refresh, for `createMemo` invalidation. */
|
|
7
|
+
tick: Accessor<number>;
|
|
8
|
+
/** Force a re-measure (rAF-throttled), e.g. when the anchored target changes. */
|
|
9
|
+
refresh: () => void;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Tracks the bounding rect of a scroll/resize-affected surface element so that
|
|
13
|
+
* surface-relative overlays (floating table toolbar, layout-options anchor) can
|
|
14
|
+
* position themselves in viewport space.
|
|
15
|
+
*
|
|
16
|
+
* Consolidates the identical `surfaceRect` + rAF `scheduleRefresh` +
|
|
17
|
+
* scroll(capture)/resize listener block that used to be copy-pasted across
|
|
18
|
+
* `FloatingTableToolbar` and `FloatingLayoutOptions`.
|
|
19
|
+
*/
|
|
20
|
+
export declare function useSurfaceRect(surfaceRef: () => HTMLElement | undefined): SurfaceRectApi;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface FieldRowProps extends JSX.HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
/** Cross-axis alignment of the children. Defaults to `flex-end` so labelled
|
|
5
|
+
* fields of different heights line up on their inputs. */
|
|
6
|
+
align?: "start" | "center" | "end" | "stretch";
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Horizontal layout row for form fields. Replaces the ad-hoc
|
|
10
|
+
* `<div class="oasis-editor-dialog-row">` flex containers; children (typically
|
|
11
|
+
* `TextField`/`NumberField`/`SelectField`) grow to share the available width.
|
|
12
|
+
*/
|
|
13
|
+
export declare function FieldRow(props: FieldRowProps): JSX.Element;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface FormFieldProps extends JSX.HTMLAttributes<HTMLDivElement> {
|
|
4
|
+
label?: string;
|
|
5
|
+
for?: string;
|
|
6
|
+
description?: string;
|
|
7
|
+
error?: string;
|
|
8
|
+
labelClass?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare function FormField(props: FormFieldProps): JSX.Element;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
import { TextFieldProps } from './TextField.js';
|
|
3
|
+
|
|
4
|
+
export interface NumberFieldProps extends Omit<TextFieldProps, "type" | "onChange"> {
|
|
5
|
+
/** Called with the parsed number, or `null` when the field is empty/invalid. */
|
|
6
|
+
onChange?: (value: number | null) => void;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* `TextField` specialised for numeric input. Wraps the raw string from the DOM
|
|
10
|
+
* in a parse so consumers receive `number | null` instead of repeating
|
|
11
|
+
* `Number(event.currentTarget.value)` at every call site.
|
|
12
|
+
*/
|
|
13
|
+
export declare function NumberField(props: NumberFieldProps): JSX.Element;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface RadioProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "value"> {
|
|
4
|
+
label: string;
|
|
5
|
+
description?: string;
|
|
6
|
+
value: string;
|
|
7
|
+
onChange?: (checked: boolean) => void;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* A single radio button. Reuses the checkbox visual language. Inside a
|
|
11
|
+
* `RadioGroup` it derives `name`/`checked`/disabled from context; standalone it
|
|
12
|
+
* behaves like a controlled radio driven by its own props.
|
|
13
|
+
*/
|
|
14
|
+
export declare function Radio(props: RadioProps): JSX.Element;
|
|
15
|
+
export interface RadioGroupOption {
|
|
16
|
+
value: string;
|
|
17
|
+
label: string;
|
|
18
|
+
description?: string;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
}
|
|
21
|
+
export interface RadioGroupProps {
|
|
22
|
+
/** Shared `name` for the radios; auto-generated when omitted. */
|
|
23
|
+
name?: string;
|
|
24
|
+
label?: string;
|
|
25
|
+
value?: string;
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
onChange?: (value: string) => void;
|
|
28
|
+
/** Declarative options. Omit to provide `Radio` children directly. */
|
|
29
|
+
options?: RadioGroupOption[];
|
|
30
|
+
class?: string;
|
|
31
|
+
children?: JSX.Element;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Groups radios under one `name` and owns the selected value, mirroring the
|
|
35
|
+
* controller-style API of `SelectField`. Pass `options` for the common case or
|
|
36
|
+
* `Radio` children for custom layout.
|
|
37
|
+
*/
|
|
38
|
+
export declare function RadioGroup(props: RadioGroupProps): JSX.Element;
|
|
@@ -9,6 +9,8 @@ export interface SelectFieldProps extends Omit<JSX.SelectHTMLAttributes<HTMLSele
|
|
|
9
9
|
label?: string;
|
|
10
10
|
description?: string;
|
|
11
11
|
error?: string;
|
|
12
|
+
labelClass?: string;
|
|
13
|
+
controlClass?: string;
|
|
12
14
|
options: SelectFieldOption[];
|
|
13
15
|
onChange?: (value: string) => void;
|
|
14
16
|
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface SurfaceButtonProps extends JSX.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4
|
+
icon?: string;
|
|
5
|
+
label?: string;
|
|
6
|
+
variant?: "ghost" | "secondary";
|
|
7
|
+
size?: "sm" | "md";
|
|
8
|
+
active?: boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare function SurfaceButton(props: SurfaceButtonProps): JSX.Element;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface TextProps extends JSX.HTMLAttributes<HTMLSpanElement> {
|
|
4
|
+
as?: "span" | "p" | "strong";
|
|
5
|
+
tone?: "default" | "muted" | "danger";
|
|
6
|
+
size?: "sm" | "md";
|
|
7
|
+
}
|
|
8
|
+
export declare function Text(props: TextProps): JSX.Element;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface TextAreaFieldProps extends Omit<JSX.TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> {
|
|
4
|
+
label?: string;
|
|
5
|
+
description?: string;
|
|
6
|
+
error?: string;
|
|
7
|
+
labelClass?: string;
|
|
8
|
+
controlClass?: string;
|
|
9
|
+
onChange?: (value: string) => void;
|
|
10
|
+
}
|
|
11
|
+
export declare function TextAreaField(props: TextAreaFieldProps): JSX.Element;
|
|
@@ -4,6 +4,8 @@ export interface TextFieldProps extends Omit<JSX.InputHTMLAttributes<HTMLInputEl
|
|
|
4
4
|
label?: string;
|
|
5
5
|
description?: string;
|
|
6
6
|
error?: string;
|
|
7
|
+
labelClass?: string;
|
|
8
|
+
controlClass?: string;
|
|
7
9
|
onChange?: (value: string) => void;
|
|
8
10
|
}
|
|
9
11
|
export declare function TextField(props: TextFieldProps): JSX.Element;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
|
|
3
|
+
export interface ToggleChipProps extends Omit<JSX.InputHTMLAttributes<HTMLInputElement>, "type" | "onChange"> {
|
|
4
|
+
label: string;
|
|
5
|
+
/** Optional inline style for the label, e.g. to preview bold/italic effects. */
|
|
6
|
+
labelStyle?: JSX.CSSProperties;
|
|
7
|
+
onChange?: (checked: boolean) => void;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* A compact checkbox styled as a toggleable chip — for dense grids of boolean
|
|
11
|
+
* options (e.g. the font-effect toggles: bold, italic, small-caps...). The
|
|
12
|
+
* underlying control is a native checkbox so it stays accessible and form-aware.
|
|
13
|
+
*/
|
|
14
|
+
export declare function ToggleChip(props: ToggleChipProps): JSX.Element;
|
|
@@ -4,14 +4,38 @@ export { Tabs } from '../components/Tabs/Tabs.js';
|
|
|
4
4
|
export type { TabsItem, TabsProps } from '../components/Tabs/Tabs.js';
|
|
5
5
|
export { Button } from './Button.js';
|
|
6
6
|
export type { ButtonProps } from './Button.js';
|
|
7
|
+
export { SurfaceButton } from './SurfaceButton.js';
|
|
8
|
+
export type { SurfaceButtonProps } from './SurfaceButton.js';
|
|
7
9
|
export { IconButton } from './IconButton.js';
|
|
8
10
|
export type { IconButtonProps } from './IconButton.js';
|
|
11
|
+
export { Text } from './Text.js';
|
|
12
|
+
export type { TextProps } from './Text.js';
|
|
13
|
+
export { Heading } from './Heading.js';
|
|
14
|
+
export type { HeadingProps } from './Heading.js';
|
|
15
|
+
export { StatusText } from './StatusText.js';
|
|
16
|
+
export type { StatusTextProps } from './StatusText.js';
|
|
17
|
+
export { ActionRow } from './ActionRow.js';
|
|
18
|
+
export type { ActionRowProps } from './ActionRow.js';
|
|
19
|
+
export { FormField } from './FormField.js';
|
|
20
|
+
export type { FormFieldProps } from './FormField.js';
|
|
9
21
|
export { TextField } from './TextField.js';
|
|
10
22
|
export type { TextFieldProps } from './TextField.js';
|
|
23
|
+
export { TextAreaField } from './TextAreaField.js';
|
|
24
|
+
export type { TextAreaFieldProps } from './TextAreaField.js';
|
|
11
25
|
export { Checkbox } from './Checkbox.js';
|
|
12
26
|
export type { CheckboxProps } from './Checkbox.js';
|
|
13
27
|
export { SelectField } from './SelectField.js';
|
|
14
28
|
export type { SelectFieldOption, SelectFieldProps } from './SelectField.js';
|
|
29
|
+
export { NumberField } from './NumberField.js';
|
|
30
|
+
export type { NumberFieldProps } from './NumberField.js';
|
|
31
|
+
export { Radio, RadioGroup } from './Radio.js';
|
|
32
|
+
export type { RadioGroupOption, RadioGroupProps, RadioProps } from './Radio.js';
|
|
33
|
+
export { FieldRow } from './FieldRow.js';
|
|
34
|
+
export type { FieldRowProps } from './FieldRow.js';
|
|
35
|
+
export { FieldGroup } from './FieldGroup.js';
|
|
36
|
+
export type { FieldGroupProps } from './FieldGroup.js';
|
|
37
|
+
export { ToggleChip } from './ToggleChip.js';
|
|
38
|
+
export type { ToggleChipProps } from './ToggleChip.js';
|
|
15
39
|
export { DialogFooter } from './DialogFooter.js';
|
|
16
40
|
export type { DialogFooterProps } from './DialogFooter.js';
|
|
17
41
|
export { FloatingActionButton } from './FloatingActionButton.js';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "oasis-editor",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.118",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -59,6 +59,7 @@
|
|
|
59
59
|
"test": "vitest run",
|
|
60
60
|
"test:word-parity": "vitest run --config vitest.word-parity.config.js",
|
|
61
61
|
"check:imports": "node ./scripts/check-import-graph.mjs",
|
|
62
|
+
"check:native-ui": "node ./scripts/check-native-ui-elements.mjs",
|
|
62
63
|
"typecheck": "tsc --noEmit",
|
|
63
64
|
"lint": "eslint src --ext .ts,.tsx",
|
|
64
65
|
"format": "prettier --write \"src/**/*.{ts,tsx}\""
|