Private
Public Access
1
0

feat: Fluent UI Outlook Lite + connections mockup

This commit is contained in:
2026-04-14 18:52:25 +00:00
parent 1199eff6c3
commit dfa4010406
34820 changed files with 1003813 additions and 205 deletions

File diff suppressed because it is too large Load Diff

15
node_modules/@fluentui/react-teaching-popover/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,15 @@
@fluentui/react-teaching-popover
Copyright (c) Microsoft Corporation
All rights reserved.
MIT License
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED _AS IS_, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Note: Usage of the fonts and icons referenced in Fluent UI React is subject to the terms listed at https://aka.ms/fluentui-assets-license

View File

@@ -0,0 +1,66 @@
# @fluentui/react-teaching-popover
**React Teaching Popover components for [Fluent UI React](https://react.fluentui.dev/)**
A Teaching Popover is a structured popover to showcase information about a new component feature to a user. It should be attached via a trigger to a button, info tip, or component - or for further extension, callout(s). TeachingPopover can also be displayed programmatically, in this case it's intent should be announced to the user on launch to define context for accessibility users.
For a simple feature, a single paged TeachingPopover can be used to display core information, while extensive reading can be linked via a 'Learn More' secondary action.
For more complicated features, we recommend using the TeachingPopoverCarousel, this will enable multiple steps of information with an associating title/image, and can guide the user through multi-step tutorials.
## Sample Code
```jsx
<TeachingPopover>
<TeachingPopoverTrigger>
<Button>TeachingPopover trigger</Button>
</TeachingPopoverTrigger>
<TeachingPopoverSurface>
<TeachingPopoverHeader>Tips</TeachingPopoverHeader>
<TeachingPopoverBody media={<Image alt="test image" fit="cover" src={swapImage} />}>
<TeachingPopoverTitle>Teaching Bubble Title</TeachingPopoverTitle>
<div>This is a teaching popover body</div>
</TeachingPopoverBody>
<TeachingPopoverFooter primary="Learn more" secondary="Got it" />
</TeachingPopoverSurface>
</TeachingPopover>
```
## Sample Code - Carousel
```jsx
<TeachingPopover>
<TeachingPopoverTrigger>
<Button>TeachingPopover trigger</Button>
</TeachingPopoverTrigger>
<TeachingPopoverSurface>
<TeachingPopoverHeader>Tips</TeachingPopoverHeader>
<TeachingPopoverCarousel defaultValue="test-0">
<TeachingPopoverCarouselCard value="test-0">
<TeachingPopoverBody media={<Image alt="test image" fit="cover" src={swapImage} />}>
<TeachingPopoverTitle>Teaching Bubble Title</TeachingPopoverTitle>
<div>This is page: 1</div>
</TeachingPopoverBody>
</TeachingPopoverCarouselCard>
<TeachingPopoverCarouselCard value="test-1">
<TeachingPopoverBody media={<Image alt="test image" fit="cover" src={swapImage} />}>
<TeachingPopoverTitle>Teaching Bubble Title</TeachingPopoverTitle>
<div>This is page: 2</div>
</TeachingPopoverBody>
</TeachingPopoverCarouselCard>
<TeachingPopoverCarouselCard value="test-3">
<TeachingPopoverBody media={<Image alt="test image" fit="cover" src={swapImage} />}>
<TeachingPopoverTitle>Teaching Bubble Title</TeachingPopoverTitle>
<div>This is page: 3</div>
</TeachingPopoverBody>
</TeachingPopoverCarouselCard>
<TeachingPopoverCarouselFooter next="Next" previous="Previous" initialStepText="Close" finalStepText="Finish">
<TeachingPopoverCarouselNav>{() => <TeachingPopoverCarouselNavButton />}</TeachingPopoverCarouselNav>
</TeachingPopoverCarouselFooter>
</TeachingPopoverCarousel>
</TeachingPopoverSurface>
</TeachingPopover>
```

View File

@@ -0,0 +1,719 @@
import { ARIAButtonSlotProps } from '@fluentui/react-aria';
import { Button } from '@fluentui/react-button';
import { ButtonProps } from '@fluentui/react-button';
import { ButtonState } from '@fluentui/react-button';
import { ComponentProps } from '@fluentui/react-utilities';
import { ComponentState } from '@fluentui/react-utilities';
import { EventData } from '@fluentui/react-utilities';
import { EventHandler } from '@fluentui/react-utilities';
import type { ForwardRefComponent } from '@fluentui/react-utilities';
import { JSXElement } from '@fluentui/react-utilities';
import { PopoverContextValue } from '@fluentui/react-popover';
import type { PopoverProps } from '@fluentui/react-popover';
import { PopoverState } from '@fluentui/react-popover';
import { PopoverSurfaceSlots } from '@fluentui/react-popover';
import { PopoverSurfaceState } from '@fluentui/react-popover';
import { PopoverTriggerChildProps } from '@fluentui/react-popover';
import { PopoverTriggerProps } from '@fluentui/react-popover';
import { PopoverTriggerState } from '@fluentui/react-popover';
import * as React_2 from 'react';
import { Slot } from '@fluentui/react-utilities';
import type { SlotClassNames } from '@fluentui/react-utilities';
declare type CarouselContextValue = {
store: CarouselStore;
value: string | null;
selectPageByDirection: (event: React_2.MouseEvent<HTMLButtonElement | HTMLAnchorElement>, direction: 'next' | 'prev') => void;
selectPageByValue: (event: React_2.MouseEvent<HTMLButtonElement | HTMLAnchorElement>, value: string) => void;
};
declare type CarouselItemProps = ComponentProps<CarouselItemSlots> & {
/**
* The value used to identify a page,
* it should be unique and is necessary for pagination
*/
value: string;
};
declare type CarouselItemSlots = {
/**
* The element wrapping carousel pages and navigation.
*/
root: NonNullable<Slot<'div'>>;
};
declare type CarouselStore = {
clear: () => void;
addValue: (value: string) => void;
insertValue: (value: string, prev: string | null) => void;
removeValue: (value: string) => void;
subscribe: (listener: () => void) => () => void;
getSnapshot: () => string[];
};
declare type CarouselValueChangeData = EventData<'click', React_2.MouseEvent<HTMLButtonElement | HTMLAnchorElement>> & {
/**
* The value to be set after event has occurred.
*/
value?: string;
};
declare type NavButtonRenderFunction = (value: string) => React_2.ReactNode;
/**
* Render the final JSX of TeachingPopover
*/
export declare const renderTeachingPopover_unstable: (state: PopoverState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverBody
*/
export declare const renderTeachingPopoverBody_unstable: (state: TeachingPopoverBodyState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarousel
*/
export declare const renderTeachingPopoverCarousel_unstable: (state: TeachingPopoverCarouselState, contextValues: TeachingPopoverCarouselContextValues) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselCard
*/
export declare const renderTeachingPopoverCarouselCard_unstable: (state: TeachingPopoverCarouselCardState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselFooter
*/
export declare const renderTeachingPopoverCarouselFooter_unstable: (state: TeachingPopoverCarouselFooterState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselFooterButton
*/
export declare const renderTeachingPopoverCarouselFooterButton_unstable: (state: TeachingPopoverCarouselFooterButtonState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselNav
*/
export declare const renderTeachingPopoverCarouselNav_unstable: (state: TeachingPopoverCarouselNavState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselNavButton
*/
export declare const renderTeachingPopoverCarouselNavButton_unstable: (state: TeachingPopoverCarouselNavButtonState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverCarouselPageCount
*/
export declare const renderTeachingPopoverCarouselPageCount_unstable: (state: TeachingPopoverCarouselPageCountState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverFooter
*/
export declare const renderTeachingPopoverFooter_unstable: (state: TeachingPopoverFooterState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverHeader
*/
export declare const renderTeachingPopoverHeader_unstable: (state: TeachingPopoverHeaderState) => JSXElement;
/**
* Render the final JSX of PopoverSurface
*/
export declare const renderTeachingPopoverSurface_unstable: (state: TeachingPopoverSurfaceState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverTitle
*/
export declare const renderTeachingPopoverTitle_unstable: (state: TeachingPopoverTitleState) => JSXElement;
/**
* Render the final JSX of TeachingPopoverTrigger
*/
export declare const renderTeachingPopoverTrigger_unstable: (state: TeachingPopoverTriggerState) => JSXElement | null;
/**
* An extension class of Popover which defaults to withArrow and FocusTrap enabled.
*/
export declare const TeachingPopover: React_2.FC<TeachingPopoverProps>;
/**
* Define a styled TeachingPopoverBody, using the `useTeachingPopoverBody_unstable` and `useTeachingPopoverBodyStyles_unstable`
* hooks.
*
* TeachingPopoverBody is used to host content within a TeachingPopover, and provides a standardized media slot
*/
export declare const TeachingPopoverBody: ForwardRefComponent<TeachingPopoverBodyProps>;
export declare const teachingPopoverBodyClassNames: SlotClassNames<TeachingPopoverBodySlots>;
export declare type TeachingPopoverBodyProps = ComponentProps<TeachingPopoverBodySlots> & {
mediaLength?: 'short' | 'medium' | 'tall';
};
export declare type TeachingPopoverBodySlots = {
/**
* The element wrapping the buttons.
*/
root: NonNullable<Slot<'div'>>;
/**
* Optional Media Content.
*/
media?: Slot<'span'>;
};
export declare type TeachingPopoverBodyState = ComponentState<TeachingPopoverBodySlots> & Required<Pick<TeachingPopoverBodyProps, 'mediaLength'>>;
/**
* Define a styled TeachingPopoverCarousel, using the `useTeachingPopoverCarousel_unstable` and `useTeachingPopoverCarouselStyles_unstable`
* hooks.
*
* TeachingPopoverCarousel injects context providers that are required for TeachingPopoverCarouselCard display and navigation functionality
*/
export declare const TeachingPopoverCarousel: ForwardRefComponent<TeachingPopoverCarouselProps>;
/**
* Define a styled TeachingPopoverCarouselCard, using the `useTeachingPopoverCarouselCard_unstable` and `useTeachingPopoverCarouselCardStyles_unstable`
* hooks.
*
* TeachingPopoverCarouselCard is the definition of a single page view within the carousel, they are shown one at a time and can be navigated through sequentially.
*/
export declare const TeachingPopoverCarouselCard: ForwardRefComponent<TeachingPopoverCarouselCardProps>;
export declare const teachingPopoverCarouselCardClassNames: SlotClassNames<TeachingPopoverCarouselCardSlots>;
export declare type TeachingPopoverCarouselCardProps = ComponentProps<TeachingPopoverCarouselCardSlots> & {
value: string;
};
export declare type TeachingPopoverCarouselCardSlots = {
/**
* The element wrapping the buttons.
*/
root: NonNullable<Slot<CarouselItemProps>>;
};
export declare type TeachingPopoverCarouselCardState = ComponentState<TeachingPopoverCarouselCardSlots> & Required<Pick<TeachingPopoverCarouselCardProps, 'value'>>;
export declare const teachingPopoverCarouselClassNames: SlotClassNames<TeachingPopoverCarouselSlots>;
/**
* Context shared between TeachingPopoverCarousel and its children components
*/
declare type TeachingPopoverCarouselContextValues = {
carousel: CarouselContextValue;
};
/**
* Define a styled TeachingPopoverCarouselFooter, using the `useTeachingPopoverCarouselFooter_unstable` and `useTeachingPopoverCarouselFooterStyles_unstable`
* hooks.
*
* TeachingPopoverCarouselFooter contains previous/next buttons configured for carousel navigation, and a root slot for page count and/or page index navigation.
*/
export declare const TeachingPopoverCarouselFooter: ForwardRefComponent<TeachingPopoverCarouselFooterProps>;
/**
* TeachingPopoverCarouselFooterButton component
*
* TeachingPopoverCarouselFooterButton extends Button and injects additional styling and onClick functionality
* to match the context provided by TeachingPopover & TeachingPopoverCarousel
*/
export declare const TeachingPopoverCarouselFooterButton: ForwardRefComponent<TeachingPopoverCarouselFooterButtonProps>;
export declare const teachingPopoverCarouselFooterButtonClassNames: SlotClassNames<TeachingPopoverCarouselFooterButtonSlots>;
/**
* TeachingPopoverCarouselFooterButton Props
*/
export declare type TeachingPopoverCarouselFooterButtonProps = ComponentProps<TeachingPopoverCarouselFooterButtonSlots> & ButtonProps & {
/**
* Defines whether the button should be next or previous type - used for both styling and functionality.
*/
navType: 'next' | 'prev';
/**
* The ReactNode provided to the button when it is on it's first (navType 'prev') or last (navType 'next') step
*/
altText: React_2.ReactNode;
};
export declare type TeachingPopoverCarouselFooterButtonSlots = {
root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;
};
/**
* State used in rendering TeachingPopoverCarouselFooterButton
*/
export declare type TeachingPopoverCarouselFooterButtonState = ButtonState & ComponentState<TeachingPopoverCarouselFooterButtonSlots> & Pick<TeachingPopoverCarouselFooterButtonProps, 'navType' | 'altText'> & {
popoverAppearance: PopoverContextValue['appearance'];
};
export declare const teachingPopoverCarouselFooterClassNames: SlotClassNames<TeachingPopoverCarouselFooterSlots>;
declare type TeachingPopoverCarouselFooterLayout = 'offset' | 'centered';
/**
* TeachingPopoverCarouselFooter Props
*/
export declare type TeachingPopoverCarouselFooterProps = ComponentProps<TeachingPopoverCarouselFooterSlots> & {
/**
* Controls whether buttons will be centered (balanced) or right aligned
* Defaults to 'centered'.
*/
layout?: TeachingPopoverCarouselFooterLayout;
/**
* The text to be displayed on the initial step of carousel
*/
initialStepText: string;
/**
* The text to be displayed on the final step of carousel
*/
finalStepText: string;
};
export declare type TeachingPopoverCarouselFooterSlots = {
/**
* The element wrapping carousel pages and navigation.
*/
root: NonNullable<Slot<'div'>>;
/**
* The previous button slot.
*/
previous?: Slot<TeachingPopoverCarouselFooterButtonProps>;
/**
* The next button slot.
*/
next: NonNullable<Slot<TeachingPopoverCarouselFooterButtonProps>>;
};
/**
* TeachingPopoverCarouselFooter State and Context Hooks
*/
export declare type TeachingPopoverCarouselFooterState = ComponentState<Required<TeachingPopoverCarouselFooterSlots>> & Pick<TeachingPopoverCarouselFooterProps, 'layout'>;
/**
* Define a styled TeachingPopoverCarouselNav, using the `useTeachingPopoverCarouselNav_unstable` and `useTeachingPopoverCarouselNavStyles_unstable`
* hooks.
*
* TeachingPopoverCarouselNav provides an index-based pagination list to jump to any page within the carousel.
*/
export declare const TeachingPopoverCarouselNav: ForwardRefComponent<TeachingPopoverCarouselNavProps>;
/**
* TeachingPopoverCarouselNavButton is a button to jump to a single page within TeachingPopoverCarousel
*
* It's value is injected via context and must be wrapped with a ValueIdContextProvider (automatically handled via TeachingPopoverCarouselNav)
*/
export declare const TeachingPopoverCarouselNavButton: ForwardRefComponent<TeachingPopoverCarouselNavButtonProps>;
export declare const teachingPopoverCarouselNavButtonClassNames: SlotClassNames<TeachingPopoverCarouselNavButtonSlots>;
/**
* TeachingPopoverCarouselNavButton Props
*/
export declare type TeachingPopoverCarouselNavButtonProps = ComponentProps<TeachingPopoverCarouselNavButtonSlots>;
export declare type TeachingPopoverCarouselNavButtonSlots = {
/**
* ARIA compliant nav buttons used to jump to pages
*/
root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;
};
/**
* TeachingPopoverCarouselNavButton State
*/
export declare type TeachingPopoverCarouselNavButtonState = ComponentState<TeachingPopoverCarouselNavButtonSlots> & {
/**
* Enables selection state control
*/
isSelected?: boolean;
} & Pick<PopoverContextValue, 'appearance'>;
export declare const teachingPopoverCarouselNavClassNames: SlotClassNames<TeachingPopoverCarouselNavSlots>;
export declare type TeachingPopoverCarouselNavProps = Omit<ComponentProps<Partial<TeachingPopoverCarouselNavSlots>>, 'children'> & {
children: NavButtonRenderFunction;
};
export declare type TeachingPopoverCarouselNavSlots = {
/**
* The element wrapping the carousel pagination. By default this is a div,
* it may contain icons or text depending on TeachingPopoverCarouselNavStyle
*/
root: NonNullable<Slot<'div'>>;
};
export declare type TeachingPopoverCarouselNavState = ComponentState<TeachingPopoverCarouselNavSlots> & {
values: string[];
renderNavButton: NavButtonRenderFunction;
};
/**
* TeachingPopoverCarouselPageCount is a simple interface for rendering based on current and total page count
*
* The child render function will provide both current and total page numbers for customization.
*/
export declare const TeachingPopoverCarouselPageCount: ForwardRefComponent<TeachingPopoverCarouselPageCountProps>;
export declare const teachingPopoverCarouselPageCountClassNames: SlotClassNames<TeachingPopoverCarouselPageCountSlots>;
/**
* TeachingPopoverCarouselPageCount Props
*/
export declare type TeachingPopoverCarouselPageCountProps = Omit<ComponentProps<Partial<TeachingPopoverCarouselPageCountSlots>>, 'children'> & {
children: TeachingPopoverCarouselPageCountRenderFunction;
};
export declare type TeachingPopoverCarouselPageCountRenderFunction = (currentPage: number, totalPages: number) => React_2.ReactNode;
export declare type TeachingPopoverCarouselPageCountSlots = {
root: Slot<'div'>;
};
/**
* State used in rendering TeachingPopoverCarouselPageCount
*/
export declare type TeachingPopoverCarouselPageCountState = ComponentState<TeachingPopoverCarouselPageCountSlots> & {
currentIndex: number;
totalPages: number;
renderPageCount: TeachingPopoverCarouselPageCountRenderFunction;
};
/**
* TeachingPopoverCarousel Props
*/
export declare type TeachingPopoverCarouselProps = ComponentProps<TeachingPopoverCarouselSlots> & UseCarouselOptions;
export declare type TeachingPopoverCarouselSlots = {
/**
* The element wrapping carousel pages and navigation.
*/
root: NonNullable<Slot<'div'>>;
};
/**
* TeachingPopoverCarousel State and Context Hooks
*/
export declare type TeachingPopoverCarouselState = ComponentState<Required<TeachingPopoverCarouselSlots>> & Partial<Pick<PopoverContextValue, 'appearance'>> & CarouselContextValue;
/**
* Define a styled TeachingPopoverFooter, using the `useTeachingPopoverFooter_unstable` and `useTeachingPopoverFooterStyles_unstable`
* hooks.
*
* TeachingPopoverFooter will provide both a secondary and primary button for the TeachingPopover,
* and handle Popover functionality such as closing the popup.
*
* Users must provide the localized text for each button within the footer via slots.
*/
export declare const TeachingPopoverFooter: ForwardRefComponent<TeachingPopoverFooterProps>;
export declare const teachingPopoverFooterClassNames: SlotClassNames<TeachingPopoverFooterSlots>;
export declare type TeachingPopoverFooterProps = ComponentProps<TeachingPopoverFooterSlots> & Pick<TeachingPopoverFooterState, 'footerLayout'>;
declare type TeachingPopoverFooterSlots = {
/**
* The element wrapping the buttons.
*/
root: NonNullable<Slot<'div'>>;
/**
* The primary button slot.
*/
primary: NonNullable<Slot<typeof Button>>;
/**
* The secondary button slot.
*/
secondary?: Slot<typeof Button>;
};
export declare type TeachingPopoverFooterState = ComponentState<TeachingPopoverFooterSlots> & Pick<PopoverContextValue, 'appearance'> & {
/**
* Enables stylization to a horizontal or vertical stack of button layouts.
* Defaults to horizontal
*/
footerLayout?: 'horizontal' | 'vertical';
};
/**
* Define a styled TeachingPopoverHeader, using the `useTeachingPopoverHeader_unstable` and `useTeachingPopoverHeaderStyles_unstable`
* hooks.
*
* TeachingPopoverHeader is an info subtitle located at the top of the popover, it provides a dismiss button by default (can be nulled)
* and an info-tip icon that can be overridden or removed, subtitle displayed will be the children elements of TeachingPopoverHeader.
*/
export declare const TeachingPopoverHeader: ForwardRefComponent<TeachingPopoverHeaderProps>;
export declare const teachingPopoverHeaderClassNames: SlotClassNames<TeachingPopoverHeaderSlots>;
export declare type TeachingPopoverHeaderProps = ComponentProps<TeachingPopoverHeaderSlots>;
export declare type TeachingPopoverHeaderSlots = {
/**
* The element wrapping the text and close button. By default this is an div; although it can be a heading, this should not be done.
* Instead, wrap the child text in a heading tag if one is needed.
* Be sure to include role and aria heading level if div is used.
*/
root: Slot<'div', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>;
/**
* The component to be used as close button in heading
*/
dismissButton?: Slot<'button'>;
/**
* Initial icon slot rendered before children content in heading.
*/
icon?: Slot<'div'>;
};
export declare type TeachingPopoverHeaderState = ComponentState<TeachingPopoverHeaderSlots> & Pick<PopoverContextValue, 'appearance'>;
/**
* TeachingPopover Props
*/
export declare type TeachingPopoverProps = PopoverProps;
/**
* TeachingPopover State
*/
export declare type TeachingPopoverState = PopoverState;
/**
* TeachingPopoverSurface component renders react children in a positioned box
*
* TeachingPopoverSurface is a direct extension of PopoverSurface, with it's own styling context hooks available.
*/
export declare const TeachingPopoverSurface: ForwardRefComponent<TeachingPopoverSurfaceProps>;
export declare const teachingPopoverSurfaceClassNames: SlotClassNames<TeachingPopoverSurfaceSlots>;
/**
* TeachingPopoverSurface Props
*/
export declare type TeachingPopoverSurfaceProps = ComponentProps<TeachingPopoverSurfaceSlots>;
/**
* Names of the slots in TeachingPopoverSurface
*/
export declare type TeachingPopoverSurfaceSlots = PopoverSurfaceSlots;
/**
* TeachingPopoverSurface State
*/
export declare type TeachingPopoverSurfaceState = PopoverSurfaceState;
/**
* Define a styled TeachingPopoverTitle, using the `useTeachingPopoverTitle_unstable` and `useTeachingPopoverTitleStyles_unstable`
* hooks.
*
* TeachingPopoverTitle is similar to TeachingPopoverHeader, but it is intended to be placed within a TeachingPopoverBody
* TeachingPopoverTitle can also optionally render a dismiss button, however this should only be enabled when there is no TeachingPopoverHeader/dismiss.
*/
export declare const TeachingPopoverTitle: ForwardRefComponent<TeachingPopoverTitleProps>;
export declare const teachingPopoverTitleClassNames: SlotClassNames<TeachingPopoverTitleSlots>;
/**
* TeachingPopoverTitle Props
*/
export declare type TeachingPopoverTitleProps = ComponentProps<TeachingPopoverTitleSlots>;
export declare type TeachingPopoverTitleSlots = {
/**
* Title for teaching bubble
*/
root: Slot<'h2', 'h1' | 'h3' | 'h4' | 'h5' | 'h6' | 'div'>;
/**
* An alternate close button path if not placed in the TeachingPopoverHeader
*/
dismissButton?: Slot<'button'>;
};
/**
* State used in rendering TeachingPopoverTitle
*/
export declare type TeachingPopoverTitleState = ComponentState<TeachingPopoverTitleSlots> & Pick<PopoverContextValue, 'appearance'>;
/**
* Direct extension of PopoverTrigger - Wraps a trigger element as an only child and adds the necessary event handling to open a teaching bubble.
*/
export declare const TeachingPopoverTrigger: React_2.FC<TeachingPopoverTriggerProps>;
/**
* Props that are passed to the child of the DialogTrigger when cloned to ensure correct behavior for the Dialog
*/
export declare type TeachingPopoverTriggerChildProps = PopoverTriggerChildProps;
/**
* TeachingPopoverTrigger Props
*/
export declare type TeachingPopoverTriggerProps = PopoverTriggerProps;
/**
* TeachingPopoverTrigger State
*/
export declare type TeachingPopoverTriggerState = PopoverTriggerState;
declare type UseCarouselOptions = {
/**
* Localizes the string used to announce carousel page changes to screen reader users
* Defaults to: undefined
*/
announcement?: (newValue: string) => string;
/**
* The initial page to display in uncontrolled mode.
*/
defaultValue?: string;
/**
* The value of the currently active page.
*/
value?: string;
/**
* Callback to notify a page change.
*/
onValueChange?: EventHandler<CarouselValueChangeData>;
/**
* Callback to notify when the final button step of a carousel has been activated.
*/
onFinish?: EventHandler<CarouselValueChangeData>;
};
export declare const useTeachingPopover_unstable: (props: TeachingPopoverProps) => TeachingPopoverState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverBody properties
* @param ref - reference to root HTMLElement of TeachingPopoverBody
*/
export declare const useTeachingPopoverBody_unstable: (props: TeachingPopoverBodyProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverBodyState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverBodyStyles_unstable: (state: TeachingPopoverBodyState) => TeachingPopoverBodyState;
export declare const useTeachingPopoverCarousel_unstable: (props: TeachingPopoverCarouselProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverCarouselState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverCarouselCard properties
* @param ref - reference to root HTMLElement of TeachingPopoverCarouselCard
*/
export declare const useTeachingPopoverCarouselCard_unstable: (props: TeachingPopoverCarouselCardProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverCarouselCardState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverCarouselCardStyles_unstable: (state: TeachingPopoverCarouselCardState) => TeachingPopoverCarouselCardState;
export declare function useTeachingPopoverCarouselContextValues_unstable(state: TeachingPopoverCarouselState): TeachingPopoverCarouselContextValues;
export declare const useTeachingPopoverCarouselFooter_unstable: (props: TeachingPopoverCarouselFooterProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverCarouselFooterState;
/**
* Create the state required to render TeachingPopoverCarouselFooterButton.
*
* The returned state can be modified with hooks such as useTeachingPopoverCarouselFooterButtonStyles_unstable,
* before being passed to renderTeachingPopoverCarouselFooterButton_unstable.
*
* @param props - props from this instance of TeachingPopoverCarouselFooterButton
* @param ref - reference to root HTMLDivElement of TeachingPopoverCarouselFooterButton
*/
export declare const useTeachingPopoverCarouselFooterButton_unstable: (props: TeachingPopoverCarouselFooterButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => TeachingPopoverCarouselFooterButtonState;
/**
* Apply styling to the TeachingPopoverCarouselFooterButton slots based on the state
*/
export declare const useTeachingPopoverCarouselFooterButtonStyles_unstable: (state: TeachingPopoverCarouselFooterButtonState) => TeachingPopoverCarouselFooterButtonState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverCarouselFooterStyles_unstable: (state: TeachingPopoverCarouselFooterState) => TeachingPopoverCarouselFooterState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverCarouselNav properties
* @param ref - reference to root HTMLElement of TeachingPopoverCarouselNav
*/
export declare const useTeachingPopoverCarouselNav_unstable: (props: TeachingPopoverCarouselNavProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverCarouselNavState;
/**
* Create the state required to render TeachingPopoverCarouselNavButton.
*
* The returned state can be modified with hooks such as useTeachingPopoverCarouselNavButtonStyles_unstable,
* before being passed to renderTeachingPopoverCarouselNavButton_unstable.
*
* @param props - props from this instance of TeachingPopoverCarouselNavButton
* @param ref - reference to root HTMLElement of TeachingPopoverCarouselNavButton
*/
export declare const useTeachingPopoverCarouselNavButton_unstable: (props: TeachingPopoverCarouselNavButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => TeachingPopoverCarouselNavButtonState;
/**
* Apply styling to the TeachingPopoverCarouselNavButton slots based on the state
*/
export declare const useTeachingPopoverCarouselNavButtonStyles_unstable: (state: TeachingPopoverCarouselNavButtonState) => TeachingPopoverCarouselNavButtonState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverCarouselNavStyles_unstable: (state: TeachingPopoverCarouselNavState) => TeachingPopoverCarouselNavState;
/**
* Create the state required to render TeachingPopoverCarouselPageCount.
*
* The returned state can be modified with hooks such as useTeachingPopoverCarouselPageCountStyles_unstable,
* before being passed to renderTeachingPopoverCarouselPageCount_unstable.
*
* @param props - props from this instance of TeachingPopoverCarouselPageCount
* @param ref - reference to root HTMLDivElement of TeachingPopoverCarouselPageCount
*/
export declare const useTeachingPopoverCarouselPageCount_unstable: (props: TeachingPopoverCarouselPageCountProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverCarouselPageCountState;
/**
* Apply styling to the TeachingPopoverCarouselPageCount slots based on the state
*/
export declare const useTeachingPopoverCarouselPageCountStyles_unstable: (state: TeachingPopoverCarouselPageCountState) => TeachingPopoverCarouselPageCountState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverCarouselStyles_unstable: (state: TeachingPopoverCarouselState) => TeachingPopoverCarouselState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverFooter properties
* @param ref - reference to root HTMLElement of TeachingPopoverFooter
*/
export declare const useTeachingPopoverFooter_unstable: (props: TeachingPopoverFooterProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverFooterState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverHeader properties
* @param ref - reference to root HTMLElement of TeachingPopoverHeader
*/
export declare const useTeachingPopoverHeader_unstable: (props: TeachingPopoverHeaderProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverHeaderState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverHeaderStyles_unstable: (state: TeachingPopoverHeaderState) => TeachingPopoverHeaderState;
/**
* Create the state required to render TeachingPopoverSurface.
*
* The returned state can be modified with hooks such as useTeachingPopoverSurfaceStyles_unstable,
* before being passed to renderTeachingPopoverSurface_unstable.
*
* @param props - props from this instance of TeachingPopoverSurface
* @param ref - reference to root HTMLDivElement of TeachingPopoverSurface
*/
export declare const useTeachingPopoverSurface_unstable: (props: TeachingPopoverSurfaceProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverSurfaceState;
/**
* Apply styling to the TeachingPopoverSurface slots based on the state
*/
export declare const useTeachingPopoverSurfaceStyles_unstable: (state: TeachingPopoverSurfaceState) => TeachingPopoverSurfaceState;
/**
* Returns the props and state required to render the component
* @param props - TeachingPopoverTitle properties
* @param ref - reference to root HTMLElement of TeachingPopoverTitle
*/
export declare const useTeachingPopoverTitle_unstable: (props: TeachingPopoverTitleProps, ref: React_2.Ref<HTMLDivElement>) => TeachingPopoverTitleState;
/** Applies style classnames to slots */
export declare const useTeachingPopoverTitleStyles_unstable: (state: TeachingPopoverTitleState) => TeachingPopoverTitleState;
/**
* Create the state required to render TeachingPopoverTrigger.
*
* @param props - props from this instance of TeachingPopoverTrigger
*/
export declare const useTeachingPopoverTrigger_unstable: (props: TeachingPopoverTriggerProps) => TeachingPopoverTriggerState;
export { }

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopover: function() {
return _index.TeachingPopover;
},
renderTeachingPopover_unstable: function() {
return _index.renderTeachingPopover_unstable;
},
useTeachingPopover_unstable: function() {
return _index.useTeachingPopover_unstable;
}
});
const _index = require("./components/TeachingPopover/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopover.ts"],"sourcesContent":["export type { TeachingPopoverProps, TeachingPopoverState } from './components/TeachingPopover/index';\nexport {\n TeachingPopover,\n renderTeachingPopover_unstable,\n useTeachingPopover_unstable,\n} from './components/TeachingPopover/index';\n"],"names":["TeachingPopover","renderTeachingPopover_unstable","useTeachingPopover_unstable"],"mappings":";;;;;;;;;;;;eAEEA,sBAAe;;;eACfC,qCAA8B;;;eAC9BC,kCAA2B;;;uBACtB,qCAAqC"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverBody: function() {
return _index.TeachingPopoverBody;
},
renderTeachingPopoverBody_unstable: function() {
return _index.renderTeachingPopoverBody_unstable;
},
teachingPopoverBodyClassNames: function() {
return _index.teachingPopoverBodyClassNames;
},
useMediaStyles: function() {
return _index.useMediaStyles;
},
useTeachingPopoverBodyStyles_unstable: function() {
return _index.useTeachingPopoverBodyStyles_unstable;
},
useTeachingPopoverBody_unstable: function() {
return _index.useTeachingPopoverBody_unstable;
}
});
const _index = require("./components/TeachingPopoverBody/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverBody.ts"],"sourcesContent":["export type {\n TeachingPopoverBodyProps,\n TeachingPopoverBodySlots,\n TeachingPopoverBodyState,\n} from './components/TeachingPopoverBody/index';\nexport {\n TeachingPopoverBody,\n renderTeachingPopoverBody_unstable,\n teachingPopoverBodyClassNames,\n useMediaStyles,\n useTeachingPopoverBodyStyles_unstable,\n useTeachingPopoverBody_unstable,\n} from './components/TeachingPopoverBody/index';\n"],"names":["TeachingPopoverBody","renderTeachingPopoverBody_unstable","teachingPopoverBodyClassNames","useMediaStyles","useTeachingPopoverBodyStyles_unstable","useTeachingPopoverBody_unstable"],"mappings":";;;;;;;;;;;;eAMEA,0BAAmB;;;eACnBC,yCAAkC;;;eAClCC,oCAA6B;;;eAC7BC,qBAAc;;;eACdC,4CAAqC;;;eACrCC,sCAA+B;;;uBAC1B,yCAAyC"}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarousel: function() {
return _index.TeachingPopoverCarousel;
},
renderTeachingPopoverCarousel_unstable: function() {
return _index.renderTeachingPopoverCarousel_unstable;
},
teachingPopoverCarouselClassNames: function() {
return _index.teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselContextValues_unstable: function() {
return _index.useTeachingPopoverCarouselContextValues_unstable;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return _index.useTeachingPopoverCarouselStyles_unstable;
},
useTeachingPopoverCarousel_unstable: function() {
return _index.useTeachingPopoverCarousel_unstable;
}
});
const _index = require("./components/TeachingPopoverCarousel/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarousel.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselContextValues,\n TeachingPopoverCarouselProps,\n TeachingPopoverCarouselSlots,\n TeachingPopoverCarouselState,\n} from './components/TeachingPopoverCarousel/index';\nexport {\n TeachingPopoverCarousel,\n renderTeachingPopoverCarousel_unstable,\n teachingPopoverCarouselClassNames,\n useTeachingPopoverCarouselContextValues_unstable,\n useTeachingPopoverCarouselStyles_unstable,\n useTeachingPopoverCarousel_unstable,\n} from './components/TeachingPopoverCarousel/index';\n"],"names":["TeachingPopoverCarousel","renderTeachingPopoverCarousel_unstable","teachingPopoverCarouselClassNames","useTeachingPopoverCarouselContextValues_unstable","useTeachingPopoverCarouselStyles_unstable","useTeachingPopoverCarousel_unstable"],"mappings":";;;;;;;;;;;;eAOEA,8BAAuB;;;eACvBC,6CAAsC;;;eACtCC,wCAAiC;;;eACjCC,uDAAgD;;;eAChDC,gDAAyC;;;eACzCC,0CAAmC;;;uBAC9B,6CAA6C"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselCard: function() {
return _index.TeachingPopoverCarouselCard;
},
renderTeachingPopoverCarouselCard_unstable: function() {
return _index.renderTeachingPopoverCarouselCard_unstable;
},
teachingPopoverCarouselCardClassNames: function() {
return _index.teachingPopoverCarouselCardClassNames;
},
useTeachingPopoverCarouselCardStyles_unstable: function() {
return _index.useTeachingPopoverCarouselCardStyles_unstable;
},
useTeachingPopoverCarouselCard_unstable: function() {
return _index.useTeachingPopoverCarouselCard_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselCard/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselCard.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselCardProps,\n TeachingPopoverCarouselCardSlots,\n TeachingPopoverCarouselCardState,\n} from './components/TeachingPopoverCarouselCard/index';\nexport {\n TeachingPopoverCarouselCard,\n renderTeachingPopoverCarouselCard_unstable,\n teachingPopoverCarouselCardClassNames,\n useTeachingPopoverCarouselCardStyles_unstable,\n useTeachingPopoverCarouselCard_unstable,\n} from './components/TeachingPopoverCarouselCard/index';\n"],"names":["TeachingPopoverCarouselCard","renderTeachingPopoverCarouselCard_unstable","teachingPopoverCarouselCardClassNames","useTeachingPopoverCarouselCardStyles_unstable","useTeachingPopoverCarouselCard_unstable"],"mappings":";;;;;;;;;;;;eAMEA,kCAA2B;;;eAC3BC,iDAA0C;;;eAC1CC,4CAAqC;;;eACrCC,oDAA6C;;;eAC7CC,8CAAuC;;;uBAClC,iDAAiD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselFooter: function() {
return _index.TeachingPopoverCarouselFooter;
},
renderTeachingPopoverCarouselFooter_unstable: function() {
return _index.renderTeachingPopoverCarouselFooter_unstable;
},
teachingPopoverCarouselFooterClassNames: function() {
return _index.teachingPopoverCarouselFooterClassNames;
},
useTeachingPopoverCarouselFooterStyles_unstable: function() {
return _index.useTeachingPopoverCarouselFooterStyles_unstable;
},
useTeachingPopoverCarouselFooter_unstable: function() {
return _index.useTeachingPopoverCarouselFooter_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselFooter/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselFooter.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselFooterLayout,\n TeachingPopoverCarouselFooterProps,\n TeachingPopoverCarouselFooterSlots,\n TeachingPopoverCarouselFooterState,\n TeachingPopoverPageCountChildRenderFunction,\n} from './components/TeachingPopoverCarouselFooter/index';\nexport {\n TeachingPopoverCarouselFooter,\n renderTeachingPopoverCarouselFooter_unstable,\n teachingPopoverCarouselFooterClassNames,\n useTeachingPopoverCarouselFooterStyles_unstable,\n useTeachingPopoverCarouselFooter_unstable,\n} from './components/TeachingPopoverCarouselFooter/index';\n"],"names":["TeachingPopoverCarouselFooter","renderTeachingPopoverCarouselFooter_unstable","teachingPopoverCarouselFooterClassNames","useTeachingPopoverCarouselFooterStyles_unstable","useTeachingPopoverCarouselFooter_unstable"],"mappings":";;;;;;;;;;;;eAQEA,oCAA6B;;;eAC7BC,mDAA4C;;;eAC5CC,8CAAuC;;;eACvCC,sDAA+C;;;eAC/CC,gDAAyC;;;uBACpC,mDAAmD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselFooterButton: function() {
return _index.TeachingPopoverCarouselFooterButton;
},
renderTeachingPopoverCarouselFooterButton_unstable: function() {
return _index.renderTeachingPopoverCarouselFooterButton_unstable;
},
teachingPopoverCarouselFooterButtonClassNames: function() {
return _index.teachingPopoverCarouselFooterButtonClassNames;
},
useTeachingPopoverCarouselFooterButtonStyles_unstable: function() {
return _index.useTeachingPopoverCarouselFooterButtonStyles_unstable;
},
useTeachingPopoverCarouselFooterButton_unstable: function() {
return _index.useTeachingPopoverCarouselFooterButton_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselFooterButton/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselFooterButton.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselFooterButtonProps,\n TeachingPopoverCarouselFooterButtonSlots,\n TeachingPopoverCarouselFooterButtonState,\n} from './components/TeachingPopoverCarouselFooterButton/index';\nexport {\n TeachingPopoverCarouselFooterButton,\n renderTeachingPopoverCarouselFooterButton_unstable,\n teachingPopoverCarouselFooterButtonClassNames,\n useTeachingPopoverCarouselFooterButtonStyles_unstable,\n useTeachingPopoverCarouselFooterButton_unstable,\n} from './components/TeachingPopoverCarouselFooterButton/index';\n"],"names":["TeachingPopoverCarouselFooterButton","renderTeachingPopoverCarouselFooterButton_unstable","teachingPopoverCarouselFooterButtonClassNames","useTeachingPopoverCarouselFooterButtonStyles_unstable","useTeachingPopoverCarouselFooterButton_unstable"],"mappings":";;;;;;;;;;;;eAMEA,0CAAmC;;;eACnCC,yDAAkD;;;eAClDC,oDAA6C;;;eAC7CC,4DAAqD;;;eACrDC,sDAA+C;;;uBAC1C,yDAAyD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselNav: function() {
return _index.TeachingPopoverCarouselNav;
},
renderTeachingPopoverCarouselNav_unstable: function() {
return _index.renderTeachingPopoverCarouselNav_unstable;
},
teachingPopoverCarouselNavClassNames: function() {
return _index.teachingPopoverCarouselNavClassNames;
},
useTeachingPopoverCarouselNavStyles_unstable: function() {
return _index.useTeachingPopoverCarouselNavStyles_unstable;
},
useTeachingPopoverCarouselNav_unstable: function() {
return _index.useTeachingPopoverCarouselNav_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselNav/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselNav.ts"],"sourcesContent":["export type {\n NavButtonRenderFunction,\n TeachingPopoverCarouselNavProps,\n TeachingPopoverCarouselNavSlots,\n TeachingPopoverCarouselNavState,\n} from './components/TeachingPopoverCarouselNav/index';\nexport {\n TeachingPopoverCarouselNav,\n renderTeachingPopoverCarouselNav_unstable,\n teachingPopoverCarouselNavClassNames,\n useTeachingPopoverCarouselNavStyles_unstable,\n useTeachingPopoverCarouselNav_unstable,\n} from './components/TeachingPopoverCarouselNav/index';\n"],"names":["TeachingPopoverCarouselNav","renderTeachingPopoverCarouselNav_unstable","teachingPopoverCarouselNavClassNames","useTeachingPopoverCarouselNavStyles_unstable","useTeachingPopoverCarouselNav_unstable"],"mappings":";;;;;;;;;;;;eAOEA,iCAA0B;;;eAC1BC,gDAAyC;;;eACzCC,2CAAoC;;;eACpCC,mDAA4C;;;eAC5CC,6CAAsC;;;uBACjC,gDAAgD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselNavButton: function() {
return _index.TeachingPopoverCarouselNavButton;
},
renderTeachingPopoverCarouselNavButton_unstable: function() {
return _index.renderTeachingPopoverCarouselNavButton_unstable;
},
teachingPopoverCarouselNavButtonClassNames: function() {
return _index.teachingPopoverCarouselNavButtonClassNames;
},
useTeachingPopoverCarouselNavButtonStyles_unstable: function() {
return _index.useTeachingPopoverCarouselNavButtonStyles_unstable;
},
useTeachingPopoverCarouselNavButton_unstable: function() {
return _index.useTeachingPopoverCarouselNavButton_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselNavButton/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselNavButton.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselNavButtonProps,\n TeachingPopoverCarouselNavButtonSlots,\n TeachingPopoverCarouselNavButtonState,\n} from './components/TeachingPopoverCarouselNavButton/index';\nexport {\n TeachingPopoverCarouselNavButton,\n renderTeachingPopoverCarouselNavButton_unstable,\n teachingPopoverCarouselNavButtonClassNames,\n useTeachingPopoverCarouselNavButtonStyles_unstable,\n useTeachingPopoverCarouselNavButton_unstable,\n} from './components/TeachingPopoverCarouselNavButton/index';\n"],"names":["TeachingPopoverCarouselNavButton","renderTeachingPopoverCarouselNavButton_unstable","teachingPopoverCarouselNavButtonClassNames","useTeachingPopoverCarouselNavButtonStyles_unstable","useTeachingPopoverCarouselNavButton_unstable"],"mappings":";;;;;;;;;;;;eAMEA,uCAAgC;;;eAChCC,sDAA+C;;;eAC/CC,iDAA0C;;;eAC1CC,yDAAkD;;;eAClDC,mDAA4C;;;uBACvC,sDAAsD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselPageCount: function() {
return _index.TeachingPopoverCarouselPageCount;
},
renderTeachingPopoverCarouselPageCount_unstable: function() {
return _index.renderTeachingPopoverCarouselPageCount_unstable;
},
teachingPopoverCarouselPageCountClassNames: function() {
return _index.teachingPopoverCarouselPageCountClassNames;
},
useTeachingPopoverCarouselPageCountStyles_unstable: function() {
return _index.useTeachingPopoverCarouselPageCountStyles_unstable;
},
useTeachingPopoverCarouselPageCount_unstable: function() {
return _index.useTeachingPopoverCarouselPageCount_unstable;
}
});
const _index = require("./components/TeachingPopoverCarouselPageCount/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverCarouselPageCount.ts"],"sourcesContent":["export type {\n TeachingPopoverCarouselPageCountProps,\n TeachingPopoverCarouselPageCountRenderFunction,\n TeachingPopoverCarouselPageCountSlots,\n TeachingPopoverCarouselPageCountState,\n} from './components/TeachingPopoverCarouselPageCount/index';\nexport {\n TeachingPopoverCarouselPageCount,\n renderTeachingPopoverCarouselPageCount_unstable,\n teachingPopoverCarouselPageCountClassNames,\n useTeachingPopoverCarouselPageCountStyles_unstable,\n useTeachingPopoverCarouselPageCount_unstable,\n} from './components/TeachingPopoverCarouselPageCount/index';\n"],"names":["TeachingPopoverCarouselPageCount","renderTeachingPopoverCarouselPageCount_unstable","teachingPopoverCarouselPageCountClassNames","useTeachingPopoverCarouselPageCountStyles_unstable","useTeachingPopoverCarouselPageCount_unstable"],"mappings":";;;;;;;;;;;;eAOEA,uCAAgC;;;eAChCC,sDAA+C;;;eAC/CC,iDAA0C;;;eAC1CC,yDAAkD;;;eAClDC,mDAA4C;;;uBACvC,sDAAsD"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverFooter: function() {
return _TeachingPopoverFooter.TeachingPopoverFooter;
},
renderTeachingPopoverFooter_unstable: function() {
return _TeachingPopoverFooter.renderTeachingPopoverFooter_unstable;
},
teachingPopoverFooterClassNames: function() {
return _TeachingPopoverFooter.teachingPopoverFooterClassNames;
},
useTeachingPopoverFooterStyles_unstable: function() {
return _TeachingPopoverFooter.useTeachingPopoverFooterStyles_unstable;
},
useTeachingPopoverFooter_unstable: function() {
return _TeachingPopoverFooter.useTeachingPopoverFooter_unstable;
}
});
const _TeachingPopoverFooter = require("./components/TeachingPopoverFooter");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverFooter.ts"],"sourcesContent":["export type {\n TeachingPopoverFooterProps,\n TeachingPopoverFooterSlots,\n TeachingPopoverFooterState,\n} from './components/TeachingPopoverFooter';\nexport {\n TeachingPopoverFooter,\n renderTeachingPopoverFooter_unstable,\n teachingPopoverFooterClassNames,\n useTeachingPopoverFooterStyles_unstable,\n useTeachingPopoverFooter_unstable,\n} from './components/TeachingPopoverFooter';\n"],"names":["TeachingPopoverFooter","renderTeachingPopoverFooter_unstable","teachingPopoverFooterClassNames","useTeachingPopoverFooterStyles_unstable","useTeachingPopoverFooter_unstable"],"mappings":";;;;;;;;;;;;eAMEA,4CAAqB;;;eACrBC,2DAAoC;;;eACpCC,sDAA+B;;;eAC/BC,8DAAuC;;;eACvCC,wDAAiC;;;uCAC5B,qCAAqC"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverHeader: function() {
return _index.TeachingPopoverHeader;
},
renderTeachingPopoverHeader_unstable: function() {
return _index.renderTeachingPopoverHeader_unstable;
},
teachingPopoverHeaderClassNames: function() {
return _index.teachingPopoverHeaderClassNames;
},
useTeachingPopoverHeaderStyles_unstable: function() {
return _index.useTeachingPopoverHeaderStyles_unstable;
},
useTeachingPopoverHeader_unstable: function() {
return _index.useTeachingPopoverHeader_unstable;
}
});
const _index = require("./components/TeachingPopoverHeader/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverHeader.ts"],"sourcesContent":["export type {\n TeachingPopoverHeaderProps,\n TeachingPopoverHeaderSlots,\n TeachingPopoverHeaderState,\n} from './components/TeachingPopoverHeader/index';\nexport {\n TeachingPopoverHeader,\n renderTeachingPopoverHeader_unstable,\n teachingPopoverHeaderClassNames,\n useTeachingPopoverHeaderStyles_unstable,\n useTeachingPopoverHeader_unstable,\n} from './components/TeachingPopoverHeader/index';\n"],"names":["TeachingPopoverHeader","renderTeachingPopoverHeader_unstable","teachingPopoverHeaderClassNames","useTeachingPopoverHeaderStyles_unstable","useTeachingPopoverHeader_unstable"],"mappings":";;;;;;;;;;;;eAMEA,4BAAqB;;;eACrBC,2CAAoC;;;eACpCC,sCAA+B;;;eAC/BC,8CAAuC;;;eACvCC,wCAAiC;;;uBAC5B,2CAA2C"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverSurface: function() {
return _index.TeachingPopoverSurface;
},
renderTeachingPopoverSurface_unstable: function() {
return _index.renderTeachingPopoverSurface_unstable;
},
teachingPopoverSurfaceClassNames: function() {
return _index.teachingPopoverSurfaceClassNames;
},
useTeachingPopoverSurfaceStyles_unstable: function() {
return _index.useTeachingPopoverSurfaceStyles_unstable;
},
useTeachingPopoverSurface_unstable: function() {
return _index.useTeachingPopoverSurface_unstable;
}
});
const _index = require("./components/TeachingPopoverSurface/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverSurface.ts"],"sourcesContent":["export type {\n TeachingPopoverSurfaceProps,\n TeachingPopoverSurfaceSlots,\n TeachingPopoverSurfaceState,\n} from './components/TeachingPopoverSurface/index';\nexport {\n TeachingPopoverSurface,\n renderTeachingPopoverSurface_unstable,\n teachingPopoverSurfaceClassNames,\n useTeachingPopoverSurfaceStyles_unstable,\n useTeachingPopoverSurface_unstable,\n} from './components/TeachingPopoverSurface/index';\n"],"names":["TeachingPopoverSurface","renderTeachingPopoverSurface_unstable","teachingPopoverSurfaceClassNames","useTeachingPopoverSurfaceStyles_unstable","useTeachingPopoverSurface_unstable"],"mappings":";;;;;;;;;;;;eAMEA,6BAAsB;;;eACtBC,4CAAqC;;;eACrCC,uCAAgC;;;eAChCC,+CAAwC;;;eACxCC,yCAAkC;;;uBAC7B,4CAA4C"}

View File

@@ -0,0 +1,28 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverTitle: function() {
return _index.TeachingPopoverTitle;
},
renderTeachingPopoverTitle_unstable: function() {
return _index.renderTeachingPopoverTitle_unstable;
},
teachingPopoverTitleClassNames: function() {
return _index.teachingPopoverTitleClassNames;
},
useTeachingPopoverTitleStyles_unstable: function() {
return _index.useTeachingPopoverTitleStyles_unstable;
},
useTeachingPopoverTitle_unstable: function() {
return _index.useTeachingPopoverTitle_unstable;
}
});
const _index = require("./components/TeachingPopoverTitle/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverTitle.ts"],"sourcesContent":["export type {\n TeachingPopoverTitleProps,\n TeachingPopoverTitleSlots,\n TeachingPopoverTitleState,\n} from './components/TeachingPopoverTitle/index';\nexport {\n TeachingPopoverTitle,\n renderTeachingPopoverTitle_unstable,\n teachingPopoverTitleClassNames,\n useTeachingPopoverTitleStyles_unstable,\n useTeachingPopoverTitle_unstable,\n} from './components/TeachingPopoverTitle/index';\n"],"names":["TeachingPopoverTitle","renderTeachingPopoverTitle_unstable","teachingPopoverTitleClassNames","useTeachingPopoverTitleStyles_unstable","useTeachingPopoverTitle_unstable"],"mappings":";;;;;;;;;;;;eAMEA,2BAAoB;;;eACpBC,0CAAmC;;;eACnCC,qCAA8B;;;eAC9BC,6CAAsC;;;eACtCC,uCAAgC;;;uBAC3B,0CAA0C"}

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverTrigger: function() {
return _index.TeachingPopoverTrigger;
},
renderTeachingPopoverTrigger_unstable: function() {
return _index.renderTeachingPopoverTrigger_unstable;
},
useTeachingPopoverTrigger_unstable: function() {
return _index.useTeachingPopoverTrigger_unstable;
}
});
const _index = require("./components/TeachingPopoverTrigger/index");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/TeachingPopoverTrigger.ts"],"sourcesContent":["export type {\n TeachingPopoverTriggerChildProps,\n TeachingPopoverTriggerProps,\n TeachingPopoverTriggerState,\n} from './components/TeachingPopoverTrigger/index';\nexport {\n TeachingPopoverTrigger,\n renderTeachingPopoverTrigger_unstable,\n useTeachingPopoverTrigger_unstable,\n} from './components/TeachingPopoverTrigger/index';\n"],"names":["TeachingPopoverTrigger","renderTeachingPopoverTrigger_unstable","useTeachingPopoverTrigger_unstable"],"mappings":";;;;;;;;;;;;eAMEA,6BAAsB;;;eACtBC,4CAAqC;;;eACrCC,yCAAkC;;;uBAC7B,4CAA4C"}

View File

@@ -0,0 +1,20 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TeachingPopover", {
enumerable: true,
get: function() {
return TeachingPopover;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTeachingPopover = require("./useTeachingPopover");
const _renderTeachingPopover = require("./renderTeachingPopover");
const TeachingPopover = (props)=>{
const state = (0, _useTeachingPopover.useTeachingPopover_unstable)(props);
return (0, _renderTeachingPopover.renderTeachingPopover_unstable)(state);
};
TeachingPopover.displayName = 'TeachingPopover';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopover/TeachingPopover.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTeachingPopover_unstable } from './useTeachingPopover';\nimport { renderTeachingPopover_unstable } from './renderTeachingPopover';\nimport type { TeachingPopoverProps } from './TeachingPopover.types';\n\n/**\n * An extension class of Popover which defaults to withArrow and FocusTrap enabled.\n */\nexport const TeachingPopover: React.FC<TeachingPopoverProps> = props => {\n const state = useTeachingPopover_unstable(props);\n\n return renderTeachingPopover_unstable(state);\n};\n\nTeachingPopover.displayName = 'TeachingPopover';\n"],"names":["React","useTeachingPopover_unstable","renderTeachingPopover_unstable","TeachingPopover","props","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;oCACa,uBAAuB;uCACpB,0BAA0B;AAMlE,MAAMG,kBAAkDC,CAAAA;IAC7D,MAAMC,YAAQJ,+CAAAA,EAA4BG;IAE1C,WAAOF,qDAAAA,EAA+BG;AACxC,EAAE;AAEFF,gBAAgBG,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* TeachingPopover State
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopover/TeachingPopover.types.ts"],"sourcesContent":["import type { PopoverState, PopoverProps } from '@fluentui/react-popover';\n\n/**\n * TeachingPopover Props\n */\nexport type TeachingPopoverProps = PopoverProps;\n\n/**\n * TeachingPopover State\n */\nexport type TeachingPopoverState = PopoverState;\n"],"names":[],"mappings":"AAOA;;CAEC,GACD,WAAgD"}

View File

@@ -0,0 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopover: function() {
return _TeachingPopover.TeachingPopover;
},
renderTeachingPopover_unstable: function() {
return _renderTeachingPopover.renderTeachingPopover_unstable;
},
useTeachingPopover_unstable: function() {
return _useTeachingPopover.useTeachingPopover_unstable;
}
});
const _TeachingPopover = require("./TeachingPopover");
const _renderTeachingPopover = require("./renderTeachingPopover");
const _useTeachingPopover = require("./useTeachingPopover");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopover/index.ts"],"sourcesContent":["export { TeachingPopover } from './TeachingPopover';\nexport type { TeachingPopoverProps, TeachingPopoverState } from './TeachingPopover.types';\nexport { renderTeachingPopover_unstable } from './renderTeachingPopover';\nexport { useTeachingPopover_unstable } from './useTeachingPopover';\n"],"names":["TeachingPopover","renderTeachingPopover_unstable","useTeachingPopover_unstable"],"mappings":";;;;;;;;;;;;eAASA,gCAAe;;;eAEfC,qDAA8B;;;eAC9BC,+CAA2B;;;iCAHJ,oBAAoB;uCAEL,0BAA0B;oCAC7B,uBAAuB"}

