pcm-shared-components 0.0.193 → 0.0.194

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 (11) hide show
  1. package/dist/components/Buttons/TillButton/index.js +6 -6
  2. package/dist/components/Dialogs/GenericAppBar/components/GenericAppBarSubMenu.js +1 -1
  3. package/dist/components/{ImageStack → Images/ImageStack}/index.js +0 -0
  4. package/dist/components/Menus/ReusablePopupMenu/components/GenericSubMenu.js +4 -2
  5. package/dist/components/Menus/ReusablePopupMenu/components/ReusableMenu.js +13 -15
  6. package/dist/components/TextBoxes/CurrencyTextInput/index.js +2 -2
  7. package/dist/index.js +1 -1
  8. package/dist/styles/tailwind.css +1 -1
  9. package/package.json +1 -1
  10. package/dist/components/ImageStack/storybook/index.docs.mdx +0 -14
  11. package/dist/components/ImageStack/storybook/index.stories.js +0 -35
package/dist/components/Buttons/TillButton/index.js CHANGED
@@ -2,12 +2,12 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
2
2
 
3
3
  import React, { memo } from 'react';
4
4
  import PropTypes from 'prop-types';
5
- import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
6
- import { ThemeProvider } from '@mui/system';
5
+ import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'; // import { ThemeProvider } from '@mui/system';
6
+
7
7
  import { createTheme, useTheme } from '@mui/material/styles';
8
8
  import { ReusablePopupMenu } from '../../Menus/ReusablePopupMenu';
9
- import i18n from '../../../locals/i18n';
10
9
  import Button from '@mui/material/Button';
