@aegov/design-system-react
Version:
A design system for the Government of the United Arab Emirates. Extending the original design system released as @aegov/design-system, this is the package specefically created for the ReactJs enviornment.
39 lines (38 loc) • 1.63 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.Placement = exports.Basic = void 0;
var _react = _interopRequireDefault(require("react"));
var _Tooltip = _interopRequireDefault(require("./Tooltip"));
var _Button = _interopRequireDefault(require("../Button/Button"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
var _default = exports.default = {
title: 'Components/Tooltip',
component: _Tooltip.default,
parameters: {
layout: 'centered'
}
};
const Basic = exports.Basic = {
args: {
children: /*#__PURE__*/_react.default.createElement(_Button.default, null, "Hover me"),
content: 'This is a basic tooltip'
}
};
const Placement = () => /*#__PURE__*/_react.default.createElement("div", {
className: "flex flex-wrap gap-4"
}, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
content: "Tooltip on top",
side: "top"
}, /*#__PURE__*/_react.default.createElement(_Button.default, null, "Top")), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
content: "Tooltip on right",
side: "right"
}, /*#__PURE__*/_react.default.createElement(_Button.default, null, "Right")), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
content: "Tooltip on bottom",
side: "bottom"
}, /*#__PURE__*/_react.default.createElement(_Button.default, null, "Bottom")), /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
content: "Tooltip on left",
side: "left"
}, /*#__PURE__*/_react.default.createElement(_Button.default, null, "Left")));
exports.Placement = Placement;