@appquality/unguess-design-system 3.1.89-tooltip → 3.1.89

package/CHANGELOG.md

@@ -1,3 +1,31 @@
+# v3.1.89 (Thu May 16 2024)
+
+#### 🐛 Bug Fix
+
+- Add tooltip to highlights and a brighter new player [#347](https://github.com/AppQuality/unguess-design-system/pull/347) ([@cannarocks](https://github.com/cannarocks))
+- "Add isTransparent prop to TooltipArgs interface and implement transparent style in Tooltip component" [#345](https://github.com/AppQuality/unguess-design-system/pull/345) ([@cannarocks](https://github.com/cannarocks))
+- "Update player controls and refactor styling" [#346](https://github.com/AppQuality/unguess-design-system/pull/346) ([@cannarocks](https://github.com/cannarocks))
+- Demo [#344](https://github.com/AppQuality/unguess-design-system/pull/344) ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
+# v3.1.88 (Mon May 13 2024)
+
+#### 🐛 Bug Fix
+
+- Player fixes [#343](https://github.com/AppQuality/unguess-design-system/pull/343) ([@cannarocks](https://github.com/cannarocks))
+- Fix undefined state in player and reduce renders [#342](https://github.com/AppQuality/unguess-design-system/pull/342) ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
 # v3.1.87 (Mon May 13 2024)
 
 #### 🐛 Bug Fix

package/build/index.js

@@ -3918,6 +3918,10 @@ const SvgVolumeUnmutedFill = props => /*#__PURE__*/React__namespace.createElemen
   d: "M11.77 9.77c.45-.45.73-1.08.73-1.77s-.28-1.31-.73-1.77m2.17 5.6c.97-.99 1.56-2.34 1.56-3.83 0-1.52-.62-2.89-1.61-3.89"
 })));
 
+const ControlButton = styled__default["default"](IconButton) `
+  color: ${({ theme }) => theme.palette.grey[700]};
+`;
+
 const AudioButton = () => {
     const [hasAudio, setHasAudio] = React.useState(false);
     const { isMuted, setMuted, context } = Video.useVideoContext();
@@ -3942,8 +3946,8 @@ const AudioButton = () => {
             setMuted(!hasVolume(player.ref.current));
             checkAudio(player.ref.current);
         }
-    }, [context.isPlaying, isMuted]);
-    return (jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, disabled: !hasAudio, onClick: () => {
+    }, [context.isPlaying, isMuted, player, setMuted]);
+    return (jsxRuntime.jsx(ControlButton, Object.assign({ disabled: !hasAudio, onClick: () => {
             if (player === null || player === void 0 ? void 0 : player.ref.current) {
                 player.ref.current.volume = player.ref.current.volume > 0 ? 0 : 1;
                 setMuted(!player.ref.current.volume);
@@ -4280,18 +4284,18 @@ const ControlsGroupCenter = (props) => {
         const nextTime = videoRef.currentTime + 10;
         videoRef.currentTime = nextTime;
     };
-    return (jsxRuntime.jsxs(StyledDiv$3, Object.assign({}, props, { children: [jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, onClick: (e) => {
+    return (jsxRuntime.jsxs(StyledDiv$3, Object.assign({}, props, { children: [jsxRuntime.jsx(ControlButton, Object.assign({ onClick: (e) => {
                     if (videoRef) {
                         videoRef.currentTime = 0;
                     }
                     e.stopPropagation();
-                } }, { children: jsxRuntime.jsx(SvgPreviousFill, {}) })), jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, onClick: (e) => {
+                } }, { children: jsxRuntime.jsx(SvgPreviousFill, {}) })), jsxRuntime.jsx(ControlButton, Object.assign({ onClick: (e) => {
                     onRewind();
                     e.stopPropagation();
-                } }, { children: jsxRuntime.jsx(SvgBackSecondsFill, {}) })), jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, size: "large", onClick: togglePlay }, { children: isPlaying ? (jsxRuntime.jsx(SvgPauseFill, { style: { width: "24px", height: "24px" } })) : (jsxRuntime.jsx(SvgPlayFill, { style: { width: "24px", height: "24px" } })) })), jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, onClick: (e) => {
+                } }, { children: jsxRuntime.jsx(SvgBackSecondsFill, {}) })), jsxRuntime.jsx(ControlButton, Object.assign({ size: "large", onClick: togglePlay }, { children: isPlaying ? (jsxRuntime.jsx(SvgPauseFill, { style: { width: "24px", height: "24px" } })) : (jsxRuntime.jsx(SvgPlayFill, { style: { width: "24px", height: "24px" } })) })), jsxRuntime.jsx(ControlButton, Object.assign({ onClick: (e) => {
                     onForward();
                     e.stopPropagation();
-                } }, { children: jsxRuntime.jsx(SvgForwardSecondsFill, {}) })), jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, isPill: true, onClick: (e) => {
+                } }, { children: jsxRuntime.jsx(SvgForwardSecondsFill, {}) })), jsxRuntime.jsx(ControlButton, Object.assign({ isPill: true, onClick: (e) => {
                     const newSpeed = getNextPlaybackRate(playBackRate);
                     if (videoRef === null || videoRef === void 0 ? void 0 : videoRef.playbackRate) {
                         setPlayBackRate(newSpeed);
@@ -4301,9 +4305,9 @@ const ControlsGroupCenter = (props) => {
                 } }, { children: jsxRuntime.jsxs(SM, Object.assign({ isBold: true, style: { lineHeight: "16px" } }, { children: [playBackRate, "x"] })) }))] })));
 };
 
-var _path$f;
+var _path$f, _circle$1;
 function _extends$i() { _extends$i = 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$i.apply(this, arguments); }
-const SvgMaximizeStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
+const SvgTagStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
   xmlns: "http://www.w3.org/2000/svg",
   width: 16,
   height: 16,
@@ -4312,19 +4316,54 @@ const SvgMaximizeStroke = props => /*#__PURE__*/React__namespace.createElement("
 }, props), _path$f || (_path$f = /*#__PURE__*/React__namespace.createElement("path", {
   fill: "none",
   stroke: "currentColor",
-  strokeLinecap: "round",
-  d: "M4.5.5H1C.72.5.5.72.5 1v3.5m15 0V1c0-.28-.22-.5-.5-.5h-3.5m-11 11V15c0 .28.22.5.5.5h3.5m11-4V15c0 .28-.22.5-.5.5h-3.5m-7-11L1 1m10.5 3.5L15 1M4.5 11.5L1 15m10.5-3.5L15 15"
+  d: "M.5 1v5.3c0 .1.1.3.1.4l8.5 8.5c.2.2.5.2.7 0l5.3-5.3c.2-.2.2-.5 0-.7L6.6.6S6.4.5 6.3.5H1C.7.5.5.7.5 1z"
+})), _circle$1 || (_circle$1 = /*#__PURE__*/React__namespace.createElement("circle", {
+  cx: 4,
+  cy: 4,
+  r: 1,
+  fill: "currentColor"
 })));
 
