antdv-next 0.0.111 → 1.0.0-alpha.1

package/dist/descriptions/style/index.d.ts

@@ -0,0 +1,59 @@
+import "../../theme/internal.js";
+import "vue";
+
+//#region src/descriptions/style/index.d.ts
+/** Component only token. Which will handle additional calculation of alias token */
+interface ComponentToken {
+  /**
+   * @desc 标签背景色
+   * @descEN Background color of label
+   */
+  labelBg: string;
+  /**
+   * @desc 标签文字颜色
+   * @descEN Text color of label
+   */
+  labelColor: string;
+  /**
+   * @desc 标题文字颜色
+   * @descEN Text color of title
+   */
+  titleColor: string;
+  /**
+   * @desc 标题下间距
+   * @descEN Bottom margin of title
+   */
+  titleMarginBottom: number;
+  /**
+   * @desc 子项下间距
+   * @descEN Bottom padding of item
+   */
+  itemPaddingBottom: number;
+  /**
+   * @desc 子项结束间距
+   * @descEN End padding of item
+   */
+  itemPaddingEnd: number;
+  /**
+   * @desc 冒号右间距
+   * @descEN Right margin of colon
+   */
+  colonMarginRight: number;
+  /**
+   * @desc 冒号左间距
+   * @descEN Left margin of colon
+   */
+  colonMarginLeft: number;
+  /**
+   * @desc 内容区域文字颜色
+   * @descEN Text color of content
+   */
+  contentColor: string;
+  /**
+   * @desc 额外区域文字颜色
+   * @descEN Text color of extra area
+   */
+  extraColor: string;
+}
+//#endregion
+export { ComponentToken };

package/dist/descriptions/style/index.js

