pds-dev-kit-web-test 2.7.155 → 2.7.157

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 (6) hide show
  1. package/dist/src/sub/DynamicLayout/components/pdsOriginal/desktop/IconButton/IconButton.d.ts +3 -1
  2. package/dist/src/sub/DynamicLayout/components/pdsOriginal/desktop/IconButton/IconButton.js +20 -16
  3. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js +2 -0
  4. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationNextBtn.js +1 -1
  5. package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationPrevBtn.js +1 -1
  6. package/package.json +1 -1
package/dist/src/sub/DynamicLayout/components/pdsOriginal/desktop/IconButton/IconButton.d.ts CHANGED
@@ -17,8 +17,10 @@ export type IconButtonProps = {
17
17
  type?: 'submit' | 'reset' | 'button';
18
18
  state?: 'normal' | 'disabled';
19
19
  tabIndex?: number;
20
+ useDefaultHoverStyle?: boolean;
21
+ useDefaultActiveStyle?: boolean;
20
22
  onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
21
23
  onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
22
24
  };
23
- declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, overrideBaseColorHex, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, overrideIconColorHex, shadow, colorTheme, type, state, tabIndex, onClick, onMouseDown }: IconButtonProps): JSX.Element;
25
+ declare function IconButton({ fillType, shapeType, baseSize, baseColorKey, overrideBaseColorHex, borderColorKey, iconSize, iconFillType, iconName, iconColorKey, overrideIconColorHex, shadow, colorTheme, type, state, tabIndex, useDefaultHoverStyle, useDefaultActiveStyle, onClick, onMouseDown }: IconButtonProps): JSX.Element;
24
26
  export default IconButton;
package/dist/src/sub/DynamicLayout/components/pdsOriginal/desktop/IconButton/IconButton.js CHANGED
@@ -42,7 +42,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
42
42
  var styled_components_1 = __importStar(require("styled-components"));
43
43
  var hybrid_1 = require("../../hybrid");
44
44
  function IconButton(_a) {
45
- var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, overrideBaseColorHex = _a.overrideBaseColorHex, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, overrideIconColorHex = _a.overrideIconColorHex, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
45
+ var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, overrideBaseColorHex = _a.overrideBaseColorHex, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, overrideIconColorHex = _a.overrideIconColorHex, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, _l = _a.useDefaultHoverStyle, useDefaultHoverStyle = _l === void 0 ? true : _l, _m = _a.useDefaultActiveStyle, useDefaultActiveStyle = _m === void 0 ? true : _m, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
46
46
  var handleClick = function (e) {
47
47
  if (onClick) {
48
48
  onClick(e);
@@ -76,7 +76,7 @@ function IconButton(_a) {
76
76
  }
77
77
  return iconStateColorObj[fillType];
78
78
  };
79
- return ((0, jsx_runtime_1.jsx)(S_IconButton, __assign({ "x-pds-name": "IconButton", "x-pds-element-type": "component", "x-pds-device-type": "desktop", fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, overrideBaseColorHex: overrideBaseColorHex, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, onClick: handleClick, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), overrideColorHex: overrideIconColorHex, fillType: iconFillType }) })));
79
+ return ((0, jsx_runtime_1.jsx)(S_IconButton, __assign({ "x-pds-name": "IconButton", "x-pds-element-type": "component", "x-pds-device-type": "desktop", fillType: fillType, shapeType: shapeType, baseSize: baseSize, baseColorKey: baseColorKey, overrideBaseColorHex: overrideBaseColorHex, borderColorKey: borderColorKey, shadow: shadow, colorTheme: colorTheme, type: type, state: state, disabled: state === 'disabled', tabIndex: tabIndex, useDefaultHoverStyle: useDefaultHoverStyle, useDefaultActiveStyle: useDefaultActiveStyle, onClick: handleClick, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(hybrid_1.Icon, { iconName: iconName, size: iconSize, colorKey: IconColorSelect(), overrideColorHex: overrideIconColorHex, fillType: iconFillType }) })));
80
80
  }
81
81
  var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), function (_a) {
82
82
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
@@ -84,21 +84,23 @@ var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObj
84
84
  ? ''
85
85
  : theme.ui_cpnt_button_fill_base_disabled;
86
86
  });
87
- var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"], ["\n background-color: ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"])), function (_a) {
87
+ var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n ", "\n\n ", "\n\n ", ";\n"], ["\n background-color: ", ";\n\n ", "\n\n ", "\n\n ", ";\n"])), function (_a) {
88
88
  var theme = _a.theme, overrideBaseColorHex = _a.overrideBaseColorHex, baseColorKey = _a.baseColorKey;
89
89
  if (overrideBaseColorHex)
90
90
  return overrideBaseColorHex;
91
91
  return baseColorKey ? theme[baseColorKey] : theme.ui_cpnt_button_fill_base_primary;
