@atlaskit/blanket 12.2.2

package/dist/cjs/entry-points/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _blanket.default;
+  }
+});
+
+var _blanket = _interopRequireDefault(require("./blanket"));

package/dist/cjs/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/version.json

@@ -0,0 +1,5 @@
+{
+	"name": "@atlaskit/blanket",
+	"version": "12.2.2",
+	"sideEffects": false
+}

package/dist/es2019/blanket.js

@@ -0,0 +1,79 @@
+/** @jsx jsx */
+import React, { forwardRef, memo, useCallback } from 'react';
+import { css, jsx } from '@emotion/core';
+import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
+import noop from '@atlaskit/ds-lib/noop';
+import { DN90A, N100A } from '@atlaskit/theme/colors';
+import { useGlobalTheme } from '@atlaskit/theme/components';
+import { layers } from '@atlaskit/theme/constants';
+import { token } from '@atlaskit/tokens';
+const packageName = "@atlaskit/blanket";
+const packageVersion = "12.2.2";
+const analyticsAttributes = {
+  componentName: 'blanket',
+  packageName,
+  packageVersion
+};
+const baseStyles = css({
+  position: 'fixed',
+  zIndex: layers.blanket(),
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  overflowY: 'auto',
+  pointerEvents: 'initial'
+});
+const shouldAllowClickThroughStyles = css({
+  pointerEvents: 'none'
+});
+const invisibleStyles = css({
+  backgroundColor: 'transparent'
+});
+const lightBgStyles = css({
+  backgroundColor: token('color.background.blanket', N100A)
+});
+const darkBgStyles = css({
+  backgroundColor: token('color.background.blanket', DN90A)
+});
+const backgroundStyle = {
+  light: lightBgStyles,
+  dark: darkBgStyles
+};
+/**
+ * __Blanket__
+ *
+ * A Blanket provides the overlay layer for components such as a modal dialog or a tooltip
+ *
+ * - [Examples](https://atlaskit.atlassian.com/examples/design-system/blanket/basic-usage)
+ */
+
+const Blanket = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Blanket({
+  shouldAllowClickThrough = false,
+  isTinted = false,
+  onBlanketClicked = noop,
+  testId,
+  children,
+  analyticsContext
+}, ref) {
+  const {
+    mode
+  } = useGlobalTheme();
+  const onBlanketClickedWithAnalytics = usePlatformLeafEventHandler({
+    fn: onBlanketClicked,
+    action: 'clicked',
+    analyticsData: analyticsContext,
+    ...analyticsAttributes
+  });
+  const blanketClickOutsideChildren = useCallback(e => e.currentTarget === e.target ? onBlanketClickedWithAnalytics(e) : undefined, [onBlanketClickedWithAnalytics]);
+  const onClick = shouldAllowClickThrough ? undefined : blanketClickOutsideChildren;
+  return jsx("div", {
+    role: "presentation",
+    css: [baseStyles, shouldAllowClickThrough && shouldAllowClickThroughStyles, backgroundStyle[mode], !isTinted && invisibleStyles],
+    onClick: onClick,
+    "data-testid": testId,
+    ref: ref
+  }, children);
+}));
+Blanket.displayName = 'Blanket';
+export default Blanket;

package/dist/es2019/entry-points/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/index.js

@@ -0,0 +1 @@
+export { default } from './blanket';

package/dist/es2019/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/version.json

@@ -0,0 +1,5 @@
+{
+	"name": "@atlaskit/blanket",
+	"version": "12.2.2",
+	"sideEffects": false
+}

package/dist/esm/blanket.js

