@axinom/mosaic-ui 0.74.0-rc.0 → 0.74.0-rc.2
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/cjs/components/FormStation/FormStation.d.ts.map +1 -1
- package/dist/cjs/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts +1 -1
- package/dist/cjs/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts.map +1 -1
- package/dist/cjs/components/FormStation/helpers/isFormContentAvailable.d.ts +8 -0
- package/dist/cjs/components/FormStation/helpers/isFormContentAvailable.d.ts.map +1 -0
- package/dist/cjs/components/InfoPanel/InfoPanel.d.ts +7 -1
- package/dist/cjs/components/InfoPanel/InfoPanel.d.ts.map +1 -1
- package/dist/cjs/components/InfoPanel/InfoPanelLayoutContext.d.ts +24 -0
- package/dist/cjs/components/InfoPanel/InfoPanelLayoutContext.d.ts.map +1 -0
- package/dist/cjs/components/InfoPanel/hooks/useCollapse.d.ts +7 -1
- package/dist/cjs/components/InfoPanel/hooks/useCollapse.d.ts.map +1 -1
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/components/FormStation/FormStation.d.ts.map +1 -1
- package/dist/esm/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts +1 -1
- package/dist/esm/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts.map +1 -1
- package/dist/esm/components/FormStation/helpers/isFormContentAvailable.d.ts +8 -0
- package/dist/esm/components/FormStation/helpers/isFormContentAvailable.d.ts.map +1 -0
- package/dist/esm/components/InfoPanel/InfoPanel.d.ts +7 -1
- package/dist/esm/components/InfoPanel/InfoPanel.d.ts.map +1 -1
- package/dist/esm/components/InfoPanel/InfoPanelLayoutContext.d.ts +24 -0
- package/dist/esm/components/InfoPanel/InfoPanelLayoutContext.d.ts.map +1 -0
- package/dist/esm/components/InfoPanel/hooks/useCollapse.d.ts +7 -1
- package/dist/esm/components/InfoPanel/hooks/useCollapse.d.ts.map +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/FormStation/FormStation.module.scss +31 -7
- package/src/components/FormStation/FormStation.spec.tsx +225 -1
- package/src/components/FormStation/FormStation.tsx +65 -15
- package/src/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.module.scss +23 -27
- package/src/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.tsx +18 -23
- package/src/components/FormStation/helpers/isFormContentAvailable.ts +14 -0
- package/src/components/InfoPanel/InfoPanel.module.scss +30 -3
- package/src/components/InfoPanel/InfoPanel.tsx +19 -4
- package/src/components/InfoPanel/InfoPanelLayoutContext.ts +27 -0
- package/src/components/InfoPanel/hooks/useCollapse.spec.tsx +215 -0
- package/src/components/InfoPanel/hooks/useCollapse.ts +21 -5
- package/src/styles/variables.scss +10 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormStation.d.ts","sourceRoot":"","sources":["../../../../src/components/FormStation/FormStation.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAC;AACnD,OAAc,
|
|
1
|
+
{"version":3,"file":"FormStation.d.ts","sourceRoot":"","sources":["../../../../src/components/FormStation/FormStation.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAC;AACnD,OAAc,EACZ,KAAK,iBAAiB,EAMvB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAI7C,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,gCAAgC,CAAC;AAC9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAChD,OAAO,KAAK,EACV,cAAc,EACd,eAAe,EACf,sBAAsB,EACtB,gBAAgB,EACjB,MAAM,sBAAsB,CAAC;AAW9B,MAAM,WAAW,gBAAgB,CAC/B,OAAO,SAAS,IAAI,GAAG,YAAY,EACnC,eAAe,GAAG,OAAO;IAEzB,4DAA4D;IAC5D,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC;IAC9B,mDAAmD;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kFAAkF;IAClF,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oEAAoE;IACpE,OAAO,CAAC,EAAE,cAAc,CAAC,OAAO,EAAE,eAAe,CAAC,EAAE,CAAC;IACrD,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uEAAuE;IACvE,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;OAGG;IACH,sBAAsB,CAAC,EAAE,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,MAAM,CAAC,CAAC;IACzE;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;OAEG;IACH,WAAW,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IACtC,mFAAmF;IACnF,gBAAgB,CAAC,EAAE,oBAAoB,CAAC,sBAAsB,CAAC,OAAO,CAAC,CAAC,CAAC;IACzE,8EAA8E;IAC9E,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,sDAAsD;IACtD,SAAS,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACxB,sEAAsE;IACtE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,8FAA8F;IAC9F,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,QAAQ,EAAE,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IACrD,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,GAAI,OAAO,SAAS,IAAI,EAAE,eAAe,GAAG,OAAO,EAAE,0UAqB1E,iBAAiB,CAClB,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAC3C,KAAG,GAAG,CAAC,OAgIP,CAAC"}
|
package/dist/cjs/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import type { Data } from '../../../types';
|
|
3
3
|
import type { FormStationProps } from '../FormStation';
|
|
4
4
|
import type { StationErrorStateType } from '../FormStation.models';
|
|
5
|
-
interface FormStationContentWrapperProps extends Pick<FormStationProps<Data>, 'stationMessage' | 'edgeToEdgeContent' | '
|
|
5
|
+
interface FormStationContentWrapperProps extends Pick<FormStationProps<Data>, 'stationMessage' | 'edgeToEdgeContent' | 'initialData'> {
|
|
6
6
|
stationError?: StationErrorStateType;
|
|
7
7
|
setStationError: React.Dispatch<React.SetStateAction<StationErrorStateType | undefined>>;
|
|
8
8
|
}
|
package/dist/cjs/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormStationContentWrapper.d.ts","sourceRoot":"","sources":["../../../../../src/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAG3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"FormStationContentWrapper.d.ts","sourceRoot":"","sources":["../../../../../src/components/FormStation/FormStationContentWrapper/FormStationContentWrapper.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAG3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAInE,UAAU,8BACR,SAAQ,IAAI,CACV,gBAAgB,CAAC,IAAI,CAAC,EACtB,gBAAgB,GAAG,mBAAmB,GAAG,aAAa,CACvD;IACD,YAAY,CAAC,EAAE,qBAAqB,CAAC;IACrC,eAAe,EAAE,KAAK,CAAC,QAAQ,CAC7B,KAAK,CAAC,cAAc,CAAC,qBAAqB,GAAG,SAAS,CAAC,CACxD,CAAC;CACH;AAED,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAC9C,8BAA8B,CAiD/B,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { Data } from '../../../types';
|
|
2
|
+
import type { InitialFormData } from '../FormStation.models';
|
|
3
|
+
/**
|
|
4
|
+
* True when the form content - and therefore anything rendered alongside it,
|
|
5
|
+
* such as the info panel - can be shown.
|
|
6
|
+
*/
|
|
7
|
+
export declare const isFormContentAvailable: (initialData: InitialFormData<Data>) => boolean;
|
|
8
|
+
//# sourceMappingURL=isFormContentAvailable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"isFormContentAvailable.d.ts","sourceRoot":"","sources":["../../../../../src/components/FormStation/helpers/isFormContentAvailable.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE7D;;;GAGG;AACH,eAAO,MAAM,sBAAsB,GACjC,aAAa,eAAe,CAAC,IAAI,CAAC,KACjC,OAI0B,CAAC"}
|
|
@@ -20,7 +20,13 @@ export interface InfoPanelProps {
|
|
|
20
20
|
* Required for auto-collapse when width is percentage, rem, or CSS variable
|
|
21
21
|
*/
|
|
22
22
|
minWidthThreshold?: number;
|
|
23
|
-
/**
|
|
23
|
+
/**
|
|
24
|
+
* Minimum width of the sibling content, used to work out when the panel no
|
|
25
|
+
* longer fits beside it (default: 740px).
|
|
26
|
+
*
|
|
27
|
+
* Applies to a standalone panel. A layout that declares its own minimum -
|
|
28
|
+
* such as `FormStation`, via its `infoPanel` prop - overrides this.
|
|
29
|
+
*/
|
|
24
30
|
siblingMinWidth?: number;
|
|
25
31
|
}
|
|
26
32
|
export declare const InfoPanel: React.FC<InfoPanelProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InfoPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/InfoPanel/InfoPanel.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"InfoPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/InfoPanel/InfoPanel.tsx"],"names":[],"mappings":"AACA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAMlD,MAAM,WAAW,cAAc;IAC7B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,qBAAqB;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uDAAuD;IACvD,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,2CAA2C;IAC3C,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAEhD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAuF9C,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Published by a layout component that places an `InfoPanel` in its own grid,
|
|
4
|
+
* describing the space the panel shares with the content beside it. An
|
|
5
|
+
* `InfoPanel` rendered without it observes its parent element instead.
|
|
6
|
+
*
|
|
7
|
+
* Internal contract - not re-exported from `index.ts`.
|
|
8
|
+
*/
|
|
9
|
+
export interface InfoPanelLayoutContextValue {
|
|
10
|
+
/** Element whose inline size bounds the [content + panel] region. */
|
|
11
|
+
measureRef: React.RefObject<HTMLElement>;
|
|
12
|
+
/**
|
|
13
|
+
* Width in px inside `measureRef` used by other content and so unavailable
|
|
14
|
+
* to the [content + panel] region, such as an actions panel.
|
|
15
|
+
*/
|
|
16
|
+
reservedWidth: number;
|
|
17
|
+
/**
|
|
18
|
+
* Minimum width in px the content beside the panel needs. Overrides
|
|
19
|
+
* `InfoPanelProps.siblingMinWidth`.
|
|
20
|
+
*/
|
|
21
|
+
contentMinWidth?: number;
|
|
22
|
+
}
|
|
23
|
+
export declare const InfoPanelLayoutContext: React.Context<InfoPanelLayoutContextValue | undefined>;
|
|
24
|
+
//# sourceMappingURL=InfoPanelLayoutContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InfoPanelLayoutContext.d.ts","sourceRoot":"","sources":["../../../../src/components/InfoPanel/InfoPanelLayoutContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;GAMG;AACH,MAAM,WAAW,2BAA2B;IAC1C,qEAAqE;IACrE,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,sBAAsB,wDAEvB,CAAC"}
|
|
@@ -6,8 +6,14 @@ interface UseCollapseOptions {
|
|
|
6
6
|
defaultCollapsed: boolean;
|
|
7
7
|
siblingMinWidth: number;
|
|
8
8
|
onCollapseChange?: (collapsed: boolean) => void;
|
|
9
|
+
/** Element to observe instead of the panel's parent. */
|
|
10
|
+
measureRef?: React.RefObject<HTMLElement>;
|
|
11
|
+
/** Width in px inside `measureRef` that is not available to the panel. */
|
|
12
|
+
reservedWidth?: number;
|
|
13
|
+
/** Minimum width the sibling content needs. Overrides `siblingMinWidth`. */
|
|
14
|
+
contentMinWidth?: number;
|
|
9
15
|
}
|
|
10
|
-
export declare const useCollapse: ({ containerRef, width, minWidthThreshold, collapsible, defaultCollapsed, siblingMinWidth, onCollapseChange, }: UseCollapseOptions) => {
|
|
16
|
+
export declare const useCollapse: ({ containerRef, width, minWidthThreshold, collapsible, defaultCollapsed, siblingMinWidth, onCollapseChange, measureRef, reservedWidth, contentMinWidth, }: UseCollapseOptions) => {
|
|
11
17
|
toggleCollapse: () => void;
|
|
12
18
|
isCollapsed: boolean;
|
|
13
19
|
isInitialized: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCollapse.d.ts","sourceRoot":"","sources":["../../../../../src/components/InfoPanel/hooks/useCollapse.ts"],"names":[],"mappings":"AAEA,UAAU,kBAAkB;IAC1B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"useCollapse.d.ts","sourceRoot":"","sources":["../../../../../src/components/InfoPanel/hooks/useCollapse.ts"],"names":[],"mappings":"AAEA,UAAU,kBAAkB;IAC1B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,wDAAwD;IACxD,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC1C,0EAA0E;IAC1E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4EAA4E;IAC5E,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AASD,eAAO,MAAM,WAAW,GAAI,2JAWzB,kBAAkB,KAAG;IACtB,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,OAAO,CAAC;IACvB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,gBAAgB,EAAE,OAAO,CAAC;CA8L3B,CAAC"}
|