92
92
  }, function (_a) {
93
- var theme = _a.theme, baseColorKey = _a.baseColorKey;
94
- return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
95
- ? ''
96
- : "background-image: linear-gradient(\n to top,\n ".concat(theme.ui_cpnt_button_fill_on_base_hover, ",\n ").concat(theme.ui_cpnt_button_fill_on_base_hover, "\n );");
93
+ var useDefaultHoverStyle = _a.useDefaultHoverStyle, theme = _a.theme, baseColorKey = _a.baseColorKey;
94
+ return useDefaultHoverStyle &&
95
+ "\n &:hover:enabled {\n ".concat(baseColorKey === 'ui_cpnt_button_fill_base_transparent'
96
+ ? ''
97
+ : "background-image: linear-gradient(\n to top,\n ".concat(theme.ui_cpnt_button_fill_on_base_hover, ",\n ").concat(theme.ui_cpnt_button_fill_on_base_hover, "\n );"), "\n }\n ");
97
98
  }, function (_a) {
98
- var theme = _a.theme, baseColorKey = _a.baseColorKey;
99
- return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
100
- ? ''
101
- : "background-image: linear-gradient(\n to top,\n ".concat(theme.ui_cpnt_button_fill_on_base_pressed, ",\n ").concat(theme.ui_cpnt_button_fill_on_base_pressed, "\n );");
99
+ var useDefaultActiveStyle = _a.useDefaultActiveStyle, theme = _a.theme, baseColorKey = _a.baseColorKey;
100
+ return useDefaultActiveStyle &&
101
+ "\n &:active:enabled {\n ".concat(baseColorKey === 'ui_cpnt_button_fill_base_transparent'
102
+ ? ''
103
+ : "background-image: linear-gradient(\n to top,\n ".concat(theme.ui_cpnt_button_fill_on_base_pressed, ",\n ").concat(theme.ui_cpnt_button_fill_on_base_pressed, "\n );"), "\n }\n ");
102
104
  }, function (_a) {
103
105
  var state = _a.state;
104
106
  return state === 'disabled' && fillDisabled;
@@ -110,7 +112,7 @@ var lineDisabled = (0, styled_components_1.css)(templateObject_3 || (templateObj
110
112
  var theme = _a.theme;
111
113
  return theme.ui_cpnt_button_line_border_disabled;
112
114
  });
113
- var line = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n\n ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"], ["\n background-color: ", ";\n border-color: ", ";\n\n ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"])), function (_a) {
115
+ var line = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n\n ", ";\n\n ", "\n\n ", "\n\n ", ";\n"], ["\n background-color: ", ";\n border-color: ", ";\n\n ", ";\n\n ", "\n\n ", "\n\n ", ";\n"])), function (_a) {
114
116
  var theme = _a.theme;
115
117
  return theme.ui_cpnt_button_line_base_default;
116
118
  }, function (_a) {
@@ -127,11 +129,13 @@ var line = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 =
127
129
  return '';
128
130
  }
129
131
  }, function (_a) {
130
- var theme = _a.theme;
131
- return "background-color: ".concat(theme.ui_cpnt_button_line_base_hover, "\n ;");
132
+ var useDefaultHoverStyle = _a.useDefaultHoverStyle, theme = _a.theme;
133
+ return useDefaultHoverStyle &&
134
+ "\n &:hover:enabled {\n background-color: ".concat(theme.ui_cpnt_button_line_base_hover, ";\n }\n ");
132
135
  }, function (_a) {
133
- var theme = _a.theme;
134
- return "background-color: ".concat(theme.ui_cpnt_button_line_base_pressed, "\n ;");
136
+ var useDefaultActiveStyle = _a.useDefaultActiveStyle, theme = _a.theme;
137
+ return useDefaultActiveStyle &&
138
+ "\n &:active:enabled {\n background-color: ".concat(theme.ui_cpnt_button_line_base_pressed, ";\n }\n ");
135
139
  }, function (_a) {
136
140
  var state = _a.state;
137
141
  return state === 'disabled' && lineDisabled;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/ContentsCarousel.js CHANGED
@@ -77,6 +77,8 @@ function ContentsCarousel(props) {
77
77
  props: CB_STYLE_PROP_CONTENTSCAROUSEL,
78
78
  device: device
79
79
  }), customProgressbarNormalStyle = _g.normalStyle, customProgressbarHoverStyle = _g.hoverStyle;
80
+ console.log('contentsCarouselHoverStyle', contentsCarouselHoverStyle);
81
+ console.log('customNavigationHoverStyle', customNavigationHoverStyle);
80
82
  var _h = (0, useSwiper_1.useSwiper)(), swiperRef = _h.swiperRef, progressRef = _h.progressRef, leftTimeMsRef = _h.leftTimeMsRef, isBeginning = _h.isBeginning, isEnd = _h.isEnd, onSwiper = _h.onSwiper, onSlideChangeTransitionEnd = _h.onSlideChangeTransitionEnd, onAutoplayTimeLeft = _h.onAutoplayTimeLeft, onClickPrevBtn = _h.onClickPrevBtn, onClickNextBtn = _h.onClickNextBtn;