+const Cutter = ({ onCutHandler, isCutting, i18n, }) => {
+    var _a;
+    const { context } = Video.useVideoContext();
+    const videoRef = (_a = context.player) === null || _a === void 0 ? void 0 : _a.ref.current;
+    if (!onCutHandler)
+        return null;
+    return (jsxRuntime.jsxs(Button, Object.assign({ isPrimary: true, isAccent: true, size: "small", onClick: (e) => {
+            if (videoRef) {
+                onCutHandler(videoRef.currentTime);
+            }
+            e.stopPropagation();
+        } }, { children: [jsxRuntime.jsx(Button.StartIcon, { children: jsxRuntime.jsx(SvgTagStroke, {}) }), isCutting
+                ? (i18n === null || i18n === void 0 ? void 0 : i18n.onHighlight) || "Click again to stop"
+                : (i18n === null || i18n === void 0 ? void 0 : i18n.beforeHighlight) || "New highlight"] })));
+};
+
 var _path$e;
 function _extends$h() { _extends$h = 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$h.apply(this, arguments); }
-const SvgMinimizeStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
+const SvgMaximizeStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
   xmlns: "http://www.w3.org/2000/svg",
   width: 16,
   height: 16,
   focusable: "false",
   viewBox: "0 0 16 16"
 }, props), _path$e || (_path$e = /*#__PURE__*/React__namespace.createElement("path", {
+  fill: "none",
+  stroke: "currentColor",
+  strokeLinecap: "round",
+  d: "M4.5.5H1C.72.5.5.72.5 1v3.5m15 0V1c0-.28-.22-.5-.5-.5h-3.5m-11 11V15c0 .28.22.5.5.5h3.5m11-4V15c0 .28-.22.5-.5.5h-3.5m-7-11L1 1m10.5 3.5L15 1M4.5 11.5L1 15m10.5-3.5L15 15"
+})));
+
+var _path$d;
+function _extends$g() { _extends$g = 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$g.apply(this, arguments); }
+const SvgMinimizeStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 16,
+  height: 16,
+  focusable: "false",
+  viewBox: "0 0 16 16"
+}, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
   fill: "none",
   stroke: "currentColor",
   strokeLinecap: "round",