View File

@@ -0,0 +1,12 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderTeachingPopover_unstable", {
enumerable: true,
get: function() {
return renderTeachingPopover_unstable;
}
});
const _reactpopover = require("@fluentui/react-popover");
const renderTeachingPopover_unstable = _reactpopover.renderPopover_unstable;

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopover/renderTeachingPopover.tsx"],"sourcesContent":["import { renderPopover_unstable } from '@fluentui/react-popover';\n\n/**\n * Render the final JSX of TeachingPopover\n */\nexport const renderTeachingPopover_unstable = renderPopover_unstable;\n"],"names":["renderPopover_unstable","renderTeachingPopover_unstable"],"mappings":";;;;;;;;;;8BAAuC,0BAA0B;AAK1D,MAAMC,iCAAiCD,oCAAAA,CAAuB"}

View File

@@ -0,0 +1,22 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopover_unstable", {
enumerable: true,
get: function() {
return useTeachingPopover_unstable;
}
});
const _reactpopover = require("@fluentui/react-popover");
const useTeachingPopover_unstable = (props)=>{
const popoverState = (0, _reactpopover.usePopover_unstable)(props);
var _props_withArrow, _props_trapFocus;
return {
...popoverState,
withArrow: (_props_withArrow = props.withArrow) !== null && _props_withArrow !== void 0 ? _props_withArrow : true,
// We trap focus because the default TeachingPopover view has buttons/carousel.
trapFocus: (_props_trapFocus = props.trapFocus) !== null && _props_trapFocus !== void 0 ? _props_trapFocus : true
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopover/useTeachingPopover.ts"],"sourcesContent":["'use client';\n\nimport { usePopover_unstable } from '@fluentui/react-popover';\nimport type { TeachingPopoverProps, TeachingPopoverState } from './TeachingPopover.types';\n\nexport const useTeachingPopover_unstable = (props: TeachingPopoverProps): TeachingPopoverState => {\n const popoverState = usePopover_unstable(props);\n\n return {\n ...popoverState,\n withArrow: props.withArrow ?? true,\n // We trap focus because the default TeachingPopover view has buttons/carousel.\n trapFocus: props.trapFocus ?? true,\n };\n};\n"],"names":["usePopover_unstable","useTeachingPopover_unstable","props","popoverState","withArrow","trapFocus"],"mappings":"AAAA;;;;;;;;;;;8BAEoC,0BAA0B;AAGvD,MAAMC,8BAA8B,CAACC;IAC1C,MAAMC,mBAAeH,iCAAAA,EAAoBE;QAI5BA,kBAEAA;IAJb,OAAO;QACL,GAAGC,YAAY;QACfC,WAAWF,CAAAA,mBAAAA,MAAME,SAAAA,AAAS,MAAA,QAAfF,qBAAAA,KAAAA,IAAAA,mBAAmB;QAC9B,+EAA+E;QAC/EG,WAAWH,CAAAA,mBAAAA,MAAMG,SAAAA,AAAS,MAAA,QAAfH,qBAAAA,KAAAA,IAAAA,mBAAmB;IAChC;AACF,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TeachingPopoverBody", {
enumerable: true,
get: function() {
return TeachingPopoverBody;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTeachingPopoverBody = require("./useTeachingPopoverBody");
const _renderTeachingPopoverBody = require("./renderTeachingPopoverBody");
const _useTeachingPopoverBodyStylesstyles = require("./useTeachingPopoverBodyStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const TeachingPopoverBody = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useTeachingPopoverBody.useTeachingPopoverBody_unstable)(props, ref);
(0, _useTeachingPopoverBodyStylesstyles.useTeachingPopoverBodyStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useTeachingPopoverBodyStyles_unstable')(state);
return (0, _renderTeachingPopoverBody.renderTeachingPopoverBody_unstable)(state);
});
TeachingPopoverBody.displayName = 'TeachingPopoverBody';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/TeachingPopoverBody.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTeachingPopoverBody_unstable } from './useTeachingPopoverBody';\nimport { renderTeachingPopoverBody_unstable } from './renderTeachingPopoverBody';\nimport { useTeachingPopoverBodyStyles_unstable } from './useTeachingPopoverBodyStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport type { TeachingPopoverBodyProps } from './TeachingPopoverBody.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled TeachingPopoverBody, using the `useTeachingPopoverBody_unstable` and `useTeachingPopoverBodyStyles_unstable`\n * hooks.\n *\n * TeachingPopoverBody is used to host content within a TeachingPopover, and provides a standardized media slot\n */\nexport const TeachingPopoverBody: ForwardRefComponent<TeachingPopoverBodyProps> = React.forwardRef((props, ref) => {\n const state = useTeachingPopoverBody_unstable(props, ref);\n\n useTeachingPopoverBodyStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTeachingPopoverBodyStyles_unstable')(state);\n\n return renderTeachingPopoverBody_unstable(state);\n});\n\nTeachingPopoverBody.displayName = 'TeachingPopoverBody';\n"],"names":["React","useTeachingPopoverBody_unstable","renderTeachingPopoverBody_unstable","useTeachingPopoverBodyStyles_unstable","useCustomStyleHook_unstable","TeachingPopoverBody","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;wCACiB,2BAA2B;2CACxB,8BAA8B;oDAC3B,wCAAwC;qCAClD,kCAAkC;AAUvE,MAAMK,sBAAAA,WAAAA,GAAqEL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACzG,MAAMC,YAAQR,uDAAAA,EAAgCM,OAAOC;QAErDL,yEAAAA,EAAsCM;QAEtCL,gDAAAA,EAA4B,yCAAyCK;IAErE,WAAOP,6DAAAA,EAAmCO;AAC5C,GAAG;AAEHJ,oBAAoBK,WAAW,GAAG"}

View File

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

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/TeachingPopoverBody.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TeachingPopoverBodySlots = {\n /**\n * The element wrapping the buttons.\n */\n root: NonNullable<Slot<'div'>>;\n /**\n * Optional Media Content.\n */\n media?: Slot<'span'>;\n};\n\nexport type TeachingPopoverBodyProps = ComponentProps<TeachingPopoverBodySlots> & {\n mediaLength?: 'short' | 'medium' | 'tall';\n};\n\nexport type TeachingPopoverBodyState = ComponentState<TeachingPopoverBodySlots> &\n Required<Pick<TeachingPopoverBodyProps, 'mediaLength'>>;\n"],"names":[],"mappings":""}

View File

@@ -0,0 +1,34 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverBody: function() {
return _TeachingPopoverBody.TeachingPopoverBody;
},
renderTeachingPopoverBody_unstable: function() {
return _renderTeachingPopoverBody.renderTeachingPopoverBody_unstable;
},
teachingPopoverBodyClassNames: function() {
return _useTeachingPopoverBodyStylesstyles.teachingPopoverBodyClassNames;
},
useMediaStyles: function() {
return _useTeachingPopoverBodyStylesstyles.useMediaStyles;
},
useTeachingPopoverBodyStyles_unstable: function() {
return _useTeachingPopoverBodyStylesstyles.useTeachingPopoverBodyStyles_unstable;
},
useTeachingPopoverBody_unstable: function() {
return _useTeachingPopoverBody.useTeachingPopoverBody_unstable;
}
});
const _TeachingPopoverBody = require("./TeachingPopoverBody");
const _renderTeachingPopoverBody = require("./renderTeachingPopoverBody");
const _useTeachingPopoverBody = require("./useTeachingPopoverBody");
const _useTeachingPopoverBodyStylesstyles = require("./useTeachingPopoverBodyStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/index.ts"],"sourcesContent":["export { TeachingPopoverBody } from './TeachingPopoverBody';\nexport type {\n TeachingPopoverBodyProps,\n TeachingPopoverBodySlots,\n TeachingPopoverBodyState,\n} from './TeachingPopoverBody.types';\nexport { renderTeachingPopoverBody_unstable } from './renderTeachingPopoverBody';\nexport { useTeachingPopoverBody_unstable } from './useTeachingPopoverBody';\nexport {\n teachingPopoverBodyClassNames,\n useMediaStyles,\n useTeachingPopoverBodyStyles_unstable,\n} from './useTeachingPopoverBodyStyles.styles';\n"],"names":["TeachingPopoverBody","renderTeachingPopoverBody_unstable","useTeachingPopoverBody_unstable","teachingPopoverBodyClassNames","useMediaStyles","useTeachingPopoverBodyStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,wCAAmB;;;eAMnBC,6DAAkC;;;eAGzCE,iEAA6B;;;eAC7BC,kDAAc;;;eACdC,yEAAqC;;;eAJ9BH,uDAA+B;;;qCAPJ,wBAAwB;2CAMT,8BAA8B;wCACjC,2BAA2B;oDAKpE,wCAAwC"}

View File

@@ -0,0 +1,21 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderTeachingPopoverBody_unstable", {
enumerable: true,
get: function() {
return renderTeachingPopoverBody_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const renderTeachingPopoverBody_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
children: [
state.media && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.media, {}),
state.root.children
]
});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/renderTeachingPopoverBody.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport type { TeachingPopoverBodyState } from './TeachingPopoverBody.types';\nimport { TeachingPopoverBodySlots } from './TeachingPopoverBody.types';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\n/**\n * Render the final JSX of TeachingPopoverBody\n */\nexport const renderTeachingPopoverBody_unstable = (state: TeachingPopoverBodyState): JSXElement => {\n assertSlots<TeachingPopoverBodySlots>(state);\n\n return (\n <state.root>\n {state.media && <state.media />}\n {state.root.children}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderTeachingPopoverBody_unstable","state","root","media","children"],"mappings":";;;;+BAUaC;;;;;;4BATb,iCAAiD;gCAGrB,4BAA4B;AAMjD,2CAA2C,CAACC;QACjDF,2BAAAA,EAAsCE;IAEtC,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,KAAK,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,KAAK,EAAA,CAAA;YAC3BF,MAAMC,IAAI,CAACE,QAAQ;;;AAG1B,EAAE"}

View File

@@ -0,0 +1,32 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopoverBody_unstable", {
enumerable: true,
get: function() {
return useTeachingPopoverBody_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const useTeachingPopoverBody_unstable = (props, ref)=>{
const { mediaLength } = props;
return {
components: {
root: 'div',
media: 'span'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref,
...props
}), {
elementType: 'div'
}),
media: _reactutilities.slot.optional(props.media, {
elementType: 'span'
}),
mediaLength: mediaLength !== null && mediaLength !== void 0 ? mediaLength : 'short'
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/useTeachingPopoverBody.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { TeachingPopoverBodyProps, TeachingPopoverBodyState } from './TeachingPopoverBody.types';\n/**\n * Returns the props and state required to render the component\n * @param props - TeachingPopoverBody properties\n * @param ref - reference to root HTMLElement of TeachingPopoverBody\n */\nexport const useTeachingPopoverBody_unstable = (\n props: TeachingPopoverBodyProps,\n ref: React.Ref<HTMLDivElement>,\n): TeachingPopoverBodyState => {\n const { mediaLength } = props;\n\n return {\n components: {\n root: 'div',\n media: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n ),\n media: slot.optional(props.media, { elementType: 'span' }),\n mediaLength: mediaLength ?? 'short',\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useTeachingPopoverBody_unstable","props","ref","mediaLength","components","root","media","always","elementType","optional"],"mappings":";;;;+BAQaG;;;;;;;iEARU,QAAQ;gCACgB,4BAA4B;AAOpE,wCAAwC,CAC7CC,OACAC;IAEA,MAAM,EAAEC,WAAW,EAAE,GAAGF;IAExB,OAAO;QACLG,YAAY;YACVC,MAAM;YACNC,OAAO;QACT;QACAD,MAAMN,oBAAAA,CAAKQ,MAAM,KACfT,wCAAAA,EAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEO,aAAa;QAAM;QAEvBF,OAAOP,oBAAAA,CAAKU,QAAQ,CAACR,MAAMK,KAAK,EAAE;YAAEE,aAAa;QAAO;QACxDL,aAAaA,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAe;IAC9B;AACF,EAAE"}

View File

@@ -0,0 +1,109 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverBodyClassNames: function() {
return teachingPopoverBodyClassNames;
},
useMediaStyles: function() {
return useMediaStyles;
},
useTeachingPopoverBodyStyles_unstable: function() {
return useTeachingPopoverBodyStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverBodyClassNames = {
root: 'fui-TeachingPopoverBody',
media: 'fui-TeachingPopoverBody__media'
};
const popoverBodyDimension = 288;
const useMediaStyles = /*#__PURE__*/ (0, _react.__styles)({
base: {
Bw0ie65: 0,
Br312pm: 0,
nk6f5a: 0,
Ijaq50: 0,
Bq1tomu: "fujjg13",
B68tc82: 0,
Bmxbyg5: 0,
Bpg54ce: "f1a3p1vp",
a9b677: "f14z66ap",
jrapky: "f1jlhsmd",
ha4doy: "fmrv4ls",
Brf1p80: "f4d9j23",
mc9l5x: "f22iagw"
},
short: {
Bubjx69: "f1taewuw",
Bfd67p1: "f2f587x"
},
medium: {
Bubjx69: "f7da563",
Bfd67p1: "fmwcswg"
},
tall: {
Bubjx69: "f9ikmtg",
Bfd67p1: "f1gv48o"
}
}, {
d: [
[
".fujjg13{grid-area:media;}",
{
p: -1
}
],
[
".f1a3p1vp{overflow:hidden;}",
{
p: -1
}
],
".f14z66ap{width:auto;}",
".f1jlhsmd{margin-bottom:12px;}",
".fmrv4ls{vertical-align:middle;}",
".f4d9j23{justify-content:center;}",
".f22iagw{display:flex;}",
".f1taewuw{aspect-ratio:2.4615384615384617;}",
".f7da563{aspect-ratio:1.6363636363636365;}",
".f9ikmtg{aspect-ratio:1;}"
],
t: [
"@supports not (aspect-ratio){.f2f587x{height:117px;}}",
"@supports not (aspect-ratio){.fmwcswg{height:176px;}}",
"@supports not (aspect-ratio){.f1gv48o{height:288px;}}"
]
});
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
root: {
mc9l5x: "f22iagw",
Beiy3e4: "f1vx9l62",
Byoj8tv: "fpe6lb7"
}
}, {
d: [
".f22iagw{display:flex;}",
".f1vx9l62{flex-direction:column;}",
".fpe6lb7{padding-bottom:12px;}"
]
});
const useTeachingPopoverBodyStyles_unstable = (state)=>{
'use no memo';
const { mediaLength } = state;
const styles = useStyles();
const mediaStyles = useMediaStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverBodyClassNames.root, styles.root, state.root.className);
if (state.media) {
state.media.className = (0, _react.mergeClasses)(teachingPopoverBodyClassNames.media, mediaStyles.base, mediaStyles[mediaLength], state.media.className);
}
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useTeachingPopoverBodyStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const teachingPopoverBodyClassNames = {\n root: 'fui-TeachingPopoverBody',\n media: 'fui-TeachingPopoverBody__media'\n};\nconst popoverBodyDimension = 288;\nexport const useMediaStyles = makeStyles({\n base: {\n gridArea: 'media',\n overflow: 'hidden',\n width: 'auto',\n marginBottom: '12px',\n verticalAlign: 'middle',\n justifyContent: 'center',\n display: 'flex'\n },\n short: {\n aspectRatio: popoverBodyDimension / 117,\n '@supports not (aspect-ratio)': {\n height: '117px'\n }\n },\n medium: {\n aspectRatio: popoverBodyDimension / 176,\n '@supports not (aspect-ratio)': {\n height: '176px'\n }\n },\n tall: {\n aspectRatio: 1,\n '@supports not (aspect-ratio)': {\n height: `${popoverBodyDimension}px`\n }\n }\n});\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n paddingBottom: '12px'\n }\n});\n/** Applies style classnames to slots */ export const useTeachingPopoverBodyStyles_unstable = (state)=>{\n 'use no memo';\n const { mediaLength } = state;\n const styles = useStyles();\n const mediaStyles = useMediaStyles();\n state.root.className = mergeClasses(teachingPopoverBodyClassNames.root, styles.root, state.root.className);\n if (state.media) {\n state.media.className = mergeClasses(teachingPopoverBodyClassNames.media, mediaStyles.base, mediaStyles[mediaLength], state.media.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","teachingPopoverBodyClassNames","root","media","popoverBodyDimension","useMediaStyles","base","Bw0ie65","Br312pm","nk6f5a","Ijaq50","Bq1tomu","B68tc82","Bmxbyg5","Bpg54ce","a9b677","jrapky","ha4doy","Brf1p80","mc9l5x","short","Bubjx69","Bfd67p1","medium","tall","d","p","t","useStyles","Beiy3e4","Byoj8tv","useTeachingPopoverBodyStyles_unstable","state","mediaLength","styles","mediaStyles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAECE,6BAA6B;;;kBAKf;;;yCAoCgE;eAArC8B;;;uBA1Cb,gBAAgB;AAClD,sCAAsC;IACzC7B,IAAI,EAAE,yBAAyB;IAC/BC,KAAK,EAAE;AACX,CAAC;AACD,MAAMC,oBAAoB,GAAG,GAAG;AACzB,MAAMC,iBAAc,WAAA,OAAGN,eAAA,EAAA;IAAAO,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,KAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,MAAA,EAAA;QAAAF,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAE,IAAA,EAAA;QAAAH,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAG,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CA4B7B,CAAC;AACF,MAAMC,SAAS,GAAA,WAAA,OAAG7B,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAiB,MAAA,EAAA;QAAAU,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAL,CAAA,EAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAMjB,CAAC;AAC8C,+CAA+CO,KAAK,IAAG;IACnG,aAAa;IACb,MAAM,EAAEC,WAAAA,EAAa,GAAGD,KAAK;IAC7B,MAAME,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1B,MAAMO,WAAW,GAAG9B,cAAc,CAAC,CAAC;IACpC2B,KAAK,CAAC9B,IAAI,CAACkC,SAAS,OAAGpC,mBAAY,EAACC,6BAA6B,CAACC,IAAI,EAAEgC,MAAM,CAAChC,IAAI,EAAE8B,KAAK,CAAC9B,IAAI,CAACkC,SAAS,CAAC;IAC1G,IAAIJ,KAAK,CAAC7B,KAAK,EAAE;QACb6B,KAAK,CAAC7B,KAAK,CAACiC,SAAS,OAAGpC,mBAAY,EAACC,6BAA6B,CAACE,KAAK,EAAEgC,WAAW,CAAC7B,IAAI,EAAE6B,WAAW,CAACF,WAAW,CAAC,EAAED,KAAK,CAAC7B,KAAK,CAACiC,SAAS,CAAC;IAChJ;IACA,OAAOJ,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,75 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverBodyClassNames: function() {
return teachingPopoverBodyClassNames;
},
useMediaStyles: function() {
return useMediaStyles;
},
useTeachingPopoverBodyStyles_unstable: function() {
return useTeachingPopoverBodyStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverBodyClassNames = {
root: 'fui-TeachingPopoverBody',
media: 'fui-TeachingPopoverBody__media'
};
const popoverBodyDimension = 288;
const useMediaStyles = (0, _react.makeStyles)({
base: {
gridArea: 'media',
overflow: 'hidden',
width: 'auto',
marginBottom: '12px',
verticalAlign: 'middle',
justifyContent: 'center',
display: 'flex'
},
short: {
aspectRatio: popoverBodyDimension / 117,
'@supports not (aspect-ratio)': {
height: '117px'
}
},
medium: {
aspectRatio: popoverBodyDimension / 176,
'@supports not (aspect-ratio)': {
height: '176px'
}
},
tall: {
aspectRatio: 1,
'@supports not (aspect-ratio)': {
height: `${popoverBodyDimension}px`
}
}
});
const useStyles = (0, _react.makeStyles)({
root: {
display: 'flex',
flexDirection: 'column',
paddingBottom: '12px'
}
});
const useTeachingPopoverBodyStyles_unstable = (state)=>{
'use no memo';
const { mediaLength } = state;
const styles = useStyles();
const mediaStyles = useMediaStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverBodyClassNames.root, styles.root, state.root.className);
if (state.media) {
state.media.className = (0, _react.mergeClasses)(teachingPopoverBodyClassNames.media, mediaStyles.base, mediaStyles[mediaLength], state.media.className);
}
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverBody/useTeachingPopoverBodyStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TeachingPopoverBodySlots, TeachingPopoverBodyState } from './TeachingPopoverBody.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const teachingPopoverBodyClassNames: SlotClassNames<TeachingPopoverBodySlots> = {\n root: 'fui-TeachingPopoverBody',\n media: 'fui-TeachingPopoverBody__media',\n};\n\nconst popoverBodyDimension = 288;\n\nexport const useMediaStyles = makeStyles({\n base: {\n gridArea: 'media',\n overflow: 'hidden',\n width: 'auto',\n marginBottom: '12px',\n verticalAlign: 'middle',\n justifyContent: 'center',\n display: 'flex',\n },\n short: {\n aspectRatio: popoverBodyDimension / 117,\n '@supports not (aspect-ratio)': {\n height: '117px',\n },\n },\n medium: {\n aspectRatio: popoverBodyDimension / 176,\n '@supports not (aspect-ratio)': {\n height: '176px',\n },\n },\n tall: {\n aspectRatio: 1,\n '@supports not (aspect-ratio)': {\n height: `${popoverBodyDimension}px`,\n },\n },\n});\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'column',\n paddingBottom: '12px',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useTeachingPopoverBodyStyles_unstable = (state: TeachingPopoverBodyState): TeachingPopoverBodyState => {\n 'use no memo';\n\n const { mediaLength } = state;\n const styles = useStyles();\n const mediaStyles = useMediaStyles();\n\n state.root.className = mergeClasses(teachingPopoverBodyClassNames.root, styles.root, state.root.className);\n\n if (state.media) {\n state.media.className = mergeClasses(\n teachingPopoverBodyClassNames.media,\n mediaStyles.base,\n mediaStyles[mediaLength],\n state.media.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","teachingPopoverBodyClassNames","root","media","popoverBodyDimension","useMediaStyles","base","gridArea","overflow","width","marginBottom","verticalAlign","justifyContent","display","short","aspectRatio","height","medium","tall","useStyles","flexDirection","paddingBottom","useTeachingPopoverBodyStyles_unstable","state","mediaLength","styles","mediaStyles","className"],"mappings":"AAAA;;;;;;;;;;;;IAMaE,6BAAAA;;;kBAOAI;;;yCAuCAiB;eAAAA;;;uBAlD4B,iBAAiB;AAInD,sCAAgF;IACrFpB,MAAM;IACNC,OAAO;AACT,EAAE;AAEF,MAAMC,uBAAuB;AAEtB,MAAMC,iBAAiBN,qBAAAA,EAAW;IACvCO,MAAM;QACJC,UAAU;QACVC,UAAU;QACVC,OAAO;QACPC,cAAc;QACdC,eAAe;QACfC,gBAAgB;QAChBC,SAAS;IACX;IACAC,OAAO;QACLC,aAAaX,uBAAuB;QACpC,gCAAgC;YAC9BY,QAAQ;QACV;IACF;IACAC,QAAQ;QACNF,aAAaX,uBAAuB;QACpC,gCAAgC;YAC9BY,QAAQ;QACV;IACF;IACAE,MAAM;QACJH,aAAa;QACb,gCAAgC;YAC9BC,QAAQ,GAAGZ,qBAAqB,EAAE,CAAC;QACrC;IACF;AACF,GAAG;AAEH,MAAMe,gBAAYpB,iBAAAA,EAAW;IAC3BG,MAAM;QACJW,SAAS;QACTO,eAAe;QACfC,eAAe;IACjB;AACF;AAGO,8CAA8C,CAACE;IACpD;IAEA,MAAM,EAAEC,WAAW,EAAE,GAAGD;IACxB,MAAME,SAASN;IACf,MAAMO,cAAcrB;IAEpBkB,MAAMrB,IAAI,CAACyB,SAAS,OAAG3B,mBAAAA,EAAaC,8BAA8BC,IAAI,EAAEuB,OAAOvB,IAAI,EAAEqB,MAAMrB,IAAI,CAACyB,SAAS;IAEzG,IAAIJ,MAAMpB,KAAK,EAAE;QACfoB,MAAMpB,KAAK,CAACwB,SAAS,OAAG3B,mBAAAA,EACtBC,8BAA8BE,KAAK,EACnCuB,YAAYpB,IAAI,EAChBoB,WAAW,CAACF,YAAY,EACxBD,MAAMpB,KAAK,CAACwB,SAAS;IAEzB;IAEA,OAAOJ;AACT,EAAE"}

View File

@@ -0,0 +1,143 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarousel_unstable", {
enumerable: true,
get: function() {
return useCarousel_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _constants = require("./constants");
const _useCarouselWalker = require("./useCarouselWalker");
const _createCarouselStore = require("./createCarouselStore");
function useCarousel_unstable(options) {
'use no memo';
const { announcement, onValueChange, onFinish } = options;
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
const win = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
const { ref: carouselRef, walker: carouselWalker } = (0, _useCarouselWalker.useCarouselWalker_unstable)();
const [store] = _react.useState(()=>(0, _createCarouselStore.createCarouselStore)());
const [value, setValue] = (0, _reactutilities.useControllableState)({
defaultState: options.defaultValue,
state: options.value,
initialState: null
});
const rootRef = _react.useRef(null);
const { announce } = (0, _reactsharedcontexts.useAnnounce)();
if (process.env.NODE_ENV !== 'production') {
// eslint-disable-next-line react-hooks/rules-of-hooks
_react.useEffect(()=>{
if (value === null) {
// eslint-disable-next-line no-console
console.error('useCarousel: Carousel needs to have a `defaultValue` or `value` prop set. If you want to control the value, use the `value` prop.');
}
}, [
value
]);
}
_react.useEffect(()=>{
var _rootRef_current;
const allItems = (_rootRef_current = rootRef.current) === null || _rootRef_current === void 0 ? void 0 : _rootRef_current.querySelectorAll(`[${_constants.CAROUSEL_ITEM}]`);
for(let i = 0; i < allItems.length; i++){
store.addValue(allItems.item(i).getAttribute(_constants.CAROUSEL_ITEM));
}
return ()=>{
store.clear();
};
}, [
store
]);
_react.useEffect(()=>{
if (!win) {
return;
}
const config = {
attributes: true,
attributeFilter: [
_constants.CAROUSEL_ITEM
],
childList: true,
subtree: true
};
// Callback function to execute when mutations are observed
const callback = (mutationList)=>{
for (const mutation of mutationList){
for (const addedNode of Array.from(mutation.addedNodes)){
if ((0, _reactutilities.isHTMLElement)(addedNode) && addedNode.hasAttribute(_constants.CAROUSEL_ITEM)) {
const newValue = addedNode.getAttribute(_constants.CAROUSEL_ITEM);
const newNode = carouselWalker.find(newValue);
if (!(newNode === null || newNode === void 0 ? void 0 : newNode.value)) {
return;
}
const previousNode = carouselWalker.prevPage(newNode === null || newNode === void 0 ? void 0 : newNode.value);
var _previousNode_value;
store.insertValue(newValue, (_previousNode_value = previousNode === null || previousNode === void 0 ? void 0 : previousNode.value) !== null && _previousNode_value !== void 0 ? _previousNode_value : null);
}
}
for (const removedNode of Array.from(mutation.removedNodes)){
if ((0, _reactutilities.isHTMLElement)(removedNode) && (removedNode === null || removedNode === void 0 ? void 0 : removedNode.hasAttribute(_constants.CAROUSEL_ITEM))) {
const removedValue = removedNode.getAttribute(_constants.CAROUSEL_ITEM);
store.removeValue(removedValue);
}
}
}
};
// Create an observer instance linked to the callback function
const observer = new win.MutationObserver(callback);
// Start observing the target node for configured mutations
observer.observe(rootRef.current, config);
// Later, you can stop observing
return ()=>{
observer.disconnect();
};
}, [
carouselWalker,
store,
win
]);
const updateSlide = (0, _reactutilities.useEventCallback)((event, newValue)=>{
setValue(newValue);
onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(event, {
event,
type: 'click',
value: newValue
});
const announceText = announcement === null || announcement === void 0 ? void 0 : announcement(newValue);
if (announceText) {
announce(announceText, {
polite: true
});
}
});
const selectPageByDirection = (0, _reactutilities.useEventCallback)((event, direction)=>{
const active = carouselWalker.active();
if (!(active === null || active === void 0 ? void 0 : active.value)) {
return;
}
const newPage = direction === 'prev' ? carouselWalker.prevPage(active.value) : carouselWalker.nextPage(active.value);
if (newPage) {
updateSlide(event, newPage === null || newPage === void 0 ? void 0 : newPage.value);
} else {
onFinish === null || onFinish === void 0 ? void 0 : onFinish(event, {
event,
type: 'click',
value: active === null || active === void 0 ? void 0 : active.value
});
}
});
return {
carouselRef: (0, _reactutilities.useMergedRefs)(rootRef, carouselRef),
carousel: {
store,
value,
selectPageByDirection,
selectPageByValue: updateSlide
}
};
}

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/Carousel.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { EventData, EventHandler } from '@fluentui/react-utilities';\n\nexport type CarouselStore = {\n clear: () => void;\n addValue: (value: string) => void;\n insertValue: (value: string, prev: string | null) => void;\n removeValue: (value: string) => void;\n subscribe: (listener: () => void) => () => void;\n getSnapshot: () => string[];\n};\n\nexport type CarouselItem = {\n el: HTMLElement;\n value: string | null;\n};\n\nexport type UseCarouselOptions = {\n /**\n * Localizes the string used to announce carousel page changes to screen reader users\n * Defaults to: undefined\n */\n announcement?: (newValue: string) => string;\n\n /**\n * The initial page to display in uncontrolled mode.\n */\n defaultValue?: string;\n\n /**\n * The value of the currently active page.\n */\n value?: string;\n\n /**\n * Callback to notify a page change.\n */\n onValueChange?: EventHandler<CarouselValueChangeData>;\n\n /**\n * Callback to notify when the final button step of a carousel has been activated.\n */\n onFinish?: EventHandler<CarouselValueChangeData>;\n};\n\nexport type CarouselValueChangeData = EventData<'click', React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>> & {\n /**\n * The value to be set after event has occurred.\n */\n value?: string;\n};\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

View File

@@ -0,0 +1,37 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CarouselProvider: function() {
return CarouselProvider;
},
carouselContextDefaultValue: function() {
return carouselContextDefaultValue;
},
useCarouselContext_unstable: function() {
return useCarouselContext_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _reactcontextselector = require("@fluentui/react-context-selector");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _createCarouselStore = require("./createCarouselStore");
const carouselContextDefaultValue = {
store: (0, _createCarouselStore.createCarouselStore)(),
value: null,
selectPageByDirection: ()=>{
/** noop */ },
selectPageByValue: ()=>{
/** noop */ }
};
const CarouselContext = (0, _reactcontextselector.createContext)(undefined);
const CarouselProvider = CarouselContext.Provider;
const useCarouselContext_unstable = (selector)=>(0, _reactcontextselector.useContextSelector)(CarouselContext, (ctx = carouselContextDefaultValue)=>selector(ctx));

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselContext.ts"],"sourcesContent":["'use client';\n\nimport { type Context, ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport * as React from 'react';\n\nimport type { CarouselStore } from './Carousel.types';\nimport { createCarouselStore } from './createCarouselStore';\n\nexport type CarouselContextValue = {\n store: CarouselStore;\n value: string | null;\n selectPageByDirection: (\n event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>,\n direction: 'next' | 'prev',\n ) => void;\n selectPageByValue: (event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>, value: string) => void;\n};\n\nexport const carouselContextDefaultValue: CarouselContextValue = {\n store: createCarouselStore(),\n value: null,\n selectPageByDirection: () => {\n /** noop */\n },\n selectPageByValue: () => {\n /** noop */\n },\n};\n\nconst CarouselContext: Context<CarouselContextValue> = createContext<CarouselContextValue | undefined>(\n undefined,\n) as Context<CarouselContextValue>;\n\nexport const CarouselProvider = CarouselContext.Provider;\n\nexport const useCarouselContext_unstable = <T>(selector: ContextSelector<CarouselContextValue, T>): T =>\n useContextSelector(CarouselContext, (ctx = carouselContextDefaultValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","React","createCarouselStore","carouselContextDefaultValue","store","value","selectPageByDirection","selectPageByValue","CarouselContext","undefined","CarouselProvider","Provider","useCarouselContext_unstable","selector","ctx"],"mappings":"AAAA;;;;;;;;;;;;oBAiCaW;;;+BAfAP;;;+BAiBAS;;;;;sCAjCoE,mCAAmC;iEAC7F,QAAQ;qCAGK,wBAAwB;AAYrD,MAAMT,8BAAoD;IAC/DC,WAAOF,wCAAAA;IACPG,OAAO;IACPC,uBAAuB;IACrB,SAAS,GACX;IACAC,mBAAmB;IACjB,SAAS,GACX;AACF,EAAE;AAEF,MAAMC,sBAAiDT,mCAAAA,EACrDU;AAGK,MAAMC,mBAAmBF,gBAAgBG,QAAQ,CAAC;AAElD,MAAMC,8BAA8B,CAAIC,eAC7Cb,wCAAAA,EAAmBQ,iBAAiB,CAACM,MAAMX,2BAA2B,GAAKU,SAASC,MAAM"}

View File

@@ -0,0 +1,6 @@
/**
* TeachingPopoverCarousel State and Context Hooks
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/CarouselItem.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type CarouselItemSlots = {\n /**\n * The element wrapping carousel pages and navigation.\n */\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type CarouselItemProps = ComponentProps<CarouselItemSlots> & {\n /**\n * The value used to identify a page,\n * it should be unique and is necessary for pagination\n */\n value: string;\n};\n\n/**\n * TeachingPopoverCarousel State and Context Hooks\n */\nexport type CarouselItemState = ComponentState<Required<CarouselItemSlots>> & {\n visible: boolean;\n} & Pick<CarouselItemProps, 'value'>;\n"],"names":[],"mappings":"AAiBA;;CAEC,GACD,WAEqC"}

View File

@@ -0,0 +1,20 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "CarouselItem", {
enumerable: true,
get: function() {
return CarouselItem;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useCarouselItem = require("./useCarouselItem");
const _renderCarouselItem = require("./renderCarouselItem");
const CarouselItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useCarouselItem.useCarouselItem_unstable)(props, ref);
return (0, _renderCarouselItem.renderCarouselItem_unstable)(state);
});
CarouselItem.displayName = 'CarouselItem';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/Carouseltem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nimport { CarouselItemProps } from './CarouselItem.types';\nimport { useCarouselItem_unstable } from './useCarouselItem';\nimport { renderCarouselItem_unstable } from './renderCarouselItem';\n\n/**\n * Define a CarouselItem, using the `useCarouselItem_unstable` and 'renderCarouselItem_unstable' hooks.\n * It has no styling opinions.\n */\nexport const CarouselItem: ForwardRefComponent<CarouselItemProps> = React.forwardRef((props, ref) => {\n const state = useCarouselItem_unstable(props, ref);\n\n return renderCarouselItem_unstable(state);\n});\n\nCarouselItem.displayName = 'CarouselItem';\n"],"names":["React","useCarouselItem_unstable","renderCarouselItem_unstable","CarouselItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;iCAIU,oBAAoB;oCACjB,uBAAuB;AAM5D,MAAMG,eAAAA,WAAAA,GAAuDH,OAAMI,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQN,yCAAAA,EAAyBI,OAAOC;IAE9C,WAAOJ,+CAAAA,EAA4BK;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

View File

@@ -0,0 +1,16 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderCarouselItem_unstable", {
enumerable: true,
get: function() {
return renderCarouselItem_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const renderCarouselItem_unstable = (state)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/renderCarouselItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { CarouselItemState, CarouselItemSlots } from './CarouselItem.types';\n\n/**\n * Render the final JSX of TeachingPopoverCarousel\n */\nexport const renderCarouselItem_unstable = (state: CarouselItemState): JSXElement => {\n assertSlots<CarouselItemSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderCarouselItem_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAOjD,MAAMC,8BAA8B,CAACC;QAC1CF,2BAAAA,EAA+BE;IAE/B,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

View File

@@ -0,0 +1,40 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselItem_unstable", {
enumerable: true,
get: function() {
return useCarouselItem_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _CarouselContext = require("../CarouselContext");
const _constants = require("../constants");
const useCarouselItem_unstable = (props, ref)=>{
const { value } = props;
const visible = (0, _CarouselContext.useCarouselContext_unstable)((c)=>c.value === value);
const state = {
value,
visible,
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref,
[_constants.CAROUSEL_ITEM]: value,
[_constants.CAROUSEL_ACTIVE_ITEM]: visible,
hidden: !visible,
...props
}), {
elementType: 'div'
})
};
if (!visible) {
state.root.children = null;
}
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/CarouselItem/useCarouselItem.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { CarouselItemProps, CarouselItemState } from './CarouselItem.types';\nimport { useCarouselContext_unstable } from '../CarouselContext';\nimport { CAROUSEL_ACTIVE_ITEM, CAROUSEL_ITEM } from '../constants';\n\nexport const useCarouselItem_unstable = (\n props: CarouselItemProps,\n ref: React.Ref<HTMLDivElement>,\n): CarouselItemState => {\n const { value } = props;\n\n const visible = useCarouselContext_unstable(c => c.value === value);\n const state: CarouselItemState = {\n value,\n visible,\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n [CAROUSEL_ITEM]: value,\n [CAROUSEL_ACTIVE_ITEM]: visible,\n hidden: !visible,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n\n if (!visible) {\n state.root.children = null;\n }\n\n return state;\n};\n"],"names":["React","getIntrinsicElementProps","slot","useCarouselContext_unstable","CAROUSEL_ACTIVE_ITEM","CAROUSEL_ITEM","useCarouselItem_unstable","props","ref","value","visible","c","state","components","root","always","hidden","elementType","children"],"mappings":"AAAA;;;;;+BAQaM;;;;;;;iEANU,QAAQ;gCACgB,4BAA4B;iCAE/B,qBAAqB;2BACb,eAAe;AAE5D,iCAAiC,CACtCC,OACAC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGF;IAElB,MAAMG,UAAUP,gDAAAA,EAA4BQ,CAAAA,IAAKA,EAAEF,KAAK,KAAKA;IAC7D,MAAMG,QAA2B;QAC/BH;QACAC;QACAG,YAAY;YACVC,MAAM;QACR;QACAA,MAAMZ,oBAAAA,CAAKa,MAAM,KACfd,wCAAAA,EAAyB,OAAO;YAC9BO;YACA,CAACH,wBAAAA,CAAc,EAAEI;YACjB,CAACL,+BAAAA,CAAqB,EAAEM;YACxBM,QAAQ,CAACN;YACT,GAAGH,KAAK;QACV,IACA;YAAEU,aAAa;QAAM;IAEzB;IAEA,IAAI,CAACP,SAAS;QACZE,MAAME,IAAI,CAACI,QAAQ,GAAG;IACxB;IAEA,OAAON;AACT,EAAE"}

View File

@@ -0,0 +1,20 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
CAROUSEL_ACTIVE_ITEM: function() {
return CAROUSEL_ACTIVE_ITEM;
},
CAROUSEL_ITEM: function() {
return CAROUSEL_ITEM;
}
});
const CAROUSEL_ITEM = 'data-carousel-item';
const CAROUSEL_ACTIVE_ITEM = 'data-carousel-active-item';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/constants.ts"],"sourcesContent":["export const CAROUSEL_ITEM = 'data-carousel-item';\nexport const CAROUSEL_ACTIVE_ITEM = 'data-carousel-active-item';\n"],"names":["CAROUSEL_ITEM","CAROUSEL_ACTIVE_ITEM"],"mappings":";;;;;;;;;;;wBACaC;;;iBADAD;;;;AAAN,MAAMA,gBAAgB,qBAAqB;AAC3C,MAAMC,uBAAuB,4BAA4B"}

View File

@@ -0,0 +1,70 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "createCarouselStore", {
enumerable: true,
get: function() {
return createCarouselStore;
}
});
const createCarouselStore = ()=>{
let values = [];
let listeners = [];
const carouselStore = {
clear () {
values = [];
emitChange();
},
addValue (value) {
values = [
...values,
value
];
emitChange();
},
insertValue (value, prev) {
if (!prev) {
values = [
value,
...values
];
} else {
const pos = values.indexOf(prev);
values.splice(pos + 1, 0, value);
// Required to be defined as a 'new' array for useSyncExternalStore
values = [
...values
];
}
emitChange();
},
removeValue (value) {
const pos = values.indexOf(value);
values.splice(pos, 1);
// Required to be defined as a 'new' array for useSyncExternalStore
values = [
...values
];
emitChange();
},
subscribe (listener) {
listeners = [
...listeners,
listener
];
return ()=>{
listeners = listeners.filter((l)=>l !== listener);
};
},
getSnapshot () {
return values;
}
};
function emitChange() {
for (const listener of listeners){
listener();
}
}
return carouselStore;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/createCarouselStore.ts"],"sourcesContent":["import { type CarouselStore } from './Carousel.types';\n\nexport const createCarouselStore = (): CarouselStore => {\n let values: string[] = [];\n let listeners: Array<() => void> = [];\n\n const carouselStore = {\n clear() {\n values = [];\n emitChange();\n },\n addValue(value: string) {\n values = [...values, value];\n\n emitChange();\n },\n insertValue(value: string, prev: string | null) {\n if (!prev) {\n values = [value, ...values];\n } else {\n const pos = values.indexOf(prev);\n values.splice(pos + 1, 0, value);\n // Required to be defined as a 'new' array for useSyncExternalStore\n values = [...values];\n }\n emitChange();\n },\n removeValue(value: string) {\n const pos = values.indexOf(value);\n values.splice(pos, 1);\n // Required to be defined as a 'new' array for useSyncExternalStore\n values = [...values];\n emitChange();\n },\n subscribe(listener: () => void) {\n listeners = [...listeners, listener];\n\n return () => {\n listeners = listeners.filter(l => l !== listener);\n };\n },\n getSnapshot() {\n return values;\n },\n };\n\n function emitChange() {\n for (const listener of listeners) {\n listener();\n }\n }\n\n return carouselStore;\n};\n"],"names":["createCarouselStore","values","listeners","carouselStore","clear","emitChange","addValue","value","insertValue","prev","pos","indexOf","splice","removeValue","subscribe","listener","filter","l","getSnapshot"],"mappings":";;;;+BAEaA;;;;;;AAAN,4BAA4B;IACjC,IAAIC,SAAmB,EAAE;IACzB,IAAIC,YAA+B,EAAE;IAErC,MAAMC,gBAAgB;QACpBC;YACEH,SAAS,EAAE;YACXI;QACF;QACAC,UAASC,KAAa;YACpBN,SAAS;mBAAIA;gBAAQM;aAAM;YAE3BF;QACF;QACAG,aAAYD,KAAa,EAAEE,IAAmB;YAC5C,IAAI,CAACA,MAAM;gBACTR,SAAS;oBAACM;uBAAUN;iBAAO;YAC7B,OAAO;gBACL,MAAMS,MAAMT,OAAOU,OAAO,CAACF;gBAC3BR,OAAOW,MAAM,CAACF,MAAM,GAAG,GAAGH;gBAC1B,mEAAmE;gBACnEN,SAAS;uBAAIA;iBAAO;YACtB;YACAI;QACF;QACAQ,aAAYN,KAAa;YACvB,MAAMG,MAAMT,OAAOU,OAAO,CAACJ;YAC3BN,OAAOW,MAAM,CAACF,KAAK;YACnB,mEAAmE;YACnET,SAAS;mBAAIA;aAAO;YACpBI;QACF;QACAS,WAAUC,QAAoB;YAC5Bb,YAAY;mBAAIA;gBAAWa;aAAS;YAEpC,OAAO;gBACLb,YAAYA,UAAUc,MAAM,CAACC,CAAAA,IAAKA,MAAMF;YAC1C;QACF;QACAG;YACE,OAAOjB;QACT;IACF;IAEA,SAASI;QACP,KAAK,MAAMU,YAAYb,UAAW;YAChCa;QACF;IACF;IAEA,OAAOZ;AACT,EAAE"}

View File

@@ -0,0 +1,17 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselValues_unstable", {
enumerable: true,
get: function() {
return useCarouselValues_unstable;
}
});
const _shim = require("use-sync-external-store/shim");
const _CarouselContext = require("./CarouselContext");
function useCarouselValues_unstable(getSnapshot) {
const store = (0, _CarouselContext.useCarouselContext_unstable)((c)=>c.store);
return (0, _shim.useSyncExternalStore)(store.subscribe, ()=>getSnapshot(store.getSnapshot()));
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/Carousel/useCarouselValues.ts"],"sourcesContent":["'use client';\n\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport { useCarouselContext_unstable } from './CarouselContext';\nimport type { CarouselStore } from './Carousel.types';\n\nexport function useCarouselValues_unstable<T>(getSnapshot: (values: ReturnType<CarouselStore['getSnapshot']>) => T): T {\n const store = useCarouselContext_unstable(c => c.store);\n\n return useSyncExternalStore(store.subscribe, () => getSnapshot(store.getSnapshot()));\n}\n"],"names":["useSyncExternalStore","useCarouselContext_unstable","useCarouselValues_unstable","getSnapshot","store","c","subscribe"],"mappings":"AAAA;;;;;;;;;;;sBAEqC,+BAA+B;iCAExB,oBAAoB;AAGzD,SAASE,2BAA8BC,WAAoE;IAChH,MAAMC,YAAQH,4CAAAA,EAA4BI,CAAAA,IAAKA,EAAED,KAAK;IAEtD,WAAOJ,0BAAAA,EAAqBI,MAAME,SAAS,EAAE,IAAMH,YAAYC,MAAMD,WAAW;AAClF"}

View File

@@ -0,0 +1,110 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useCarouselWalker_unstable", {
enumerable: true,
get: function() {
return useCarouselWalker_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _constants = require("./constants");
const useCarouselWalker_unstable = ()=>{
const { targetDocument } = (0, _reactsharedcontexts.useFluent_unstable)();
const treeWalkerRef = _react.useRef(targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.createTreeWalker(targetDocument.body));
const htmlRef = _react.useRef(null);
const ref = _react.useCallback((el)=>{
if (!targetDocument) {
return;
}
if (!el) {
return;
}
htmlRef.current = el;
treeWalkerRef.current = targetDocument.createTreeWalker(el, NodeFilter.SHOW_ELEMENT, {
acceptNode (node) {
if (!(0, _reactutilities.isHTMLElement)(node)) {
return NodeFilter.FILTER_SKIP;
}
return node.hasAttribute(_constants.CAROUSEL_ITEM) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
}
});
}, [
targetDocument
]);
return {
ref,
walker: _react.useMemo(()=>({
active () {
if (!htmlRef.current) {
return null;
}
const activeEl = htmlRef.current.querySelector(`[${_constants.CAROUSEL_ACTIVE_ITEM}="true"]`);
if ((0, _reactutilities.isHTMLElement)(activeEl)) {
return {
el: activeEl,
value: activeEl.getAttribute(_constants.CAROUSEL_ITEM)
};
}
return null;
},
find (value) {
var _treeWalkerRef_current;
if (!((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode) || !htmlRef.current) {
return null;
}
treeWalkerRef.current.currentNode = htmlRef.current;
let nextNode = null;
while(nextNode = treeWalkerRef.current.nextNode()){
if (!(0, _reactutilities.isHTMLElement)(nextNode)) {
continue;
}
if (nextNode.getAttribute(_constants.CAROUSEL_ITEM) === value) {
return {
el: nextNode,
value: nextNode.getAttribute(_constants.CAROUSEL_ITEM)
};
}
}
return null;
},
nextPage (value) {
var _treeWalkerRef_current;
const res = this.find(value);
if (!res || !((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode)) {
return null;
}
treeWalkerRef.current.currentNode = res.el;
const next = treeWalkerRef.current.nextNode();
if ((0, _reactutilities.isHTMLElement)(next)) {
return {
el: next,
value: next.getAttribute(_constants.CAROUSEL_ITEM)
};
}
return null;
},
prevPage (value) {
var _treeWalkerRef_current;
const res = this.find(value);
if (!res || !((_treeWalkerRef_current = treeWalkerRef.current) === null || _treeWalkerRef_current === void 0 ? void 0 : _treeWalkerRef_current.currentNode)) {
return null;
}
treeWalkerRef.current.currentNode = res.el;
const next = treeWalkerRef.current.previousNode();
if ((0, _reactutilities.isHTMLElement)(next)) {
return {
el: next,
value: next.getAttribute(_constants.CAROUSEL_ITEM)
};
}
return null;
}
}), [])
};
};

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,26 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TeachingPopoverCarousel", {
enumerable: true,
get: function() {
return TeachingPopoverCarousel;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTeachingPopoverCarousel = require("./useTeachingPopoverCarousel");
const _renderTeachingPopoverCarousel = require("./renderTeachingPopoverCarousel");
const _useTeachingPopoverCarouselStylesstyles = require("./useTeachingPopoverCarouselStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const _useTeachingPopoverCarouselContextValues = require("./useTeachingPopoverCarouselContextValues");
const TeachingPopoverCarousel = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useTeachingPopoverCarousel.useTeachingPopoverCarousel_unstable)(props, ref);
(0, _useTeachingPopoverCarouselStylesstyles.useTeachingPopoverCarouselStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useTeachingPopoverCarouselStyles_unstable')(state);
const contextValues = (0, _useTeachingPopoverCarouselContextValues.useTeachingPopoverCarouselContextValues_unstable)(state);
return (0, _renderTeachingPopoverCarousel.renderTeachingPopoverCarousel_unstable)(state, contextValues);
});
TeachingPopoverCarousel.displayName = 'TeachingPopoverCarousel';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/TeachingPopoverCarousel.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nimport { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';\nimport { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';\nimport { useTeachingPopoverCarouselStyles_unstable } from './useTeachingPopoverCarouselStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport type { TeachingPopoverCarouselProps } from './TeachingPopoverCarousel.types';\nimport { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';\n\n/**\n * Define a styled TeachingPopoverCarousel, using the `useTeachingPopoverCarousel_unstable` and `useTeachingPopoverCarouselStyles_unstable`\n * hooks.\n *\n * TeachingPopoverCarousel injects context providers that are required for TeachingPopoverCarouselCard display and navigation functionality\n */\nexport const TeachingPopoverCarousel: ForwardRefComponent<TeachingPopoverCarouselProps> = React.forwardRef(\n (props, ref) => {\n const state = useTeachingPopoverCarousel_unstable(props, ref);\n\n useTeachingPopoverCarouselStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTeachingPopoverCarouselStyles_unstable')(state);\n\n const contextValues = useTeachingPopoverCarouselContextValues_unstable(state);\n\n return renderTeachingPopoverCarousel_unstable(state, contextValues);\n },\n);\n\nTeachingPopoverCarousel.displayName = 'TeachingPopoverCarousel';\n"],"names":["React","useTeachingPopoverCarousel_unstable","renderTeachingPopoverCarousel_unstable","useTeachingPopoverCarouselStyles_unstable","useCustomStyleHook_unstable","useTeachingPopoverCarouselContextValues_unstable","TeachingPopoverCarousel","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;4CAGqB,+BAA+B;+CAC5B,kCAAkC;wDAC/B,4CAA4C;qCAC1D,kCAAkC;yDAEb,4CAA4C;AAQtG,MAAMM,0BAAAA,WAAAA,GAA6EN,OAAMO,UAAU,CACxG,CAACC,OAAOC;IACN,MAAMC,YAAQT,+DAAAA,EAAoCO,OAAOC;QAEzDN,iFAAAA,EAA0CO;QAE1CN,gDAAAA,EAA4B,6CAA6CM;IAEzE,MAAMC,oBAAgBN,yFAAAA,EAAiDK;IAEvE,WAAOR,qEAAAA,EAAuCQ,OAAOC;AACvD,GACA;AAEFL,wBAAwBM,WAAW,GAAG"}

View File

@@ -0,0 +1,6 @@
/**
* Context shared between TeachingPopoverCarousel and its children components
*/ "use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/TeachingPopoverCarousel.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { type PopoverContextValue } from '@fluentui/react-popover';\n\nimport { type CarouselContextValue } from './Carousel/CarouselContext';\nimport type { UseCarouselOptions } from './Carousel/Carousel.types';\n\nexport type TeachingPopoverCarouselSlots = {\n /**\n * The element wrapping carousel pages and navigation.\n */\n root: NonNullable<Slot<'div'>>;\n};\n\n/**\n * TeachingPopoverCarousel Props\n */\nexport type TeachingPopoverCarouselProps = ComponentProps<TeachingPopoverCarouselSlots> & UseCarouselOptions;\n\n/**\n * TeachingPopoverCarousel State and Context Hooks\n */\nexport type TeachingPopoverCarouselState = ComponentState<Required<TeachingPopoverCarouselSlots>> &\n Partial<Pick<PopoverContextValue, 'appearance'>> &\n CarouselContextValue;\n\n/**\n * Context shared between TeachingPopoverCarousel and its children components\n */\nexport type TeachingPopoverCarouselContextValues = {\n carousel: CarouselContextValue;\n};\n"],"names":[],"mappings":"AAyBA;;CAEC,GACD,WAEE"}

View File

@@ -0,0 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarousel: function() {
return _TeachingPopoverCarousel.TeachingPopoverCarousel;
},
renderTeachingPopoverCarousel_unstable: function() {
return _renderTeachingPopoverCarousel.renderTeachingPopoverCarousel_unstable;
},
teachingPopoverCarouselClassNames: function() {
return _useTeachingPopoverCarouselStylesstyles.teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselContextValues_unstable: function() {
return _useTeachingPopoverCarouselContextValues.useTeachingPopoverCarouselContextValues_unstable;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return _useTeachingPopoverCarouselStylesstyles.useTeachingPopoverCarouselStyles_unstable;
},
useTeachingPopoverCarousel_unstable: function() {
return _useTeachingPopoverCarousel.useTeachingPopoverCarousel_unstable;
}
});
const _TeachingPopoverCarousel = require("./TeachingPopoverCarousel");
const _renderTeachingPopoverCarousel = require("./renderTeachingPopoverCarousel");
const _useTeachingPopoverCarousel = require("./useTeachingPopoverCarousel");
const _useTeachingPopoverCarouselStylesstyles = require("./useTeachingPopoverCarouselStyles.styles");
const _useTeachingPopoverCarouselContextValues = require("./useTeachingPopoverCarouselContextValues");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/index.ts"],"sourcesContent":["export { TeachingPopoverCarousel } from './TeachingPopoverCarousel';\nexport type {\n TeachingPopoverCarouselContextValues,\n TeachingPopoverCarouselProps,\n TeachingPopoverCarouselSlots,\n TeachingPopoverCarouselState,\n} from './TeachingPopoverCarousel.types';\nexport { renderTeachingPopoverCarousel_unstable } from './renderTeachingPopoverCarousel';\nexport { useTeachingPopoverCarousel_unstable } from './useTeachingPopoverCarousel';\nexport {\n teachingPopoverCarouselClassNames,\n useTeachingPopoverCarouselStyles_unstable,\n} from './useTeachingPopoverCarouselStyles.styles';\nexport { useTeachingPopoverCarouselContextValues_unstable } from './useTeachingPopoverCarouselContextValues';\n"],"names":["TeachingPopoverCarousel","renderTeachingPopoverCarousel_unstable","useTeachingPopoverCarousel_unstable","teachingPopoverCarouselClassNames","useTeachingPopoverCarouselStyles_unstable","useTeachingPopoverCarouselContextValues_unstable"],"mappings":";;;;;;;;;;;;eAASA,gDAAuB;;;eAOvBC,qEAAsC;;;eAG7CE,yEAAiC;;;eAG1BE,yFAAgD;;;eAFvDD,iFAAyC;;;eAHlCF,+DAAmC;;;yCARJ,4BAA4B;+CAOb,kCAAkC;4CACrC,+BAA+B;wDAI5E,4CAA4C;yDACc,4CAA4C"}

View File

@@ -0,0 +1,20 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "renderTeachingPopoverCarousel_unstable", {
enumerable: true,
get: function() {
return renderTeachingPopoverCarousel_unstable;
}
});
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
const _reactutilities = require("@fluentui/react-utilities");
const _CarouselContext = require("./Carousel/CarouselContext");
const renderTeachingPopoverCarousel_unstable = (state, contextValues)=>{
(0, _reactutilities.assertSlots)(state);
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_CarouselContext.CarouselProvider, {
value: contextValues.carousel,
children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
});
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/renderTeachingPopoverCarousel.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type {\n TeachingPopoverCarouselState,\n TeachingPopoverCarouselSlots,\n TeachingPopoverCarouselContextValues,\n} from './TeachingPopoverCarousel.types';\nimport { CarouselProvider } from './Carousel/CarouselContext';\n\n/**\n * Render the final JSX of TeachingPopoverCarousel\n */\nexport const renderTeachingPopoverCarousel_unstable = (\n state: TeachingPopoverCarouselState,\n contextValues: TeachingPopoverCarouselContextValues,\n): JSXElement => {\n assertSlots<TeachingPopoverCarouselSlots>(state);\n\n return (\n <CarouselProvider value={contextValues.carousel}>\n <state.root />\n </CarouselProvider>\n );\n};\n"],"names":["assertSlots","CarouselProvider","renderTeachingPopoverCarousel_unstable","state","contextValues","value","carousel","root"],"mappings":";;;;+BAeaE;;;;;;4BAdb,gDAAiD;gCAErB,4BAA4B;iCAOvB,6BAA6B;AAKvD,+CAA+C,CACpDC,OACAC;QAEAJ,2BAAAA,EAA0CG;IAE1C,OAAA,WAAA,OACE,eAAA,EAACF,iCAAAA,EAAAA;QAAiBI,OAAOD,cAAcE,QAAQ;kBAC7C,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}

View File

@@ -0,0 +1,45 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopoverCarousel_unstable", {
enumerable: true,
get: function() {
return useTeachingPopoverCarousel_unstable;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _reactutilities = require("@fluentui/react-utilities");
const _reactpopover = require("@fluentui/react-popover");
const _Carousel = require("./Carousel/Carousel");
const useTeachingPopoverCarousel_unstable = (props, ref)=>{
const toggleOpen = (0, _reactpopover.usePopoverContext_unstable)((c)=>c.toggleOpen);
const handleFinish = (0, _reactutilities.useEventCallback)((event, data)=>{
var _props_onFinish;
(_props_onFinish = props.onFinish) === null || _props_onFinish === void 0 ? void 0 : _props_onFinish.call(props, event, data);
toggleOpen(event);
});
const { carousel, carouselRef } = (0, _Carousel.useCarousel_unstable)({
announcement: props.announcement,
defaultValue: props.defaultValue,
value: props.value,
onValueChange: props.onValueChange,
onFinish: handleFinish
});
const appearance = (0, _reactpopover.usePopoverContext_unstable)((context)=>context.appearance);
return {
appearance,
components: {
root: 'div'
},
root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
ref: (0, _reactutilities.useMergedRefs)(ref, carouselRef),
...props
}), {
elementType: 'div'
}),
...carousel
};
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarousel.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TeachingPopoverCarouselProps, TeachingPopoverCarouselState } from './TeachingPopoverCarousel.types';\nimport { usePopoverContext_unstable } from '@fluentui/react-popover';\nimport { useCarousel_unstable } from './Carousel/Carousel';\n\nexport const useTeachingPopoverCarousel_unstable = (\n props: TeachingPopoverCarouselProps,\n ref: React.Ref<HTMLDivElement>,\n): TeachingPopoverCarouselState => {\n const toggleOpen = usePopoverContext_unstable(c => c.toggleOpen);\n const handleFinish: TeachingPopoverCarouselProps['onFinish'] = useEventCallback((event, data) => {\n props.onFinish?.(event, data);\n toggleOpen(event as React.MouseEvent<HTMLElement>);\n });\n\n const { carousel, carouselRef } = useCarousel_unstable({\n announcement: props.announcement,\n defaultValue: props.defaultValue,\n value: props.value,\n onValueChange: props.onValueChange,\n onFinish: handleFinish,\n });\n\n const appearance = usePopoverContext_unstable(context => context.appearance);\n return {\n appearance,\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, carouselRef),\n ...props,\n }),\n { elementType: 'div' },\n ),\n ...carousel,\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useEventCallback","useMergedRefs","usePopoverContext_unstable","useCarousel_unstable","useTeachingPopoverCarousel_unstable","props","ref","toggleOpen","c","handleFinish","event","data","onFinish","carousel","carouselRef","announcement","defaultValue","value","onValueChange","appearance","context","components","root","always","elementType"],"mappings":"AAAA;;;;;+BAQaO;;;;;;;iEANU,QAAQ;gCACiD,4BAA4B;8BAEjE,0BAA0B;0BAChC,sBAAsB;AAEpD,4CAA4C,CACjDC,OACAC;IAEA,MAAMC,iBAAaL,wCAAAA,EAA2BM,CAAAA,IAAKA,EAAED,UAAU;IAC/D,MAAME,eAAyDT,oCAAAA,EAAiB,CAACU,OAAOC;YACtFN;SAAAA,kBAAAA,MAAMO,QAAAA,AAAQ,MAAA,QAAdP,oBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,gBAAAA,IAAAA,CAAAA,OAAiBK,OAAOC;QACxBJ,WAAWG;IACb;IAEA,MAAM,EAAEG,QAAQ,EAAEC,WAAW,EAAE,OAAGX,8BAAAA,EAAqB;QACrDY,cAAcV,MAAMU,YAAY;QAChCC,cAAcX,MAAMW,YAAY;QAChCC,OAAOZ,MAAMY,KAAK;QAClBC,eAAeb,MAAMa,aAAa;QAClCN,UAAUH;IACZ;IAEA,MAAMU,iBAAajB,wCAAAA,EAA2BkB,CAAAA,UAAWA,QAAQD,UAAU;IAC3E,OAAO;QACLA;QACAE,YAAY;YACVC,MAAM;QACR;QACAA,MAAMvB,oBAAAA,CAAKwB,MAAM,KACfzB,wCAAAA,EAAyB,OAAO;YAC9BQ,SAAKL,6BAAAA,EAAcK,KAAKQ;YACxB,GAAGT,KAAK;QACV,IACA;YAAEmB,aAAa;QAAM;QAEvB,GAAGX,QAAQ;IACb;AACF,EAAE"}

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "useTeachingPopoverCarouselContextValues_unstable", {
enumerable: true,
get: function() {
return useTeachingPopoverCarouselContextValues_unstable;
}
});
function useTeachingPopoverCarouselContextValues_unstable(state) {
const { store, value, selectPageByValue, selectPageByDirection } = state;
const carousel = {
store,
value,
selectPageByDirection,
selectPageByValue
};
return {
carousel
};
}

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarouselContextValues.ts"],"sourcesContent":["import type {\n TeachingPopoverCarouselContextValues,\n TeachingPopoverCarouselState,\n} from './TeachingPopoverCarousel.types';\n\nexport function useTeachingPopoverCarouselContextValues_unstable(\n state: TeachingPopoverCarouselState,\n): TeachingPopoverCarouselContextValues {\n const { store, value, selectPageByValue, selectPageByDirection } = state;\n\n const carousel = {\n store,\n value,\n selectPageByDirection,\n selectPageByValue,\n };\n\n return { carousel };\n}\n"],"names":["useTeachingPopoverCarouselContextValues_unstable","state","store","value","selectPageByValue","selectPageByDirection","carousel"],"mappings":";;;;;;;;;;AAKO,SAASA,iDACdC,KAAmC;IAEnC,MAAM,EAAEC,KAAK,EAAEC,KAAK,EAAEC,iBAAiB,EAAEC,qBAAqB,EAAE,GAAGJ;IAEnE,MAAMK,WAAW;QACfJ;QACAC;QACAE;QACAD;IACF;IAEA,OAAO;QAAEE;IAAS;AACpB"}

View File

@@ -0,0 +1,33 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverCarouselClassNames: function() {
return teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return useTeachingPopoverCarouselStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverCarouselClassNames = {
root: 'fui-TeachingPopoverCarousel'
};
// Todo: Page change animation & styles
const useStyles = /*#__PURE__*/ (0, _react.__styles)({
root: {}
}, {});
const useTeachingPopoverCarouselStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["useTeachingPopoverCarouselStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nexport const teachingPopoverCarouselClassNames = {\n root: 'fui-TeachingPopoverCarousel'\n};\n// Todo: Page change animation & styles\nconst useStyles = makeStyles({\n root: {}\n});\n/** Applies style classnames to slots */ export const useTeachingPopoverCarouselStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","teachingPopoverCarouselClassNames","root","useStyles","useTeachingPopoverCarouselStyles_unstable","state","styles","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;qCAEkC;;;6CAOiD;;;;uBARtD,gBAAgB;AAClD,MAAME,oCAAoC;IAC7CC,IAAI,EAAE;AACV,CAAC;AACD,uCAAA;AACA,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAG,IAAA,EAAA,CAAA;AAAA,GAAA,CAAA,CAEjB,CAAC;AAC8C,MAAME,6CAA6CC,KAAK,IAAG;IACvG,aAAa;IACb,MAAMC,MAAM,GAAGH,SAAS,CAAC,CAAC;IAC1BE,KAAK,CAACH,IAAI,CAACK,SAAS,OAAGP,mBAAY,EAACC,iCAAiC,CAACC,IAAI,EAAEI,MAAM,CAACJ,IAAI,EAAEG,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;IAC9G,OAAOF,KAAK;AAChB,CAAC"}

View File

@@ -0,0 +1,33 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
teachingPopoverCarouselClassNames: function() {
return teachingPopoverCarouselClassNames;
},
useTeachingPopoverCarouselStyles_unstable: function() {
return useTeachingPopoverCarouselStyles_unstable;
}
});
const _react = require("@griffel/react");
const teachingPopoverCarouselClassNames = {
root: 'fui-TeachingPopoverCarousel'
};
// Todo: Page change animation & styles
const useStyles = (0, _react.makeStyles)({
root: {}
});
const useTeachingPopoverCarouselStyles_unstable = (state)=>{
'use no memo';
const styles = useStyles();
state.root.className = (0, _react.mergeClasses)(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);
return state;
};

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarousel/useTeachingPopoverCarouselStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TeachingPopoverCarouselSlots, TeachingPopoverCarouselState } from './TeachingPopoverCarousel.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const teachingPopoverCarouselClassNames: SlotClassNames<TeachingPopoverCarouselSlots> = {\n root: 'fui-TeachingPopoverCarousel',\n};\n\n// Todo: Page change animation & styles\nconst useStyles = makeStyles({\n root: {},\n});\n\n/** Applies style classnames to slots */\nexport const useTeachingPopoverCarouselStyles_unstable = (\n state: TeachingPopoverCarouselState,\n): TeachingPopoverCarouselState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(teachingPopoverCarouselClassNames.root, styles.root, state.root.className);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","teachingPopoverCarouselClassNames","root","useStyles","useTeachingPopoverCarouselStyles_unstable","state","styles","className"],"mappings":"AAAA;;;;;;;;;;;;qCAMaE;;;6CAUAG;;;;uBAd4B,iBAAiB;AAInD,MAAMH,oCAAkF;IAC7FC,MAAM;AACR,EAAE;AAEF,uCAAuC;AACvC,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BG,MAAM,CAAC;AACT;AAGO,MAAME,4CAA4C,CACvDC;IAEA;IAEA,MAAMC,SAASH;IAEfE,MAAMH,IAAI,CAACK,SAAS,OAAGP,mBAAAA,EAAaC,kCAAkCC,IAAI,EAAEI,OAAOJ,IAAI,EAAEG,MAAMH,IAAI,CAACK,SAAS;IAE7G,OAAOF;AACT,EAAE"}

View File

@@ -0,0 +1,24 @@
'use client';
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "TeachingPopoverCarouselCard", {
enumerable: true,
get: function() {
return TeachingPopoverCarouselCard;
}
});
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
const _useTeachingPopoverCarouselCard = require("./useTeachingPopoverCarouselCard");
const _renderTeachingPopoverCarouselCard = require("./renderTeachingPopoverCarouselCard");
const _useTeachingPopoverCarouselCardStylesstyles = require("./useTeachingPopoverCarouselCardStyles.styles");
const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
const TeachingPopoverCarouselCard = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
const state = (0, _useTeachingPopoverCarouselCard.useTeachingPopoverCarouselCard_unstable)(props, ref);
(0, _useTeachingPopoverCarouselCardStylesstyles.useTeachingPopoverCarouselCardStyles_unstable)(state);
(0, _reactsharedcontexts.useCustomStyleHook_unstable)('useTeachingPopoverCarouselCardStyles_unstable')(state);
return (0, _renderTeachingPopoverCarouselCard.renderTeachingPopoverCarouselCard_unstable)(state);
});
TeachingPopoverCarouselCard.displayName = 'TeachingPopoverCarouselCard';

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarouselCard/TeachingPopoverCarouselCard.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useTeachingPopoverCarouselCard_unstable } from './useTeachingPopoverCarouselCard';\nimport { renderTeachingPopoverCarouselCard_unstable } from './renderTeachingPopoverCarouselCard';\nimport type { TeachingPopoverCarouselCardProps } from './TeachingPopoverCarouselCard.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTeachingPopoverCarouselCardStyles_unstable } from './useTeachingPopoverCarouselCardStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Define a styled TeachingPopoverCarouselCard, using the `useTeachingPopoverCarouselCard_unstable` and `useTeachingPopoverCarouselCardStyles_unstable`\n * hooks.\n *\n * TeachingPopoverCarouselCard is the definition of a single page view within the carousel, they are shown one at a time and can be navigated through sequentially.\n */\nexport const TeachingPopoverCarouselCard: ForwardRefComponent<TeachingPopoverCarouselCardProps> = React.forwardRef(\n (props, ref) => {\n const state = useTeachingPopoverCarouselCard_unstable(props, ref);\n\n useTeachingPopoverCarouselCardStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTeachingPopoverCarouselCardStyles_unstable')(state);\n\n return renderTeachingPopoverCarouselCard_unstable(state);\n },\n);\n\nTeachingPopoverCarouselCard.displayName = 'TeachingPopoverCarouselCard';\n"],"names":["React","useTeachingPopoverCarouselCard_unstable","renderTeachingPopoverCarouselCard_unstable","useTeachingPopoverCarouselCardStyles_unstable","useCustomStyleHook_unstable","TeachingPopoverCarouselCard","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;;;;;;;;;;;;iEAEuB,QAAQ;gDACyB,mCAAmC;mDAChC,sCAAsC;4DAGnC,gDAAgD;qCAClE,kCAAkC;AAQvE,MAAMK,8BAAAA,WAAAA,GAAqFL,OAAMM,UAAU,CAChH,CAACC,OAAOC;IACN,MAAMC,YAAQR,uEAAAA,EAAwCM,OAAOC;QAE7DL,yFAAAA,EAA8CM;QAE9CL,gDAAAA,EAA4B,iDAAiDK;IAE7E,WAAOP,6EAAAA,EAA2CO;AACpD,GACA;AAEFJ,4BAA4BK,WAAW,GAAG"}

View File

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

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarouselCard/TeachingPopoverCarouselCard.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { CarouselItemProps } from '../TeachingPopoverCarousel/Carousel/CarouselItem/CarouselItem.types';\n\nexport type TeachingPopoverCarouselCardSlots = {\n /**\n * The element wrapping the buttons.\n */\n root: NonNullable<Slot<CarouselItemProps>>;\n};\n\nexport type TeachingPopoverCarouselCardProps = ComponentProps<TeachingPopoverCarouselCardSlots> & {\n /* Required: Passed into CarouselItem to identify pages. */\n value: string;\n};\n\nexport type TeachingPopoverCarouselCardState = ComponentState<TeachingPopoverCarouselCardSlots> &\n Required<Pick<TeachingPopoverCarouselCardProps, 'value'>>;\n"],"names":[],"mappings":""}

View File

@@ -0,0 +1,31 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _export(target, all) {
for(var name in all)Object.defineProperty(target, name, {
enumerable: true,
get: all[name]
});
}
_export(exports, {
TeachingPopoverCarouselCard: function() {
return _TeachingPopoverCarouselCard.TeachingPopoverCarouselCard;
},
renderTeachingPopoverCarouselCard_unstable: function() {
return _renderTeachingPopoverCarouselCard.renderTeachingPopoverCarouselCard_unstable;
},
teachingPopoverCarouselCardClassNames: function() {
return _useTeachingPopoverCarouselCardStylesstyles.teachingPopoverCarouselCardClassNames;
},
useTeachingPopoverCarouselCardStyles_unstable: function() {
return _useTeachingPopoverCarouselCardStylesstyles.useTeachingPopoverCarouselCardStyles_unstable;
},
useTeachingPopoverCarouselCard_unstable: function() {
return _useTeachingPopoverCarouselCard.useTeachingPopoverCarouselCard_unstable;
}
});
const _TeachingPopoverCarouselCard = require("./TeachingPopoverCarouselCard");
const _renderTeachingPopoverCarouselCard = require("./renderTeachingPopoverCarouselCard");
const _useTeachingPopoverCarouselCard = require("./useTeachingPopoverCarouselCard");
const _useTeachingPopoverCarouselCardStylesstyles = require("./useTeachingPopoverCarouselCardStyles.styles");

View File

@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/TeachingPopoverCarouselCard/index.ts"],"sourcesContent":["export { TeachingPopoverCarouselCard } from './TeachingPopoverCarouselCard';\nexport type {\n TeachingPopoverCarouselCardProps,\n TeachingPopoverCarouselCardSlots,\n TeachingPopoverCarouselCardState,\n} from './TeachingPopoverCarouselCard.types';\nexport { renderTeachingPopoverCarouselCard_unstable } from './renderTeachingPopoverCarouselCard';\nexport { useTeachingPopoverCarouselCard_unstable } from './useTeachingPopoverCarouselCard';\nexport {\n teachingPopoverCarouselCardClassNames,\n useTeachingPopoverCarouselCardStyles_unstable,\n} from './useTeachingPopoverCarouselCardStyles.styles';\n"],"names":["TeachingPopoverCarouselCard","renderTeachingPopoverCarouselCard_unstable","useTeachingPopoverCarouselCard_unstable","teachingPopoverCarouselCardClassNames","useTeachingPopoverCarouselCardStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,wDAA2B;;;eAM3BC,6EAA0C;;;eAGjDE,iFAAqC;;;eACrCC,yFAA6C;;;eAHtCF,uEAAuC;;;6CAPJ,gCAAgC;mDAMjB,sCAAsC;gDACzC,mCAAmC;4DAIpF,gDAAgD"}

Some files were not shown because too many files have changed in this diff Show More