@@ -0,0 +1,144 @@
+import { resetComponent, textEllipsis } from "../../style/index.js";
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { mergeToken } from "../../theme/internal.js";
+import { unit } from "@antdv-next/cssinjs";
+
+//#region src/descriptions/style/index.ts
+function genBorderedStyle(token) {
+	const { componentCls, labelBg } = token;
+	return { [`&${componentCls}-bordered`]: {
+		[`> ${componentCls}-view`]: {
+			"border": `${unit(token.lineWidth)} ${token.lineType} ${token.colorSplit}`,
+			"> table": { tableLayout: "auto" },
+			[`${componentCls}-row`]: {
+				"borderBottom": `${unit(token.lineWidth)} ${token.lineType} ${token.colorSplit}`,
+				"&:first-child": { "> th:first-child, > td:first-child": { borderStartStartRadius: token.borderRadiusLG } },
+				"&:last-child": {
+					"borderBottom": "none",
+					"> th:first-child, > td:first-child": { borderEndStartRadius: token.borderRadiusLG }
+				},
+				[`> ${componentCls}-item-label, > ${componentCls}-item-content`]: {
+					"padding": `${unit(token.padding)} ${unit(token.paddingLG)}`,
+					"borderInlineEnd": `${unit(token.lineWidth)} ${token.lineType} ${token.colorSplit}`,
+					"&:last-child": { borderInlineEnd: "none" }
+				},
+				[`> ${componentCls}-item-label`]: {
+					"color": token.colorTextSecondary,
+					"backgroundColor": labelBg,
+					"&::after": { display: "none" }
+				}
+			}
+		},
+		[`&${componentCls}-middle`]: { [`${componentCls}-row`]: { [`> ${componentCls}-item-label, > ${componentCls}-item-content`]: { padding: `${unit(token.paddingSM)} ${unit(token.paddingLG)}` } } },
+		[`&${componentCls}-small`]: { [`${componentCls}-row`]: { [`> ${componentCls}-item-label, > ${componentCls}-item-content`]: { padding: `${unit(token.paddingXS)} ${unit(token.padding)}` } } }
+	} };
+}
+const genDescriptionStyles = (token) => {
+	const { componentCls, extraColor, itemPaddingBottom, itemPaddingEnd, colonMarginRight, colonMarginLeft, titleMarginBottom } = token;
+	return { [componentCls]: {
+		...resetComponent(token),
+		...genBorderedStyle(token),
+		"&-rtl": { direction: "rtl" },
+		[`${componentCls}-header`]: {
+			display: "flex",
+			alignItems: "center",
+			marginBottom: titleMarginBottom
+		},
+		[`${componentCls}-title`]: {
+			...textEllipsis,
+			flex: "auto",
+			color: token.titleColor,
+			fontWeight: token.fontWeightStrong,
+			fontSize: token.fontSizeLG,
+			lineHeight: token.lineHeightLG
+		},
+		[`${componentCls}-extra`]: {
+			marginInlineStart: "auto",
+			color: extraColor,
+			fontSize: token.fontSize
+		},
+		[`${componentCls}-view`]: {
+			width: "100%",
+			borderRadius: token.borderRadiusLG,
+			table: {
+				width: "100%",
+				tableLayout: "fixed",
+				borderCollapse: "collapse"
+			}
+		},
+		[`${componentCls}-row`]: {
+			"> th, > td": {
+				paddingBottom: itemPaddingBottom,
+				paddingInlineEnd: itemPaddingEnd
+			},
+			"> th:last-child, > td:last-child": { paddingInlineEnd: 0 },
+			"&:last-child": {
+				"borderBottom": "none",
+				"> th, > td": { paddingBottom: 0 }
+			}
+		},
+		[`${componentCls}-item-label`]: {
+			"color": token.labelColor,
+			"fontWeight": "normal",
+			"fontSize": token.fontSize,
+			"lineHeight": token.lineHeight,
+			"textAlign": "start",
+			"&::after": {
+				content: "\":\"",
+				position: "relative",
+				top: -.5,
+				marginInline: `${unit(colonMarginLeft)} ${unit(colonMarginRight)}`
+			},
+			[`&${componentCls}-item-no-colon::after`]: { content: "\"\"" }
+		},
+		[`${componentCls}-item-no-label`]: { "&::after": {
+			margin: 0,
+			content: "\"\""
+		} },
+		[`${componentCls}-item-content`]: {
+			display: "table-cell",
+			flex: 1,
+			color: token.contentColor,
+			fontSize: token.fontSize,
+			lineHeight: token.lineHeight,
+			wordBreak: "break-word",
+			overflowWrap: "break-word"
+		},
+		[`${componentCls}-item`]: {
+			"paddingBottom": 0,
+			"verticalAlign": "top",
+			"&-container": {
+				display: "flex",
+				[`${componentCls}-item-label`]: {
+					display: "inline-flex",
+					alignItems: "baseline"
+				},
+				[`${componentCls}-item-content`]: {
+					display: "inline-flex",
+					alignItems: "baseline",
+					minWidth: "1em"
+				}
+			}
+		},
+		"&-middle": { [`${componentCls}-row`]: { "> th, > td": { paddingBottom: token.paddingSM } } },
+		"&-small": { [`${componentCls}-row`]: { "> th, > td": { paddingBottom: token.paddingXS } } }
+	} };
+};
+const prepareComponentToken = (token) => ({
+	labelBg: token.colorFillAlter,
+	labelColor: token.colorTextTertiary,
+	titleColor: token.colorText,
+	titleMarginBottom: token.fontSizeSM * token.lineHeightSM,
+	itemPaddingBottom: token.padding,
+	itemPaddingEnd: token.padding,
+	colonMarginRight: token.marginXS,
+	colonMarginLeft: token.marginXXS / 2,
+	contentColor: token.colorText,
+	extraColor: token.colorText
+});
+var style_default = genStyleHooks("Descriptions", (token) => {
+	return genDescriptionStyles(mergeToken(token, {}));
+}, prepareComponentToken);
+
+//#endregion
+export { style_default as default };

package/dist/divider/index.d.ts

