@algolia/satellite 1.0.0-beta.175 → 1.0.0-beta.177

package/cjs/Flag/types.d.ts

@@ -1,27 +0,0 @@
-import type { ReactNode } from "react";
-import type { IconComponentType } from "../Icons";
-import type { ColorVariant } from "../types";
-export interface Notification {
-    /** Unique notification ID */
-    id: string;
-    title?: string;
-    /** Content goes here */
-    content: ReactNode;
-    /** Icon to accompany the notification */
-    icon?: IconComponentType;
-    /**  @default false */
-    loading?: boolean;
-    /**  @default "blue" */
-    variant?: ColorVariant;
-    /**
-     * Function triggered when the dismiss button is clicked.
-     * Dismiss button won't be rendered if absent.
-     * */
-    onDismiss?: () => void;
-    /** Defines if and how long before the notification should be dismissed (in ms) */
-    autoDismissAfter?: number;
-    locale?: {
-        dismissText?: string;
-    };
-    children?: ReactNode;
-}

package/cjs/MenuButton/components/items/ButtonItem.d.ts

@@ -1,14 +0,0 @@
-import type { IconComponentType } from "Icons";
-import type { FC } from "react";
-import type { BaseItemProps } from "../../useMenuItemProps";
-export declare type ButtonItemProps = BaseItemProps<HTMLButtonElement> & JSX.IntrinsicElements["button"] & {
-    /** Left aligned icon */
-    startIcon?: IconComponentType;
-    /**
-     * Variant of the item
-     * @default "default"
-     */
-    variant?: "default" | "destructive";
-};
-export declare const ButtonItem: FC<ButtonItemProps>;
-export default ButtonItem;

package/esm/Flag/Flag.d.ts

@@ -1,11 +0,0 @@
-import type { VFC } from "react";
-import type { Notification } from "./types";
-export declare type FlagLocale = Notification["locale"];
-export declare type FlagProps = Omit<Notification, "id" | "content">;
-/**
- * The `Toast` component is a brief notification that providing timely feedback to users before vanishing after a short duration.
- *
- * See the [Toast documentation page](https://satellite.algolia.com/components/feedback/toast) for more information.
- */
-export declare const Flag: VFC<FlagProps>;
-export default Flag;

package/esm/Flag/Flags.d.ts

@@ -1,48 +0,0 @@
-import type { VFC } from "react";
-import type { Notification } from "./types";
-export interface FlagsProps {
-    /**
-     * Array of notifications
-     * @example [{ id: "test", title: "Test", content: "Example" }]
-     */
-    notifications: Notification[];
-}
-/**
- * Use flags for messages containing confirmations, alerts, and acknowledgments that require minimal user interaction. These event-driven messages appear at the bottom of the screen and overlay any content.
- * For critical messaging about loss of data or functionality, please use banners.
- *
- * ## Structure
- *
- * - **Icon (or avatar) and title**: flag messages should always contain a concise title and an appropriate icon
- * - **Message (optional)**: If the text overflows, truncate using an ellipsis
- * - **Actions (optional)**: two links max that enable users to act on the flag's content
- * - **Dismiss**: use to close the flag
- *
- * ## Variations
- *
- * ### Warning
- *
- * Warning messages appear before we request the user to take action. This is usually in anticipation of a significant change. Have empathy for the user. Inform, but don't alarm. If the warning comes before an action, clearly communicate what will happen if the they proceed, and provide an alternative where possible.
- *
- * ### Error
- *
- * Error messages let the user know that something has gone wrong after they've tried to do something. Explain the problem and provide the user with a next step or an alternative. Keep the message simple and direct, avoid blame and accept if something is our fault.
- *
- * ### Success
- *
- * Success messages let the user know that they have completed an action. For these messages, it's best to reaffirm the outcome and get out of the user's way. If they have just created something, give them an option to view it.
- *
- * ### Info / Loading
- *
- * Info messages alert the user to additional information without requiring an action. Inform the user about something that might help or impact them.
- *
- * ## Interaction
- *
- * Flags can be dismissed by selecting the 'x' or will fade away after X seconds. The user can pause the auto-dismiss by hovering over the flag.
- *
- * ## Multiple flags
- *
- * When there are multiple flags, they will stack on top of one another with the most recent flag on top. When a user dismisses a flag, any older flags 'below' will come to the top. Careful consideration should be taken to take into account the ordering and priority of flags in the stack. Never use dismissible and non-dismissible flags in a stack as flags that automatically dismiss can do so and not be visible to the user.
- */
-export declare const Flags: VFC<FlagsProps>;
-export default Flags;

package/esm/Flag/Flags.js

