UNPKG

@atlaskit/flag

Version:

A flag is used for confirmations, alerts, and acknowledgments that require minimal user interaction, often displayed using a flag group.

77 lines (74 loc) 3.4 kB
import _extends from "@babel/runtime/helpers/extends"; import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties"; import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray"; import _defineProperty from "@babel/runtime/helpers/defineProperty"; import _slicedToArray from "@babel/runtime/helpers/slicedToArray"; var _excluded = ["isAutoDismiss"]; function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } import React, { useCallback, useMemo, useState } from 'react'; import AutoDismissFlag from './auto-dismiss-flag'; import Flag from './flag'; import { FlagContext } from './flag-context'; import FlagGroup from './flag-group'; var getUniqueId = function () { var count = 0; return function () { return "flag-provider-unique-id:".concat(count++); }; }(); // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports export function FlagsProvider(_ref) { var children = _ref.children, shouldRenderToParent = _ref.shouldRenderToParent; var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), flags = _useState2[0], setFlags = _useState2[1]; var removeFlag = useCallback(function (id) { setFlags(function (current) { return current.slice(0).filter(function (flag) { return flag.id !== id; }); }); }, []); var api = useMemo(function () { return { showFlag: function show(value) { var flag = _objectSpread(_objectSpread({}, value), {}, { id: value.id || getUniqueId() }); setFlags(function (current) { var index = current.findIndex(function (value) { return value.id === flag.id; }); // If flag is not found add it if (index === -1) { return [flag].concat(_toConsumableArray(current)); } // If flag already exists with the same id, then replace it var shallow = _toConsumableArray(current); shallow[index] = flag; return shallow; }); return function dismiss() { removeFlag(flag.id); }; }, hideFlag: removeFlag }; }, [removeFlag]); return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FlagContext.Provider, { value: api }, children), /*#__PURE__*/React.createElement(FlagGroup, { onDismissed: removeFlag, shouldRenderToParent: shouldRenderToParent }, flags.map(function (flag) { var isAutoDismiss = flag.isAutoDismiss, restProps = _objectWithoutProperties(flag, _excluded); var FlagType = isAutoDismiss ? AutoDismissFlag : Flag; return /*#__PURE__*/React.createElement(FlagType, _extends({}, restProps, { key: flag.id })); }))); }