@kwiz/fluentui 1.0.84 → 1.0.85

package/dist/controls/drawer-ex.d.ts

@@ -0,0 +1,10 @@
+import { DrawerHeaderProps, DrawerHeaderTitleProps, DrawerProps } from "@fluentui/react-components";
+import { ReactNode } from "react";
+export default function DrawerEX(props: {
+    rootProps?: DrawerProps;
+    headerProps?: DrawerHeaderProps;
+    headerTitleProps?: DrawerHeaderTitleProps;
+    children?: ReactNode;
+    title?: string;
+    titleActions?: JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/controls/drawer-ex.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Drawer, DrawerBody, DrawerHeader, drawerHeaderClassNames, DrawerHeaderTitle, makeStyles, tokens } from "@fluentui/react-components";
+import { useCommonStyles } from "../styles/styles";
+const useStyles = makeStyles({
+    drawer: {
+        border: 0,
+        [`&>.${drawerHeaderClassNames.root}`]: {
+            boxShadow: tokens.shadow4Brand,
+            backgroundColor: tokens.colorBrandBackground,
+            color: tokens.colorNeutralBackground1,
+            padding: tokens.spacingVerticalXL,
+            '& button': {
+                color: tokens.colorNeutralBackground1
+            }
+        }
+    }
+});
+export default function DrawerEX(props) {
+    var _a, _b;
+    const commonStyles = useCommonStyles();
+    const css = useStyles();
+    return _jsxs(Drawer, Object.assign({}, props.rootProps, { className: css.drawer, children: [_jsx(DrawerHeader, Object.assign({}, props.headerProps, { className: commonStyles.header, children: _jsx(DrawerHeaderTitle, Object.assign({}, props.headerTitleProps, { action: props.titleActions || ((_a = props.headerTitleProps) === null || _a === void 0 ? void 0 : _a.action), children: props.title || ((_b = props.headerTitleProps) === null || _b === void 0 ? void 0 : _b.children) })) })), _jsx(DrawerBody, { children: props.children })] }));
+}
+//# sourceMappingURL=drawer-ex.js.map

package/dist/controls/drawer-ex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-ex.js","sourceRoot":"","sources":["../../src/controls/drawer-ex.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,sBAAsB,EAAqB,iBAAiB,EAAuC,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAErM,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,MAAM,EAAE;QACJ,MAAM,EAAE,CAAC;QACT,CAAC,MAAM,sBAAsB,CAAC,IAAI,EAAE,CAAC,EAAE;YACnC,SAAS,EAAE,MAAM,CAAC,YAAY;YAC9B,eAAe,EAAE,MAAM,CAAC,oBAAoB;YAC5C,KAAK,EAAE,MAAM,CAAC,uBAAuB;YACrC,OAAO,EAAE,MAAM,CAAC,iBAAiB;YACjC,UAAU,EAAE;gBACR,KAAK,EAAE,MAAM,CAAC,uBAAuB;aACxC;SAEJ;KACJ;CACJ,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAOhC;;IACG,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,MAAM,GAAG,GAAG,SAAS,EAAE,CAAC;IACxB,OAAO,MAAC,MAAM,oBAAK,KAAK,CAAC,SAAS,IAAE,SAAS,EAAE,GAAG,CAAC,MAAM,aACrD,KAAC,YAAY,oBAAK,KAAK,CAAC,WAAW,IAAE,SAAS,EAAE,YAAY,CAAC,MAAM,YAC/D,KAAC,iBAAiB,oBAAK,KAAK,CAAC,gBAAgB,IAAE,MAAM,EAAE,KAAK,CAAC,YAAY,KAAI,MAAA,KAAK,CAAC,gBAAgB,0CAAE,MAAM,CAAA,YACtG,KAAK,CAAC,KAAK,KAAI,MAAA,KAAK,CAAC,gBAAgB,0CAAE,QAAQ,CAAA,IAChC,IACT,EACf,KAAC,UAAU,cACN,KAAK,CAAC,QAAQ,GACN,KACR,CAAC;AACd,CAAC"}

package/dist/controls/field-set.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+export declare function FieldSet({ title, children }: {
+    title: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function HorizontalFieldSet({ title, children }: {
+    title: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/controls/field-set.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { makeStyles, shorthands, tokens } from "@fluentui/react-components";
+import { Horizontal } from "./horizontal";
+const useStyles = makeStyles({
+    fieldset: Object.assign({ borderRadius: tokens.borderRadiusMedium }, shorthands.borderColor(tokens.colorNeutralStrokeSubtle)),
+    horizontal: {
+        alignItems: "start"
+    }
+});
+export function FieldSet({ title, children }) {
+    const css = useStyles();
+    return _jsxs("fieldset", { className: css.fieldset, children: [_jsx("legend", { children: title }), children] });
+}
+export function HorizontalFieldSet({ title, children }) {
+    const css = useStyles();
+    return _jsx(FieldSet, { title: title, children: _jsx(Horizontal, { wrap: true, css: [css.horizontal], children: children }) });
+}
+//# sourceMappingURL=field-set.js.map

package/dist/controls/field-set.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-set.js","sourceRoot":"","sources":["../../src/controls/field-set.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE5E,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,QAAQ,kBACJ,YAAY,EAAE,MAAM,CAAC,kBAAkB,IACpC,UAAU,CAAC,WAAW,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAC7D;IACD,UAAU,EAAE;QACR,UAAU,EAAE,OAAO;KACtB;CACJ,CAAC,CAAC;AAEH,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,QAAQ,EAA0C;IAChF,MAAM,GAAG,GAAG,SAAS,EAAE,CAAC;IAExB,OAAO,oBAAU,SAAS,EAAE,GAAG,CAAC,QAAQ,aACpC,2BAAS,KAAK,GAAU,EACvB,QAAQ,IACF,CAAC;AAChB,CAAC;AACD,MAAM,UAAU,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAA0C;IAC1F,MAAM,GAAG,GAAG,SAAS,EAAE,CAAC;IAExB,OAAO,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YACzB,KAAC,UAAU,IAAC,IAAI,QAAC,GAAG,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,YACjC,QAAQ,GACA,GACN,CAAC;AAChB,CAAC"}

package/dist/controls/horizontal.d.ts

@@ -1,11 +1,9 @@
 import React from 'react';
-import { ISectionProps } from './section';
-interface IProps extends ISectionProps {
-    wrap?: boolean;
-    nogap?: boolean;
-    /** vertical align center */
+import { IStackProps } from './stack';
+interface IProps extends Omit<IStackProps, "direction" | "justified"> {
+    /** vertical align items center */
     centered?: boolean;
-    /** horizontal centered */
+    /** align items horizontal centered */
     hCentered?: boolean;
 }
 export declare const Horizontal: (props: IProps & {

package/dist/controls/horizontal.js

@@ -1,34 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { makeStyles } from '@fluentui/react-components';
-import { isNotEmptyArray } from '@kwiz/common';
 import React from 'react';
-import { KnownClassNames, mixins } from '../styles/styles';
-import { Section } from './section';
-const useStyles = makeStyles({
-    horizontal: Object.assign(Object.assign({}, mixins.flex), { flexDirection: 'row' }),
-    wrap: mixins.wrap,
-    nogap: mixins.nogap,
-    centered: {
-        alignItems: "center"
-    },
-    hCentered: {
-        justifyContent: "center"
-    },
-});
+import { Stack } from './stack';
 export const Horizontal = React.forwardRef((props, ref) => {
-    const cssNames = useStyles();
-    let css = [KnownClassNames.horizontal];
-    css.push(cssNames.horizontal);
-    if (props.wrap)
-        css.push(cssNames.wrap);
-    if (props.nogap)
-        css.push(cssNames.nogap);
-    if (props.centered)
-        css.push(cssNames.centered);
-    if (props.hCentered)
-        css.push(cssNames.hCentered);
-    if (isNotEmptyArray(props.css))
-        css.push(...props.css);
-    return (_jsx(Section, Object.assign({}, props, { css: css, ref: ref })));
+    return _jsx(Stack, Object.assign({}, props, { direction: 'h', justified: props.hCentered }));
 });
 //# sourceMappingURL=horizontal.js.map

package/dist/controls/horizontal.js.map

@@ -1 +1 @@
-{"version":3,"file":"horizontal.js","sourceRoot":"","sources":["../../src/controls/horizontal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAiB,OAAO,EAAE,MAAM,WAAW,CAAC;AAEnD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,UAAU,kCACH,MAAM,CAAC,IAAI,KACd,aAAa,EAAE,KAAK,GACvB;IACD,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,QAAQ,EAAE;QACN,UAAU,EAAE,QAAQ;KACvB;IACD,SAAS,EAAE;QACP,cAAc,EAAE,QAAQ;KAC3B;CACJ,CAAC,CAAA;AAUF,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAkD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACvG,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,IAAI,GAAG,GAAa,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IAEjD,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;IAC9B,IAAI,KAAK,CAAC,IAAI;QACV,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,KAAK,CAAC,KAAK;QACX,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC7B,IAAI,KAAK,CAAC,QAAQ;QACd,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAChC,IAAI,KAAK,CAAC,SAAS;QACf,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAEjC,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;QAAE,GAAG,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAEvD,OAAO,CACH,KAAC,OAAO,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAC7C,CAAC;AACN,CAAC,CAAC,CAAC"}
+{"version":3,"file":"horizontal.js","sourceRoot":"","sources":["../../src/controls/horizontal.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAe,KAAK,EAAE,MAAM,SAAS,CAAC;AAQ7C,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAkD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACvG,OAAO,KAAC,KAAK,oBAAK,KAAK,IACnB,SAAS,EAAC,GAAG,EACb,SAAS,EAAE,KAAK,CAAC,SAAS,IAAI,CAAC;AACvC,CAAC,CAAC,CAAC"}

package/dist/controls/index.d.ts

@@ -8,9 +8,11 @@ export * from './ColorPickerDialog';
 export * from './date';
 export * from './diagram-picker';
 export * from './divider';
+export * from './drawer-ex';
 export * from './dropdown';
 export * from './error-boundary';
 export * from './field-editor';
+export * from './field-set';
 export * from './file-upload';
 export * from './horizontal';
 export * from './html-editor/editor';
@@ -26,6 +28,7 @@ export * from './prompt';
 export * from './qrcode';
 export * from './search';
 export * from './section';
+export * from './stack';
 export * from './svg';
 export * from './toolbar';
 export * from './vertical';

package/dist/controls/index.js

@@ -8,9 +8,11 @@ export * from './ColorPickerDialog';
 export * from './date';
 export * from './diagram-picker';
 export * from './divider';
+export * from './drawer-ex';
 export * from './dropdown';
 export * from './error-boundary';
 export * from './field-editor';
+export * from './field-set';
 export * from './file-upload';
 export * from './horizontal';
 export * from './html-editor/editor';
@@ -26,6 +28,7 @@ export * from './prompt';
 export * from './qrcode';
 export * from './search';
 export * from './section';
+export * from './stack';
 export * from './svg';
 export * from './toolbar';
 export * from './vertical';

package/dist/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC"}

package/dist/controls/stack.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ISectionProps } from './section';
+export interface IStackProps extends ISectionProps {
+    /** h:horizontal, v:vertical */
+    direction: "h" | "v";
+    wrap?: boolean;
+    nogap?: boolean;
+    /** align items */
+    centered?: boolean;
+    /** justify items */
+    justified?: boolean;
+}
+export declare const Stack: (props: IStackProps & {
+    children?: React.ReactNode | undefined;
+} & React.RefAttributes<HTMLDivElement>) => React.JSX.Element | null;

package/dist/controls/stack.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { makeStyles } from '@fluentui/react-components';
+import { isNotEmptyArray } from '@kwiz/common';
+import React from 'react';
+import { KnownClassNames, mixins } from '../styles/styles';
+import { Section } from './section';
+const useStyles = makeStyles({
+    horizontal: Object.assign(Object.assign({}, mixins.flex), { flexDirection: 'row' }),
+    vertical: Object.assign(Object.assign({}, mixins.flex), { flexDirection: 'column' }),
+    wrap: mixins.wrap,
+    nogap: mixins.nogap,
+    centered: {
+        alignItems: "center"
+    },
+    justified: {
+        justifyContent: "center"
+    },
+});
+export const Stack = React.forwardRef((props, ref) => {
+    const cssNames = useStyles();
+    let css = [
+        props.direction === "h" ? KnownClassNames.horizontal : KnownClassNames.vertical,
+        props.direction === "h" ? cssNames.horizontal : cssNames.vertical
+    ];
+    if (props.wrap)
+        css.push(cssNames.wrap);
+    if (props.nogap)
+        css.push(cssNames.nogap);
+    if (props.centered)
+        css.push(cssNames.centered);
+    if (props.justified)
+        css.push(cssNames.justified);
+    if (isNotEmptyArray(props.css))
+        css.push(...props.css);
+    return (_jsx(Section, Object.assign({}, props, { css: css, ref: ref })));
+});
+//# sourceMappingURL=stack.js.map

package/dist/controls/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.js","sourceRoot":"","sources":["../../src/controls/stack.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAiB,OAAO,EAAE,MAAM,WAAW,CAAC;AAEnD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,UAAU,kCACH,MAAM,CAAC,IAAI,KACd,aAAa,EAAE,KAAK,GACvB;IACD,QAAQ,kCACD,MAAM,CAAC,IAAI,KACd,aAAa,EAAE,QAAQ,GAC1B;IACD,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,QAAQ,EAAE;QACN,UAAU,EAAE,QAAQ;KACvB;IACD,SAAS,EAAE;QACP,cAAc,EAAE,QAAQ;KAC3B;CACJ,CAAC,CAAA;AAYF,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAuD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACvG,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,IAAI,GAAG,GAAa;QAChB,KAAK,CAAC,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,QAAQ;QAC/E,KAAK,CAAC,SAAS,KAAK,GAAG,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,QAAQ;KACpE,CAAC;IAEF,IAAI,KAAK,CAAC,IAAI;QACV,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,KAAK,CAAC,KAAK;QACX,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC7B,IAAI,KAAK,CAAC,QAAQ;QACd,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAChC,IAAI,KAAK,CAAC,SAAS;QACf,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAEjC,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;QAAE,GAAG,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAEvD,OAAO,CACH,KAAC,OAAO,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAC7C,CAAC;AACN,CAAC,CAAC,CAAC"}

package/dist/controls/vertical.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import { ISectionProps } from './section';
-interface IProps extends ISectionProps {
-    wrap?: boolean;
-    nogap?: boolean;
-    /** vertical centered */
+import { IStackProps } from './stack';
+interface IProps extends Omit<IStackProps, "direction" | "justified"> {
+    /** horizontal align items center */
+    centered?: boolean;
+    /** align items vertical centered */
     vCentered?: boolean;
 }
 export declare const Vertical: (props: IProps & {

package/dist/controls/vertical.js

@@ -1,29 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { makeStyles } from '@fluentui/react-components';
-import { isNotEmptyArray } from '@kwiz/common';
 import React from 'react';
-import { KnownClassNames, mixins } from '../styles/styles';
-import { Section } from './section';
-const useStyles = makeStyles({
-    vertical: Object.assign(Object.assign({}, mixins.flex), { flexDirection: 'column' }),
-    wrap: mixins.wrap,
-    nogap: mixins.nogap,
-    vCentered: {
-        justifyContent: "center"
-    },
-});
+import { Stack } from './stack';
 export const Vertical = React.forwardRef((props, ref) => {
-    const cssNames = useStyles();
-    let css = [KnownClassNames.vertical];
-    css.push(cssNames.vertical);
-    if (props.wrap)
-        css.push(cssNames.wrap);
-    if (props.nogap)
-        css.push(cssNames.nogap);
-    if (props.vCentered)
-        css.push(cssNames.vCentered);
-    if (isNotEmptyArray(props.css))
-        css.push(...props.css);
-    return (_jsx(Section, Object.assign({}, props, { css: css, ref: ref })));
+    return _jsx(Stack, Object.assign({}, props, { direction: 'v', justified: props.vCentered }));
 });
 //# sourceMappingURL=vertical.js.map

package/dist/controls/vertical.js.map

@@ -1 +1 @@
-{"version":3,"file":"vertical.js","sourceRoot":"","sources":["../../src/controls/vertical.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAiB,OAAO,EAAE,MAAM,WAAW,CAAC;AAEnD,MAAM,SAAS,GAAG,UAAU,CAAC;IACzB,QAAQ,kCACD,MAAM,CAAC,IAAI,KACd,aAAa,EAAE,QAAQ,GAC1B;IACD,IAAI,EAAE,MAAM,CAAC,IAAI;IACjB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,SAAS,EAAE;QACP,cAAc,EAAE,QAAQ;KAC3B;CAEJ,CAAC,CAAA;AAQF,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAkD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrG,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,IAAI,GAAG,GAAa,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;IAE/C,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAC5B,IAAI,KAAK,CAAC,IAAI;QACV,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC5B,IAAI,KAAK,CAAC,KAAK;QACX,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC7B,IAAI,KAAK,CAAC,SAAS;QACf,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAEjC,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC;QAAE,GAAG,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IAEvD,OAAO,CACH,KAAC,OAAO,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI,CAC7C,CAAC;AACN,CAAC,CAAC,CAAC"}
+{"version":3,"file":"vertical.js","sourceRoot":"","sources":["../../src/controls/vertical.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAe,KAAK,EAAE,MAAM,SAAS,CAAC;AAQ7C,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAkD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrG,OAAO,KAAC,KAAK,oBAAK,KAAK,IACnB,SAAS,EAAC,GAAG,EACb,SAAS,EAAE,KAAK,CAAC,SAAS,IAAI,CAAC;AACvC,CAAC,CAAC,CAAC"}

package/dist/helpers/use-toast.d.ts

@@ -11,7 +11,9 @@ export type toastDispatcherType = (info: {
         text: string;
         onClick: () => void;
     }[];
-    intent?: ToastIntent;
+    intent?: ToastIntent | "progress";
+    media?: JSX.Element;
+    inverted?: boolean;
 }) => void;
 export declare function useToast(): {
     control: JSX.Element;

package/dist/helpers/use-toast.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Link, Toast, ToastBody, Toaster, ToastFooter, ToastTitle, useId, useToastController } from "@fluentui/react-components";
+import { Link, Spinner, Toast, ToastBody, Toaster, ToastFooter, ToastTitle, useId, useToastController } from "@fluentui/react-components";
 import { isNotEmptyArray } from "@kwiz/common";
 import { useKWIZFluentContext } from "./context-internal";
 export function useToast() {
@@ -9,8 +9,16 @@ export function useToast() {
     return {
         control: _jsx(Toaster, { mountNode: ctx.mountNode, toasterId: toasterId }),
         dispatch: info => {
-            dispatchToast(_jsxs(Toast, { children: [info.title && _jsx(ToastTitle, { action: info.titleAction ? _jsx(Link, { onClick: info.titleAction.onClick, children: info.titleAction.text }) : undefined, children: info.title }), info.body && _jsx(ToastBody, { subtitle: info.subtitle, children: info.body }), isNotEmptyArray(info.footerActions) &&
-                        _jsx(ToastFooter, { children: info.footerActions.map((a, i) => _jsx(Link, { onClick: a.onClick, children: a.text }, `l${i}`)) })] }), { intent: info.intent || "info" });
+            dispatchToast(_jsxs(Toast, { appearance: info.inverted ? "inverted" : undefined, children: [info.title && _jsx(ToastTitle, { media: info.media
+                            ? info.media
+                            : info.intent === "progress"
+                                ? _jsx(Spinner, { size: "tiny" })
+                                : undefined, action: info.titleAction ? _jsx(Link, { onClick: info.titleAction.onClick, children: info.titleAction.text }) : undefined, children: info.title }), info.body && _jsx(ToastBody, { subtitle: info.subtitle, children: info.body }), isNotEmptyArray(info.footerActions) &&
+                        _jsx(ToastFooter, { children: info.footerActions.map((a, i) => _jsx(Link, { onClick: a.onClick, children: a.text }, `l${i}`)) })] }), {
+                intent: info.intent === "progress"
+                    ? "info"
+                    : info.intent || "info"
+            });
         }
     };
 }

package/dist/helpers/use-toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-toast.js","sourceRoot":"","sources":["../../src/helpers/use-toast.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAe,UAAU,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAC9I,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAU1D,MAAM,UAAU,QAAQ;IAIpB,MAAM,GAAG,GAAG,oBAAoB,EAAE,CAAC;IACnC,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IACnC,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxD,OAAO;QACH,OAAO,EAAE,KAAC,OAAO,IAAC,SAAS,EAAE,GAAG,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,GAAI;QACpE,QAAQ,EAAE,IAAI,CAAC,EAAE;YACb,aAAa,CAAC,MAAC,KAAK,eACf,IAAI,CAAC,KAAK,IAAI,KAAC,UAAU,IAAC,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,YAAG,IAAI,CAAC,WAAW,CAAC,IAAI,GAAQ,CAAC,CAAC,CAAC,SAAS,YAAG,IAAI,CAAC,KAAK,GAAc,EACnK,IAAI,CAAC,IAAI,IAAI,KAAC,SAAS,IAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,YAAG,IAAI,CAAC,IAAI,GAAa,EACxE,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC;wBAChC,KAAC,WAAW,cACP,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,KAAC,IAAI,IAAe,OAAO,EAAE,CAAC,CAAC,OAAO,YAAG,CAAC,CAAC,IAAI,IAApC,IAAI,CAAC,EAAE,CAAqC,CAAC,GAChF,IAEd,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,MAAM,EAAE,CAAC,CAAC;QACjD,CAAC;KACJ,CAAA;AACL,CAAC"}
+{"version":3,"file":"use-toast.js","sourceRoot":"","sources":["../../src/helpers/use-toast.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAe,UAAU,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACvJ,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAa1D,MAAM,UAAU,QAAQ;IAIpB,MAAM,GAAG,GAAG,oBAAoB,EAAE,CAAC;IACnC,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;IACnC,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxD,OAAO;QACH,OAAO,EAAE,KAAC,OAAO,IAAC,SAAS,EAAE,GAAG,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,GAAI;QACpE,QAAQ,EAAE,IAAI,CAAC,EAAE;YACb,aAAa,CAAC,MAAC,KAAK,IAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,aAClE,IAAI,CAAC,KAAK,IAAI,KAAC,UAAU,IACtB,KAAK,EAAE,IAAI,CAAC,KAAK;4BACb,CAAC,CAAC,IAAI,CAAC,KAAK;4BACZ,CAAC,CAAC,IAAI,CAAC,MAAM,KAAK,UAAU;gCACxB,CAAC,CAAC,KAAC,OAAO,IAAC,IAAI,EAAC,MAAM,GAAG;gCACzB,CAAC,CAAC,SAAS,EACnB,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,YAAG,IAAI,CAAC,WAAW,CAAC,IAAI,GAAQ,CAAC,CAAC,CAAC,SAAS,YAAG,IAAI,CAAC,KAAK,GAClH,EACZ,IAAI,CAAC,IAAI,IAAI,KAAC,SAAS,IAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,YAAG,IAAI,CAAC,IAAI,GAAa,EACxE,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC;wBAChC,KAAC,WAAW,cACP,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,KAAC,IAAI,IAAe,OAAO,EAAE,CAAC,CAAC,OAAO,YAAG,CAAC,CAAC,IAAI,IAApC,IAAI,CAAC,EAAE,CAAqC,CAAC,GAChF,IAEd,EAAE;gBACN,MAAM,EACF,IAAI,CAAC,MAAM,KAAK,UAAU;oBACtB,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,MAAM;aAClC,CAAC,CAAC;QACP,CAAC;KACJ,CAAA;AACL,CAAC"}

package/dist/styles/styles.d.ts

@@ -26,7 +26,7 @@ export declare const KnownClassNames: {
     left: string;
     right: string;
 };
-export declare const useCommonStyles: () => Record<"hintLabel" | "validationLabel" | "fullscreen", string>;
+export declare const useCommonStyles: () => Record<"hintLabel" | "validationLabel" | "fullscreen" | "header", string>;
 export declare const commonSizes: {
     widthMedium: number;
     widthWide: number;

package/dist/styles/styles.js

@@ -87,6 +87,15 @@ export const useCommonStyles = makeStyles({
         padding: tokens.spacingHorizontalL,
         paddingLeft: "20px",
         paddingRight: "20px"
+    },
+    header: {
+        boxShadow: tokens.shadow4Brand,
+        backgroundColor: tokens.colorBrandBackground,
+        color: tokens.colorNeutralBackground1,
+        padding: `${tokens.spacingVerticalXL} ${tokens.spacingHorizontalXL}`,
+        '& button': {
+            color: tokens.colorNeutralBackground1
+        }
     }
 });
 export const commonSizes = {

package/dist/styles/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles/styles.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/styles/styles.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@kwiz/fluentui",
-    "version": "1.0.84",
+    "version": "1.0.85",
     "description": "KWIZ common controls for FluentUI",
     "module": "dist/index.js",
     "types": "dist/index.d.ts",
@@ -18,14 +18,15 @@
         "build-explain": "tsc --explainFiles",
         "check-dependencies": "madge --circular ./src",
         "create-link": "npm link",
-        "test": "depcruise src && node --import tsx --test src",
+        "test": "npm run prestart && depcruise src && node --import tsx --test src",
         "link-local-kwiz": "npm link @kwiz/common",
         "__update-kwiz-packages": "npm install @kwiz/common@latest",
         "npm-v-patch": "npm version patch && git push origin main:main && git push --tags",
         "npm-v-major": "npm version major && git push origin main:main && git push --tags",
         "npm-publish": "npm publish --access public",
         "reset-repo": "git fetch origin && git reset --hard origin/main",
-        "clear-npm-cache": "npm cache clean --force"
+        "clear-npm-cache": "npm cache clean --force",
+        "prestart": "check-node-version --node 18"
     },
     "repository": {
         "type": "git",
@@ -52,6 +53,7 @@
     "packageManager": "npm@9.5.1",
     "devDependencies": {
         "@types/qrcode": "^1.5.5",
+        "check-node-version": "^4.2.1",
         "dependency-cruiser": "^16.8.0",
         "fs-extra": "^11.2.0",
         "madge": "^6.1.0",