@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.
Files changed (113) hide show
  1. package/dist/cjs/accordion/accordion.types.d.ts +1 -0
  2. package/dist/cjs/accordion/accordion.types.d.ts.map +1 -1
  3. package/dist/cjs/button/button.d.ts +1 -0
  4. package/dist/cjs/button/button.d.ts.map +1 -1
  5. package/dist/cjs/button/button.js +3 -3
  6. package/dist/cjs/button/button.types.d.ts +2 -0
  7. package/dist/cjs/button/button.types.d.ts.map +1 -1
  8. package/dist/cjs/dragAndDrop/dragAndDrop.d.ts +5 -0
  9. package/dist/cjs/dragAndDrop/dragAndDrop.d.ts.map +1 -0
  10. package/dist/cjs/dragAndDrop/dragAndDrop.js +84 -0
  11. package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts +18 -0
  12. package/dist/cjs/dragAndDrop/dragAndDrop.types.d.ts.map +1 -0
  13. package/dist/cjs/dragAndDrop/dragAndDrop.types.js +2 -0
  14. package/dist/cjs/dragAndDrop/index.d.ts +4 -0
  15. package/dist/cjs/dragAndDrop/index.d.ts.map +1 -0
  16. package/dist/cjs/dragAndDrop/index.js +24 -0
  17. package/dist/cjs/dragAndDrop/theme.d.ts +8 -0
  18. package/dist/cjs/dragAndDrop/theme.d.ts.map +1 -0
  19. package/dist/cjs/dragAndDrop/theme.js +12 -0
  20. package/dist/cjs/index.d.ts +2 -0
  21. package/dist/cjs/index.d.ts.map +1 -1
  22. package/dist/cjs/index.js +2 -0
  23. package/dist/cjs/sidemenu/context.d.ts +5 -0
  24. package/dist/cjs/sidemenu/context.d.ts.map +1 -0
  25. package/dist/cjs/sidemenu/context.js +7 -0
  26. package/dist/cjs/sidemenu/index.d.ts +6 -0
  27. package/dist/cjs/sidemenu/index.d.ts.map +1 -0
  28. package/dist/cjs/sidemenu/index.js +26 -0
  29. package/dist/cjs/sidemenu/sidemenu.d.ts +12 -0
  30. package/dist/cjs/sidemenu/sidemenu.d.ts.map +1 -0
  31. package/dist/cjs/sidemenu/sidemenu.js +85 -0
  32. package/dist/cjs/sidemenu/sidemenu.types.d.ts +41 -0
  33. package/dist/cjs/sidemenu/sidemenu.types.d.ts.map +1 -0
  34. package/dist/cjs/sidemenu/sidemenu.types.js +2 -0
  35. package/dist/cjs/sidemenu/sidemenuItem.d.ts +5 -0
  36. package/dist/cjs/sidemenu/sidemenuItem.d.ts.map +1 -0
  37. package/dist/cjs/sidemenu/sidemenuItem.js +67 -0
  38. package/dist/cjs/sidemenu/sidemenuTop.d.ts +5 -0
  39. package/dist/cjs/sidemenu/sidemenuTop.d.ts.map +1 -0
  40. package/dist/cjs/sidemenu/sidemenuTop.js +34 -0
  41. package/dist/cjs/sidemenu/theme.d.ts +8 -0
  42. package/dist/cjs/sidemenu/theme.d.ts.map +1 -0
  43. package/dist/cjs/sidemenu/theme.js +12 -0
  44. package/dist/cjs/theme/components.d.ts +12 -0
  45. package/dist/cjs/theme/components.d.ts.map +1 -1
  46. package/dist/cjs/theme/components.js +60 -56
  47. package/dist/cjs/theme/defaultTheme.d.ts +12 -0
  48. package/dist/cjs/theme/defaultTheme.d.ts.map +1 -1
  49. package/dist/esm/accordion/accordion.types.d.ts +1 -0
  50. package/dist/esm/accordion/accordion.types.d.ts.map +1 -1
  51. package/dist/esm/button/button.d.ts +1 -0
  52. package/dist/esm/button/button.d.ts.map +1 -1
  53. package/dist/esm/button/button.js +2 -2
  54. package/dist/esm/button/button.types.d.ts +2 -0
  55. package/dist/esm/button/button.types.d.ts.map +1 -1
  56. package/dist/esm/dragAndDrop/dragAndDrop.d.ts +5 -0
  57. package/dist/esm/dragAndDrop/dragAndDrop.d.ts.map +1 -0
  58. package/dist/esm/dragAndDrop/dragAndDrop.js +42 -0
  59. package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts +18 -0
  60. package/dist/esm/dragAndDrop/dragAndDrop.types.d.ts.map +1 -0
  61. package/dist/esm/dragAndDrop/dragAndDrop.types.js +1 -0
  62. package/dist/esm/dragAndDrop/index.d.ts +4 -0
  63. package/dist/esm/dragAndDrop/index.d.ts.map +1 -0
  64. package/dist/esm/dragAndDrop/index.js +3 -0
  65. package/dist/esm/dragAndDrop/theme.d.ts +8 -0
  66. package/dist/esm/dragAndDrop/theme.d.ts.map +1 -0
  67. package/dist/esm/dragAndDrop/theme.js +10 -0
  68. package/dist/esm/index.d.ts +2 -0
  69. package/dist/esm/index.d.ts.map +1 -1
  70. package/dist/esm/index.js +2 -0
  71. package/dist/esm/sidemenu/context.d.ts +5 -0
  72. package/dist/esm/sidemenu/context.d.ts.map +1 -0
  73. package/dist/esm/sidemenu/context.js +3 -0
  74. package/dist/esm/sidemenu/index.d.ts +6 -0
  75. package/dist/esm/sidemenu/index.d.ts.map +1 -0
  76. package/dist/esm/sidemenu/index.js +5 -0
  77. package/dist/esm/sidemenu/sidemenu.d.ts +12 -0
  78. package/dist/esm/sidemenu/sidemenu.d.ts.map +1 -0
  79. package/dist/esm/sidemenu/sidemenu.js +44 -0
  80. package/dist/esm/sidemenu/sidemenu.types.d.ts +41 -0
  81. package/dist/esm/sidemenu/sidemenu.types.d.ts.map +1 -0
  82. package/dist/esm/sidemenu/sidemenu.types.js +1 -0
  83. package/dist/esm/sidemenu/sidemenuItem.d.ts +5 -0
  84. package/dist/esm/sidemenu/sidemenuItem.d.ts.map +1 -0
  85. package/dist/esm/sidemenu/sidemenuItem.js +26 -0
  86. package/dist/esm/sidemenu/sidemenuTop.d.ts +5 -0
  87. package/dist/esm/sidemenu/sidemenuTop.d.ts.map +1 -0
  88. package/dist/esm/sidemenu/sidemenuTop.js +16 -0
  89. package/dist/esm/sidemenu/theme.d.ts +8 -0
  90. package/dist/esm/sidemenu/theme.d.ts.map +1 -0
  91. package/dist/esm/sidemenu/theme.js +10 -0
  92. package/dist/esm/theme/components.d.ts +12 -0
  93. package/dist/esm/theme/components.d.ts.map +1 -1
  94. package/dist/esm/theme/components.js +4 -0
  95. package/dist/esm/theme/defaultTheme.d.ts +12 -0
  96. package/dist/esm/theme/defaultTheme.d.ts.map +1 -1
  97. package/package.json +1 -1
  98. package/src/accordion/accordion.types.ts +1 -0
  99. package/src/button/button.tsx +2 -1
  100. package/src/button/button.types.ts +2 -0
  101. package/src/dragAndDrop/dragAndDrop.tsx +85 -0
  102. package/src/dragAndDrop/dragAndDrop.types.ts +19 -0
  103. package/src/dragAndDrop/index.ts +3 -0
  104. package/src/dragAndDrop/theme.ts +14 -0
  105. package/src/index.ts +2 -0
  106. package/src/sidemenu/context.ts +5 -0
  107. package/src/sidemenu/index.ts +5 -0
  108. package/src/sidemenu/sidemenu.tsx +66 -0
  109. package/src/sidemenu/sidemenu.types.ts +46 -0
  110. package/src/sidemenu/sidemenuItem.tsx +81 -0
  111. package/src/sidemenu/sidemenuTop.tsx +25 -0
  112. package/src/sidemenu/theme.ts +14 -0
  113. 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;;;;;;;;;;;;;;;SAoBtB,CAAA;AACD;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;UAqHX,iBAAiB;UACjB,iBAAiB;CACxB,CAAA;AAKD,eAAe,MAAM,CAAA"}
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: "falAngleDown" })))));
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,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,4 @@
1
+ export * from './dragAndDrop';
2
+ export { default } from './dragAndDrop';
3
+ export * from './dragAndDrop.types';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -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,8 @@
1
+ declare const _default: {
2
+ baseStyle: {};
3
+ defaultProps: {};
4
+ sizes: {};
5
+ variants: {};
6
+ };
7
+ export default _default;
8
+ //# sourceMappingURL=theme.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/dragAndDrop/theme.ts"],"names":[],"mappings":";;;;;;AAQA,wBAKC"}
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const baseStyle = {};
4
+ const defaultProps = {};
5
+ const sizes = {};
6
+ const variants = {};
7
+ exports.default = {
8
+ baseStyle,
9
+ defaultProps,
10
+ sizes,
11
+ variants
12
+ };
@@ -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';
@@ -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,5 @@
1
+ /// <reference types="react" />
2
+ import { Dict } from '../utils';
3
+ declare const SidemenuProvider: import("react").Provider<Dict<any>>, useSidemenuContext: () => Dict<any>;
4
+ export { SidemenuProvider, useSidemenuContext };
5
+ //# sourceMappingURL=context.d.ts.map
@@ -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,6 @@
1
+ export * from './sidemenu';
2
+ export * from './sidemenuItem';
3
+ export * from './sidemenuTop';
4
+ export { default } from './sidemenu';
5
+ export * from './sidemenu.types';
6
+ //# sourceMappingURL=index.d.ts.map
@@ -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,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,5 @@
1
+ import { SidemenuItemProps } from './sidemenu.types';
2
+ /** A menu item. */
3
+ export declare const SidemenuItem: (props: SidemenuItemProps) => JSX.Element;
4
+ export default SidemenuItem;
5
+ //# sourceMappingURL=sidemenuItem.d.ts.map
@@ -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;
@@ -0,0 +1,5 @@
1
+ import { SidemenuTopProps } from './sidemenu.types';
2
+ /** Top container. */
3
+ export declare const SidemenuTop: (props: SidemenuTopProps) => JSX.Element | null;
4
+ export default SidemenuTop;
5
+ //# sourceMappingURL=sidemenuTop.d.ts.map