@atlaskit/inline-message 12.1.3 → 12.2.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/inline-message
 
+## 12.2.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 12.2.0
+
+### Minor Changes
+
+- [#110670](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110670)
+  [`c733254a2dd6e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c733254a2dd6e) -
+  Explicitly set jsxRuntime to classic via pragma comments in order to avoid issues where jsxRuntime
+  is implicitly set to automatic.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 12.1.3
 
 ### Patch Changes
@@ -29,7 +48,7 @@
 
 - [#96634](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/96634)
   [`047cd471b7e2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/047cd471b7e2) -
-  Add support for React 18.
+  Add support for React 18 in non-strict mode.
 
 ## 12.0.5
 

package/README.md

@@ -1,6 +1,7 @@
 # Inline message
 
-An inline message lets users know when important information is available or when an action is required.
+An inline message lets users know when important information is available or when an action is
+required.
 
 ## Installation
 
@@ -8,4 +9,5 @@ yarn add @atlaskit/inline-message
 
 ## Usage
 
-Detailed docs and example usage can be found [here](https://atlaskit.atlassian.com/packages/core/inline-message).
+Detailed docs and example usage can be found
+[here](https://atlaskit.atlassian.com/packages/core/inline-message).

package/__perf__/default.tsx

@@ -3,12 +3,9 @@ import React from 'react';
 import InlineMessage from '../src';
 
 export default () => (
-  <div>
-    <InlineMessage
-      title="Inline Message Title Example"
-      secondaryText="Secondary Text"
-    >
-      <p>Primary and secondary text dialog</p>
-    </InlineMessage>
-  </div>
+	<div>
+		<InlineMessage title="Inline Message Title Example" secondaryText="Secondary Text">
+			<p>Primary and secondary text dialog</p>
+		</InlineMessage>
+	</div>
 );

package/dist/cjs/components/inline-message/index.js

@@ -15,8 +15,13 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _colors = require("@atlaskit/theme/colors");
 var _messageIcon = _interopRequireDefault(require("../message-icon"));
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var rootStyles = (0, _react2.css)({
   display: 'inline-block',
   maxWidth: '100%',
@@ -24,12 +29,12 @@ var rootStyles = (0, _react2.css)({
     outline: '1px solid'
   },
   '&:hover': {
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--icon]': {
       // Legacy style
       color: 'var(--icon-accent-color)'
     },
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--button]': {
       textDecoration: 'underline'
     }
@@ -106,6 +111,7 @@ var InlineMessage = function InlineMessage(_ref) {
     ,
     style: {
       '--icon-accent-color': iconColor(appearance)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     },
     "data-testid": testId
   }, (0, _react2.jsx)(_layering.UNSAFE_LAYERING, {

package/dist/cjs/components/message-icon/index.js

@@ -7,8 +7,13 @@ exports.default = void 0;
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("../../constants");
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var iconColor = function iconColor(appearance) {
   switch (appearance) {
     case 'connectivity':
@@ -48,7 +53,7 @@ var SelectedIcon = function SelectedIcon(_ref) {
     defaultLabel = _typesMapping$appeara.defaultLabel;
   return (0, _react.jsx)("span", {
     "data-ds--inline-message--icon": true
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     ,
     style: {
       '--icon-color': iconColor(appearance)

package/dist/es2019/components/inline-message/index.js

@@ -1,5 +1,10 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { useCallback, useState } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';
 import InlineDialog from '@atlaskit/inline-dialog';
@@ -15,12 +20,12 @@ const rootStyles = css({
     outline: '1px solid'
   },
   '&:hover': {
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--icon]': {
       // Legacy style
       color: 'var(--icon-accent-color)'
     },
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--button]': {
       textDecoration: 'underline'
     }
@@ -87,6 +92,7 @@ const InlineMessage = ({
     ,
     style: {
       '--icon-accent-color': iconColor(appearance)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     },
     "data-testid": testId
   }, jsx(UNSAFE_LAYERING, {

package/dist/es2019/components/message-icon/index.js

@@ -1,5 +1,9 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { B400, G300, P300, R400, Y300 } from '@atlaskit/theme/colors';
 import { typesMapping } from '../../constants';
@@ -46,7 +50,7 @@ const SelectedIcon = ({
   } = typesMapping;
   return jsx("span", {
     "data-ds--inline-message--icon": true
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     ,
     style: {
       '--icon-color': iconColor(appearance)

package/dist/esm/components/inline-message/index.js

@@ -1,6 +1,11 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { useCallback, useState } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import Button from '@atlaskit/button/custom-theme-button';
 import InlineDialog from '@atlaskit/inline-dialog';
@@ -16,12 +21,12 @@ var rootStyles = css({
     outline: '1px solid'
   },
   '&:hover': {
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--icon]': {
       // Legacy style
       color: 'var(--icon-accent-color)'
     },
-    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+    // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
     '[data-ds--inline-message--button]': {
       textDecoration: 'underline'
     }
@@ -98,6 +103,7 @@ var InlineMessage = function InlineMessage(_ref) {
     ,
     style: {
       '--icon-accent-color': iconColor(appearance)
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     },
     "data-testid": testId
   }, jsx(UNSAFE_LAYERING, {

package/dist/esm/components/message-icon/index.js

@@ -1,5 +1,9 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { B400, G300, P300, R400, Y300 } from '@atlaskit/theme/colors';
 import { typesMapping } from '../../constants';
@@ -42,7 +46,7 @@ var SelectedIcon = function SelectedIcon(_ref) {
     defaultLabel = _typesMapping$appeara.defaultLabel;
   return jsx("span", {
     "data-ds--inline-message--icon": true
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     ,
     style: {
       '--icon-color': iconColor(appearance)

package/dist/types/components/inline-message/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type FC, type ReactNode } from 'react';
 import type { IconAppearance, InlineDialogPlacement } from '../../types';

package/dist/types/components/message-icon/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import type { FC } from 'react';
 import type { IconAppearance } from '../../types';

package/dist/types-ts4.5/components/inline-message/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type FC, type ReactNode } from 'react';
 import type { IconAppearance, InlineDialogPlacement } from '../../types';

package/dist/types-ts4.5/components/message-icon/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import type { FC } from 'react';
 import type { IconAppearance } from '../../types';

package/package.json

@@ -1,105 +1,105 @@
 {
-  "name": "@atlaskit/inline-message",
-  "version": "12.1.3",
-  "description": "An inline message lets users know when important information is available or when an action is required.",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
-  "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",
-  "af:exports": {
-    ".": "./src/index.tsx",
-    "./constants": "./src/constants.tsx",
-    "./types": "./src/types.tsx"
-  },
-  "atlassian": {
-    "team": "Design System Team",
-    "releaseModel": "continuous",
-    "productPushConsumption": [
-      "jira"
-    ],
-    "website": {
-      "name": "Inline message",
-      "category": "Components"
-    },
-    "runReact18": true
-  },
-  "dependencies": {
-    "@atlaskit/button": "^17.17.0",
-    "@atlaskit/icon": "^22.3.0",
-    "@atlaskit/inline-dialog": "^14.1.0",
-    "@atlaskit/layering": "^0.3.0",
-    "@atlaskit/platform-feature-flags": "^0.2.0",
-    "@atlaskit/primitives": "^7.0.0",
-    "@atlaskit/theme": "^12.9.0",
-    "@atlaskit/tokens": "^1.49.0",
-    "@babel/runtime": "^7.0.0",
-    "@emotion/react": "^11.7.1"
-  },
-  "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
-  },
-  "devDependencies": {
-    "@af/accessibility-testing": "*",
-    "@af/integration-testing": "*",
-    "@af/visual-regression": "*",
-    "@atlaskit/ds-lib": "^2.3.0",
-    "@atlaskit/ssr": "*",
-    "@atlaskit/visual-regression": "*",
-    "@emotion/jest": "^11.8.0",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/user-event": "^14.4.3",
-    "react-dom": "^16.8.0",
-    "typescript": "~5.4.2"
-  },
-  "keywords": [
-    "atlaskit",
-    "react",
-    "ui"
-  ],
-  "techstack": {
-    "@atlassian/frontend": {
-      "import-structure": "atlassian-conventions"
-    },
-    "@repo/internal": {
-      "dom-events": "use-bind-event-listener",
-      "design-system": "v1",
-      "styling": [
-        "static",
-        "emotion"
-      ],
-      "ui-components": "lite-mode",
-      "analytics": "analytics-next",
-      "design-tokens": [
-        "color",
-        "spacing"
-      ],
-      "deprecation": "no-deprecated-imports"
-    }
-  },
-  "typesVersions": {
-    ">=4.5 <4.9": {
-      "*": [
-        "dist/types-ts4.5/*",
-        "dist/types-ts4.5/index.d.ts"
-      ]
-    }
-  },
-  "platform-feature-flags": {
-    "platform.design-system-team.layering_qmiw3": {
-      "type": "boolean",
-      "referenceOnly": true
-    },
-    "platform.design-system-team.inline-message-layering_wfp1p": {
-      "type": "boolean"
-    }
-  },
-  "homepage": "https://atlassian.design/components/inline-message/"
-}
+	"name": "@atlaskit/inline-message",
+	"version": "12.2.1",
+	"description": "An inline message lets users know when important information is available or when an action is required.",
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	},
+	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
+	"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",
+	"af:exports": {
+		".": "./src/index.tsx",
+		"./constants": "./src/constants.tsx",
+		"./types": "./src/types.tsx"
+	},
+	"atlassian": {
+		"team": "Design System Team",
+		"releaseModel": "continuous",
+		"productPushConsumption": [
+			"jira"
+		],
+		"website": {
+			"name": "Inline message",
+			"category": "Components"
+		},
+		"runReact18": true
+	},
+	"dependencies": {
+		"@atlaskit/button": "^17.22.0",
+		"@atlaskit/icon": "^22.4.0",
+		"@atlaskit/inline-dialog": "^14.2.0",
+		"@atlaskit/layering": "^0.3.0",
+		"@atlaskit/platform-feature-flags": "^0.2.0",
+		"@atlaskit/primitives": "^8.0.0",
+		"@atlaskit/theme": "^12.10.0",
+		"@atlaskit/tokens": "^1.51.0",
+		"@babel/runtime": "^7.0.0",
+		"@emotion/react": "^11.7.1"
+	},
+	"peerDependencies": {
+		"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
+	},
+	"devDependencies": {
+		"@af/accessibility-testing": "*",
+		"@af/integration-testing": "*",
+		"@af/visual-regression": "*",
+		"@atlaskit/ds-lib": "^2.3.0",
+		"@atlaskit/ssr": "*",
+		"@atlaskit/visual-regression": "*",
+		"@emotion/jest": "^11.8.0",
+		"@testing-library/react": "^12.1.5",
+		"@testing-library/user-event": "^14.4.3",
+		"react-dom": "^16.8.0",
+		"typescript": "~5.4.2"
+	},
+	"keywords": [
+		"atlaskit",
+		"react",
+		"ui"
+	],
+	"techstack": {
+		"@atlassian/frontend": {
+			"import-structure": "atlassian-conventions"
+		},
+		"@repo/internal": {
+			"dom-events": "use-bind-event-listener",
+			"design-system": "v1",
+			"styling": [
+				"static",
+				"emotion"
+			],
+			"ui-components": "lite-mode",
+			"analytics": "analytics-next",
+			"design-tokens": [
+				"color",
+				"spacing"
+			],
+			"deprecation": "no-deprecated-imports"
+		}
+	},
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"platform-feature-flags": {
+		"platform.design-system-team.layering_qmiw3": {
+			"type": "boolean",
+			"referenceOnly": true
+		},
+		"platform.design-system-team.inline-message-layering_wfp1p": {
+			"type": "boolean"
+		}
+	},
+	"homepage": "https://atlassian.design/components/inline-message/"
+}

package/report.api.md

@@ -2,7 +2,8 @@
 
 ## API Report File for "@atlaskit/inline-message"
 
-> Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
+> Do not edit this file. This report is auto-generated using
+> [API Extractor](https://api-extractor.com/).
 > [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
 
 ### Table of contents
@@ -19,30 +20,25 @@ import { FC } from 'react';
 import { ReactNode } from 'react';
 
 // @public (undocumented)
-type IconAppearance =
-  | 'confirmation'
-  | 'connectivity'
-  | 'error'
-  | 'info'
-  | 'warning';
+type IconAppearance = 'confirmation' | 'connectivity' | 'error' | 'info' | 'warning';
 
 // @public (undocumented)
 type InlineDialogPlacement =
-  | 'auto'
-  | 'auto-end'
-  | 'auto-start'
-  | 'bottom'
-  | 'bottom-end'
-  | 'bottom-start'
-  | 'left'
-  | 'left-end'
-  | 'left-start'
-  | 'right'
-  | 'right-end'
-  | 'right-start'
-  | 'top'
-  | 'top-end'
-  | 'top-start';
+	| 'auto'
+	| 'auto-end'
+	| 'auto-start'
+	| 'bottom'
+	| 'bottom-end'
+	| 'bottom-start'
+	| 'left'
+	| 'left-end'
+	| 'left-start'
+	| 'right'
+	| 'right-end'
+	| 'right-start'
+	| 'top'
+	| 'top-end'
+	| 'top-start';
 
 // @public
 const InlineMessage: FC<InlineMessageProps>;
@@ -50,15 +46,15 @@ export default InlineMessage;
 
 // @public (undocumented)
 interface InlineMessageProps {
-  appearance?: IconAppearance;
-  children?: ReactNode;
-  iconLabel?: string;
-  placement?: InlineDialogPlacement;
-  secondaryText?: ReactNode;
-  testId?: string;
-  title?: ReactNode;
-  // @deprecated (undocumented)
-  type?: IconAppearance;
+	appearance?: IconAppearance;
+	children?: ReactNode;
+	iconLabel?: string;
+	placement?: InlineDialogPlacement;
+	secondaryText?: ReactNode;
+	testId?: string;
+	title?: ReactNode;
+	// @deprecated (undocumented)
+	type?: IconAppearance;
 }
 
 // (No @packageDocumentation comment for this package)
@@ -72,7 +68,7 @@ interface InlineMessageProps {
 
 ```json
 {
-  "react": "^16.8.0"
+	"react": "^16.8.0"
 }
 ```