@@ -0,0 +1,89 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+/** @jsx jsx */
+import React, { forwardRef, memo, useCallback } from 'react';
+import { css, jsx } from '@emotion/core';
+import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
+import noop from '@atlaskit/ds-lib/noop';
+import { DN90A, N100A } from '@atlaskit/theme/colors';
+import { useGlobalTheme } from '@atlaskit/theme/components';
+import { layers } from '@atlaskit/theme/constants';
+import { token } from '@atlaskit/tokens';
+var packageName = "@atlaskit/blanket";
+var packageVersion = "12.2.2";
+var analyticsAttributes = {
+  componentName: 'blanket',
+  packageName: packageName,
+  packageVersion: packageVersion
+};
+var baseStyles = css({
+  position: 'fixed',
+  zIndex: layers.blanket(),
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  overflowY: 'auto',
+  pointerEvents: 'initial'
+});
+var shouldAllowClickThroughStyles = css({
+  pointerEvents: 'none'
+});
+var invisibleStyles = css({
+  backgroundColor: 'transparent'
+});
+var lightBgStyles = css({
+  backgroundColor: token('color.background.blanket', N100A)
+});
+var darkBgStyles = css({
+  backgroundColor: token('color.background.blanket', DN90A)
+});
+var backgroundStyle = {
+  light: lightBgStyles,
+  dark: darkBgStyles
+};
+/**
+ * __Blanket__
+ *
+ * A Blanket provides the overlay layer for components such as a modal dialog or a tooltip
+ *
+ * - [Examples](https://atlaskit.atlassian.com/examples/design-system/blanket/basic-usage)
+ */
+
+var Blanket = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Blanket(_ref, ref) {
+  var _ref$shouldAllowClick = _ref.shouldAllowClickThrough,
+      shouldAllowClickThrough = _ref$shouldAllowClick === void 0 ? false : _ref$shouldAllowClick,
+      _ref$isTinted = _ref.isTinted,
+      isTinted = _ref$isTinted === void 0 ? false : _ref$isTinted,
+      _ref$onBlanketClicked = _ref.onBlanketClicked,
+      onBlanketClicked = _ref$onBlanketClicked === void 0 ? noop : _ref$onBlanketClicked,
+      testId = _ref.testId,
+      children = _ref.children,
+      analyticsContext = _ref.analyticsContext;
+
+  var _useGlobalTheme = useGlobalTheme(),
+      mode = _useGlobalTheme.mode;
+
+  var onBlanketClickedWithAnalytics = usePlatformLeafEventHandler(_objectSpread({
+    fn: onBlanketClicked,
+    action: 'clicked',
+    analyticsData: analyticsContext
+  }, analyticsAttributes));
+  var blanketClickOutsideChildren = useCallback(function (e) {
+    return e.currentTarget === e.target ? onBlanketClickedWithAnalytics(e) : undefined;
+  }, [onBlanketClickedWithAnalytics]);
+  var onClick = shouldAllowClickThrough ? undefined : blanketClickOutsideChildren;
+  return jsx("div", {
+    role: "presentation",
+    css: [baseStyles, shouldAllowClickThrough && shouldAllowClickThroughStyles, backgroundStyle[mode], !isTinted && invisibleStyles],
+    onClick: onClick,
+    "data-testid": testId,
+    ref: ref
+  }, children);
+}));
+Blanket.displayName = 'Blanket';
+export default Blanket;

package/dist/esm/entry-points/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/index.js

@@ -0,0 +1 @@
+export { default } from './blanket';

package/dist/esm/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/version.json

@@ -0,0 +1,5 @@
+{
+	"name": "@atlaskit/blanket",
+	"version": "12.2.2",
+	"sideEffects": false
+}

package/dist/types/blanket.d.ts

@@ -0,0 +1,12 @@
+/** @jsx jsx */
+import React from 'react';
+import type { BlanketProps } from './types';
+/**
+ * __Blanket__
+ *
+ * A Blanket provides the overlay layer for components such as a modal dialog or a tooltip
+ *
+ * - [Examples](https://atlaskit.atlassian.com/examples/design-system/blanket/basic-usage)
+ */
+declare const Blanket: React.MemoExoticComponent<React.ForwardRefExoticComponent<BlanketProps & React.RefAttributes<HTMLDivElement>>>;
+export default Blanket;

package/dist/types/entry-points/types.d.ts

@@ -0,0 +1 @@
+export type { BlanketProps } from '../types';

package/dist/types/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './blanket';
+export type { BlanketProps } from './types';

