origam 2.24.0 → 2.26.0
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/CHANGELOG.md +44 -0
- package/dist/src/assets/css/main.css +1 -1
- package/dist/src/assets/css/tokens/dark.css +2 -16
- package/dist/src/assets/css/tokens/light.css +1 -8
- package/dist/src/assets/scss/tokens/_dark.scss +2 -16
- package/dist/src/assets/scss/tokens/_light.scss +1 -8
- package/dist/src/components/Btn/OrigamBtn.vue +89 -124
- package/dist/src/components/Card/OrigamCard.vue +80 -13
- package/dist/src/components/DataTable/OrigamDataTable.vue +26 -1
- package/dist/src/components/DataTable/OrigamDataTableRows.vue +58 -12
- package/dist/src/components/ExpansionPanel/OrigamExpansionPanel.vue +4 -2
- package/dist/src/components/ExpansionPanel/OrigamExpansionPanelContent.vue +12 -3
- package/dist/src/components/Field/OrigamField.vue +120 -152
- package/dist/src/components/Skeleton/OrigamSkeleton.vue +2 -7
- package/dist/src/components/Switch/OrigamSwitch.vue +1 -69
- package/dist/src/enums/DataTable/data-table.enum.cjs +8 -2
- package/dist/src/enums/DataTable/data-table.enum.d.ts +16 -0
- package/dist/src/enums/DataTable/data-table.enum.js +6 -0
- package/dist/src/interfaces/Btn/btn.interface.d.ts +3 -3
- package/dist/src/interfaces/Commons/loader.interface.d.ts +13 -1
- package/dist/src/interfaces/Field/field.interface.d.ts +2 -2
- package/dist/src/interfaces/Skeleton/skeleton.interface.d.ts +13 -0
- package/dist/src/interfaces/Switch/switch.interface.d.ts +2 -2
- package/dist/src/types/Commons/loader.type.d.ts +24 -0
- package/dist/src/types/tokens.type.d.ts +1 -1
- package/dist/src/utils/DataTable/skeleton-cell.util.cjs +13 -0
- package/dist/src/utils/DataTable/skeleton-cell.util.d.ts +12 -0
- package/dist/src/utils/DataTable/skeleton-cell.util.js +7 -0
- package/dist/src/utils/Skeleton/skeleton.util.cjs +30 -0
- package/dist/src/utils/Skeleton/skeleton.util.d.ts +33 -0
- package/dist/src/utils/Skeleton/skeleton.util.js +23 -0
- package/dist/src/utils/index.cjs +22 -0
- package/dist/src/utils/index.d.ts +2 -0
- package/dist/src/utils/index.js +2 -0
- package/package.json +1 -1
|
@@ -3,10 +3,16 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.DATATABLE_SELECT_STRATEGY = void 0;
|
|
6
|
+
exports.DATATABLE_SKELETON_CELL = exports.DATATABLE_SELECT_STRATEGY = void 0;
|
|
7
7
|
var DATATABLE_SELECT_STRATEGY = exports.DATATABLE_SELECT_STRATEGY = /* @__PURE__ */(DATATABLE_SELECT_STRATEGY2 => {
|
|
8
8
|
DATATABLE_SELECT_STRATEGY2["SINGLE"] = "single";
|
|
9
9
|
DATATABLE_SELECT_STRATEGY2["PAGE"] = "page";
|
|
10
10
|
DATATABLE_SELECT_STRATEGY2["ALL"] = "all";
|
|
11
11
|
return DATATABLE_SELECT_STRATEGY2;
|
|
12
|
-
})(DATATABLE_SELECT_STRATEGY || {});
|
|
12
|
+
})(DATATABLE_SELECT_STRATEGY || {});
|
|
13
|
+
var DATATABLE_SKELETON_CELL = exports.DATATABLE_SKELETON_CELL = /* @__PURE__ */(DATATABLE_SKELETON_CELL2 => {
|
|
14
|
+
DATATABLE_SKELETON_CELL2["TEXT"] = "text";
|
|
15
|
+
DATATABLE_SKELETON_CELL2["END"] = "end";
|
|
16
|
+
DATATABLE_SKELETON_CELL2["CONTROL"] = "control";
|
|
17
|
+
return DATATABLE_SKELETON_CELL2;
|
|
18
|
+
})(DATATABLE_SKELETON_CELL || {});
|
|
@@ -3,3 +3,19 @@ export declare enum DATATABLE_SELECT_STRATEGY {
|
|
|
3
3
|
PAGE = "page",
|
|
4
4
|
ALL = "all"
|
|
5
5
|
}
|
|
6
|
+
/*********************************************************
|
|
7
|
+
* DATATABLE_SKELETON_CELL
|
|
8
|
+
*
|
|
9
|
+
* @description
|
|
10
|
+
* Silhouette a placeholder cell draws, derived from the COLUMN it belongs
|
|
11
|
+
* to (the table has no column "type"; its descriptor only carries `align`
|
|
12
|
+
* and the reserved `data-table-select` / `data-table-expand` keys).
|
|
13
|
+
* `text` is a bar from the start edge, `end` a shorter bar flush with the
|
|
14
|
+
* end edge (numbers, amounts), `control` a small square (checkbox,
|
|
15
|
+
* expand chevron).
|
|
16
|
+
********************************************************/
|
|
17
|
+
export declare enum DATATABLE_SKELETON_CELL {
|
|
18
|
+
TEXT = "text",
|
|
19
|
+
END = "end",
|
|
20
|
+
CONTROL = "control"
|
|
21
|
+
}
|
|
@@ -4,3 +4,9 @@ export var DATATABLE_SELECT_STRATEGY = /* @__PURE__ */ ((DATATABLE_SELECT_STRATE
|
|
|
4
4
|
DATATABLE_SELECT_STRATEGY2["ALL"] = "all";
|
|
5
5
|
return DATATABLE_SELECT_STRATEGY2;
|
|
6
6
|
})(DATATABLE_SELECT_STRATEGY || {});
|
|
7
|
+
export var DATATABLE_SKELETON_CELL = /* @__PURE__ */ ((DATATABLE_SKELETON_CELL2) => {
|
|
8
|
+
DATATABLE_SKELETON_CELL2["TEXT"] = "text";
|
|
9
|
+
DATATABLE_SKELETON_CELL2["END"] = "end";
|
|
10
|
+
DATATABLE_SKELETON_CELL2["CONTROL"] = "control";
|
|
11
|
+
return DATATABLE_SKELETON_CELL2;
|
|
12
|
+
})(DATATABLE_SKELETON_CELL || {});
|
|
@@ -9,7 +9,7 @@ import type { IElevationProps } from '../Commons/elevation.interface';
|
|
|
9
9
|
import type { IGroupEmits, IGroupItemProps } from '../Commons/group.interface';
|
|
10
10
|
import type { IHoverProps } from '../Commons/hover.interface';
|
|
11
11
|
import type { ILinkProps } from '../Commons/router.interface';
|
|
12
|
-
import type {
|
|
12
|
+
import type { IControlLoaderProps } from '../Commons/loader.interface';
|
|
13
13
|
import type { ILocationProps } from '../Commons/location.interface';
|
|
14
14
|
import type { IMarginProps } from '../Commons/margin.interface';
|
|
15
15
|
import type { IPaddingProps } from '../Commons/padding.interface';
|
|
@@ -25,7 +25,7 @@ import type { TStatus, TStatusPosition } from '../../types/Commons/status.type';
|
|
|
25
25
|
* `icon` prop accepts `boolean | TIcon` (boolean = icon-only mode) which is
|
|
26
26
|
* wider than `IIconProps.icon?: TIcon`. Pulling the two status props in
|
|
27
27
|
* directly avoids the TS2430 incompatible-extends error. */
|
|
28
|
-
export interface IBtnProps extends ICommonsComponentProps, IColorProps, IBgColorProps, IBorderProps, IDensityProps, IDimensionProps, IElevationProps, IRoundedProps, ITagProps, ISizeProps, ILinkProps, IRippleProps,
|
|
28
|
+
export interface IBtnProps extends ICommonsComponentProps, IColorProps, IBgColorProps, IBorderProps, IDensityProps, IDimensionProps, IElevationProps, IRoundedProps, ITagProps, ISizeProps, ILinkProps, IRippleProps, IControlLoaderProps, IPositionProps, ILocationProps, IGroupItemProps, IPaddingProps, IMarginProps, IAdjacentProps, IHoverProps, IActiveProps, IActionVariantProps, Pick<ITypographyProps, 'fontSize' | 'fontWeight' | 'lineHeight' | 'letterSpacing'> {
|
|
29
29
|
/** @deprecated Use `variant="flat"` instead. Kept for backward compat. */
|
|
30
30
|
flat?: boolean;
|
|
31
31
|
/** Pass `true` to activate icon-only mode; pass a `TIcon` value to set the icon. */
|
|
@@ -62,7 +62,7 @@ export interface IBtnEmits extends IGroupEmits {
|
|
|
62
62
|
export interface IBtnSlots extends IAdjacentSlots {
|
|
63
63
|
/** Overrides the whole loader/prepend/content/append layout. */
|
|
64
64
|
wrapper?: () => any;
|
|
65
|
-
/** Overrides the active loader (line/circular
|
|
65
|
+
/** Overrides the active loader (line/circular), receives the
|
|
66
66
|
* forwarded `<OrigamProgress>` props. */
|
|
67
67
|
loader?: (data: Record<string, unknown>) => any;
|
|
68
68
|
default?: () => any;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { IColorProps } from './color.interface';
|
|
2
2
|
import type { ICommonsComponentProps, ITagProps } from './commons.interface';
|
|
3
|
-
import type { TLoaderConfig, TLoaderKind, TLoadingValue } from '../../types/Commons/loader.type';
|
|
3
|
+
import type { TControlLoadingValue, TLoaderConfig, TLoaderKind, TLoadingValue } from '../../types/Commons/loader.type';
|
|
4
4
|
/*********************************************************
|
|
5
5
|
* ILoaderProps / IResolvedLoader
|
|
6
6
|
*
|
|
@@ -20,6 +20,18 @@ export interface ILoaderProps extends ICommonsComponentProps, ITagProps, IColorP
|
|
|
20
20
|
loading?: TLoadingValue;
|
|
21
21
|
loadingText?: string;
|
|
22
22
|
}
|
|
23
|
+
/*********************************************************
|
|
24
|
+
* IControlLoaderProps
|
|
25
|
+
*
|
|
26
|
+
* @description
|
|
27
|
+
* `ILoaderProps` for a CONTROL (`OrigamBtn`, `OrigamSwitch`, `OrigamField`
|
|
28
|
+
* and its derivatives): same surface, but `loading` refuses
|
|
29
|
+
* `{ type: 'skeleton' }` - an action in flight never replaces the control
|
|
30
|
+
* (see `TControlLoaderConfig`).
|
|
31
|
+
********************************************************/
|
|
32
|
+
export interface IControlLoaderProps extends Omit<ILoaderProps, 'loading'> {
|
|
33
|
+
loading?: TControlLoadingValue;
|
|
34
|
+
}
|
|
23
35
|
/**
|
|
24
36
|
* Resolved loader state — what each consumer component reads to decide
|
|
25
37
|
* which renderer to mount and with which props.
|
|
@@ -7,7 +7,7 @@ import type { IDensityProps } from '../Commons/density.interface';
|
|
|
7
7
|
import type { IElevationProps } from '../Commons/elevation.interface';
|
|
8
8
|
import type { IFocusEmits, IFocusProps } from '../Commons/focus.interface';
|
|
9
9
|
import type { ILabelProps } from '../Label/label.interface';
|
|
10
|
-
import type {
|
|
10
|
+
import type { IControlLoaderProps } from '../Commons/loader.interface';
|
|
11
11
|
import type { IRoundedProps } from '../Commons/rounded.interface';
|
|
12
12
|
import type { ISizeProps } from '../Commons/size.interface';
|
|
13
13
|
import type { ITypographyProps } from '../Commons/typography.interface';
|
|
@@ -31,7 +31,7 @@ import type { IInputVariantProps } from '../Commons/variant.interface';
|
|
|
31
31
|
* `--origam-field---border-*` token channel the three outline legs already
|
|
32
32
|
* read, so the notch keeps opening under `--active` / `--focused`.
|
|
33
33
|
********************************************************/
|
|
34
|
-
export interface IFieldProps extends ICommonsComponentProps,
|
|
34
|
+
export interface IFieldProps extends ICommonsComponentProps, IControlLoaderProps, IColorProps, IBgColorProps, IAdjacentInnerProps, IBorderProps, IFocusProps, IDensityProps, ILabelProps, IActiveProps, IInputVariantProps, IRoundedProps, IElevationProps, ISizeProps, Pick<ITypographyProps, 'fontSize' | 'fontWeight' | 'lineHeight' | 'letterSpacing'> {
|
|
35
35
|
centerAffix?: boolean;
|
|
36
36
|
dirty?: boolean;
|
|
37
37
|
disabled?: boolean;
|
|
@@ -4,6 +4,7 @@ import type { IDimensionProps } from '../Commons/dimension.interface';
|
|
|
4
4
|
import type { IRoundedProps } from '../Commons/rounded.interface';
|
|
5
5
|
import type { ISizeProps } from '../Commons/size.interface';
|
|
6
6
|
import type { TSkeletonAnimation, TSkeletonVariant } from '../../types/Skeleton/skeleton.type';
|
|
7
|
+
import type { ISkeletonGroupProps } from './skeleton-group.interface';
|
|
7
8
|
export interface ISkeletonProps extends ICommonsComponentProps, IColorProps, IBgColorProps, ISizeProps, IRoundedProps, IDimensionProps {
|
|
8
9
|
variant?: TSkeletonVariant;
|
|
9
10
|
loading?: boolean;
|
|
@@ -52,3 +53,15 @@ export interface ISkeletonProps extends ICommonsComponentProps, IColorProps, IBg
|
|
|
52
53
|
********************************************************/
|
|
53
54
|
export interface ISkeletonEmits {
|
|
54
55
|
}
|
|
56
|
+
/*********************************************************
|
|
57
|
+
* ISkeletonOverrides
|
|
58
|
+
*
|
|
59
|
+
* @description
|
|
60
|
+
* Result of `splitSkeletonOverrides()`: the `loading="{ type: 'skeleton' }"`
|
|
61
|
+
* bag split between the `<OrigamSkeletonGroup>` (per zone) and each
|
|
62
|
+
* primitive it contains (per block).
|
|
63
|
+
********************************************************/
|
|
64
|
+
export interface ISkeletonOverrides {
|
|
65
|
+
group: ISkeletonGroupProps;
|
|
66
|
+
block: Pick<ISkeletonProps, 'color' | 'bgColor' | 'rounded'>;
|
|
67
|
+
}
|
|
@@ -7,13 +7,13 @@ import type { IElevationProps } from '../Commons/elevation.interface';
|
|
|
7
7
|
import type { IFocusEmits } from '../Commons/focus.interface';
|
|
8
8
|
import type { IHoverProps } from '../Commons/hover.interface';
|
|
9
9
|
import type { IInputProps } from '../Input/input.interface';
|
|
10
|
-
import type {
|
|
10
|
+
import type { IControlLoaderProps } from '../Commons/loader.interface';
|
|
11
11
|
import type { IMarginProps } from '../Commons/margin.interface';
|
|
12
12
|
import type { IPaddingProps } from '../Commons/padding.interface';
|
|
13
13
|
import type { IRoundedProps } from '../Commons/rounded.interface';
|
|
14
14
|
import type { ISelectionControlProps } from '../SelectionControl/selection-control.interface';
|
|
15
15
|
import type { ISwitchTrackSlotsProps } from './switch-track.interface';
|
|
16
|
-
export interface ISwitchProps extends ICommonsComponentProps, ITagProps, IPaddingProps, IMarginProps, IBorderProps, IRoundedProps, IInputProps, ISelectionControlProps,
|
|
16
|
+
export interface ISwitchProps extends ICommonsComponentProps, ITagProps, IPaddingProps, IMarginProps, IBorderProps, IRoundedProps, IInputProps, ISelectionControlProps, IControlLoaderProps, IColorProps, IDensityProps, IElevationProps, IActiveProps, IHoverProps {
|
|
17
17
|
indeterminate?: boolean;
|
|
18
18
|
inset?: boolean;
|
|
19
19
|
}
|
|
@@ -35,3 +35,27 @@ export type TLoaderConfig = ({
|
|
|
35
35
|
* | `{ type: 'line' \| 'circular' \| 'skeleton', … }` | Loading with explicit kind override and per-instance prop overrides. |
|
|
36
36
|
*/
|
|
37
37
|
export type TLoadingValue = boolean | number | TLoaderConfig;
|
|
38
|
+
/*********************************************************
|
|
39
|
+
* TControlLoaderConfig / TControlLoadingValue
|
|
40
|
+
*
|
|
41
|
+
* @description
|
|
42
|
+
* Per-kind override config of a CONTROL (`OrigamBtn`, `OrigamSwitch`,
|
|
43
|
+
* `OrigamField` and its derivatives). A control that is mid-action keeps its
|
|
44
|
+
* label, its value and its input rendered: an action in flight is signalled
|
|
45
|
+
* by an indicator (spinner / strip), never by a placeholder that stands in
|
|
46
|
+
* for the control.
|
|
47
|
+
*
|
|
48
|
+
* @description
|
|
49
|
+
* So the `skeleton` member of `TLoaderConfig` is REFUSED at compile time
|
|
50
|
+
* here: `{ type: 'skeleton' }` is a type error on these components.
|
|
51
|
+
* Skeleton placeholders stay available on the containers whose content
|
|
52
|
+
* genuinely does not exist yet (Card, ExpansionPanel, DataTable).
|
|
53
|
+
*
|
|
54
|
+
* @description
|
|
55
|
+
* `TControlLoadingValue` is the `loading` prop value a control accepts:
|
|
56
|
+
* `TLoadingValue` minus the skeleton placeholder.
|
|
57
|
+
********************************************************/
|
|
58
|
+
export type TControlLoaderConfig = Exclude<TLoaderConfig, {
|
|
59
|
+
type: `${LOADER_KIND.SKELETON}`;
|
|
60
|
+
}>;
|
|
61
|
+
export type TControlLoadingValue = boolean | number | TControlLoaderConfig;
|