@veracity/vui 1.8.1 → 1.9.0-beta.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/dist/cjs/accordion/accordion.types.d.ts +1 -0
- package/dist/cjs/accordion/accordion.types.d.ts.map +1 -1
- package/dist/cjs/button/button.d.ts +1 -0
- package/dist/cjs/button/button.d.ts.map +1 -1
- package/dist/cjs/button/button.js +3 -3
- package/dist/cjs/button/button.types.d.ts +2 -0
- package/dist/cjs/button/button.types.d.ts.map +1 -1
- package/dist/cjs/dragAndDrop/dragAndDrop.d.ts +5 -0
- package/dist/cjs/dragAndDrop/dragAndDrop.d.ts.map +1 -0
- package/dist/cjs/dragAndDrop/dragAndDrop.js +84 -0
- package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts +18 -0
- package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts.map +1 -0
- package/dist/cjs/dragAndDrop/dragAndDrop.types.js +2 -0
- package/dist/cjs/dragAndDrop/index.d.ts +4 -0
- package/dist/cjs/dragAndDrop/index.d.ts.map +1 -0
- package/dist/cjs/dragAndDrop/index.js +24 -0
- package/dist/cjs/dragAndDrop/theme.d.ts +8 -0
- package/dist/cjs/dragAndDrop/theme.d.ts.map +1 -0
- package/dist/cjs/dragAndDrop/theme.js +12 -0
- package/dist/cjs/index.d.ts +2 -0
- package/dist/cjs/index.d.ts.map +1 -1
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/sidemenu/context.d.ts +5 -0
- package/dist/cjs/sidemenu/context.d.ts.map +1 -0
- package/dist/cjs/sidemenu/context.js +7 -0
- package/dist/cjs/sidemenu/index.d.ts +6 -0
- package/dist/cjs/sidemenu/index.d.ts.map +1 -0
- package/dist/cjs/sidemenu/index.js +26 -0
- package/dist/cjs/sidemenu/sidemenu.d.ts +12 -0
- package/dist/cjs/sidemenu/sidemenu.d.ts.map +1 -0
- package/dist/cjs/sidemenu/sidemenu.js +85 -0
- package/dist/cjs/sidemenu/sidemenu.types.d.ts +41 -0
- package/dist/cjs/sidemenu/sidemenu.types.d.ts.map +1 -0
- package/dist/cjs/sidemenu/sidemenu.types.js +2 -0
- package/dist/cjs/sidemenu/sidemenuItem.d.ts +5 -0
- package/dist/cjs/sidemenu/sidemenuItem.d.ts.map +1 -0
- package/dist/cjs/sidemenu/sidemenuItem.js +67 -0
- package/dist/cjs/sidemenu/sidemenuTop.d.ts +5 -0
- package/dist/cjs/sidemenu/sidemenuTop.d.ts.map +1 -0
- package/dist/cjs/sidemenu/sidemenuTop.js +34 -0
- package/dist/cjs/sidemenu/theme.d.ts +8 -0
- package/dist/cjs/sidemenu/theme.d.ts.map +1 -0
- package/dist/cjs/sidemenu/theme.js +12 -0
- package/dist/cjs/theme/components.d.ts +12 -0
- package/dist/cjs/theme/components.d.ts.map +1 -1
- package/dist/cjs/theme/components.js +60 -56
- package/dist/cjs/theme/defaultTheme.d.ts +12 -0
- package/dist/cjs/theme/defaultTheme.d.ts.map +1 -1
- package/dist/esm/accordion/accordion.types.d.ts +1 -0
- package/dist/esm/accordion/accordion.types.d.ts.map +1 -1
- package/dist/esm/button/button.d.ts +1 -0
- package/dist/esm/button/button.d.ts.map +1 -1
- package/dist/esm/button/button.js +2 -2
- package/dist/esm/button/button.types.d.ts +2 -0
- package/dist/esm/button/button.types.d.ts.map +1 -1
- package/dist/esm/dragAndDrop/dragAndDrop.d.ts +5 -0
- package/dist/esm/dragAndDrop/dragAndDrop.d.ts.map +1 -0
- package/dist/esm/dragAndDrop/dragAndDrop.js +42 -0
- package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts +18 -0
- package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts.map +1 -0
- package/dist/esm/dragAndDrop/dragAndDrop.types.js +1 -0
- package/dist/esm/dragAndDrop/index.d.ts +4 -0
- package/dist/esm/dragAndDrop/index.d.ts.map +1 -0
- package/dist/esm/dragAndDrop/index.js +3 -0
- package/dist/esm/dragAndDrop/theme.d.ts +8 -0
- package/dist/esm/dragAndDrop/theme.d.ts.map +1 -0
- package/dist/esm/dragAndDrop/theme.js +10 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +2 -0
- package/dist/esm/sidemenu/context.d.ts +5 -0
- package/dist/esm/sidemenu/context.d.ts.map +1 -0
- package/dist/esm/sidemenu/context.js +3 -0
- package/dist/esm/sidemenu/index.d.ts +6 -0
- package/dist/esm/sidemenu/index.d.ts.map +1 -0
- package/dist/esm/sidemenu/index.js +5 -0
- package/dist/esm/sidemenu/sidemenu.d.ts +12 -0
- package/dist/esm/sidemenu/sidemenu.d.ts.map +1 -0
- package/dist/esm/sidemenu/sidemenu.js +44 -0
- package/dist/esm/sidemenu/sidemenu.types.d.ts +41 -0
- package/dist/esm/sidemenu/sidemenu.types.d.ts.map +1 -0
- package/dist/esm/sidemenu/sidemenu.types.js +1 -0
- package/dist/esm/sidemenu/sidemenuItem.d.ts +5 -0
- package/dist/esm/sidemenu/sidemenuItem.d.ts.map +1 -0
- package/dist/esm/sidemenu/sidemenuItem.js +26 -0
- package/dist/esm/sidemenu/sidemenuTop.d.ts +5 -0
- package/dist/esm/sidemenu/sidemenuTop.d.ts.map +1 -0
- package/dist/esm/sidemenu/sidemenuTop.js +16 -0
- package/dist/esm/sidemenu/theme.d.ts +8 -0
- package/dist/esm/sidemenu/theme.d.ts.map +1 -0
- package/dist/esm/sidemenu/theme.js +10 -0
- package/dist/esm/theme/components.d.ts +12 -0
- package/dist/esm/theme/components.d.ts.map +1 -1
- package/dist/esm/theme/components.js +4 -0
- package/dist/esm/theme/defaultTheme.d.ts +12 -0
- package/dist/esm/theme/defaultTheme.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/accordion/accordion.types.ts +1 -0
- package/src/button/button.tsx +2 -1
- package/src/button/button.types.ts +2 -0
- package/src/dragAndDrop/dragAndDrop.tsx +85 -0
- package/src/dragAndDrop/dragAndDrop.types.ts +19 -0
- package/src/dragAndDrop/index.ts +3 -0
- package/src/dragAndDrop/theme.ts +14 -0
- package/src/index.ts +2 -0
- package/src/sidemenu/context.ts +5 -0
- package/src/sidemenu/index.ts +5 -0
- package/src/sidemenu/sidemenu.tsx +66 -0
- package/src/sidemenu/sidemenu.types.ts +46 -0
- package/src/sidemenu/sidemenuItem.tsx +81 -0
- package/src/sidemenu/sidemenuTop.tsx +25 -0
- package/src/sidemenu/theme.ts +14 -0
- package/src/theme/components.ts +4 -0
|
@@ -8,6 +8,7 @@ export declare type AccordionProps = SystemProps & ThemingProps<'Accordion'> & {
|
|
|
8
8
|
orientation?: AccordionOrientation;
|
|
9
9
|
/** Hover color for the item title @default "blue.10" */
|
|
10
10
|
itemTitleHoverBg?: string;
|
|
11
|
+
/** Collection of Accordion items */
|
|
11
12
|
items?: AccordionItemProps[];
|
|
12
13
|
};
|
|
13
14
|
export declare type AccordionItemId = string | number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accordion.types.d.ts","sourceRoot":"","sources":["../../../src/accordion/accordion.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,oBAAoB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE5D,oBAAY,cAAc,GAAG,WAAW,GACtC,YAAY,CAAC,WAAW,CAAC,GAAG;IAC1B,qDAAqD;IACrD,WAAW,CAAC,EAAE,oBAAoB,CAAA;IAClC,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAA;CAC7B,CAAA;AAEH,oBAAY,eAAe,GAAG,MAAM,GAAG,MAAM,CAAA;AAE7C,oBAAY,sBAAsB,GAAG;IACnC,EAAE,EAAE,eAAe,CAAA;IACnB,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,oBAAY,kBAAkB,GAAG,aAAa,GAAG;IAC/C,gBAAgB;IAChB,EAAE,EAAE,eAAe,CAAA;IACnB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc;IACd,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,yCAAyC;IACzC,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,sBAAsB;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,IAAI,CAAA;CACnD,CAAA;AAED,oBAAY,uBAAuB,GAAG;IACpC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACnC,CAAA"}
|
|
1
|
+
{"version":3,"file":"accordion.types.d.ts","sourceRoot":"","sources":["../../../src/accordion/accordion.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,oBAAoB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE5D,oBAAY,cAAc,GAAG,WAAW,GACtC,YAAY,CAAC,WAAW,CAAC,GAAG;IAC1B,qDAAqD;IACrD,WAAW,CAAC,EAAE,oBAAoB,CAAA;IAClC,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,oCAAoC;IACpC,KAAK,CAAC,EAAE,kBAAkB,EAAE,CAAA;CAC7B,CAAA;AAEH,oBAAY,eAAe,GAAG,MAAM,GAAG,MAAM,CAAA;AAE7C,oBAAY,sBAAsB,GAAG;IACnC,EAAE,EAAE,eAAe,CAAA;IACnB,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,oBAAY,kBAAkB,GAAG,aAAa,GAAG;IAC/C,gBAAgB;IAChB,EAAE,EAAE,eAAe,CAAA;IACnB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc;IACd,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,yCAAyC;IACzC,OAAO,CAAC,EAAE,SAAS,CAAA;IACnB,yCAAyC;IACzC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,sBAAsB;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,YAAY;IACZ,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC1B,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,IAAI,CAAA;CACnD,CAAA;AAED,oBAAY,uBAAuB,GAAG;IACpC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,oBAAoB,CAAA;CACnC,CAAA"}
|
|
@@ -5,6 +5,7 @@ import ButtonIcon from './buttonIcon';
|
|
|
5
5
|
import ButtonText from './buttonText';
|
|
6
6
|
export declare const ButtonBase: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, import("..").AnimationProps & import("..").BackgroundColorProps & import("..").BorderProps & import("..").BorderTopProps & import("..").BorderRightProps & import("..").BorderBottomProps & import("..").BorderLeftProps & import("..").BorderColorProps & import("..").BorderTopColorProps & import("..").BorderRightColorProps & import("..").BorderBottomColorProps & import("..").BorderLeftColorProps & import("..").BorderWidthProps & import("..").BorderTopWidthProps & import("..").BorderRightWidthProps & import("..").BorderBottomWidthProps & import("..").BorderLeftWidthProps & import("..").BorderStyleProps & import("..").BorderRadiusProps & import("..").OutlineProps & import("..").OutlineColorProps & import("..").OutlineWidthProps & import("..").OutlineStyleProps & import("..").DivideXProps & import("..").DivideYProps & import("..").DivideXReverseProps & import("..").DivideYReverseProps & import("..").DivideColorProps & import("..").DivideStyleProps & import("..").RingProps & import("..").RingColorProps & import("..").OpacityProps & import("..").BoxShadowProps & import("..").TextShadowProps & import("..").DisplayProps & import("..").AlignItemsProps & import("..").AlignContentProps & import("..").JustifyContentProps & import("..").JustifyItemsProps & import("..").FlexWrapProps & import("..").FlexGrowProps & import("..").FlexShrinkProps & import("..").FlexBasisProps & import("..").FlexDirectionProps & import("..").FlexProps & import("..").JustifySelfProps & import("..").AlignSelfProps & import("..").OrderProps & import("../system/flexboxGrids").RowProps & import("../system/flexboxGrids").ColProps & import("../system/grids").GapProps & import("../system/grids").ColumnGapProps & import("../system/grids").RowGapProps & import("../system/grids").GridColumnProps & import("../system/grids").GridRowProps & import("../system/grids").GridAutoFlowProps & import("../system/grids").GridAutoColumnsProps & import("../system/grids").GridAutoRowsProps & import("../system/grids").GridTemplateColumnsProps & import("../system/grids").GridTemplateRowsProps & import("../system/grids").GridTemplateAreasProps & import("../system/grids").GridAreaProps & import("..").AppearanceProps & import("..").CursorProps & import("..").PointerEventsProps & import("..").ResizeProps & import("..").UserSelectProps & import("..").IsTruncatedProps & import("..").FloatProps & import("..").BoxSizingProps & import("..").OverflowProps & import("..").OverflowXProps & import("..").OverflowYProps & import("..").PositionProps & import("..").ZIndexProps & import("..").TopProps & import("..").RightProps & import("..").BottomProps & import("..").LeftProps & import("..").VisibilityProps & import("..").OverscrollBehaviorProps & import("..").ObjectFitProps & import("..").MaxLinesProps & import("..").WidthProps & import("..").HeightProps & import("..").MaxWidthProps & import("..").MaxHeightProps & import("..").MinWidthProps & import("..").MinHeightProps & import("..").MarginProps & import("..").MarginTopProps & import("..").MarginRightProps & import("..").MarginBottomProps & import("..").MarginLeftProps & import("..").MarginXProps & import("..").MarginYProps & import("..").PaddingProps & import("..").PaddingTopProps & import("..").PaddingRightProps & import("..").PaddingBottomProps & import("..").PaddingLeftProps & import("..").PaddingXProps & import("..").PaddingYProps & import("..").SpaceXProps & import("..").SpaceYProps & import("..").SpaceXReverseProps & import("..").SpaceYReverseProps & import("../system/tables").BorderCollapseProps & import("../system/tables").TableLayoutProps & import("..").TransformProps & import("..").TransformOriginProps & import("..").TranslateXProps & import("..").TranslateYProps & import("..").RotateProps & import("..").SkewXProps & import("..").SkewYProps & import("..").ScaleProps & import("..").ScaleXProps & import("..").ScaleYProps & import("..").TransitionProps & import("..").TransitionPropertyProps & import("..").TransitionDurationProps & import("..").TransitionTimingFunctionProps & import("..").TransitionDelayProps & import("..").FontFamilyProps & import("..").FontSizeProps & import("..").FontStyleProps & import("..").FontWeightProps & import("..").LineHeightProps & import("..").ColorProps & import("..").TextTransformProps & import("..").TextDecorationProps & import("..").TextAlignProps & import("..").VerticalAlignProps & import("..").LetterSpacingProps & import("..").WhiteSpaceProps & import("..").TextOverflowProps & import("..").ListStyleTypeProps & import("..").ListStylePositionProps & import("..").WordBreakProps & import("..").ThemingProps<"Button"> & {
|
|
7
7
|
colorScheme?: import("./button.types").ButtonColorScheme | undefined;
|
|
8
|
+
dropDownIcon?: import("..").IconProp | undefined;
|
|
8
9
|
icon?: JSX.Element | import("..").IconProp | undefined;
|
|
9
10
|
iconLeft?: JSX.Element | import("..").IconProp | undefined;
|
|
10
11
|
iconRight?: JSX.Element | import("..").IconProp | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/button/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAGtC,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAEnE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,UAAU,MAAM,cAAc,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAiBrC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;SAoBtB,CAAA;AACD;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;UAsHX,iBAAiB;UACjB,iBAAiB;CACxB,CAAA;AAKD,eAAe,MAAM,CAAA"}
|
|
@@ -89,8 +89,8 @@ exports.Button = (0, core_1.vui)((props, ref) => {
|
|
|
89
89
|
var _a, _b, _c, _d;
|
|
90
90
|
const buttonGroupProps = (0, context_1.useButtonGroupContext)();
|
|
91
91
|
const mergedProps = Object.assign(Object.assign({}, buttonGroupProps), props);
|
|
92
|
-
const { borderWidth: borderWidthProp, children, className, colorScheme: colorSchemeProp, disabled, icon, iconLeft, iconRight, isActive, isDropDown, isElevated, isFullWidth, isLoading, // eslint-disable-line
|
|
93
|
-
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, variant } = mergedProps, rest = __rest(mergedProps, ["borderWidth", "children", "className", "colorScheme", "disabled", "icon", "iconLeft", "iconRight", "isActive", "isDropDown", "isElevated", "isFullWidth", "isLoading", "isRound", "isSplit", "isTruncated", "size", "state", "stateMapping", "text", "variant"]);
|
|
92
|
+
const { borderWidth: borderWidthProp, children, className, colorScheme: colorSchemeProp, disabled, dropDownIcon = 'falAngleDown', icon, iconLeft, iconRight, isActive, isDropDown, isElevated, isFullWidth, isLoading, // eslint-disable-line
|
|
93
|
+
isRound, isSplit, isTruncated, size, state = props.isLoading ? 'loading' : '', stateMapping, text, variant } = mergedProps, rest = __rest(mergedProps, ["borderWidth", "children", "className", "colorScheme", "disabled", "dropDownIcon", "icon", "iconLeft", "iconRight", "isActive", "isDropDown", "isElevated", "isFullWidth", "isLoading", "isRound", "isSplit", "isTruncated", "size", "state", "stateMapping", "text", "variant"]);
|
|
94
94
|
const hasState = Boolean(state) && state !== 'idle';
|
|
95
95
|
const states = Object.assign(Object.assign({}, consts_1.buttonStateMapping), stateMapping);
|
|
96
96
|
const _e = (_a = states[state]) !== null && _a !== void 0 ? _a : {}, { iconProps: stateIconProps } = _e, stateProps = __rest(_e, ["iconProps"]);
|
|
@@ -138,7 +138,7 @@ exports.Button = (0, core_1.vui)((props, ref) => {
|
|
|
138
138
|
!icon && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
139
139
|
(0, utils_1.isString)(iconLeft) ? react_1.default.createElement(buttonIcon_1.default, { mr: isDropDown ? 0 : iconLeftMr, name: iconLeft }) : iconLeft, children !== null && children !== void 0 ? children : ((0, utils_1.isReactText)(text) ? react_1.default.createElement(buttonText_1.default, Object.assign({}, { isTruncated, text })) : text),
|
|
140
140
|
(0, utils_1.isString)(iconRight) ? react_1.default.createElement(buttonIcon_1.default, { ml: iconRightMl, name: iconRight }) : iconRight)),
|
|
141
|
-
isDropDown && react_1.default.createElement(buttonIcon_1.default, { name:
|
|
141
|
+
isDropDown && react_1.default.createElement(buttonIcon_1.default, { name: dropDownIcon })))));
|
|
142
142
|
});
|
|
143
143
|
exports.Button.Icon = buttonIcon_1.default;
|
|
144
144
|
exports.Button.Text = buttonText_1.default;
|
|
@@ -7,6 +7,8 @@ export declare type ButtonColorScheme = 'blue' | 'green' | 'pink' | 'prussian' |
|
|
|
7
7
|
export declare type ButtonProps = SystemProps & ThemingProps<'Button'> & {
|
|
8
8
|
/** Available theme colors for this component. @default prussian */
|
|
9
9
|
colorScheme?: ButtonColorScheme;
|
|
10
|
+
/** Icon for the drop-down element. @default falAngleDown */
|
|
11
|
+
dropDownIcon?: IconProp;
|
|
10
12
|
/** Icon that replaces any other content. */
|
|
11
13
|
icon?: IconProp | JSX.Element;
|
|
12
14
|
/** Socket displaying icon on the left side. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../src/button/button.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC,oBAAY,iBAAiB,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,KAAK,CAAA;AAE9E,oBAAY,WAAW,GAAG,WAAW,GACnC,YAAY,CAAC,QAAQ,CAAC,GAAG;IACvB,mEAAmE;IACnE,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,4CAA4C;IAC5C,IAAI,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7B,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IACjC,gDAAgD;IAChD,SAAS,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAClC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,qEAAqE;IACrE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kEAAkE;IAClE,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,kBAAkB,CAAA;IACjC,sDAAsD;IACtD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB,CAAA;AACH,oBAAY,WAAW,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAE9E,oBAAY,kBAAkB,GAAG,MAAM,CACrC,MAAM,EACN,WAAW,GAAG;IAAE,WAAW,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IAAC,SAAS,EAAE,SAAS,CAAA;CAAE,CAChF,CAAA;AAED,wDAAwD;AACxD,oBAAY,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,WAAW,GAAG,MAAM,CAAC,CAAA"}
|
|
1
|
+
{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../src/button/button.types.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC,oBAAY,iBAAiB,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,KAAK,CAAA;AAE9E,oBAAY,WAAW,GAAG,WAAW,GACnC,YAAY,CAAC,QAAQ,CAAC,GAAG;IACvB,mEAAmE;IACnE,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,4DAA4D;IAC5D,YAAY,CAAC,EAAE,QAAQ,CAAA;IACvB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAC7B,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IACjC,gDAAgD;IAChD,SAAS,CAAC,EAAE,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAA;IAClC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,4CAA4C;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,qEAAqE;IACrE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,yCAAyC;IACzC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yDAAyD;IACzD,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,kEAAkE;IAClE,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,kBAAkB,CAAA;IACjC,sDAAsD;IACtD,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB,CAAA;AACH,oBAAY,WAAW,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAA;AAE9E,oBAAY,kBAAkB,GAAG,MAAM,CACrC,MAAM,EACN,WAAW,GAAG;IAAE,WAAW,EAAE,WAAW,CAAC,aAAa,CAAC,CAAC;IAAC,SAAS,EAAE,SAAS,CAAA;CAAE,CAChF,CAAA;AAED,wDAAwD;AACxD,oBAAY,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,WAAW,GAAG,MAAM,CAAC,CAAA"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { DragAndDropProps } from './dragAndDrop.types';
|
|
2
|
+
/** [Beta] Prepares uploading files by selecting or dragging. */
|
|
3
|
+
export declare const DragAndDrop: import("../core").VuiComponent<"label", DragAndDropProps>;
|
|
4
|
+
export default DragAndDrop;
|
|
5
|
+
//# sourceMappingURL=dragAndDrop.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dragAndDrop.d.ts","sourceRoot":"","sources":["../../../src/dragAndDrop/dragAndDrop.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AAatD,gEAAgE;AAChE,eAAO,MAAM,WAAW,2DA8DtB,CAAA;AAEF,eAAe,WAAW,CAAA"}
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.DragAndDrop = void 0;
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const core_1 = require("../core");
|
|
43
|
+
const icon_1 = __importDefault(require("../icon"));
|
|
44
|
+
const t_1 = __importDefault(require("../t"));
|
|
45
|
+
const utils_1 = require("../utils");
|
|
46
|
+
const defaultIcon = 'falCloudUpload';
|
|
47
|
+
const defaultText = 'Click or drag files to this area';
|
|
48
|
+
const DragAndDropBase = core_1.styled.labelBox `
|
|
49
|
+
display: flex;
|
|
50
|
+
min-width: 0;
|
|
51
|
+
transition-duration: normal;
|
|
52
|
+
justify-content: center;
|
|
53
|
+
`;
|
|
54
|
+
/** [Beta] Prepares uploading files by selecting or dragging. */
|
|
55
|
+
exports.DragAndDrop = (0, core_1.vui)((props, ref) => {
|
|
56
|
+
const _a = (0, core_1.omitThemingProps)(props), { accept, icon = defaultIcon, className, onFilesAdded, multiple = true, text = defaultText, children, disabled } = _a, rest = __rest(_a, ["accept", "icon", "className", "onFilesAdded", "multiple", "text", "children", "disabled"]);
|
|
57
|
+
const fileInput = (0, react_1.useRef)(null);
|
|
58
|
+
const styles = (0, core_1.useStyleConfig)('DragAndDrop', props);
|
|
59
|
+
const processFiles = (files) => Array.from(files).map(file => file);
|
|
60
|
+
const handleFileInput = (e) => {
|
|
61
|
+
var _a;
|
|
62
|
+
e.preventDefault();
|
|
63
|
+
if (disabled)
|
|
64
|
+
return undefined;
|
|
65
|
+
const files = processFiles((_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.files);
|
|
66
|
+
if (files === null || files === void 0 ? void 0 : files.length)
|
|
67
|
+
onFilesAdded === null || onFilesAdded === void 0 ? void 0 : onFilesAdded(files);
|
|
68
|
+
};
|
|
69
|
+
const handleDrop = (e) => {
|
|
70
|
+
var _a;
|
|
71
|
+
e.preventDefault();
|
|
72
|
+
if (disabled)
|
|
73
|
+
return undefined;
|
|
74
|
+
const files = ((_a = e.dataTransfer) === null || _a === void 0 ? void 0 : _a.files) ? processFiles(e.dataTransfer.files) : [];
|
|
75
|
+
if (files === null || files === void 0 ? void 0 : files.length)
|
|
76
|
+
onFilesAdded === null || onFilesAdded === void 0 ? void 0 : onFilesAdded(files);
|
|
77
|
+
};
|
|
78
|
+
return (react_1.default.createElement(DragAndDropBase, Object.assign({ bg: disabled ? 'grey.20' : 'blue.20', className: (0, utils_1.cs)('vui-drag-and-drop', className), cursor: disabled ? 'not-allowed' : 'pointer', onDragEnter: e => e.preventDefault(), onDragOver: e => e.preventDefault(), onDrop: e => handleDrop(e), p: 5, pointerEvents: disabled ? 'none' : 'auto', ref: ref }, styles, rest),
|
|
79
|
+
children || (react_1.default.createElement(t_1.default, { color: disabled ? 'grey.50' : 'auto', display: "flex" },
|
|
80
|
+
react_1.default.createElement(icon_1.default, { mr: 1, name: icon }),
|
|
81
|
+
text)),
|
|
82
|
+
react_1.default.createElement(core_1.v.input, { accept: accept, className: "vui-drag-and-drop-hidden-input", display: "none", multiple: multiple, onChange: handleFileInput, ref: fileInput, type: "file" })));
|
|
83
|
+
});
|
|
84
|
+
exports.default = exports.DragAndDrop;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { BoxProps } from '../box';
|
|
2
|
+
import { IconProp } from '../icon';
|
|
3
|
+
import { ThemingProps } from '../theme';
|
|
4
|
+
export declare type DragAndDropProps = BoxProps & ThemingProps<'DragAndDrop'> & {
|
|
5
|
+
/** A string that defines the file types the file input should accept. This string is a comma-separated list of [unique file type specifiers](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers). */
|
|
6
|
+
accept?: string;
|
|
7
|
+
/** Disabled. @default `false` */
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
/** The message icon. @default `falCloudUpload` */
|
|
10
|
+
icon?: IconProp;
|
|
11
|
+
/** Allows to select multiple files when the drop zone is clicked.. @default `true` */
|
|
12
|
+
multiple?: boolean;
|
|
13
|
+
/** The message text. @default `Click or drag files to this area` */
|
|
14
|
+
text?: string;
|
|
15
|
+
/** Drop or file select callback */
|
|
16
|
+
onFilesAdded?: (files: File[]) => void;
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=dragAndDrop.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dragAndDrop.types.d.ts","sourceRoot":"","sources":["../../../src/dragAndDrop/dragAndDrop.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,gBAAgB,GAAG,QAAQ,GACrC,YAAY,CAAC,aAAa,CAAC,GAAG;IAC5B,mPAAmP;IACnP,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kDAAkD;IAClD,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,sFAAsF;IACtF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,oEAAoE;IACpE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mCAAmC;IACnC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAA;CACvC,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dragAndDrop/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,cAAc,qBAAqB,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
17
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
18
|
+
};
|
|
19
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
+
exports.default = void 0;
|
|
21
|
+
__exportStar(require("./dragAndDrop"), exports);
|
|
22
|
+
var dragAndDrop_1 = require("./dragAndDrop");
|
|
23
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(dragAndDrop_1).default; } });
|
|
24
|
+
__exportStar(require("./dragAndDrop.types"), exports);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/dragAndDrop/theme.ts"],"names":[],"mappings":";;;;;;AAQA,wBAKC"}
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ export * from './copyToClipboard';
|
|
|
11
11
|
export * from './core';
|
|
12
12
|
export * from './dialog';
|
|
13
13
|
export * from './divider';
|
|
14
|
+
export * from './dragAndDrop';
|
|
14
15
|
export * from './footer';
|
|
15
16
|
export * from './grid';
|
|
16
17
|
export * from './header';
|
|
@@ -34,6 +35,7 @@ export * from './portal';
|
|
|
34
35
|
export * from './progress';
|
|
35
36
|
export * from './radio';
|
|
36
37
|
export * from './select';
|
|
38
|
+
export * from './sidemenu';
|
|
37
39
|
export * from './skeleton';
|
|
38
40
|
export * from './spinner';
|
|
39
41
|
export * from './svg';
|
package/dist/cjs/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,mBAAmB,CAAA;AACjC,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,KAAK,CAAA;AACnB,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AACzB,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,KAAK,CAAA;AACnB,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,OAAO,CAAA;AACrB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,eAAe,CAAA;AAC7B,cAAc,UAAU,CAAA;AACxB,cAAc,eAAe,CAAA;AAC7B,cAAc,qBAAqB,CAAA;AACnC,cAAc,QAAQ,CAAA;AACtB,cAAc,YAAY,CAAA;AAC1B,cAAc,mBAAmB,CAAA;AACjC,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,UAAU,CAAA;AACxB,cAAc,QAAQ,CAAA;AACtB,cAAc,UAAU,CAAA;AACxB,cAAc,WAAW,CAAA;AACzB,cAAc,QAAQ,CAAA;AACtB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,KAAK,CAAA;AACnB,cAAc,cAAc,CAAA;AAC5B,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA;AAC1B,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AACzB,cAAc,OAAO,CAAA;AACrB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,KAAK,CAAA;AACnB,cAAc,SAAS,CAAA;AACvB,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,QAAQ,CAAA;AACtB,cAAc,OAAO,CAAA;AACrB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA;AACvB,cAAc,YAAY,CAAA;AAC1B,cAAc,SAAS,CAAA"}
|
package/dist/cjs/index.js
CHANGED
|
@@ -27,6 +27,7 @@ __exportStar(require("./copyToClipboard"), exports);
|
|
|
27
27
|
__exportStar(require("./core"), exports);
|
|
28
28
|
__exportStar(require("./dialog"), exports);
|
|
29
29
|
__exportStar(require("./divider"), exports);
|
|
30
|
+
__exportStar(require("./dragAndDrop"), exports);
|
|
30
31
|
__exportStar(require("./footer"), exports);
|
|
31
32
|
__exportStar(require("./grid"), exports);
|
|
32
33
|
__exportStar(require("./header"), exports);
|
|
@@ -50,6 +51,7 @@ __exportStar(require("./portal"), exports);
|
|
|
50
51
|
__exportStar(require("./progress"), exports);
|
|
51
52
|
__exportStar(require("./radio"), exports);
|
|
52
53
|
__exportStar(require("./select"), exports);
|
|
54
|
+
__exportStar(require("./sidemenu"), exports);
|
|
53
55
|
__exportStar(require("./skeleton"), exports);
|
|
54
56
|
__exportStar(require("./spinner"), exports);
|
|
55
57
|
__exportStar(require("./svg"), exports);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAiB,IAAI,EAAE,MAAM,UAAU,CAAA;AAE9C,QAAA,MAAO,gBAAgB,uCAAE,kBAAkB,iBAA6C,CAAA;AAExF,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,CAAA"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useSidemenuContext = exports.SidemenuProvider = void 0;
|
|
4
|
+
const utils_1 = require("../utils");
|
|
5
|
+
const [SidemenuProvider, useSidemenuContext] = (0, utils_1.createContext)({ isOptional: true });
|
|
6
|
+
exports.SidemenuProvider = SidemenuProvider;
|
|
7
|
+
exports.useSidemenuContext = useSidemenuContext;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA;AAC1B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,eAAe,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,cAAc,kBAAkB,CAAA"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
14
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
|
+
};
|
|
16
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
17
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
18
|
+
};
|
|
19
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
20
|
+
exports.default = void 0;
|
|
21
|
+
__exportStar(require("./sidemenu"), exports);
|
|
22
|
+
__exportStar(require("./sidemenuItem"), exports);
|
|
23
|
+
__exportStar(require("./sidemenuTop"), exports);
|
|
24
|
+
var sidemenu_1 = require("./sidemenu");
|
|
25
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(sidemenu_1).default; } });
|
|
26
|
+
__exportStar(require("./sidemenu.types"), exports);
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { VuiComponent } from '../core';
|
|
2
|
+
import { SidemenuProps } from './sidemenu.types';
|
|
3
|
+
import SidemenuItem from './sidemenuItem';
|
|
4
|
+
import SidemenuTop from './sidemenuTop';
|
|
5
|
+
export declare const SidemenuBase: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("..").SystemProps, never>;
|
|
6
|
+
/** [Beta] A collapsible side menu for navigation. */
|
|
7
|
+
export declare const Sidemenu: VuiComponent<"div", SidemenuProps> & {
|
|
8
|
+
Top: typeof SidemenuTop;
|
|
9
|
+
Item: typeof SidemenuItem;
|
|
10
|
+
};
|
|
11
|
+
export default Sidemenu;
|
|
12
|
+
//# sourceMappingURL=sidemenu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sidemenu.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA+B,YAAY,EAAE,MAAM,SAAS,CAAA;AAInE,OAAO,EAAqB,aAAa,EAAE,MAAM,kBAAkB,CAAA;AACnE,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,WAAW,MAAM,eAAe,CAAA;AAEvC,eAAO,MAAM,YAAY,+HAMxB,CAAA;AAED,qDAAqD;AACrD,eAAO,MAAM,QAAQ;SAqCd,kBAAkB;UACjB,mBAAmB;CAC1B,CAAA;AAKD,eAAe,QAAQ,CAAA"}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.Sidemenu = exports.SidemenuBase = void 0;
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const box_1 = __importDefault(require("../box"));
|
|
43
|
+
const button_1 = __importDefault(require("../button"));
|
|
44
|
+
const core_1 = require("../core");
|
|
45
|
+
const icon_1 = __importDefault(require("../icon"));
|
|
46
|
+
const utils_1 = require("../utils");
|
|
47
|
+
const context_1 = require("./context");
|
|
48
|
+
const sidemenuItem_1 = __importDefault(require("./sidemenuItem"));
|
|
49
|
+
const sidemenuTop_1 = __importDefault(require("./sidemenuTop"));
|
|
50
|
+
exports.SidemenuBase = core_1.styled.divBox `
|
|
51
|
+
display: flex;
|
|
52
|
+
flex-direction: column;
|
|
53
|
+
min-width: 0;
|
|
54
|
+
transition-duration: normal;
|
|
55
|
+
overflow: hidden;
|
|
56
|
+
`;
|
|
57
|
+
/** [Beta] A collapsible side menu for navigation. */
|
|
58
|
+
exports.Sidemenu = (0, core_1.vui)((props, ref) => {
|
|
59
|
+
var _a;
|
|
60
|
+
const { children, className, items, isExpanded = false, width = 280 } = props, rest = __rest(props, ["children", "className", "items", "isExpanded", "width"]);
|
|
61
|
+
const styles = (0, core_1.useStyleConfig)('Sidemenu', props);
|
|
62
|
+
const [isExpandedInternal, setIsExpandedInternal] = (0, react_1.useState)(isExpanded);
|
|
63
|
+
const context = (0, react_1.useMemo)(() => (0, utils_1.filterUndefined)({ isExpandedInternal }), [isExpandedInternal]);
|
|
64
|
+
const aliasedProps = (0, utils_1.filterUndefined)({});
|
|
65
|
+
(0, react_1.useEffect)(() => {
|
|
66
|
+
setIsExpandedInternal(isExpanded);
|
|
67
|
+
}, [isExpanded]);
|
|
68
|
+
const toggle = () => {
|
|
69
|
+
setIsExpandedInternal(!isExpandedInternal);
|
|
70
|
+
};
|
|
71
|
+
const w = isExpandedInternal ? width : 64;
|
|
72
|
+
const icon = isExpandedInternal ? 'falArrowLeft' : 'falArrowRight';
|
|
73
|
+
const iconRight = isExpandedInternal ? 16 : 34;
|
|
74
|
+
return (react_1.default.createElement(context_1.SidemenuProvider, { value: context },
|
|
75
|
+
react_1.default.createElement(exports.SidemenuBase, Object.assign({ className: (0, utils_1.cs)('vui-sidemenu', className), ref: ref, w: w }, styles, aliasedProps, rest),
|
|
76
|
+
react_1.default.createElement(box_1.default, { flexDirection: "column", flexGrow: 1, w: "100%" }, items
|
|
77
|
+
? (_a = items === null || items === void 0 ? void 0 : items.map) === null || _a === void 0 ? void 0 : _a.call(items, (item, key) => react_1.default.createElement(sidemenuItem_1.default, Object.assign({ key: key }, item)))
|
|
78
|
+
: children),
|
|
79
|
+
react_1.default.createElement(box_1.default, { borderTop: "1px solid lightgray", className: "vui-sidemenu-bottom", mt: 2, w: "100%" },
|
|
80
|
+
react_1.default.createElement(button_1.default, { borderRadius: 0, onClick: toggle, variant: "text", w: "100%" },
|
|
81
|
+
react_1.default.createElement(icon_1.default, { name: icon, position: "absolute", right: iconRight }))))));
|
|
82
|
+
});
|
|
83
|
+
exports.Sidemenu.Top = sidemenuTop_1.default;
|
|
84
|
+
exports.Sidemenu.Item = sidemenuItem_1.default;
|
|
85
|
+
exports.default = exports.Sidemenu;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { BoxProps } from '../box';
|
|
3
|
+
import { IconProp } from '../icon';
|
|
4
|
+
import { SystemProps } from '../system';
|
|
5
|
+
import { ThemingProps } from '../theme';
|
|
6
|
+
export declare type SidemenuOrientation = 'vertical' | 'horizontal';
|
|
7
|
+
export declare type SidemenuProps = SystemProps & ThemingProps<'Sidemenu'> & {
|
|
8
|
+
/** Collection of menu items */
|
|
9
|
+
items?: SidemenuItemProps[];
|
|
10
|
+
/** Whether the menu is expanded @default false */
|
|
11
|
+
isExpanded?: boolean;
|
|
12
|
+
/** With of the container when the side menu is expanded @default 280 */
|
|
13
|
+
width?: number;
|
|
14
|
+
};
|
|
15
|
+
export declare type SidemenuItemProps = BoxProps & {
|
|
16
|
+
/** Custom class name */
|
|
17
|
+
className?: string;
|
|
18
|
+
/** Children */
|
|
19
|
+
children?: ReactNode;
|
|
20
|
+
/** Custom class name */
|
|
21
|
+
icon: IconProp;
|
|
22
|
+
/** Icon size @default md */
|
|
23
|
+
iconSize?: 'md' | 'sm';
|
|
24
|
+
/** Whether the item is active */
|
|
25
|
+
isActive?: boolean;
|
|
26
|
+
/** Path */
|
|
27
|
+
path?: string;
|
|
28
|
+
/** On click callback */
|
|
29
|
+
onClick?: () => void;
|
|
30
|
+
/** Title */
|
|
31
|
+
title: string;
|
|
32
|
+
};
|
|
33
|
+
export declare type SidemenuTopProps = BoxProps & {
|
|
34
|
+
/** Custom class name */
|
|
35
|
+
className?: string;
|
|
36
|
+
/** Left slod (always visible) */
|
|
37
|
+
leftSlot?: ReactNode;
|
|
38
|
+
/** Right slod (hiden if the sidemenu is collapsed) */
|
|
39
|
+
rightSlot?: ReactNode;
|
|
40
|
+
};
|
|
41
|
+
//# sourceMappingURL=sidemenu.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sidemenu.types.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenu.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,mBAAmB,GAAG,UAAU,GAAG,YAAY,CAAA;AAE3D,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gCAAgC;IAChC,KAAK,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAC3B,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAEH,oBAAY,iBAAiB,GAAG,QAAQ,GAAG;IACzC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,eAAe;IACf,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,wBAAwB;IACxB,IAAI,EAAE,QAAQ,CAAA;IACd,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACtB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW;IACX,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,wBAAwB;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,YAAY;IACZ,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,oBAAY,gBAAgB,GAAG,QAAQ,GAAG;IACxC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,sDAAsD;IACtD,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sidemenuItem.d.ts","sourceRoot":"","sources":["../../../src/sidemenu/sidemenuItem.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpD,mBAAmB;AACnB,eAAO,MAAM,YAAY,UAAW,iBAAiB,gBAiEpD,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
26
|
+
var t = {};
|
|
27
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
28
|
+
t[p] = s[p];
|
|
29
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
30
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
31
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
32
|
+
t[p[i]] = s[p[i]];
|
|
33
|
+
}
|
|
34
|
+
return t;
|
|
35
|
+
};
|
|
36
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
37
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
38
|
+
};
|
|
39
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
40
|
+
exports.SidemenuItem = void 0;
|
|
41
|
+
const react_1 = __importStar(require("react"));
|
|
42
|
+
const react_router_dom_1 = require("react-router-dom");
|
|
43
|
+
const box_1 = __importDefault(require("../box"));
|
|
44
|
+
const button_1 = __importDefault(require("../button"));
|
|
45
|
+
const core_1 = require("../core");
|
|
46
|
+
const icon_1 = __importDefault(require("../icon"));
|
|
47
|
+
const t_1 = __importDefault(require("../t"));
|
|
48
|
+
const utils_1 = require("../utils");
|
|
49
|
+
const context_1 = require("./context");
|
|
50
|
+
/** A menu item. */
|
|
51
|
+
const SidemenuItem = (props) => {
|
|
52
|
+
const _a = (0, core_1.omitThemingProps)(props), { className, children, icon, iconSize = 'md', isActive, onClick, path, title } = _a, rest = __rest(_a, ["className", "children", "icon", "iconSize", "isActive", "onClick", "path", "title"]);
|
|
53
|
+
const [displayChildren, setDisplayChildren] = (0, react_1.useState)(true);
|
|
54
|
+
const { isExpandedInternal } = (0, context_1.useSidemenuContext)();
|
|
55
|
+
const innerContent = isExpandedInternal ? (react_1.default.createElement(box_1.default, { px: 2, py: 1, w: "100%", whiteSpace: "pre" },
|
|
56
|
+
react_1.default.createElement(icon_1.default, { ml: iconSize === 'sm' ? '4px' : 0, name: icon, size: iconSize }),
|
|
57
|
+
react_1.default.createElement(t_1.default, { ml: 2 }, title))) : (react_1.default.createElement(box_1.default, { px: 2, py: 1, w: "100%" },
|
|
58
|
+
react_1.default.createElement(icon_1.default, { ml: iconSize === 'sm' ? '4px' : 0, name: icon, size: iconSize })));
|
|
59
|
+
const pathProps = path ? { as: react_router_dom_1.Link, to: path } : {};
|
|
60
|
+
return (react_1.default.createElement(box_1.default, { flexDirection: "column", w: "100%" },
|
|
61
|
+
react_1.default.createElement(button_1.default, Object.assign({ border: "none", borderLeft: "3px solid black", borderLeftColor: isActive ? 'blue.80' : 'transparent', borderRadius: 0, className: (0, utils_1.cs)('vui-sidemenu-item', className), h: "auto", justifyContent: "space-between", onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(), p: 0, variant: "text", w: "100%" }, pathProps, rest),
|
|
62
|
+
innerContent,
|
|
63
|
+
!!children && isExpandedInternal && (react_1.default.createElement(button_1.default, { icon: displayChildren ? 'falChevronUp' : 'falChevronDown', mr: 1, onClick: () => setDisplayChildren(!displayChildren), size: "xs", variant: "text" }))),
|
|
64
|
+
!!children && displayChildren && (react_1.default.createElement(box_1.default, { flexDirection: "column", justifyContent: "start", w: "100%" }, children))));
|
|
65
|
+
};
|
|
66
|
+
exports.SidemenuItem = SidemenuItem;
|
|
67
|
+
exports.default = exports.SidemenuItem;
|