81
83
  var _j = (0, react_1.useState)(false), isHovered = _j[0], setIsHovered = _j[1];
82
84
  var loop = isHovered ? contentsCarouselHoverStyle.loop : contentsCarouselNormalStyle.loop;
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationNextBtn.js CHANGED
@@ -58,7 +58,7 @@ var CustomNavigationNextBtn = function (_a) {
58
58
  buttonSize = 'xxlarge';
59
59
  iconSize = 48;
60
60
  }
61
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: nextButton && ((0, jsx_runtime_1.jsx)(S_NextButton, __assign({ className: "cb-contentscarousel-next-button", disabled: isDisabled, "$size": styles.nextBtnSize }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: buttonSize, iconSize: iconSize, shapeType: nextButton.shapeType, borderColorKey: nextButton.borderColorKey, overrideBaseColorHex: styles.nextBtnPrimaryColor, iconName: nextButton.iconName, iconFillType: "line", iconColorKey: nextButton.iconColorKey || 'ui_cpnt_icon_sys_black', overrideIconColorHex: styles.nextBtnSecondaryColor, shadow: nextButton.shadow, onClick: onClick }) }))) }));
61
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: nextButton && ((0, jsx_runtime_1.jsx)(S_NextButton, __assign({ className: "cb-contentscarousel-next-button", disabled: isDisabled, "$size": styles.nextBtnSize }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: buttonSize, iconSize: iconSize, shapeType: nextButton.shapeType, borderColorKey: nextButton.borderColorKey, overrideBaseColorHex: styles.nextBtnPrimaryColor, iconName: nextButton.iconName, iconFillType: "line", iconColorKey: nextButton.iconColorKey || 'ui_cpnt_icon_sys_black', overrideIconColorHex: styles.nextBtnSecondaryColor, shadow: nextButton.shadow, useDefaultActiveStyle: false, useDefaultHoverStyle: false, onClick: onClick }) }))) }));
62
62
  };
63
63
  exports.CustomNavigationNextBtn = CustomNavigationNextBtn;
64
64
  var S_NextButton = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n cursor: pointer;\n\n ", ";\n"], ["\n cursor: pointer;\n\n ", ";\n"])), function (_a) {
package/dist/src/sub/DynamicLayout/sections/CustomSection/components/ComponentBlock/componentBlocks/ContentsCarousel/components/CustomNavigationPrevBtn.js CHANGED
@@ -58,7 +58,7 @@ var CustomNavigationPrevBtn = function (_a) {
58
58
  buttonSize = 'xxlarge';
59
59
  iconSize = 48;
60
60
  }
61
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: prevButton && ((0, jsx_runtime_1.jsx)(S_PrevButton, __assign({ className: "cb-contentscarousel-prev-button", disabled: isDisabled, "$size": styles.prevBtnSize }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: buttonSize, iconSize: iconSize, shapeType: prevButton.shapeType, borderColorKey: prevButton.borderColorKey, overrideBaseColorHex: styles.prevBtnPrimaryColor, iconName: prevButton.iconName, iconFillType: "line", iconColorKey: prevButton.iconColorKey || 'ui_cpnt_icon_sys_black', overrideIconColorHex: styles.prevBtnSecondaryColor, shadow: prevButton.shadow, onClick: onClick }) }))) }));
61
+ return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: prevButton && ((0, jsx_runtime_1.jsx)(S_PrevButton, __assign({ className: "cb-contentscarousel-prev-button", disabled: isDisabled, "$size": styles.prevBtnSize }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { fillType: "fill", baseSize: buttonSize, iconSize: iconSize, shapeType: prevButton.shapeType, borderColorKey: prevButton.borderColorKey, overrideBaseColorHex: styles.prevBtnPrimaryColor, iconName: prevButton.iconName, iconFillType: "line", iconColorKey: prevButton.iconColorKey || 'ui_cpnt_icon_sys_black', overrideIconColorHex: styles.prevBtnSecondaryColor, shadow: prevButton.shadow, onClick: onClick, useDefaultActiveStyle: false, useDefaultHoverStyle: false }) }))) }));
62
62
  };
63
63
  exports.CustomNavigationPrevBtn = CustomNavigationPrevBtn;
64
64
  var S_PrevButton = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n cursor: pointer;\n\n ", ";\n"], ["\n cursor: pointer;\n\n ", ";\n"])), function (_a) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web-test",
3
- "version": "2.7.155",
3
+ "version": "2.7.157",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",