@gravity-ui/dashkit 6.0.0-beta.1 → 6.0.0-beta.2

package/build/cjs/components/ActionsToolbar/ActionsToolbar.css

@@ -0,0 +1,26 @@
+.actions-toolbar {
+  display: flex;
+  position: fixed;
+  width: fit-content;
+  padding: 8px;
+  border-radius: var(--g-border-radius-l);
+  background-color: var(--g-color-base-background);
+  box-shadow: 0px 5px 6px 0px var(--g-color-sfx-shadow);
+}
+.actions-toolbar__button {
+  transition: all 0.2s ease;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 98px;
+  height: 68px;
+  cursor: pointer;
+  border-radius: var(--g-border-radius-s);
+}
+.actions-toolbar__button:hover {
+  background-color: var(--g-color-base-generic);
+}
+.actions-toolbar__icon {
+  margin-bottom: 10px;
+}

package/build/cjs/components/ActionsToolbar/ActionsToolbar.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { IconProps } from '@gravity-ui/uikit';
+export interface ActionsToolbarProps {
+    controls: ActionsToolbarButton[];
+    className?: string;
+}
+export interface ActionsToolbarButton {
+    icon: IconProps['data'];
+    text: React.ReactNode;
+    handler: () => void;
+    iconSize?: number;
+}
+export declare const ActionsToolbar: React.FC<ActionsToolbarProps>;

package/build/cjs/components/ActionsToolbar/ActionsToolbar.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionsToolbar = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const bem_cn_lite_1 = tslib_1.__importDefault(require("bem-cn-lite"));
+const uikit_1 = require("@gravity-ui/uikit");
+const b = (0, bem_cn_lite_1.default)('actions-toolbar');
+const WidgetButton = ({ icon, text, handler }) => (react_1.default.createElement("div", { className: b('button'), onClick: handler },
+    react_1.default.createElement(uikit_1.Icon, { size: '18', className: b('icon'), data: icon }),
+    react_1.default.createElement(uikit_1.Text, { variant: 'body-1' }, text)));
+const ActionsToolbar = (props) => {
+    return (react_1.default.createElement("div", { className: `${b()} ${props.className}` }, props.controls.map((button, index) => {
+        return (react_1.default.createElement(WidgetButton, { key: index, icon: button.icon, text: button.text, handler: button.handler }));
+    })));
+};
+exports.ActionsToolbar = ActionsToolbar;

package/build/cjs/components/index.d.ts

@@ -1,2 +1,4 @@
 export * from './DashKit';
+export { ActionsToolbar } from './ActionsToolbar/ActionsToolbar';
 export type { OverlayControlItem } from './OverlayControls/OverlayControls';
+export type { ActionsToolbarButton } from './ActionsToolbar/ActionsToolbar';

package/build/cjs/components/index.js

@@ -1,4 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ActionsToolbar = void 0;
 const tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./DashKit"), exports);
+var ActionsToolbar_1 = require("./ActionsToolbar/ActionsToolbar");
+Object.defineProperty(exports, "ActionsToolbar", { enumerable: true, get: function () { return ActionsToolbar_1.ActionsToolbar; } });

package/build/esm/components/ActionsToolbar/ActionsToolbar.css

@@ -0,0 +1,26 @@
+.actions-toolbar {
+  display: flex;
+  position: fixed;
+  width: fit-content;
+  padding: 8px;
+  border-radius: var(--g-border-radius-l);
+  background-color: var(--g-color-base-background);
+  box-shadow: 0px 5px 6px 0px var(--g-color-sfx-shadow);
+}
+.actions-toolbar__button {
+  transition: all 0.2s ease;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 98px;
+  height: 68px;
+  cursor: pointer;
+  border-radius: var(--g-border-radius-s);
+}
+.actions-toolbar__button:hover {
+  background-color: var(--g-color-base-generic);
+}
+.actions-toolbar__icon {
+  margin-bottom: 10px;
+}

package/build/esm/components/ActionsToolbar/ActionsToolbar.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { IconProps } from '@gravity-ui/uikit';
+import './ActionsToolbar.css';
+export interface ActionsToolbarProps {
+    controls: ActionsToolbarButton[];
+    className?: string;
+}
+export interface ActionsToolbarButton {
+    icon: IconProps['data'];
+    text: React.ReactNode;
+    handler: () => void;
+    iconSize?: number;
+}
+export declare const ActionsToolbar: React.FC<ActionsToolbarProps>;

package/build/esm/components/ActionsToolbar/ActionsToolbar.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import block from 'bem-cn-lite';
+import { Icon, Text } from '@gravity-ui/uikit';
+import './ActionsToolbar.css';
+const b = block('actions-toolbar');
+const WidgetButton = ({ icon, text, handler }) => (React.createElement("div", { className: b('button'), onClick: handler },
+    React.createElement(Icon, { size: '18', className: b('icon'), data: icon }),
+    React.createElement(Text, { variant: 'body-1' }, text)));
+export const ActionsToolbar = (props) => {
+    return (React.createElement("div", { className: `${b()} ${props.className}` }, props.controls.map((button, index) => {
+        return (React.createElement(WidgetButton, { key: index, icon: button.icon, text: button.text, handler: button.handler }));
+    })));
+};

package/build/esm/components/index.d.ts

@@ -1,2 +1,4 @@
 export * from './DashKit';
+export { ActionsToolbar } from './ActionsToolbar/ActionsToolbar';
 export type { OverlayControlItem } from './OverlayControls/OverlayControls';
+export type { ActionsToolbarButton } from './ActionsToolbar/ActionsToolbar';

package/build/esm/components/index.js

@@ -1 +1,2 @@
 export * from './DashKit';
+export { ActionsToolbar } from './ActionsToolbar/ActionsToolbar';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dashkit",
-  "version": "6.0.0-beta.1",
+  "version": "6.0.0-beta.2",
   "description": "Library for rendering dashboard grid layout",
   "license": "MIT",
   "repository": {