@atlaskit/spotlight 0.3.1 → 0.3.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/spotlight
 
+## 0.3.2
+
+### Patch Changes
+
+- [`ec2250eef3ec9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ec2250eef3ec9) -
+  Spotlight now accepts `top-center` and `bottom-center` placements to ensure SpotlightCard content
+  can be seen on small viewports.
+
 ## 0.3.1
 
 ### Patch Changes

package/dist/cjs/ui/card/caret/index.js

@@ -15,8 +15,10 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var styles = {
   root: "_kqswh2mm _1pby1fw0 _1bsbo7ao _4t3io7ao _t9ecjyd4 _bfhkcdhy",
   'top-start': "_1eint94y",
+  'top-center': "_1eint94y",
   'top-end': "_1eint94y",
   'bottom-start': "_1s1gt94y",
+  'bottom-center': "_1s1gt94y",
   'bottom-end': "_1s1gt94y",
   'right-start': "_1yxnt94y",
   'right-end': "_1yxnt94y",

package/dist/cjs/ui/card/index.compiled.css

@@ -5,6 +5,7 @@
 ._16qs9g9j{box-shadow:var(--ds-shadow-overflow,0 0 8px #091e4228,0 0 1px #091e421e)}
 ._1bsbaq3k{width:295px}
 ._1e0212x7{inset-inline-start:var(--ds-space-075,6px)}
+._1e021qz4{inset-inline-start:-140px}
 ._1e02c7mi{inset-inline-start:var(--ds-space-negative-250,-20px)}
 ._1e0c1txw{display:flex}
 ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}

package/dist/cjs/ui/card/index.js

@@ -21,10 +21,12 @@ var styles = {
 };
 var placementStyles = {
   'top-start': "_u7co12x7 _rjxpc7mi",
+  'top-center': "_u7co12x7 _1e021qz4",
   'top-end': "_u7co12x7 _1e02c7mi",
   'right-start': "_1e0212x7 _u7comgjw",
   'right-end': "_1e0212x7 _152tmgjw",
   'bottom-start': "_152t12x7 _rjxpc7mi",
+  'bottom-center': "_152t12x7 _1e021qz4",
   'bottom-end': "_152t12x7 _1e02c7mi",
   'left-start': "_rjxp12x7 _u7comgjw",
   'left-end': "_rjxp12x7 _152tmgjw"

package/dist/cjs/ui/popover-content/index.js

@@ -38,8 +38,10 @@ var offset = [0, 2];
  */
 var popperPlacementMap = {
   'top-start': 'top',
+  'top-center': 'top',
   'top-end': 'top',
   'bottom-start': 'bottom',
+  'bottom-center': 'bottom',
   'bottom-end': 'bottom',
   'right-start': 'right',
   'right-end': 'right',

package/dist/es2019/ui/card/caret/index.js

@@ -7,8 +7,10 @@ import { SpotlightContext } from '../../../controllers/context';
 const styles = {
   root: "_kqswh2mm _1pby1fw0 _1bsbo7ao _4t3io7ao _t9ecjyd4 _bfhkcdhy",
   'top-start': "_1eint94y",
+  'top-center': "_1eint94y",
   'top-end': "_1eint94y",
   'bottom-start': "_1s1gt94y",
+  'bottom-center': "_1s1gt94y",
   'bottom-end': "_1s1gt94y",
   'right-start': "_1yxnt94y",
   'right-end': "_1yxnt94y",

package/dist/es2019/ui/card/index.compiled.css

@@ -5,6 +5,7 @@
 ._16qs9g9j{box-shadow:var(--ds-shadow-overflow,0 0 8px #091e4228,0 0 1px #091e421e)}
 ._1bsbaq3k{width:295px}
 ._1e0212x7{inset-inline-start:var(--ds-space-075,6px)}
+._1e021qz4{inset-inline-start:-140px}
 ._1e02c7mi{inset-inline-start:var(--ds-space-negative-250,-20px)}
 ._1e0c1txw{display:flex}
 ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}

package/dist/es2019/ui/card/index.js

@@ -13,10 +13,12 @@ const styles = {
 };
 const placementStyles = {
   'top-start': "_u7co12x7 _rjxpc7mi",
+  'top-center': "_u7co12x7 _1e021qz4",
   'top-end': "_u7co12x7 _1e02c7mi",
   'right-start': "_1e0212x7 _u7comgjw",
   'right-end': "_1e0212x7 _152tmgjw",
   'bottom-start': "_152t12x7 _rjxpc7mi",
+  'bottom-center': "_152t12x7 _1e021qz4",
   'bottom-end': "_152t12x7 _1e02c7mi",
   'left-start': "_rjxp12x7 _u7comgjw",
   'left-end': "_rjxp12x7 _152tmgjw"

package/dist/es2019/ui/popover-content/index.js

@@ -30,8 +30,10 @@ const offset = [0, 2];
  */
 const popperPlacementMap = {
   'top-start': 'top',
+  'top-center': 'top',
   'top-end': 'top',
   'bottom-start': 'bottom',
+  'bottom-center': 'bottom',
   'bottom-end': 'bottom',
   'right-start': 'right',
   'right-end': 'right',

package/dist/esm/ui/card/caret/index.js

@@ -7,8 +7,10 @@ import { SpotlightContext } from '../../../controllers/context';
 var styles = {
   root: "_kqswh2mm _1pby1fw0 _1bsbo7ao _4t3io7ao _t9ecjyd4 _bfhkcdhy",
   'top-start': "_1eint94y",
+  'top-center': "_1eint94y",
   'top-end': "_1eint94y",
   'bottom-start': "_1s1gt94y",
+  'bottom-center': "_1s1gt94y",
   'bottom-end': "_1s1gt94y",
   'right-start': "_1yxnt94y",
   'right-end': "_1yxnt94y",

package/dist/esm/ui/card/index.compiled.css

@@ -5,6 +5,7 @@
 ._16qs9g9j{box-shadow:var(--ds-shadow-overflow,0 0 8px #091e4228,0 0 1px #091e421e)}
 ._1bsbaq3k{width:295px}
 ._1e0212x7{inset-inline-start:var(--ds-space-075,6px)}
+._1e021qz4{inset-inline-start:-140px}
 ._1e02c7mi{inset-inline-start:var(--ds-space-negative-250,-20px)}
 ._1e0c1txw{display:flex}
 ._1q51u2gc{padding-block-start:var(--ds-space-100,8px)}

package/dist/esm/ui/card/index.js

@@ -13,10 +13,12 @@ var styles = {
 };
 var placementStyles = {
   'top-start': "_u7co12x7 _rjxpc7mi",
+  'top-center': "_u7co12x7 _1e021qz4",
   'top-end': "_u7co12x7 _1e02c7mi",
   'right-start': "_1e0212x7 _u7comgjw",
   'right-end': "_1e0212x7 _152tmgjw",
   'bottom-start': "_152t12x7 _rjxpc7mi",
+  'bottom-center': "_152t12x7 _1e021qz4",
   'bottom-end': "_152t12x7 _1e02c7mi",
   'left-start': "_rjxp12x7 _u7comgjw",
   'left-end': "_rjxp12x7 _152tmgjw"

package/dist/esm/ui/popover-content/index.js

@@ -30,8 +30,10 @@ var offset = [0, 2];
  */
 var popperPlacementMap = {
   'top-start': 'top',
+  'top-center': 'top',
   'top-end': 'top',
   'bottom-start': 'bottom',
+  'bottom-center': 'bottom',
   'bottom-end': 'bottom',
   'right-start': 'right',
   'right-end': 'right',

package/dist/types/index.d.ts

@@ -14,3 +14,4 @@ export { SpotlightMedia, type SpotlightMediaProps } from './ui/media';
 export { PopoverProvider } from './ui/popover-provider';
 export { PopoverContent } from './ui/popover-content';
 export { PopoverTarget } from './ui/popover-target';
+export { type Placement } from './types';

package/dist/types/types.d.ts

@@ -1 +1 @@
-export type Placement = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
+export type Placement = 'top-start' | 'top-center' | 'top-end' | 'bottom-start' | 'bottom-center' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';

package/dist/types-ts4.5/index.d.ts

@@ -14,3 +14,4 @@ export { SpotlightMedia, type SpotlightMediaProps } from './ui/media';
 export { PopoverProvider } from './ui/popover-provider';
 export { PopoverContent } from './ui/popover-content';
 export { PopoverTarget } from './ui/popover-target';
+export { type Placement } from './types';

package/dist/types-ts4.5/types.d.ts

@@ -1 +1 @@
-export type Placement = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
+export type Placement = 'top-start' | 'top-center' | 'top-end' | 'bottom-start' | 'bottom-center' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';

package/offerings.json

@@ -0,0 +1,33 @@
+[
+	{
+		"name": "Spotlight",
+		"package": "@atlaskit/spotlight",
+		"import": {
+			"name": "Spotlight",
+			"package": "@atlaskit/spotlight",
+			"type": "named"
+		},
+		"keywords": ["spotlight", "search", "command", "palette", "quick"],
+		"categories": ["navigation"],
+		"shortDescription": "A component for quick search and command execution.",
+		"status": "general-availability",
+		"accessibilityGuidelines": [
+			"Ensure proper keyboard navigation",
+			"Provide clear search functionality",
+			"Use appropriate ARIA attributes",
+			"Consider screen reader announcements"
+		],
+		"usageGuidelines": [
+			"Use for quick search and commands",
+			"Provide clear search functionality",
+			"Consider keyboard shortcuts",
+			"Handle search results appropriately"
+		],
+		"contentGuidelines": [
+			"Use clear, descriptive search labels",
+			"Provide helpful search suggestions",
+			"Use consistent command naming",
+			"Keep search results relevant"
+		]
+	}
+]

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/spotlight",
-	"version": "0.3.1",
+	"version": "0.3.2",
 	"description": "A spotlight introduces users to various points of interest across Atlassian through focused messages or multi-step tours.",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",