@@ -4367,7 +4406,7 @@ const FullScreenButton = ({ container, }) => {
                 setFullScreen(false);
             }
         }
-    }), [ref, isFullScreen]);
+    }), [ref, isFullScreen, setFullScreen]);
     const canGoFullScreen = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
         if (ref) {
             return (requestFullscreen ||
@@ -4392,7 +4431,7 @@ const FullScreenButton = ({ container, }) => {
             }
         };
     }, [ref]);
-    return (jsxRuntime.jsx(IconButton, Object.assign({ isBright: true, onClick: (e) => {
+    return (jsxRuntime.jsx(ControlButton, Object.assign({ onClick: (e) => {
             handleFullScreen();
             e.stopPropagation();
         }, disabled: !canGoFullScreen() }, { children: document.fullscreenElement || isFullScreen ? (jsxRuntime.jsx(SvgMinimizeStroke, {})) : (jsxRuntime.jsx(SvgMaximizeStroke, {})) })));
@@ -4427,7 +4466,7 @@ const ProgressBar = React.forwardRef((props, ref) => {
 
 const StyledDiv$2 = styled__default["default"].div `
   display: flex;
-  color: ${({ theme }) => theme.palette.grey[300]};
+  color: ${({ theme }) => theme.palette.grey[700]};
 `;
 const TimeLabel = ({ current, duration, }) => (jsxRuntime.jsx(StyledDiv$2, { children: jsxRuntime.jsxs(SM, Object.assign({ tag: "span" }, { children: [formatDuration(current), "/", formatDuration(duration)] })) }));
 
@@ -4453,48 +4492,13 @@ const PlayerTooltip = (_a) => {
     return (jsxRuntime.jsx(Wrapper$1, Object.assign({}, props, { children: jsxRuntime.jsx(Content$1, { children: children }) })));
 };
 
-var _path$d, _circle$1;
-function _extends$g() { _extends$g = 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$g.apply(this, arguments); }
-const SvgTagStroke = props => /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
-  xmlns: "http://www.w3.org/2000/svg",
-  width: 16,
-  height: 16,
-  focusable: "false",
-  viewBox: "0 0 16 16"
-}, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
-  fill: "none",
-  stroke: "currentColor",
-  d: "M.5 1v5.3c0 .1.1.3.1.4l8.5 8.5c.2.2.5.2.7 0l5.3-5.3c.2-.2.2-.5 0-.7L6.6.6S6.4.5 6.3.5H1C.7.5.5.7.5 1z"
-})), _circle$1 || (_circle$1 = /*#__PURE__*/React__namespace.createElement("circle", {
-  cx: 4,
-  cy: 4,
-  r: 1,
-  fill: "currentColor"
-})));
-
-const Cutter = ({ onCutHandler, isCutting, i18n, }) => {
-    var _a;
-    const { context } = Video.useVideoContext();
-    const videoRef = (_a = context.player) === null || _a === void 0 ? void 0 : _a.ref.current;
-    if (!onCutHandler)
-        return null;
-    return (jsxRuntime.jsxs(Button, Object.assign({ isPrimary: true, isAccent: true, size: "small", onClick: (e) => {
-            if (videoRef) {
-                onCutHandler(videoRef.currentTime);
-            }
-            e.stopPropagation();
-        } }, { children: [jsxRuntime.jsx(Button.StartIcon, { children: jsxRuntime.jsx(SvgTagStroke, {}) }), isCutting
-                ? (i18n === null || i18n === void 0 ? void 0 : i18n.onHighlight) || "Click again to stop"
-                : (i18n === null || i18n === void 0 ? void 0 : i18n.beforeHighlight) || "New highlight"] })));
-};
-
 const ControlsWrapper = styled__default["default"].div `
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   padding: ${({ theme }) => theme.space.xxs} 0;
-  background-color: ${({ theme }) => reactTheming.getColor(theme.palette.grey, 700, undefined, 0.8)};
+  background-color: ${({ theme }) => theme.palette.grey[100]};
   ${({ isPlaying }) => isPlaying && "display: none;"}
   z-index: 2;
 `;
@@ -4634,6 +4638,10 @@ const BigButton = styled__default["default"](IconButton) `
   min-width: ${({ theme }) => theme.space.base * 15}px;
   width: 80px;
   height: 80px;
+
+  box-shadow: ${({ theme }) => theme.shadows.boxShadow(theme)};
+  
+
   ${PlayIcon} {
     width: 60%;
     height: 60%;
@@ -4700,8 +4708,7 @@ const Container$1 = styled__default["default"].div `
       }
     }
   }