10
+ import i18next from 'i18next';
11
11
  /**
12
12
  * Creates a till button from other PCM components to simplify the component.
13
13
  * Uses:
@@ -52,8 +52,8 @@ export default /*#__PURE__*/memo(TillButton);
52
52
  TillButton.defaultProps = {
53
53
  inUse: false,
54
54
  name: '',
55
- defaultText: i18n.t('common.app.till'),
56
- menuData: [],
55
+ defaultText: i18next.t('common.app.till'),
56
+ menuData: {},
57
57
  className: undefined,
58
58
  size: 'large',
59
59
  theme: undefined
@@ -69,7 +69,7 @@ TillButton.propTypes = {
69
69
  defaultText: PropTypes.string,
70
70
 
71
71
  /** Menu items for the dropdown, see the ReusablePopupMenu component for a better understanding of the props parameters */
72
- menuData: PropTypes.array,
72
+ menuData: PropTypes.object,
73
73
 
74
74
  /** Classes applied to the button */
75
75
  className: PropTypes.string,
package/dist/components/Dialogs/GenericAppBar/components/GenericAppBarSubMenu.js CHANGED
@@ -70,7 +70,7 @@ const GenericAppBarSubMenu = ({
70
70
  full_menu: true,
71
71
  handleParentMenuClose: handleSubMenuClose
72
72
  }) : /*#__PURE__*/React.createElement(MenuItem, {
73
- key: `sub_menu_items__${idx}}`,
73
+ key: `app_bar_sub_menu_items__${idx}}`,
74
74
  onClick: () => {
75
75
  handleSubMenuClose();
76
76
  sub_menu.onClick();
package/dist/components/Menus/ReusablePopupMenu/components/GenericSubMenu.js CHANGED
@@ -123,8 +123,10 @@ const GenericSubMenu = ({
123
123
  open: isSubMenuOpen,
124
124
  onClose: handleSubMenuClose,
125
125
  onClick: menu.onClick
126
- }, (menu.subMenu || []).filter(mn => !(mn.hideMenu && mn.hideMenu === true)).map((sub_menu, idx) => /*#__PURE__*/React.createElement(React.Fragment, null, sub_menu.subMenu ? /*#__PURE__*/React.createElement(GenericSubMenu, {
127
- key: `common_grid_app_bar_sub_desktop_sub_${idx}`,
126
+ }, (menu.subMenu || []).filter(mn => !(mn.hideMenu && mn.hideMenu === true)).map((sub_menu, idx) => /*#__PURE__*/React.createElement("div", {
127
+ key: 'this_submenu_' + idx
128
+ }, sub_menu.subMenu ? /*#__PURE__*/React.createElement(GenericSubMenu, {
129
+ key: `app_bar_common_grid_app_bar_sub_desktop_sub_${idx}`,
128
130
  menu: sub_menu,
129
131
  classes: classes,
130
132
  full_menu: true,
package/dist/components/Menus/ReusablePopupMenu/components/ReusableMenu.js CHANGED
@@ -1,5 +1,3 @@
1
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
1
  import React from 'react';
4
2
  import withStyles from "@mui/styles/withStyles";
5
3
  import Menu from "@mui/material/Menu";
@@ -15,17 +13,7 @@ const StyledMenu = withStyles({
15
13
  paddingTop: 4,
16
14
  paddingBottom: 4
17
15
  }
18
- })(props => /*#__PURE__*/React.createElement(Menu, _extends({
19
- elevation: 0,
20
- anchorOrigin: {
21
- vertical: "bottom",
22
- horizontal: props.menuAnchorLocation
23
- },
24
- transformOrigin: {
25
- vertical: "top",
26
- horizontal: props.menuAnchorLocation
27
- }
28
- }, props)));
16
+ })(props => /*#__PURE__*/React.createElement(Menu, props));
29
17
  const StyledMenuItem = withStyles(() => ({
30
18
  root: {
31
19
  minHeight: 32,
@@ -61,15 +49,25 @@ const ReusableMenu = props => {
61
49
  } = props;
62
50
  return /*#__PURE__*/React.createElement(StyledMenu, {
63
51
  id: "customized-menu",
52
+ elevation: 0,
64
53
  anchorEl: menuAnchor,
65
- menuAnchorLocation: menuAnchorLocation,
54
+ anchorOrigin: {
55
+ vertical: "bottom",
56
+ horizontal: menuAnchorLocation
57
+ },
58
+ transformOrigin: {
59
+ vertical: "top",
60
+ horizontal: menuAnchorLocation
61
+ },
66
62
  keepMounted: keepMounted,
67
63
  open: Boolean(menuAnchor),
68
64
  onClose: handleClose
69
65
  }, menuData.filter(mn => !(mn.hideMenu && mn.hideMenu === true)).map((menu, idx) => /*#__PURE__*/React.createElement("div", {
70
66
  className: "w-full",
71
67
  key: `ReusableMenu_${idx}`
72
- }, menu.name && /*#__PURE__*/React.createElement(React.Fragment, null, menu.subMenu ? /*#__PURE__*/React.createElement("div", {
68
+ }, menu.name && /*#__PURE__*/React.createElement("div", {
69
+ key: 'this_menu_' + idx
70
+ }, menu.subMenu ? /*#__PURE__*/React.createElement("div", {
73
71
  className: "flex flex-row w-full",
74
72
  key: `main_sub_items_${new Date()}`
75
73
  }, /*#__PURE__*/React.createElement(GenericSubMenu, {
package/dist/components/TextBoxes/CurrencyTextInput/index.js CHANGED
@@ -80,7 +80,7 @@ export const CurrencyTextInput = props => {
80
80
 
81
81
  if (decimalCheck.length === 2 && decimalCheck[1].length > 0) {
82
82
  return Number(value).toLocaleString(undefined, {
83
- minimumFractionDigits: 1,
83
+ minimumFractionDigits: Number(decimalPlaces) > 0 ? 1 : 0,
84
84
  maximumFractionDigits: decimalPlaces,
85
85
  useGrouping: false
86
86
  });
@@ -220,7 +220,7 @@ CurrencyTextInput.propTypes = {
220
220
  name: PropTypes.string,
221
221
 
222
222
  /** Value to be enter and display in input */
223
- value: PropTypes.string,
223
+ value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
224
224
 
225
225
  /** The label content*/
226
226
  label: PropTypes.string,
package/dist/index.js CHANGED
@@ -21,5 +21,5 @@ import currencySymbol from './locals/currencySymbol';
21
21
  import DateRangeCalendar from './components/Date/DateRangeCalendar';
22
22
  import SimpleLabel from './components/Labels/SimpleLabel';
23
23
  import CurrencyTextInput from './components/TextBoxes/CurrencyTextInput';
24
- import ImageStack from './components/ImageStack';
24
+ import ImageStack from './components/Images/ImageStack';
25
25
  export { TestButton, CodeHighlight, CustomFab, HelpButton, GenericDialogWindow, PcSharedComponentThemeInheritor, ImageCanvasDraw, PCMScrollbar, TwoColumnDisplay, SimpleTab, HrefLink, GenericAppBar, ReusablePopupMenu, SearchBar, TillButton, DropdownButton, translationResources, coreLocals, currencySymbol, DateRangeCalendar, SimpleLabel, CurrencyTextInput, ImageStack };
package/dist/styles/tailwind.css CHANGED
@@ -1 +1 @@
1
- *,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-webkit-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.static{position:static}.absolute{position:absolute}.relative{position:relative}.top-0{top:0}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.m-auto{margin:auto}.m-12{margin:1.2rem}.mx-6{margin-left:.6rem;margin-right:.6rem}.my-auto{margin-top:auto;margin-bottom:auto}.my-4{margin-top:.4rem;margin-bottom:.4rem}.mx-2{margin-left:.2rem;margin-right:.2rem}.my-12{margin-top:1.2rem;margin-bottom:1.2rem}.my-6{margin-top:.6rem;margin-bottom:.6rem}.mx-8{margin-left:.8rem;margin-right:.8rem}.ml-0{margin-left:0}.mr-0{margin-right:0}.ml-4{margin-left:.4rem}.mt-12{margin-top:1.2rem}.mt-6{margin-top:.6rem}.mb-2{margin-bottom:.2rem}.mr-12{margin-right:1.2rem}.ml-6{margin-left:.6rem}.mb-6{margin-bottom:.6rem}.ml-12{margin-left:1.2rem}.mb-24{margin-bottom:2.4rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-full{height:100%}.h-screen{height:100vh}.w-full{width:100%}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/5{width:40%}.grow{flex-grow:1}.cursor-not-allowed{cursor:not-allowed}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.list-disc{list-style-type:disc}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overscroll-none{overscroll-behavior:none}.rounded{border-radius:.4rem}.rounded-md{border-radius:.6rem}.border{border-width:1px}.border-2{border-width:2px}.border-transparent{border-color:#0000}.bg-black{--tw-bg-opacity:1;background-color:rgb(34 41 47/var(--tw-bg-opacity))}.bg-green-600{--tw-bg-opacity:1;background-color:rgb(67 160 71/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(238 238 238/var(--tw-bg-opacity))}.bg-yellow-100\/50{background-color:#fff9c480}.p-6{padding:.6rem}.px-4{padding-left:.4rem;padding-right:.4rem}.py-2{padding-top:.2rem;padding-bottom:.2rem}.px-2{padding-left:.2rem;padding-right:.2rem}.pt-12{padding-top:1.2rem}.pt-4{padding-top:.4rem}.pl-0{padding-left:0}.pr-0{padding-right:0}.pb-4{padding-bottom:.4rem}.text-center{text-align:center}.font-sans{font-family:Muli,Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:1.4rem;line-height:2rem}.text-xl{font-size:2rem;line-height:2.8rem}.text-2xl{line-height:3.2rem}.text-24,.text-2xl{font-size:2.4rem}.font-medium{font-weight:500}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(117 117 117/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(158 158 158/var(--tw-text-opacity))}.no-underline{-webkit-text-decoration-line:none;text-decoration-line:none}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px 0 var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.drop-shadow-none{--tw-drop-shadow:drop-shadow(0 0 #0000)}.drop-shadow-none,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hover\:bg-green-700:hover{--tw-bg-opacity:1;background-color:rgb(56 142 60/var(--tw-bg-opacity))}.hover\:bg-gray-100\/75:hover{background-color:#f5f5f5bf}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(97 97 97/var(--tw-text-opacity))}.hover\:underline:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-green-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(76 175 80/var(--tw-ring-opacity))}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}@media (min-width:960px){.md\:pt-0{padding-top:0}}
1
+ *,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::-webkit-backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2196f380;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.static{position:static}.absolute{position:absolute}.relative{position:relative}.top-0{top:0}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.m-auto{margin:auto}.m-12{margin:1.2rem}.mx-6{margin-left:.6rem;margin-right:.6rem}.my-auto{margin-top:auto;margin-bottom:auto}.my-4{margin-top:.4rem;margin-bottom:.4rem}.mx-2{margin-left:.2rem;margin-right:.2rem}.my-12{margin-top:1.2rem;margin-bottom:1.2rem}.my-6{margin-top:.6rem;margin-bottom:.6rem}.mx-8{margin-left:.8rem;margin-right:.8rem}.ml-0{margin-left:0}.mr-0{margin-right:0}.ml-4{margin-left:.4rem}.mt-12{margin-top:1.2rem}.mt-6{margin-top:.6rem}.mb-2{margin-bottom:.2rem}.ml-6{margin-left:.6rem}.mb-6{margin-bottom:.6rem}.ml-12{margin-left:1.2rem}.mb-24{margin-bottom:2.4rem}.mr-12{margin-right:1.2rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.h-full{height:100%}.h-screen{height:100vh}.w-full{width:100%}.w-auto{width:auto}.w-1\/2{width:50%}.w-2\/5{width:40%}.grow{flex-grow:1}.cursor-not-allowed{cursor:not-allowed}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.list-disc{list-style-type:disc}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.overscroll-none{overscroll-behavior:none}.rounded{border-radius:.4rem}.rounded-md{border-radius:.6rem}.border{border-width:1px}.border-2{border-width:2px}.border-transparent{border-color:#0000}.bg-green-600{--tw-bg-opacity:1;background-color:rgb(67 160 71/var(--tw-bg-opacity))}.bg-black{--tw-bg-opacity:1;background-color:rgb(34 41 47/var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(238 238 238/var(--tw-bg-opacity))}.bg-yellow-100\/50{background-color:#fff9c480}.p-6{padding:.6rem}.px-4{padding-left:.4rem;padding-right:.4rem}.py-2{padding-top:.2rem;padding-bottom:.2rem}.px-2{padding-left:.2rem;padding-right:.2rem}.pt-12{padding-top:1.2rem}.pt-4{padding-top:.4rem}.pl-0{padding-left:0}.pr-0{padding-right:0}.pb-4{padding-bottom:.4rem}.text-center{text-align:center}.font-sans{font-family:Muli,Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-sm{font-size:1.4rem;line-height:2rem}.text-xl{font-size:2rem;line-height:2.8rem}.text-2xl{line-height:3.2rem}.text-24,.text-2xl{font-size:2.4rem}.font-medium{font-weight:500}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(117 117 117/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(158 158 158/var(--tw-text-opacity))}.no-underline{-webkit-text-decoration-line:none;text-decoration-line:none}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px 0 #0000000f;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px 0 var(--tw-shadow-color)}.shadow,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 #0000000d;--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.drop-shadow-none{--tw-drop-shadow:drop-shadow(0 0 #0000)}.drop-shadow-none,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.hover\:bg-green-700:hover{--tw-bg-opacity:1;background-color:rgb(56 142 60/var(--tw-bg-opacity))}.hover\:bg-gray-100\/75:hover{background-color:#f5f5f5bf}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(97 97 97/var(--tw-text-opacity))}.hover\:underline:hover{-webkit-text-decoration-line:underline;text-decoration-line:underline}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-green-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(76 175 80/var(--tw-ring-opacity))}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px}@media (min-width:960px){.md\:pt-0{padding-top:0}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pcm-shared-components",
3
- "version": "0.0.193",
3
+ "version": "0.0.194",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "babel": {
package/dist/components/ImageStack/storybook/index.docs.mdx DELETED
@@ -1,14 +0,0 @@
1
- import { ArgsTable, Canvas, Meta, Story } from "@storybook/addon-docs";
2
- import ImageStack from '..'
3
-
4
-
5
- # ImageStack
6
- Simple image stack with image preview on hover
7
-
8
- ## Importing the component in your project.
9
- ```js
10
- import {ImageStack} from 'pcm-shared-components';
11
- ```
12
-
13
-
14
- <ArgsTable of={ImageStack} />
package/dist/components/ImageStack/storybook/index.stories.js DELETED
@@ -1,35 +0,0 @@
1
- import ImageStack from '..';
2
- import IndexDocs from './index.docs.mdx';
3
- import { faker } from '@faker-js/faker';
4
- export const IMAGES = [];
5
- Array.from({
6
- length: 10
7
- }).forEach(() => {
8
- IMAGES.push(faker.image.avatar());
9
- });
10
- export default {
11
- title: 'Image/ImageStack',
12
- component: ImageStack,
13
- argTypes: {},
14
- parameters: {
15
- docs: {
16
- // inlineStories: true,
17
- page: IndexDocs
18
- }
19
- }
20
- };
21
-
22
- const ImageStackTemplate = args => /*#__PURE__*/React.createElement(ImageStack, args);
23
-
24
- export const ImageStackHorizontal = ImageStackTemplate.bind({});
25
- ImageStackHorizontal.args = {
26
- orientation: 'horizontal',
27
- imageSize: 40,
28
- images: IMAGES
29
- };
30
- export const ImageStackVertical = ImageStackTemplate.bind({});
31
- ImageStackVertical.args = {
32
- orientation: 'vertical',
33
- imageSize: 60,
34
- images: IMAGES
35
- };