@atlaskit/flag 14.7.2 → 15.0.0

package/report.api.md

@@ -1,14 +1,24 @@
-## API Report File for "@atlaskit/flag".
+<!-- API Report Version: 2.2 -->
 
-> Do not edit this file. This report is auto-generated by [API Extractor](https://api-extractor.com/).
+## API Report File for "@atlaskit/flag"
 
-[Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
+> 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
+
+- [Main Entry Types](#main-entry-types)
+
+### Main Entry Types
+
+<!--SECTION START: Main Entry Types-->
 
 ```ts
 /// <reference types="react" />
 
 import { ComponentType } from 'react';
 import { CustomThemeButtonProps } from '@atlaskit/button/types';
+import { FC } from 'react';
 import { jsx } from '@emotion/react';
 import { MouseEventHandler } from 'react';
 import { default as React_2 } from 'react';
@@ -17,9 +27,11 @@ import { ReactNode } from 'react';
 import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
 
-export declare type ActionsType = Array<ActionType>;
+// @public (undocumented)
+export type ActionsType = Array<ActionType>;
 
-declare type ActionType = {
+// @public (undocumented)
+type ActionType = {
   content: ReactNode;
   onClick?: (
     e: React.MouseEvent<HTMLElement>,
@@ -30,217 +42,119 @@ declare type ActionType = {
   testId?: string;
 };
 
-export declare type AppearanceTypes =
+// @public (undocumented)
+export type AppearanceTypes =
   | 'error'
   | 'info'
   | 'normal'
   | 'success'
   | 'warning';
 
-/**
- * __Auto dismiss flag__
- *
- * An auto dismiss flag is dismissed automatically after eight seconds.
- *
- * - [Examples](https://atlassian.design/components/flag/auto-dismiss-flag/examples)
- * - [Code](https://atlassian.design/components/flag/auto-dismiss-flag/code)
- */
-export declare const AutoDismissFlag: (
-  props: AutoDismissFlagProps,
-) => JSX.Element;
-
-declare interface AutoDismissFlagProps
+// @public
+export const AutoDismissFlag: (props: AutoDismissFlagProps) => JSX.Element;
+
+// @public (undocumented)
+interface AutoDismissFlagProps
   extends AutoDismissFlagPropsWithoutId,
     FlagPropsId {}
 
-declare type AutoDismissFlagPropsWithoutId = {
-  /**
-   * Array of clickable actions to be shown at the bottom of the flag. For flags where appearance
-   * is 'normal', actions will be shown as links. For all other appearance values, actions will
-   * shown as buttons.
-   * If href is passed the action will be shown as a link with the passed href prop.
-   */
+// @public (undocumented)
+type AutoDismissFlagPropsWithoutId = {
   actions?: ActionsType;
-  /**
-   * Makes the flag appearance bold. Setting this to anything other than 'normal' hides the
-   * dismiss button.
-   */
   appearance?: AppearanceTypes;
-  /**
-   * The secondary content shown below the flag title
-   */
   description?: ReactNode;
-  /**
-   * The icon displayed in the top-left of the flag. Should be an instance of `@atlaskit/icon`.
-   * Your icon will receive the appropriate default color, which you can override by wrapping the
-   * icon in a containing element with CSS `color` set to your preferred icon color.
-   */
   icon: ReactNode;
-  /**
-   * The bold text shown at the top of the flag.
-   */
   title: ReactNode;
-  /**
-   * Handler which will be called when a Flag's dismiss button is clicked.
-   * Receives the id of the dismissed Flag as a parameter.
-   */
   onDismissed?: (id: number | string, analyticsEvent: UIAnalyticsEvent) => void;
-  /**
-   * A link component that is passed down to the `@atlaskit/button` used by actions,
-   * to allow custom routers to be used. See the
-   * [button with router](https://atlaskit.atlassian.com/packages/design-system/button/example/ButtonWithRouter)
-   * example of what this component should look like.
-   */
   linkComponent?: ComponentType<CustomThemeButtonProps>;
-  /**
-   * 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.
-   *
-   * Will set these elements when defined:
-   *
-   * - Flag root element - `{testId}`
-   * - Close button visible on default flags - `{testId}-dismiss`
-   * - Toggle button visible on bold flags - `{testId}-toggle`
-   * - Flag content which wraps the description and actions - `{testId}-expander`
-   * - Flag description - `{testId}-description`
-   * - Flag actions - `{testId}-actions`
-   */
   testId?: string;
-  /**
-   * Additional information to be included in the `context` of analytics events that come from flag
-   */
   analyticsContext?: Record<string, any>;
 };
 
-declare type Combine<First, Second> = Omit<First, keyof Second> & Second;
+// @public (undocumented)
+type Combine<First, Second> = Omit<First, keyof Second> & Second;
 
-export declare interface CreateFlagArgs extends FlagPropsWithoutId {
-  /**
-   * A unique identifier used for rendering and onDismissed callbacks.
-   * This will be autogenerated if you don’t supply one.
-   * If you don’t want the same flag showing multiple times, provide a unique id.
-   */
+// @public (undocumented)
+export interface CreateFlagArgs extends FlagPropsWithoutId {
   id?: FlagId;
-  /**
-   * Marks whether the flag should render as an AutoDismissFlag
-   */
   isAutoDismiss?: boolean;
 }
 
-export declare type DismissFn = () => void;
-
-/**
- * __Flag__
- *
- * A flag is used for confirmations, alerts, and acknowledgments that require minimal user interaction,
- * often displayed using a flag group.
- *
- * - [Examples](https://atlassian.design/components/flag/examples)
- * - [Code](https://atlassian.design/components/flag/code)
- * - [Usage](https://atlassian.design/components/flag/usage)
- */
-declare const Flag: (props: FlagProps) => jsx.JSX.Element;
+// @public (undocumented)
+export type DismissFn = () => void;
+
+// @public
+const Flag: FC<FlagProps>;
 export default Flag;
 
-export declare type FlagAPI = {
+// @public (undocumented)
+export type FlagAPI = {
   showFlag: (args: CreateFlagArgs) => DismissFn;
 };
 
-export declare type FlagArgs = Combine<
+// @public (undocumented)
+export type FlagArgs = Combine<
   CreateFlagArgs,
   {
     id: FlagId;
   }
 >;
 
-/**
- * __Flag group__
- *
- * A flag group is used to group a set of related flags, with entry and exit animations.
- *
- * - [Examples](https://atlassian.design/components/flag/flag-group/examples)
- * - [Code](https://atlassian.design/components/flag/flag-group/code)
- */
-export declare const FlagGroup: (props: FlagGroupProps) => jsx.JSX.Element;
-
-declare type FlagGroupProps = {
-  /**
-   * ID attribute used for DOM selection.
-   */
+// @public
+export const FlagGroup: (props: FlagGroupProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+type FlagGroupProps = {
   id?: string;
-  /**
-   * Describes the specific role of this FlagGroup for users viewing the page with a screen reader (defaults to `Flag notifications`).
-   */
   label?: string;
-  /**
-   * Describes the specific tag on which the screen reader text will be rendered (defaults to `h2`).
-   */
   labelTag?: React.ElementType;
-  /**
-   * Flag elements to be displayed.
-   */
-  children?: Array<ReactElement> | ReactElement | null | boolean;
-  /**
-   * Handler which will be called when a Flag's dismiss button is clicked.
-   * Receives the id of the dismissed Flag as a parameter.
-   */
+  children?: Array<ReactElement> | ReactElement | boolean | null;
   onDismissed?: (id: number | string, analyticsEvent: UIAnalyticsEvent) => void;
 };
 
-declare type FlagId = string | number;
+// @public (undocumented)
+type FlagId = number | string;
 
-export declare interface FlagProps extends FlagPropsWithoutId, FlagPropsId {}
+// @public (undocumented)
+export interface FlagProps extends FlagPropsWithoutId, FlagPropsId {}
 
-declare type FlagPropsId = {
-  /**
-   * A unique identifier used for rendering and onDismissed callbacks.
-   */
+// @public (undocumented)
+type FlagPropsId = {
   id: number | string;
 };
 
-declare interface FlagPropsWithoutId
+// @public (undocumented)
+interface FlagPropsWithoutId
   extends AutoDismissFlagPropsWithoutId,
     WithAnalyticsEventsProps {
-  /**
-   * Standard onBlur event, applied to Flag by AutoDismissFlag
-   */
   onBlur?: (
     e: React.FocusEvent<HTMLElement>,
     analyticsEvent: UIAnalyticsEvent,
   ) => void;
-  /**
-   * Standard onFocus event, applied to Flag by AutoDismissFlag
-   */
   onFocus?: (
     e: React.FocusEvent<HTMLElement>,
     analyticsEvent: UIAnalyticsEvent,
   ) => void;
-  /**
-   * Standard onMouseOut event, applied to Flag by AutoDismissFlag
-   */
   onMouseOut?: MouseEventHandler;
-  /**
-   * Standard onMouseOver event, applied to Flag by AutoDismissFlag
-   */
   onMouseOver?: MouseEventHandler;
 }
 
-export declare function FlagsProvider({
+// @public (undocumented)
+export function FlagsProvider({
   children,
 }: {
   children: React_2.ReactNode;
 }): JSX.Element;
 
-/**
- * useFlags is used to access the `showFlags` function which can be used to programatically display flags.
- * - [Examples](https://atlassian.design/components/flag/flags-provider/examples#using-showflags)
- */
-export declare function useFlags(): FlagAPI;
+// @public
+export function useFlags(): FlagAPI;
 
-export declare const withFlagsProvider: (
+// @public (undocumented)
+export const withFlagsProvider: (
   fn: () => React_2.ReactNode,
 ) => React_2.ReactNode;
 
-export {};
+// (No @packageDocumentation comment for this package)
 ```
+
+<!--SECTION END: Main Entry Types-->

package/dist/cjs/internal/description.js

@@ -1,34 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = require("@emotion/react");
-
-/** @jsx jsx */
-var descriptionStyles = (0, _react.css)({
-  maxHeight: 100,
-  // height is defined as 5 lines maximum by design
-  overflow: 'auto',
-  wordWrap: 'break-word'
-});
-
-var Description = function Description(_ref) {
-  var color = _ref.color,
-      testId = _ref.testId,
-      children = _ref.children,
-      isBold = _ref.isBold;
-  return (0, _react.jsx)("div", {
-    style: {
-      color: color
-    },
-    css: [descriptionStyles],
-    "data-testid": testId
-  }, children);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-var _default = Description;
-exports.default = _default;

package/dist/cjs/internal/title.js

@@ -1,30 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = require("@emotion/react");
-
-/** @jsx jsx */
-var titleStyles = (0, _react.css)({
-  padding: "2px 0 6px 16px",
-  flex: 1,
-  fontWeight: 600
-});
-
-var Title = function Title(_ref) {
-  var color = _ref.color,
-      children = _ref.children;
-  return (0, _react.jsx)("span", {
-    style: {
-      color: color
-    },
-    css: titleStyles
-  }, children);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-var _default = Title;
-exports.default = _default;

package/dist/es2019/internal/description.js

@@ -1,24 +0,0 @@
-/** @jsx jsx */
-import { jsx, css } from '@emotion/react';
-const descriptionStyles = css({
-  maxHeight: 100,
-  // height is defined as 5 lines maximum by design
-  overflow: 'auto',
-  wordWrap: 'break-word'
-});
-
-const Description = ({
-  color,
-  testId,
-  children,
-  isBold
-}) => jsx("div", {
-  style: {
-    color
-  },
-  css: [descriptionStyles],
-  "data-testid": testId
-}, children); // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-export default Description;

package/dist/es2019/internal/title.js

@@ -1,20 +0,0 @@
-/** @jsx jsx */
-import { jsx, css } from '@emotion/react';
-const titleStyles = css({
-  padding: `2px 0 6px 16px`,
-  flex: 1,
-  fontWeight: 600
-});
-
-const Title = ({
-  color,
-  children
-}) => jsx("span", {
-  style: {
-    color
-  },
-  css: titleStyles
-}, children); // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-export default Title;

package/dist/esm/internal/description.js

@@ -1,25 +0,0 @@
-/** @jsx jsx */
-import { jsx, css } from '@emotion/react';
-var descriptionStyles = css({
-  maxHeight: 100,
-  // height is defined as 5 lines maximum by design
-  overflow: 'auto',
-  wordWrap: 'break-word'
-});
-
-var Description = function Description(_ref) {
-  var color = _ref.color,
-      testId = _ref.testId,
-      children = _ref.children,
-      isBold = _ref.isBold;
-  return jsx("div", {
-    style: {
-      color: color
-    },
-    css: [descriptionStyles],
-    "data-testid": testId
-  }, children);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-export default Description;

package/dist/esm/internal/title.js

@@ -1,21 +0,0 @@
-/** @jsx jsx */
-import { jsx, css } from '@emotion/react';
-var titleStyles = css({
-  padding: "2px 0 6px 16px",
-  flex: 1,
-  fontWeight: 600
-});
-
-var Title = function Title(_ref) {
-  var color = _ref.color,
-      children = _ref.children;
-  return jsx("span", {
-    style: {
-      color: color
-    },
-    css: titleStyles
-  }, children);
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
-
-export default Title;

package/dist/types/internal/description.d.ts

@@ -1,8 +0,0 @@
-import { FC } from 'react';
-interface DescriptionProps {
-    testId?: string;
-    color: string;
-    isBold: boolean;
-}
-declare const Description: FC<DescriptionProps>;
-export default Description;

package/dist/types/internal/title.d.ts

@@ -1,6 +0,0 @@
-import { FC } from 'react';
-interface TitleProps {
-    color: string;
-}
-declare const Title: FC<TitleProps>;
-export default Title;

package/dist/types-ts4.0/auto-dismiss-flag.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-import { AutoDismissFlagProps } from './types';
-export declare const AUTO_DISMISS_SECONDS = 8;
-/**
- * __Auto dismiss flag__
- *
- * An auto dismiss flag is dismissed automatically after eight seconds.
- *
- * - [Examples](https://atlassian.design/components/flag/auto-dismiss-flag/examples)
- * - [Code](https://atlassian.design/components/flag/auto-dismiss-flag/code)
- */
-declare const AutoDismissFlag: (props: AutoDismissFlagProps) => JSX.Element;
-export default AutoDismissFlag;

package/dist/types-ts4.0/constants.d.ts

@@ -1,2 +0,0 @@
-import { AppearanceTypes } from './types';
-export declare const DEFAULT_APPEARANCE: AppearanceTypes;

package/dist/types-ts4.0/flag-actions.d.ts

@@ -1,15 +0,0 @@
-/** @jsx jsx */
-import type { ComponentType } from 'react';
-import { jsx } from '@emotion/react';
-import type { CustomThemeButtonProps } from '@atlaskit/button/types';
-import type { ThemeModes } from '@atlaskit/theme/types';
-import type { ActionsType, AppearanceTypes } from './types';
-declare type FlagActionsProps = {
-    appearance: AppearanceTypes;
-    actions: ActionsType;
-    linkComponent?: ComponentType<CustomThemeButtonProps>;
-    mode: ThemeModes;
-    testId?: string;
-};
-declare const FlagActions: (props: FlagActionsProps) => jsx.JSX.Element | null;
-export default FlagActions;

package/dist/types-ts4.0/flag-group.d.ts

@@ -1,45 +0,0 @@
-/** @jsx jsx */
-import { ReactElement } from 'react';
-import { jsx } from '@emotion/react';
-import type { UIAnalyticsEvent } from '@atlaskit/analytics-next';
-declare type FlagGroupProps = {
-    /**
-     * ID attribute used for DOM selection.
-     */
-    id?: string;
-    /**
-     * Describes the specific role of this FlagGroup for users viewing the page with a screen reader (defaults to `Flag notifications`).
-     */
-    label?: string;
-    /**
-     * Describes the specific tag on which the screen reader text will be rendered (defaults to `h2`).
-     */
-    labelTag?: React.ElementType;
-    /**
-     * Flag elements to be displayed.
-     */
-    children?: Array<ReactElement> | ReactElement | null | boolean;
-    /**
-     * Handler which will be called when a Flag's dismiss button is clicked.
-     * Receives the id of the dismissed Flag as a parameter.
-     */
-    onDismissed?: (id: number | string, analyticsEvent: UIAnalyticsEvent) => void;
-};
-export declare const flagWidth: number;
-export declare const flagAnimationTime = 400;
-declare type FlagGroupAPI = {
-    onDismissed: (id: number | string, analyticsEvent: UIAnalyticsEvent) => void;
-    isDismissAllowed: boolean;
-};
-export declare const FlagGroupContext: import("react").Context<FlagGroupAPI>;
-export declare function useFlagGroup(): FlagGroupAPI;
-/**
- * __Flag group__
- *
- * A flag group is used to group a set of related flags, with entry and exit animations.
- *
- * - [Examples](https://atlassian.design/components/flag/flag-group/examples)
- * - [Code](https://atlassian.design/components/flag/flag-group/code)
- */
-declare const FlagGroup: (props: FlagGroupProps) => jsx.JSX.Element;
-export default FlagGroup;

package/dist/types-ts4.0/flag-provider.d.ts

@@ -1,33 +0,0 @@
-import React from 'react';
-import { FlagPropsWithoutId } from './types';
-declare type FlagId = string | number;
-export declare type Combine<First, Second> = Omit<First, keyof Second> & Second;
-export interface CreateFlagArgs extends FlagPropsWithoutId {
-    /**
-     * A unique identifier used for rendering and onDismissed callbacks.
-     * This will be autogenerated if you don’t supply one.
-     * If you don’t want the same flag showing multiple times, provide a unique id.
-     */
-    id?: FlagId;
-    /**
-     * Marks whether the flag should render as an AutoDismissFlag
-     */
-    isAutoDismiss?: boolean;
-}
-export declare type FlagArgs = Combine<CreateFlagArgs, {
-    id: FlagId;
-}>;
-export declare type DismissFn = () => void;
-export declare type FlagAPI = {
-    showFlag: (args: CreateFlagArgs) => DismissFn;
-};
-/**
- * useFlags is used to access the `showFlags` function which can be used to programatically display flags.
- * - [Examples](https://atlassian.design/components/flag/flags-provider/examples#using-showflags)
- */
-export declare function useFlags(): FlagAPI;
-export declare function FlagsProvider({ children }: {
-    children: React.ReactNode;
-}): JSX.Element;
-export declare const withFlagsProvider: (fn: () => React.ReactNode) => React.ReactNode;
-export {};

package/dist/types-ts4.0/flag.d.ts

@@ -1,14 +0,0 @@
-import { jsx } from '@emotion/react';
-import type { FlagProps } from './types';
-/**
- * __Flag__
- *
- * A flag is used for confirmations, alerts, and acknowledgments that require minimal user interaction,
- * often displayed using a flag group.
- *
- * - [Examples](https://atlassian.design/components/flag/examples)
- * - [Code](https://atlassian.design/components/flag/code)
- * - [Usage](https://atlassian.design/components/flag/usage)
- */
-declare const Flag: (props: FlagProps) => jsx.JSX.Element;
-export default Flag;

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

@@ -1,6 +0,0 @@
-export { default } from './flag';
-export { default as AutoDismissFlag } from './auto-dismiss-flag';
-export { default as FlagGroup } from './flag-group';
-export { useFlags, withFlagsProvider, FlagsProvider } from './flag-provider';
-export type { CreateFlagArgs, DismissFn, FlagAPI, FlagArgs, } from './flag-provider';
-export type { FlagProps, ActionsType, AppearanceTypes } from './types';

package/dist/types-ts4.0/internal/description.d.ts

@@ -1,8 +0,0 @@
-import { FC } from 'react';
-interface DescriptionProps {
-    testId?: string;
-    color: string;
-    isBold: boolean;
-}
-declare const Description: FC<DescriptionProps>;
-export default Description;

package/dist/types-ts4.0/internal/dismiss-button.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { jsx } from '@emotion/react';
-import { AppearanceTypes } from '../types';
-interface DismissButtonProps {
-    appearance: AppearanceTypes;
-    onClick: (...args: any) => void;
-    isExpanded: boolean;
-    isBold: boolean;
-    testId?: string;
-}
-declare const _default: import("react").MemoExoticComponent<({ appearance, onClick, isBold, isExpanded, testId, }: DismissButtonProps) => jsx.JSX.Element>;
-export default _default;

package/dist/types-ts4.0/internal/expander.d.ts

@@ -1,8 +0,0 @@
-/** @jsx jsx */
-import { FC } from 'react';
-declare type ExpanderProps = {
-    isExpanded: boolean;
-    testId?: string;
-};
-declare const Expander: FC<ExpanderProps>;
-export default Expander;

package/dist/types-ts4.0/internal/index.d.ts

@@ -1,4 +0,0 @@
-export { default as Title } from './title';
-export { default as Description } from './description';
-export { default as Expander } from './expander';
-export { default as DismissButton } from './dismiss-button';

package/dist/types-ts4.0/internal/title.d.ts

@@ -1,6 +0,0 @@
-import { FC } from 'react';
-interface TitleProps {
-    color: string;
-}
-declare const Title: FC<TitleProps>;
-export default Title;