-
-  background-color: ${({ theme }) => theme.palette.grey[700]};
+  background: ${({ theme }) => theme.palette.grey[100]};
 `;
 
 const UgSpinner = styled__default["default"](reactLoaders.Spinner) ``;

package/build/stories/buttons/button/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ButtonArgs } from "./_types";
 export declare const Default: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, ButtonArgs>;
 export declare const Basic: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, ButtonArgs>;

package/build/stories/buttons/utils.d.ts

@@ -8,18 +8,18 @@ export declare const variants: readonly [{}, {
     readonly disabled: true;
 }];
 export declare const Row: import("styled-components").IStyledComponent<"web", {
-    alignItems?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsXs?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsSm?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsMd?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsLg?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    alignItemsXl?: "start" | "end" | "center" | "baseline" | "stretch" | undefined;
-    justifyContent?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentXs?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentSm?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentMd?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentLg?: "start" | "end" | "center" | "between" | "around" | undefined;
-    justifyContentXl?: "start" | "end" | "center" | "between" | "around" | undefined;
+    alignItems?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsXs?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsSm?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsMd?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsLg?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    alignItemsXl?: "start" | "center" | "end" | "baseline" | "stretch" | undefined;
+    justifyContent?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentXs?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentSm?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentMd?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentLg?: "start" | "center" | "end" | "between" | "around" | undefined;
+    justifyContentXl?: "start" | "center" | "end" | "between" | "around" | undefined;
     wrap?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
     wrapXs?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
     wrapSm?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
@@ -73,7 +73,7 @@ export declare const Row: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
@@ -299,18 +299,18 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     md?: string | number | boolean | undefined;
     lg?: string | number | boolean | undefined;
     xl?: string | number | boolean | undefined;
-    alignSelf?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    alignSelfXs?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    alignSelfSm?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    alignSelfMd?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    alignSelfLg?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    alignSelfXl?: "start" | "end" | "center" | "auto" | "baseline" | "stretch" | undefined;
-    textAlign?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignXs?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignSm?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignMd?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignLg?: "start" | "end" | "center" | "justify" | undefined;
-    textAlignXl?: "start" | "end" | "center" | "justify" | undefined;
+    alignSelf?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfXs?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfSm?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfMd?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfLg?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    alignSelfXl?: "start" | "center" | "end" | "baseline" | "stretch" | "auto" | undefined;
+    textAlign?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignXs?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignSm?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignMd?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignLg?: "start" | "center" | "end" | "justify" | undefined;
+    textAlignXl?: "start" | "center" | "end" | "justify" | undefined;
     offset?: string | number | undefined;
     offsetXs?: string | number | undefined;
     offsetSm?: string | number | undefined;
@@ -370,7 +370,7 @@ export declare const Col: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
@@ -640,7 +640,7 @@ export declare const MD: import("styled-components").IStyledComponent<"web", {
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
-    inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    inputMode?: "decimal" | "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;

package/build/stories/chat/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PlaceholderOptions } from "@tiptap/extension-placeholder";
 import { Editor as TipTapEditor } from "@tiptap/react";
 import { ChatEditorArgs, FileItem, SuggestedUser } from "./_types";

package/build/stories/dropdowns/select/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DropdownArgs, SelectArgs } from "./_types";
 import { MenuArgs } from "../menu/_types";
 interface IItem {

package/build/stories/editor/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { EditorArgs } from "./_types";
 interface EditorStoryArgs extends EditorArgs {
     children?: any;

package/build/stories/player/index.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { PlayerArgs } from "./_types";
 interface PlayerStoryArgs extends PlayerArgs {
 }

package/build/stories/player/parts/controlButton.d.ts

@@ -0,0 +1,289 @@
+/// <reference types="react" />
+export declare const ControlButton: import("styled-components").IStyledComponent<"web", {
+    isBright?: boolean | undefined;
+    isAccent?: boolean | undefined;
+    isRotated?: boolean | undefined;
+    isDanger?: boolean | undefined;
+    size?: "small" | "medium" | "large" | undefined;
+    isNeutral?: boolean | undefined;
+    isPrimary?: boolean | undefined;
+    isBasic?: boolean | undefined;
+    isPill?: boolean | undefined;
+    focusInset?: boolean | undefined;
+    isSelected?: boolean | undefined;
+    disabled?: boolean | undefined;
+    form?: string | undefined;
+    formAction?: string | undefined;
+    formEncType?: string | undefined;
+    formMethod?: string | undefined;
+    formNoValidate?: boolean | undefined;
+    formTarget?: string | undefined;
+    name?: string | undefined;
+    type?: "button" | "submit" | "reset" | undefined;
+    value?: string | number | readonly string[] | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoFocus?: boolean | undefined;
+    className?: string | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "true" | "false") | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    nonce?: string | undefined;
+    placeholder?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: (boolean | "true" | "false") | undefined;
+    style?: import("react").CSSProperties | undefined;
+    tabIndex?: number | undefined;
+    title?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: import("react").AriaRole | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCapitalize?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    color?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    is?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    children?: import("react").ReactNode;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onCut?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<HTMLButtonElement> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLButtonElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<HTMLButtonElement> | undefined;
+    onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onChangeCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onBeforeInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onBeforeInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onInput?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onInputCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onReset?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onResetCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onSubmit?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onSubmitCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onInvalid?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onInvalidCapture?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
+    onLoad?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onError?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLButtonElement> | undefined;
+    onAbort?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEmptied?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEnded?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPause?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPlay?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPlaying?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onProgress?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onRateChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onResize?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onResizeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSeeked?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSeeking?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onStalled?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSuspend?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onWaiting?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onDrag?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragEnd?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragEnter?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragExit?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragLeave?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragOver?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragStart?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDrop?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onDropCapture?: import("react").DragEventHandler<HTMLButtonElement> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<HTMLButtonElement> | undefined;
+    onSelect?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<HTMLButtonElement> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<HTMLButtonElement> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
+    onScroll?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<HTMLButtonElement> | undefined;
+    onWheel?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<HTMLButtonElement> | undefined;
+    onAnimationStart?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLButtonElement> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
+    ref?: import("react").Ref<HTMLButtonElement> | undefined;
+    key?: import("react").Key | null | undefined;
+}> & import("react").ForwardRefExoticComponent<import("../../buttons/icon-button/_types").IconButtonArgs & import("react").RefAttributes<HTMLButtonElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "3.1.89-tooltip",
+  "version": "3.1.89",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",