@@ -1,83 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _excluded = ["content", "id"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-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 { CSSTransition, TransitionGroup } from "react-transition-group";
-import { useCreatePortal } from "../Satellite";
-import stl from "../styles/helpers/satellitePrefixer";
-import { prefersReducedMotion } from "../utils/prefersReducedMotion";
-import Flag from "./Flag";
-import { jsx as _jsx } from "react/jsx-runtime";
-var TRANSITION_TIMEOUT = 500;
-
-/**
- * Use flags for messages containing confirmations, alerts, and acknowledgments that require minimal user interaction. These event-driven messages appear at the bottom of the screen and overlay any content.
- * For critical messaging about loss of data or functionality, please use banners.
- *
- * ## Structure
- *
- * - **Icon (or avatar) and title**: flag messages should always contain a concise title and an appropriate icon
- * - **Message (optional)**: If the text overflows, truncate using an ellipsis
- * - **Actions (optional)**: two links max that enable users to act on the flag's content
- * - **Dismiss**: use to close the flag
- *
- * ## Variations
- *
- * ### Warning
- *
- * Warning messages appear before we request the user to take action. This is usually in anticipation of a significant change. Have empathy for the user. Inform, but don't alarm. If the warning comes before an action, clearly communicate what will happen if the they proceed, and provide an alternative where possible.
- *
- * ### Error
- *
- * Error messages let the user know that something has gone wrong after they've tried to do something. Explain the problem and provide the user with a next step or an alternative. Keep the message simple and direct, avoid blame and accept if something is our fault.
- *
- * ### Success
- *
- * Success messages let the user know that they have completed an action. For these messages, it's best to reaffirm the outcome and get out of the user's way. If they have just created something, give them an option to view it.
- *
- * ### Info / Loading
- *
- * Info messages alert the user to additional information without requiring an action. Inform the user about something that might help or impact them.
- *
- * ## Interaction
- *
- * Flags can be dismissed by selecting the 'x' or will fade away after X seconds. The user can pause the auto-dismiss by hovering over the flag.
- *
- * ## Multiple flags
- *
- * When there are multiple flags, they will stack on top of one another with the most recent flag on top. When a user dismisses a flag, any older flags 'below' will come to the top. Careful consideration should be taken to take into account the ordering and priority of flags in the stack. Never use dismissible and non-dismissible flags in a stack as flags that automatically dismiss can do so and not be visible to the user.
- */
-export var Flags = function Flags(_ref) {
-  var _ref$notifications = _ref.notifications,
-    notifications = _ref$notifications === void 0 ? [] : _ref$notifications;
-  var createPortal = useCreatePortal();
-  return createPortal( /*#__PURE__*/_jsx(TransitionGroup, {
-    className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["z-notification bottom-0 right-0 fixed flex flex-col items-end p-4"]))),
-    component: "ul",
-    children: notifications.map(function (_ref2) {
-      var content = _ref2.content,
-        id = _ref2.id,
-        rest = _objectWithoutProperties(_ref2, _excluded);
-      return /*#__PURE__*/_jsx(CSSTransition, {
-        classNames: !prefersReducedMotion ? {
-          enter: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["flags_item-enter"]))),
-          enterActive: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["flags_item-enter-active"]))),
-          exit: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flags_item-exit"]))),
-          exitActive: stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["flags_item-exit-active"])))
-        } : {},
-        timeout: !prefersReducedMotion ? TRANSITION_TIMEOUT : 0,
-        appear: true,
-        children: /*#__PURE__*/_jsx("li", {
-          className: stl(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["mt-4"]))),
-          children: /*#__PURE__*/_jsx(Flag, _objectSpread(_objectSpread({}, rest), {}, {
-            children: content
-          }))
-        })
-      }, id);
-    })
-  }));
-};
-export default Flags;

package/esm/Flag/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./Flag";
-export * from "./Flags";
-export * from "./types";
-export { default } from "./Flag";

package/esm/Flag/index.js

@@ -1,4 +0,0 @@
-export * from "./Flag";
-export * from "./Flags";
-export * from "./types";
-export { default } from "./Flag";

package/esm/Flag/types.d.ts

@@ -1,27 +0,0 @@
-import type { ReactNode } from "react";
-import type { IconComponentType } from "../Icons";
-import type { ColorVariant } from "../types";
-export interface Notification {
-    /** Unique notification ID */
-    id: string;
-    title?: string;
-    /** Content goes here */
-    content: ReactNode;
-    /** Icon to accompany the notification */
-    icon?: IconComponentType;
-    /**  @default false */
-    loading?: boolean;
-    /**  @default "blue" */
-    variant?: ColorVariant;
-    /**
-     * Function triggered when the dismiss button is clicked.
-     * Dismiss button won't be rendered if absent.
-     * */
-    onDismiss?: () => void;
-    /** Defines if and how long before the notification should be dismissed (in ms) */
-    autoDismissAfter?: number;
-    locale?: {
-        dismissText?: string;
-    };
-    children?: ReactNode;
-}

package/esm/MenuButton/components/items/ButtonItem.d.ts

@@ -1,14 +0,0 @@
-import type { IconComponentType } from "Icons";
-import type { FC } from "react";
-import type { BaseItemProps } from "../../useMenuItemProps";
-export declare type ButtonItemProps = BaseItemProps<HTMLButtonElement> & JSX.IntrinsicElements["button"] & {
-    /** Left aligned icon */
-    startIcon?: IconComponentType;
-    /**
-     * Variant of the item
-     * @default "default"
-     */
-    variant?: "default" | "destructive";
-};
-export declare const ButtonItem: FC<ButtonItemProps>;
-export default ButtonItem;