@@ -0,0 +1,37 @@
+import { SemanticClassNamesType, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import { Orientation } from "../_util/hooks/useOrientation.js";
+import "../_util/hooks/index.js";
+import { SizeType } from "../config-provider/SizeContext.js";
+import { ComponentBaseProps } from "../config-provider/context.js";
+import * as vue80 from "vue";
+
+//#region src/divider/index.d.ts
+type SemanticName = 'root' | 'rail' | 'content';
+type TitlePlacement = 'left' | 'right' | 'center' | 'start' | 'end';
+type DividerClassNamesType = SemanticClassNamesType<DividerProps, SemanticName>;
+type DividerStylesType = SemanticStylesType<DividerProps, SemanticName>;
+interface DividerProps extends ComponentBaseProps {
+  /**  @deprecated please use `orientation` */
+  type?: Orientation;
+  /**
+   * @default center
+   */
+  orientation?: Orientation;
+  vertical?: boolean;
+  titlePlacement?: TitlePlacement;
+  /** @deprecated please use `styles.content.margin` */
+  orientationMargin?: string | number;
+  dashed?: boolean;
+  /**
+   * @since 5.20.0
+   * @default solid
+   */
+  variant?: 'dashed' | 'dotted' | 'solid';
+  size?: SizeType;
+  plain?: boolean;
+  classes?: DividerClassNamesType;
+  styles?: DividerStylesType;
+}
+declare const Divider: vue80.DefineSetupFnComponent<DividerProps, {}, {}, DividerProps & {}, vue80.PublicProps>;
+//#endregion
+export { Divider, DividerProps };

package/dist/divider/index.js

@@ -0,0 +1,171 @@
+import { useComponentBaseConfig } from "../config-provider/context.js";
+import { pureAttrs, useMergeSemantic, useToArr } from "../_util/hooks/useMergeSemantic.js";
+import { useOrientation } from "../_util/hooks/useOrientation.js";
+import "../_util/hooks/index.js";
+import { toPropsRefs } from "../_util/tools.js";
+import { useSize } from "../config-provider/hooks/useSize.js";
+import style_default from "./style/index.js";
+import { Fragment, computed, createVNode, defineComponent, mergeDefaults, mergeProps } from "vue";
+import { classNames } from "@v-c/util";
+import { filterEmpty } from "@v-c/util/dist/props-util";
+
+//#region src/divider/index.tsx
+const titlePlacementList = [
+	"left",
+	"right",
+	"center",
+	"start",
+	"end"
+];
+const sizeClassNameMap = {
+	small: "sm",
+	middle: "md"
+};
+const Divider = /* @__PURE__ */ defineComponent((props, { slots, attrs }) => {
+	const { class: contextClassName, classes: contextClassNames, styles: contextStyles, direction, prefixCls } = useComponentBaseConfig("divider", props);
+	const { type, vertical, orientation, classes, styles, size } = toPropsRefs(props, "orientation", "vertical", "type", "classes", "styles", "size");
+	const [hashId, cssVarCls] = style_default(prefixCls);
+	const sizeFullName = useSize(size);
+	const sizeCls = computed(() => sizeClassNameMap[sizeFullName.value]);
+	const validTitlePlacement = computed(() => titlePlacementList.includes(orientation.value || ""));
+	const mergedTitlePlacement = computed(() => {
+		const placement = props?.titlePlacement ?? (validTitlePlacement.value ? orientation.value : "center");
+		if (placement === "left") return direction.value === "rtl" ? "end" : "start";
+		if (placement === "right") return direction.value === "rtl" ? "start" : "end";
+		return placement;
+	});
+	const hasMarginStart = computed(() => mergedTitlePlacement.value === "start" && props.orientationMargin != null);
+	const hasMarginEnd = computed(() => mergedTitlePlacement.value === "end" && props.orientationMargin != null);
+	const [mergedOrientation, mergedVertical] = useOrientation(orientation, vertical, type);
+	const mergedProps = computed(() => {
+		return {
+			...props,
+			orientation: mergedOrientation.value,
+			titlePlacement: mergedTitlePlacement.value,
+			size: sizeFullName.value
+		};
+	});
+	const [mergedClassNames, mergedStyles] = useMergeSemantic(useToArr(contextClassNames, classes), useToArr(contextStyles, styles), computed(() => {
+		return { props: mergedProps.value };
+	}));
+	const memoizedOrientationMargin = computed(() => {
+		const orientationMargin = props.orientationMargin;
+		if (typeof orientationMargin === "number") return `${orientationMargin}px`;
+		if (/^\d+$/.test(orientationMargin)) return `${Number(orientationMargin)}px`;
+		return orientationMargin;
+	});
+	return () => {
+		const { variant, dashed, plain, rootClass } = props;
+		const children = filterEmpty(slots?.default?.());
+		const hasChildren = children.length > 0;
+		const railCls = `${prefixCls.value}-rail`;
+		const classString = classNames(prefixCls.value, contextClassName?.value, hashId.value, cssVarCls.value, `${prefixCls.value}-${mergedOrientation.value}`, {
+			[`${prefixCls.value}-with-text`]: hasChildren,
+			[`${prefixCls.value}-with-text-${mergedTitlePlacement.value}`]: hasChildren,
+			[`${prefixCls.value}-dashed`]: !!dashed,
+			[`${prefixCls.value}-${variant}`]: variant !== "solid",
+			[`${prefixCls.value}-plain`]: !!plain,
+			[`${prefixCls.value}-rtl`]: direction.value === "rtl",
+			[`${prefixCls.value}-no-default-orientation-margin-start`]: hasMarginStart.value,
+			[`${prefixCls.value}-no-default-orientation-margin-end`]: hasMarginEnd.value,
+			[`${prefixCls.value}-${sizeCls.value}`]: !!sizeCls.value,
+			[railCls]: !hasChildren,
+			[mergedClassNames.value.rail]: mergedClassNames.value.rail && !hasChildren
+		}, rootClass, mergedClassNames.value.root);
+		const innerStyle = {
+			marginInlineStart: hasMarginStart.value ? memoizedOrientationMargin.value : void 0,
+			marginInlineEnd: hasMarginEnd.value ? memoizedOrientationMargin.value : void 0
+		};
+		return createVNode("div", mergeProps({
+			"class": classString,
+			"style": [
+				contextStyles.value,
+				mergedStyles.value.root,
+				hasChildren ? {} : mergedStyles.value.rail,
+				attrs.style
+			]
+		}, pureAttrs(attrs), { "role": "separator" }), [hasChildren && !mergedVertical.value && createVNode(Fragment, null, [
+			createVNode("div", {
+				"class": classNames(railCls, `${railCls}-start`, mergedClassNames.value.rail),
+				"style": mergedStyles.value.rail
+			}, null),
+			createVNode("span", {
+				"class": classNames(`${prefixCls.value}-inner-text`, mergedClassNames.value.content),
+				"style": [innerStyle, mergedStyles.value.content]
+			}, [children]),
+			createVNode("div", {
+				"class": classNames(railCls, `${railCls}-end`, mergedClassNames.value.rail),
+				"style": mergedStyles.value.rail
+			}, null)
+		])]);
+	};
+}, {
+	props: /* @__PURE__ */ mergeDefaults({
+		type: {
+			type: String,
+			required: false
+		},
+		orientation: {
+			type: String,
+			required: false
+		},
+		vertical: {
+			type: Boolean,
+			required: false
+		},
+		titlePlacement: {
+			type: String,
+			required: false
+		},
+		orientationMargin: {
+			type: [String, Number],
+			required: false
+		},
+		dashed: {
+			type: Boolean,
+			required: false
+		},
+		variant: {
+			type: String,
+			required: false
+		},
+		size: {
+			type: [String, null],
+			required: false
+		},
+		plain: {
+			type: Boolean,
+			required: false
+		},
+		classes: {
+			type: [Object, Function],
+			required: false
+		},
+		styles: {
+			type: [Object, Function],
+			required: false
+		},
+		rootClass: {
+			type: String,
+			required: false
+		},
+		prefixCls: {
+			type: String,
+			required: false
+		}
+	}, {
+		orientation: "center",
+		variant: "solid",
+		type: "horizontal",
+		orientationMargin: void 0
+	}),
+	name: "ADivider",
+	inheritAttrs: false
+});
+Divider.install = (app) => {
+	app.component(Divider.name, Divider);
+};
+var divider_default = Divider;
+
+//#endregion
+export { divider_default as default };

package/dist/divider/style/index.d.ts

@@ -0,0 +1,24 @@
+import "../../theme/internal.js";
+import { CSSProperties } from "vue";
+
+//#region src/divider/style/index.d.ts
+/** Component only token. Which will handle additional calculation of alias token */
+interface ComponentToken {
+  /**
+   * @desc 文本横向内间距
+   * @descEN Horizontal padding of text
+   */
+  textPaddingInline: CSSProperties['paddingInline'];
+  /**
+   * @desc 文本与边缘距离，取值 0 ～ 1
+   * @descEN Distance between text and edge, which should be a number between 0 and 1.
+   */
+  orientationMargin?: number;
+  /**
+   * @desc 纵向分割线的横向外间距
+   * @descEN Horizontal margin of vertical Divider
+   */
+  verticalMarginInline: CSSProperties['marginInline'];
+}
+//#endregion
+export { ComponentToken };

package/dist/divider/style/index.js

@@ -0,0 +1,128 @@
+import { resetComponent } from "../../style/index.js";
+import { genStyleHooks } from "../../theme/util/genStyleUtils.js";
+import { mergeToken } from "../../theme/internal.js";
+import { unit } from "@antdv-next/cssinjs";
+
+//#region src/divider/style/index.ts
+const genSizeDividerStyle = (token) => {
+	const { componentCls } = token;
+	return { [componentCls]: { "&-horizontal": { [`&${componentCls}`]: {
+		"&-sm": { marginBlock: token.marginXS },
+		"&-md": { marginBlock: token.margin }
+	} } } };
+};
+const genSharedDividerStyle = (token) => {
+	const { componentCls, sizePaddingEdgeHorizontal, colorSplit, lineWidth, textPaddingInline, orientationMargin, verticalMarginInline } = token;
+	const railCls = `${componentCls}-rail`;
+	return { [componentCls]: {
+		...resetComponent(token),
+		"borderBlockStart": `${unit(lineWidth)} solid ${colorSplit}`,
+		[railCls]: { borderBlockStart: `${unit(lineWidth)} solid ${colorSplit}` },
+		"&-vertical": {
+			position: "relative",
+			top: "-0.06em",
+			display: "inline-block",
+			height: "0.9em",
+			marginInline: verticalMarginInline,
+			marginBlock: 0,
+			verticalAlign: "middle",
+			borderTop: 0,
+			borderInlineStart: `${unit(lineWidth)} solid ${colorSplit}`
+		},
+		"&-horizontal": {
+			display: "flex",
+			clear: "both",
+			width: "100%",
+			minWidth: "100%",
+			margin: `${unit(token.marginLG)} 0`
+		},
+		[`&-horizontal${componentCls}-with-text`]: {
+			display: "flex",
+			alignItems: "center",
+			margin: `${unit(token.dividerHorizontalWithTextGutterMargin)} 0`,
+			color: token.colorTextHeading,
+			fontWeight: 500,
+			fontSize: token.fontSizeLG,
+			whiteSpace: "nowrap",
+			textAlign: "center",
+			borderBlockStart: `0 ${colorSplit}`,
+			[`${railCls}-start, ${railCls}-end`]: {
+				width: "50%",
+				borderBlockStartColor: "inherit",
+				borderBlockEnd: 0,
+				content: "''"
+			}
+		},
+		[`&-horizontal${componentCls}-with-text-start`]: {
+			[`${railCls}-start`]: { width: `calc(${orientationMargin} * 100%)` },
+			[`${railCls}-end`]: { width: `calc(100% - ${orientationMargin} * 100%)` }
+		},
+		[`&-horizontal${componentCls}-with-text-end`]: {
+			[`${railCls}-start`]: { width: `calc(100% - ${orientationMargin} * 100%)` },
+			[`${railCls}-end`]: { width: `calc(${orientationMargin} * 100%)` }
+		},
+		[`${componentCls}-inner-text`]: {
+			display: "inline-block",
+			paddingBlock: 0,
+			paddingInline: textPaddingInline
+		},
+		"&-dashed": {
+			background: "none",
+			borderColor: colorSplit,
+			borderStyle: "dashed",
+			borderWidth: `${unit(lineWidth)} 0 0`,
+			[railCls]: { borderBlockStart: `${unit(lineWidth)} dashed ${colorSplit}` }
+		},
+		[`&-horizontal${componentCls}-with-text${componentCls}-dashed`]: { [`${railCls}-start, ${railCls}-end`]: { borderStyle: "dashed none none" } },
+		[`&-vertical${componentCls}-dashed`]: {
+			borderInlineStartWidth: lineWidth,
+			borderInlineEnd: 0,
+			borderBlockStart: 0,
+			borderBlockEnd: 0
+		},
+		"&-dotted": {
+			background: "none",
+			borderColor: colorSplit,
+			borderStyle: "dotted",
+			borderWidth: `${unit(lineWidth)} 0 0`,
+			[railCls]: { borderBlockStart: `${unit(lineWidth)} dotted ${colorSplit}` }
+		},
+		[`&-horizontal${componentCls}-with-text${componentCls}-dotted`]: { "&::before, &::after": { borderStyle: "dotted none none" } },
+		[`&-vertical${componentCls}-dotted`]: {
+			borderInlineStartWidth: lineWidth,
+			borderInlineEnd: 0,
+			borderBlockStart: 0,
+			borderBlockEnd: 0
+		},
+		[`&-plain${componentCls}-with-text`]: {
+			color: token.colorText,
+			fontWeight: "normal",
+			fontSize: token.fontSize
+		},
+		[`&-horizontal${componentCls}-with-text-start${componentCls}-no-default-orientation-margin-start`]: {
+			[`${railCls}-start`]: { width: 0 },
+			[`${railCls}-end`]: { width: "100%" },
+			[`${componentCls}-inner-text`]: { paddingInlineStart: sizePaddingEdgeHorizontal }
+		},
+		[`&-horizontal${componentCls}-with-text-end${componentCls}-no-default-orientation-margin-end`]: {
+			[`${railCls}-start`]: { width: "100%" },
+			[`${railCls}-end`]: { width: 0 },
+			[`${componentCls}-inner-text`]: { paddingInlineEnd: sizePaddingEdgeHorizontal }
+		}
+	} };
+};
+const prepareComponentToken = (token) => ({
+	textPaddingInline: "1em",
+	orientationMargin: .05,
+	verticalMarginInline: token.marginXS
+});
+var style_default = genStyleHooks("Divider", (token) => {
+	const dividerToken = mergeToken(token, {
+		dividerHorizontalWithTextGutterMargin: token.margin,
+		sizePaddingEdgeHorizontal: 0
+	});
+	return [genSharedDividerStyle(dividerToken), genSizeDividerStyle(dividerToken)];
+}, prepareComponentToken, { unitless: { orientationMargin: true } });
+
+//#endregion
+export { style_default as default };

package/dist/drawer/DrawerPanel.d.ts

@@ -0,0 +1,49 @@
+import { VueNode } from "../_util/type.js";
+import { SemanticClassNamesType, SemanticStylesType } from "../_util/hooks/useMergeSemantic.js";
+import "../_util/hooks/index.js";
+import { ClosableType } from "../_util/hooks/useClosable.js";
+import { DrawerProps as DrawerProps$1 } from "./index.js";
+import { CSSProperties } from "vue";
+import { DrawerProps } from "@v-c/drawer";
+
+//#region src/drawer/DrawerPanel.d.ts
+type SemanticName = 'root' | 'mask' | 'header' | 'title' | 'extra' | 'section' | 'body' | 'footer' | 'wrapper' | 'dragger' | 'close';
+type DrawerClassNamesType = SemanticClassNamesType<DrawerProps$1, SemanticName>;
+type DrawerStylesType = SemanticStylesType<DrawerProps$1, SemanticName>;
+interface DrawerPanelProps {
+  prefixCls: string;
+  ariaId?: string;
+  title?: VueNode;
+  footer?: VueNode;
+  extra?: VueNode;
+  size?: DrawerProps$1['size'];
+  /**
+   * Recommend to use closeIcon instead
+   *
+   * e.g.
+   *
+   * `<Drawer closeIcon={false} />`
+   */
+  closable?: boolean | (Extract<ClosableType, object> & {
+    placement?: 'start' | 'end';
+  });
+  closeIcon?: VueNode;
+  onClose?: DrawerProps['onClose'];
+  classes?: DrawerClassNamesType;
+  styles?: DrawerStylesType;
+  loading?: boolean;
+  /** @deprecated Please use `styles.header` instead */
+  headerStyle?: CSSProperties;
+  /** @deprecated Please use `styles.body` instead */
+  bodyStyle?: CSSProperties;
+  /** @deprecated Please use `styles.footer` instead */
+  footerStyle?: CSSProperties;
+  /** @deprecated Please use `styles.wrapper` instead */
+  contentWrapperStyle?: CSSProperties;
+  /** @deprecated Please use `styles.mask` instead */
+  maskStyle?: CSSProperties;
+  /** @deprecated Please use `styles.content` instead */
+  drawerStyle?: CSSProperties;
+}
+//#endregion
+export { DrawerPanelProps };