package/dist/types/types.d.ts

@@ -0,0 +1,30 @@
+import { ReactNode } from 'react';
+import UIAnalyticsEvent from '@atlaskit/analytics-next/UIAnalyticsEvent';
+export interface BlanketProps {
+    /**
+     * Whether mouse events can pierce the blanket. If true, onBlanketClicked will not be fired.
+     */
+    shouldAllowClickThrough?: boolean;
+    /**
+     * Whether the blanket has a tinted background color.
+     */
+    isTinted?: boolean;
+    /**
+     * Handler function to be called when the blanket is clicked.
+     */
+    onBlanketClicked?: (event: React.MouseEvent<HTMLDivElement>, analyticsEvent: UIAnalyticsEvent) => void;
+    /**
+     * Additional information to be included in the `context` of analytics events.
+     */
+    analyticsContext?: Record<string, any>;
+    /**
+     * A `testId` prop is provided for specified elements,
+     * which is a unique string that appears as a data attribute `data-testid` in the rendered code,
+     * serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * The children to be rendered within Blanket.
+     */
+    children?: ReactNode;
+}

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@atlaskit/blanket",
+  "version": "12.2.2",
+  "description": "A React component that covers the underlying UI for a layered component.",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "author": "Atlassian Pty Ltd",
+  "license": "Apache-2.0",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "module:es2019": "dist/es2019/index.js",
+  "types": "dist/types/index.d.ts",
+  "sideEffects": false,
+  "atlaskit:src": "src/index.tsx",
+  "atlaskit:designLink": "https://atlassian.design/guidelines/product/components/modal-dialog",
+  "atlassian": {
+    "team": "Design System Team",
+    "inPublicMirror": true,
+    "releaseModel": "scheduled",
+    "website": {
+      "name": "Blanket"
+    }
+  },
+  "af:exports": {
+    ".": "./src/index.tsx",
+    "./types": "./src/entry-points/types.tsx"
+  },
+  "dependencies": {
+    "@atlaskit/analytics-next": "^8.2.0",
+    "@atlaskit/codemod-utils": "^3.4.0",
+    "@atlaskit/ds-lib": "^1.3.0",
+    "@atlaskit/theme": "^12.0.0",
+    "@atlaskit/tokens": "^0.2.0",
+    "@babel/runtime": "^7.0.0",
+    "@emotion/core": "^10.0.9"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0"
+  },
+  "devDependencies": {
+    "@atlaskit/badge": "^15.0.0",
+    "@atlaskit/build-utils": "*",
+    "@atlaskit/button": "^16.1.0",
+    "@atlaskit/docs": "*",
+    "@atlaskit/ssr": "*",
+    "@atlaskit/toggle": "^12.3.0",
+    "@atlaskit/visual-regression": "*",
+    "@atlaskit/webdriver-runner": "*",
+    "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@testing-library/dom": "^7.7.3",
+    "@testing-library/react": "^8.0.1",
+    "jscodeshift": "^0.13.0",
+    "react-dom": "^16.8.0",
+    "react-lorem-component": "^0.13.0",
+    "storybook-addon-performance": "^0.16.0",
+    "typescript": "3.9.6",
+    "wait-for-expect": "^1.2.0"
+  },
+  "keywords": [
+    "atlaskit",
+    "react",
+    "ui"
+  ],
+  "techstack": {
+    "@atlassian/frontend": {
+      "import-structure": "atlassian-conventions"
+    },
+    "@repo/internal": {
+      "design-system": "v1",
+      "styling": "emotion",
+      "ui-components": "lite-mode",
+      "analytics": "analytics-next",
+      "theming": "tokens",
+      "deprecation": "no-deprecated-imports"
+    }
+  },
+  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
+}

package/types/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@atlaskit/blanket/types",
+  "main": "../dist/cjs/entry-points/types.js",
+  "module": "../dist/esm/entry-points/types.js",
+  "module:es2019": "../dist/es2019/entry-points/types.js",
+  "types": "../dist/types/entry-points/types.d.ts"
+}