@fluentui-copilot/react-prompt-starter 0.0.0-nightly-20251010-0406-7df7c6d1.1 → 0.0.0-nightly-20251013-0406-7c7739c8.1

package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js

@@ -0,0 +1,178 @@
+"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, {
+    promptStarterClassNames: function() {
+        return promptStarterClassNames;
+    },
+    usePromptStarterStyles_unstable: function() {
+        return usePromptStarterStyles_unstable;
+    }
+});
+const _reactcomponents = require("@fluentui/react-components");
+const _tokens = require("@fluentui-copilot/tokens");
+const promptStarterClassNames = {
+    root: 'fai-PromptStarter',
+    primaryAction: 'fai-PromptStarter__primaryAction',
+    icon: 'fai-PromptStarter__icon',
+    category: 'fai-PromptStarter__category',
+    prompt: 'fai-PromptStarter__prompt',
+    reasonMarker: 'fai-PromptStarter__reasonMarker',
+    actions: 'fai-PromptStarter__actions'
+};
+const useRootResetStyles = (0, _reactcomponents.makeResetStyles)({
+    display: 'grid',
+    gridTemplateColumns: '1fr auto',
+    gridTemplateRows: 'max-content auto',
+    minWidth: '214px',
+    // Apply styles to the primary action on hover / active states
+    '&:hover': {
+        [`& .${promptStarterClassNames.primaryAction}`]: {
+            boxShadow: _tokens.tokens.shadow16,
+            transform: 'scale(1.03)',
+            transition: `transform ${_tokens.tokens.durationNormal} ${_tokens.tokens.curveDecelerateMin}`
+        }
+    },
+    '&:active': {
+        [`& .${promptStarterClassNames.primaryAction}`]: {
+            boxShadow: _tokens.tokens.shadow8,
+            transform: 'scale(1.03)',
+            transition: `transform ${_tokens.tokens.durationNormal} ${_tokens.tokens.curveDecelerateMin}`
+        }
+    },
+    // Hide actions when not focused or hovered
+    ':not(:focus-within):not(:hover)': {
+        [`& .${promptStarterClassNames.actions}`]: {
+            clip: 'rect(0px, 0px, 0px, 0px)',
+            height: '1px',
+            margin: '-1px',
+            overflow: 'hidden',
+            padding: '0px',
+            width: '1px',
+            position: 'absolute',
+            opacity: 0
+        }
+    }
+});
+const useStyles = (0, _reactcomponents.makeStyles)({
+    primaryAction: {
+        gridRow: '1 / 3',
+        gridColumn: '1 / 3',
+        position: 'relative',
+        display: 'grid',
+        gridTemplateColumns: 'max-content 1fr',
+        gridAutoRows: 'max-content 1fr max-content',
+        borderRadius: '28px',
+        backgroundColor: _tokens.tokens.colorNeutralBackground1,
+        color: _tokens.tokens.colorNeutralForeground2,
+        fontFamily: _tokens.tokens.fontFamilyBase,
+        cursor: 'pointer',
+        outlineStyle: 'none',
+        textAlign: 'left',
+        columnGap: _tokens.tokens.spacingHorizontalMNudge,
+        rowGap: _tokens.tokens.spacingVerticalS,
+        padding: `${_tokens.tokens.spacingVerticalL} ${_tokens.tokens.spacingHorizontalL}`,
+        ..._reactcomponents.shorthands.border(_tokens.tokens.strokeWidthThin, 'solid', _tokens.tokens.colorNeutralStroke2),
+        ...(0, _reactcomponents.createFocusOutlineStyle)({
+            style: {
+                outlineRadius: '28px'
+            }
+        })
+    },
+    primaryActionHovered: {
+        boxShadow: _tokens.tokens.shadow16,
+        transform: 'scale(1.03)',
+        transition: `transform ${_tokens.tokens.durationNormal} ${_tokens.tokens.curveDecelerateMin}`
+    },
+    icon: {
+        display: 'flex',
+        alignItems: 'center',
+        minHeight: _tokens.tokens.spacingVerticalXXL,
+        gridRow: 1,
+        gridColumn: '1 / 2'
+    },
+    category: {
+        display: 'flex',
+        alignItems: 'center',
+        ..._reactcomponents.typographyStyles.body1Strong,
+        gridRow: 1,
+        gridColumn: '2 / 3'
+    },
+    actions: {
+        margin: `${_tokens.tokens.spacingVerticalL} ${_tokens.tokens.spacingHorizontalL}
+             ${_tokens.tokens.spacingVerticalNone} ${_tokens.tokens.spacingHorizontalNone}`,
+        position: 'relative',
+        gridRow: '1 / 2',
+        gridColumn: '2 / 3',
+        opacity: 1,
+        transition: `opacity ${_tokens.tokens.durationFast} ${_tokens.tokens.curveLinear}`
+    },
+    actionsWithCategory: {
+        // Add a background and gradient fade to truncate the title if applicable
+        backgroundColor: _tokens.tokens.colorNeutralBackground1,
+        boxShadow: `-12px 0 12px 0 ${_tokens.tokens.colorNeutralBackground1}`
+    },
+    prompt: {
+        ..._reactcomponents.typographyStyles.body1Strong,
+        // Truncate text after two lines.
+        display: '-webkit-box',
+        '-webkit-box-orient': 'vertical',
+        '-webkit-line-clamp': '2',
+        overflowY: 'hidden',
+        gridRow: '2',
+        gridColumn: '1 / 3'
+    },
+    promptNoReasonMarker: {
+        // Truncate text after three lines when no reason marker is present.
+        '-webkit-line-clamp': '3'
+    },
+    reasonMarker: {
+        gridRow: '3',
+        gridColumn: '1 / 3',
+        ..._reactcomponents.typographyStyles.caption2
+    }
+});
+const useSingleColumnStyles = (0, _reactcomponents.makeStyles)({
+    primaryAction: {
+        display: 'flex',
+        borderRadius: _tokens.tokens.borderRadius2XL,
+        ...(0, _reactcomponents.createFocusOutlineStyle)({
+            style: {
+                outlineRadius: _tokens.tokens.borderRadius2XL
+            }
+        })
+    },
+    prompt: {
+        ..._reactcomponents.typographyStyles.caption1Strong
+    }
+});
+const usePromptStarterStyles_unstable = (state)=>{
+    'use no memo';
+    const { isSingleColumn } = state;
+    const styles = useStyles();
+    const rootResetStyles = useRootResetStyles();
+    const singleColumnStyles = useSingleColumnStyles();
+    state.root.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.root, rootResetStyles, state.root.className);
+    state.primaryAction.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.primaryAction, styles.primaryAction, isSingleColumn && singleColumnStyles.primaryAction, state.primaryAction.className);
+    if (state.icon) {
+        state.icon.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.icon, styles.icon, state.icon.className);
+    }
+    if (state.category) {
+        state.category.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.category, styles.category, state.category.className);
+    }
+    state.prompt.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.prompt, styles.prompt, !state.reasonMarker && styles.promptNoReasonMarker, isSingleColumn && singleColumnStyles.prompt, state.prompt.className);
+    if (state.reasonMarker) {
+        state.reasonMarker.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.reasonMarker, styles.reasonMarker, state.reasonMarker.className);
+    }
+    if (state.actions) {
+        state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.actions, styles.actions, state.category && styles.actionsWithCategory, state.actions.className);
+    }
+    return state;
+};

package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n  makeStyles,\n  makeResetStyles,\n  mergeClasses,\n  shorthands,\n  typographyStyles,\n  createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n  root: 'fai-PromptStarter',\n  primaryAction: 'fai-PromptStarter__primaryAction',\n  icon: 'fai-PromptStarter__icon',\n  category: 'fai-PromptStarter__category',\n  prompt: 'fai-PromptStarter__prompt',\n  reasonMarker: 'fai-PromptStarter__reasonMarker',\n  actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n  display: 'grid',\n  gridTemplateColumns: '1fr auto',\n  gridTemplateRows: 'max-content auto',\n  minWidth: '214px',\n\n  // Apply styles to the primary action on hover / active states\n  '&:hover': {\n    [`& .${promptStarterClassNames.primaryAction}`]: {\n      boxShadow: tokens.shadow16,\n      transform: 'scale(1.03)',\n      transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n    },\n  },\n  '&:active': {\n    [`& .${promptStarterClassNames.primaryAction}`]: {\n      boxShadow: tokens.shadow8,\n      transform: 'scale(1.03)',\n      transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n    },\n  },\n\n  // Hide actions when not focused or hovered\n  ':not(:focus-within):not(:hover)': {\n    [`& .${promptStarterClassNames.actions}`]: {\n      clip: 'rect(0px, 0px, 0px, 0px)',\n      height: '1px',\n      margin: '-1px',\n      overflow: 'hidden',\n      padding: '0px',\n      width: '1px',\n      position: 'absolute',\n      opacity: 0,\n    },\n  },\n});\n\nconst useStyles = makeStyles({\n  primaryAction: {\n    gridRow: '1 / 3',\n    gridColumn: '1 / 3',\n    position: 'relative',\n    display: 'grid',\n    gridTemplateColumns: 'max-content 1fr',\n    gridAutoRows: 'max-content 1fr max-content',\n    borderRadius: '28px',\n    backgroundColor: tokens.colorNeutralBackground1,\n    color: tokens.colorNeutralForeground2,\n    fontFamily: tokens.fontFamilyBase,\n    cursor: 'pointer',\n    outlineStyle: 'none',\n    textAlign: 'left',\n    columnGap: tokens.spacingHorizontalMNudge,\n    rowGap: tokens.spacingVerticalS,\n    padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n    ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n    ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n  },\n\n  primaryActionHovered: {\n    boxShadow: tokens.shadow16,\n    transform: 'scale(1.03)',\n    transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n  },\n\n  icon: {\n    display: 'flex',\n    alignItems: 'center',\n    minHeight: tokens.spacingVerticalXXL,\n    gridRow: 1,\n    gridColumn: '1 / 2',\n  },\n  category: {\n    display: 'flex',\n    alignItems: 'center',\n    ...typographyStyles.body1Strong,\n\n    gridRow: 1,\n    gridColumn: '2 / 3',\n  },\n  actions: {\n    margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n             ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n    position: 'relative',\n    gridRow: '1 / 2',\n    gridColumn: '2 / 3',\n\n    opacity: 1,\n    transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n  },\n  actionsWithCategory: {\n    // Add a background and gradient fade to truncate the title if applicable\n    backgroundColor: tokens.colorNeutralBackground1,\n\n    boxShadow: `-12px 0 12px 0 ${tokens.colorNeutralBackground1}`,\n  },\n  prompt: {\n    ...typographyStyles.body1Strong,\n\n    // Truncate text after two lines.\n    display: '-webkit-box',\n    '-webkit-box-orient': 'vertical',\n    '-webkit-line-clamp': '2',\n    overflowY: 'hidden',\n    gridRow: '2',\n    gridColumn: '1 / 3',\n  },\n  promptNoReasonMarker: {\n    // Truncate text after three lines when no reason marker is present.\n    '-webkit-line-clamp': '3',\n  },\n  reasonMarker: {\n    gridRow: '3',\n    gridColumn: '1 / 3',\n    ...typographyStyles.caption2,\n  },\n});\n\nconst useSingleColumnStyles = makeStyles({\n  primaryAction: {\n    display: 'flex',\n    borderRadius: tokens.borderRadius2XL,\n    ...createFocusOutlineStyle({ style: { outlineRadius: tokens.borderRadius2XL } }),\n  },\n  prompt: {\n    ...typographyStyles.caption1Strong,\n  },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n  'use no memo';\n\n  const { isSingleColumn } = state;\n\n  const styles = useStyles();\n  const rootResetStyles = useRootResetStyles();\n  const singleColumnStyles = useSingleColumnStyles();\n  state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n  state.primaryAction.className = mergeClasses(\n    promptStarterClassNames.primaryAction,\n    styles.primaryAction,\n    isSingleColumn && singleColumnStyles.primaryAction,\n    state.primaryAction.className,\n  );\n  if (state.icon) {\n    state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);\n  }\n  if (state.category) {\n    state.category.className = mergeClasses(\n      promptStarterClassNames.category,\n      styles.category,\n      state.category.className,\n    );\n  }\n  state.prompt.className = mergeClasses(\n    promptStarterClassNames.prompt,\n    styles.prompt,\n    !state.reasonMarker && styles.promptNoReasonMarker,\n    isSingleColumn && singleColumnStyles.prompt,\n    state.prompt.className,\n  );\n  if (state.reasonMarker) {\n    state.reasonMarker.className = mergeClasses(\n      promptStarterClassNames.reasonMarker,\n      styles.reasonMarker,\n      state.reasonMarker.className,\n    );\n  }\n  if (state.actions) {\n    state.actions.className = mergeClasses(\n      promptStarterClassNames.actions,\n      styles.actions,\n      state.category && styles.actionsWithCategory,\n      state.actions.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["promptStarterClassNames","usePromptStarterStyles_unstable","root","primaryAction","icon","category","prompt","reasonMarker","actions","useRootResetStyles","makeResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","tokens","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","makeStyles","gridRow","gridColumn","gridAutoRows","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","columnGap","spacingHorizontalMNudge","rowGap","spacingVerticalS","spacingVerticalL","spacingHorizontalL","shorthands","border","strokeWidthThin","colorNeutralStroke2","createFocusOutlineStyle","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","typographyStyles","body1Strong","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","actionsWithCategory","overflowY","promptNoReasonMarker","caption2","useSingleColumnStyles","borderRadius2XL","caption1Strong","state","isSingleColumn","styles","rootResetStyles","singleColumnStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/PromptStarterList.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "PromptStarterList", {
+    enumerable: true,
+    get: function() {
+        return PromptStarterList;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _usePromptStarterList = require("./usePromptStarterList");
+const _renderPromptStarterList = require("./renderPromptStarterList");
+const _usePromptStarterListStylesstyles = require("./usePromptStarterListStyles.styles");
+const _usePromptStarterListContextValues = require("./usePromptStarterListContextValues");
+const PromptStarterList = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _usePromptStarterList.usePromptStarterList_unstable)(props, ref);
+    const contextValues = (0, _usePromptStarterListContextValues.usePromptStarterListContextValues)(state);
+    (0, _usePromptStarterListStylesstyles.usePromptStarterListStyles_unstable)(state);
+    return (0, _renderPromptStarterList.renderPromptStarterList_unstable)(state, contextValues);
+});
+PromptStarterList.displayName = 'PromptStarterList';

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/PromptStarterList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptStarterList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePromptStarterList_unstable } from './usePromptStarterList';\nimport { renderPromptStarterList_unstable } from './renderPromptStarterList';\nimport { usePromptStarterListStyles_unstable } from './usePromptStarterListStyles.styles';\nimport type { PromptStarterListProps } from './PromptStarterList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { usePromptStarterListContextValues } from './usePromptStarterListContextValues';\n\nexport const PromptStarterList: ForwardRefComponent<PromptStarterListProps> = React.forwardRef((props, ref) => {\n  const state = usePromptStarterList_unstable(props, ref);\n  const contextValues = usePromptStarterListContextValues(state);\n\n  usePromptStarterListStyles_unstable(state);\n  return renderPromptStarterList_unstable(state, contextValues);\n});\n\nPromptStarterList.displayName = 'PromptStarterList';\n"],"names":["PromptStarterList","React","forwardRef","props","ref","state","usePromptStarterList_unstable","contextValues","usePromptStarterListContextValues","usePromptStarterListStyles_unstable","renderPromptStarterList_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;sCACuB;yCACG;kDACG;mDAGF;AAE3C,MAAMA,oBAAAA,WAAAA,GAAiEC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACrG,MAAMC,QAAQC,IAAAA,mDAAAA,EAA8BH,OAAOC;IACnD,MAAMG,gBAAgBC,IAAAA,oEAAAA,EAAkCH;IAExDI,IAAAA,qEAAAA,EAAoCJ;IACpC,OAAOK,IAAAA,yDAAAA,EAAiCL,OAAOE;AACjD;AAEAP,kBAAkBW,WAAW,GAAG"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/PromptStarterList.types.js

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

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/PromptStarterList.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptStarterList.types.ts"],"sourcesContent":["import type { DesignVersion } from '@fluentui-copilot/react-provider';\nimport type {\n  ComponentProps,\n  ComponentState,\n  Slot,\n  Button,\n  UseArrowNavigationGroupOptions,\n} from '@fluentui/react-components';\n\nexport type PromptStarterListSlots = {\n  root: NonNullable<Slot<'div'>>;\n  gridWrapper: NonNullable<Slot<'div'>>;\n  actions?: Slot<'span'>;\n  expandButton?: Slot<typeof Button>;\n};\n\n/**\n * PromptStarterList Props\n */\nexport type PromptStarterListProps = ComponentProps<Partial<PromptStarterListSlots>, 'gridWrapper'> &\n  DesignVersion & {\n    /**\n     * Text for the expand button when the list is collapsed.\n     *\n     * default: \"Show more\"\n     */\n    expandButtonLabel?: string;\n    /**\n     * Text for the expand button when the list is expanded.\n     *\n     * default: \"Show less\"\n     */\n    collapseButtonLabel?: string;\n    /**\n     * Arrow navigation options. This can be used to customize Tabster's direction,\n     * tab behavior, and memoization options.\n     *\n     * default: {  axis: 'horizontal', memorizeCurrent: true }\n     */\n    arrowNavigationOptions?: UseArrowNavigationGroupOptions;\n\n    /**\n     * Whether to animate the entrance of its items when it first mounts.\n     *\n     * @default true\n     */\n    animateOnMount?: boolean;\n  };\n\n/**\n * State used in rendering PromptStarterList\n */\nexport type PromptStarterListState = ComponentState<PromptStarterListSlots> &\n  Required<Pick<PromptStarterListProps, 'designVersion'>> & {\n    numberOfColumns: number;\n    isExpanded?: boolean;\n  };\n\nexport type PromptStarterListContextValue = Pick<PromptStarterListState, 'numberOfColumns' | 'isExpanded'>;\n"],"names":[],"rangeMappings":"","mappings":""}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/index.js

@@ -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, {
+    PromptStarterList: function() {
+        return _PromptStarterList.PromptStarterList;
+    },
+    promptStarterListClassNames: function() {
+        return _usePromptStarterListStylesstyles.promptStarterListClassNames;
+    },
+    renderPromptStarterList_unstable: function() {
+        return _renderPromptStarterList.renderPromptStarterList_unstable;
+    },
+    usePromptStarterListStyles_unstable: function() {
+        return _usePromptStarterListStylesstyles.usePromptStarterListStyles_unstable;
+    },
+    usePromptStarterList_unstable: function() {
+        return _usePromptStarterList.usePromptStarterList_unstable;
+    }
+});
+const _PromptStarterList = require("./PromptStarterList");
+const _renderPromptStarterList = require("./renderPromptStarterList");
+const _usePromptStarterList = require("./usePromptStarterList");
+const _usePromptStarterListStylesstyles = require("./usePromptStarterListStyles.styles");

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export { PromptStarterList } from './PromptStarterList';\nexport type {\n  PromptStarterListProps,\n  PromptStarterListSlots,\n  PromptStarterListState,\n  PromptStarterListContextValue,\n} from './PromptStarterList.types';\nexport { renderPromptStarterList_unstable } from './renderPromptStarterList';\nexport { usePromptStarterList_unstable } from './usePromptStarterList';\nexport { promptStarterListClassNames, usePromptStarterListStyles_unstable } from './usePromptStarterListStyles.styles';\n"],"names":["PromptStarterList","promptStarterListClassNames","renderPromptStarterList_unstable","usePromptStarterListStyles_unstable","usePromptStarterList_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,iBAAiB;eAAjBA,oCAAiB;;IASjBC,2BAA2B;eAA3BA,6DAA2B;;IAF3BC,gCAAgC;eAAhCA,yDAAgC;;IAEHC,mCAAmC;eAAnCA,qEAAmC;;IADhEC,6BAA6B;eAA7BA,mDAA6B;;;mCARJ;yCAOe;sCACH;kDACmC"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/renderPromptStarterList.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderPromptStarterList_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderPromptStarterList_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactcomponents = require("@fluentui/react-components");
+const _PromptStarterListContext = require("../../../contexts/PromptStarterListContext");
+const renderPromptStarterList_unstable = (state, contextValue)=>{
+    (0, _reactcomponents.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_PromptStarterListContext.PromptStarterListProvider, {
+        value: contextValue,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactcomponents.PresenceGroup, {
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.gridWrapper, {
+                        children: state.root.children
+                    })
+                }),
+                state.actions && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.actions, {}),
+                state.expandButton && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.expandButton, {})
+            ]
+        })
+    });
+};

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/renderPromptStarterList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderPromptStarterList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots, PresenceGroup } from '@fluentui/react-components';\nimport type { JSXElement } from '@fluentui/react-components';\nimport { PromptStarterListProvider } from '../../../contexts/PromptStarterListContext';\nimport type {\n  PromptStarterListState,\n  PromptStarterListSlots,\n  PromptStarterListContextValue,\n} from './PromptStarterList.types';\n\n/**\n * Render the final JSX of PromptStarterList\n */\nexport const renderPromptStarterList_unstable = (\n  state: PromptStarterListState,\n  contextValue: PromptStarterListContextValue,\n): JSXElement => {\n  assertSlots<PromptStarterListSlots>(state);\n\n  return (\n    <PromptStarterListProvider value={contextValue}>\n      <state.root>\n        <PresenceGroup>\n          <state.gridWrapper>{state.root.children}</state.gridWrapper>\n        </PresenceGroup>\n        {state.actions && <state.actions />}\n        {state.expandButton && <state.expandButton />}\n      </state.root>\n    </PromptStarterListProvider>\n  );\n};\n"],"names":["renderPromptStarterList_unstable","state","contextValue","assertSlots","_jsx","PromptStarterListProvider","value","_jsxs","root","PresenceGroup","gridWrapper","children","actions","expandButton"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAeaA;;;eAAAA;;;4BAdb;iCAE2C;0CAED;AAUnC,MAAMA,mCAAmC,CAC9CC,OACAC;IAEAC,IAAAA,4BAAAA,EAAoCF;IAEpC,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACC,mDAAAA,EAAAA;QAA0BC,OAAOJ;kBAChC,WAAA,GAAAK,IAAAA,gBAAA,EAACN,MAAMO,IAAI,EAAA;;8BACTJ,IAAAA,eAAA,EAACK,8BAAAA,EAAAA;8BACC,WAAA,GAAAL,IAAAA,eAAA,EAACH,MAAMS,WAAW,EAAA;kCAAET,MAAMO,IAAI,CAACG,QAAQ;;;gBAExCV,MAAMW,OAAO,IAAA,WAAA,GAAIR,IAAAA,eAAA,EAACH,MAAMW,OAAO,EAAA,CAAA;gBAC/BX,MAAMY,YAAY,IAAA,WAAA,GAAIT,IAAAA,eAAA,EAACH,MAAMY,YAAY,EAAA,CAAA;;;;AAIlD"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterList.js

@@ -0,0 +1,120 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "usePromptStarterList_unstable", {
+    enumerable: true,
+    get: function() {
+        return usePromptStarterList_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactcomponents = require("@fluentui/react-components");
+const _reactprovider = require("@fluentui-copilot/react-provider");
+const _reacticons = require("@fluentui/react-icons");
+const _promptStarterMotion = require("../PromptStarter/promptStarterMotion");
+const usePromptStarterList_unstable = (props, ref)=>{
+    const { arrowNavigationOptions, expandButtonLabel = 'Show more', collapseButtonLabel = 'Show less', animateOnMount = true } = props;
+    const designVersion = (0, _reactprovider.useDesignVersion)(props.designVersion);
+    var _arrowNavigationOptions_axis, _arrowNavigationOptions_memorizeCurrent;
+    const focusAttrs = (0, _reactcomponents.useArrowNavigationGroup)({
+        ...arrowNavigationOptions,
+        axis: (_arrowNavigationOptions_axis = arrowNavigationOptions === null || arrowNavigationOptions === void 0 ? void 0 : arrowNavigationOptions.axis) !== null && _arrowNavigationOptions_axis !== void 0 ? _arrowNavigationOptions_axis : 'both',
+        memorizeCurrent: (_arrowNavigationOptions_memorizeCurrent = arrowNavigationOptions === null || arrowNavigationOptions === void 0 ? void 0 : arrowNavigationOptions.memorizeCurrent) !== null && _arrowNavigationOptions_memorizeCurrent !== void 0 ? _arrowNavigationOptions_memorizeCurrent : true
+    });
+    const [isExpanded, setIsExpanded] = _react.useState(false);
+    const [numberOfColumns, setNumberOfColumns] = _react.useState(3);
+    const gridWrapperRef = _react.useRef(null);
+    const { targetDocument } = (0, _reactcomponents.useFluent)();
+    const win = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.defaultView;
+    _react.useEffect(()=>{
+        if (!win || !gridWrapperRef.current) return;
+        const promptStarterGrid = gridWrapperRef.current;
+        const updateNumberOfColumns = ()=>{
+            const numColumns = win.getComputedStyle(promptStarterGrid).gridTemplateColumns.split(' ').length;
+            setNumberOfColumns(numColumns);
+        };
+        const ro = new win.ResizeObserver(updateNumberOfColumns);
+        ro.observe(promptStarterGrid);
+        return ()=>{
+            ro.unobserve(promptStarterGrid);
+        };
+    }, [
+        win
+    ]);
+    const state = {
+        numberOfColumns: numberOfColumns,
+        isExpanded,
+        designVersion,
+        components: {
+            root: 'div',
+            gridWrapper: 'div',
+            actions: 'span',
+            expandButton: _reactcomponents.Button
+        },
+        root: _reactcomponents.slot.always((0, _reactcomponents.getIntrinsicElementProps)('div', {
+            ref,
+            ...props
+        }), {
+            elementType: 'div'
+        }),
+        gridWrapper: _reactcomponents.slot.always(props.gridWrapper, {
+            defaultProps: {
+                role: 'list',
+                ...focusAttrs
+            },
+            elementType: 'div'
+        }),
+        actions: _reactcomponents.slot.optional(props.actions, {
+            elementType: 'span'
+        }),
+        expandButton: _reactcomponents.slot.optional(props.expandButton, {
+            defaultProps: {
+                appearance: 'subtle',
+                size: 'small',
+                shape: 'rounded',
+                icon: /*#__PURE__*/ _react.createElement(_reacticons.ChevronDown12Regular, null),
+                iconPosition: 'after',
+                'aria-expanded': isExpanded,
+                children: isExpanded ? collapseButtonLabel : expandButtonLabel
+            },
+            renderByDefault: true,
+            elementType: _reactcomponents.Button
+        })
+    };
+    state.gridWrapper.ref = (0, _reactcomponents.useMergedRefs)(gridWrapperRef, state.gridWrapper.ref);
+    // Get the array of children.
+    const childrenArray = _react.useMemo(()=>{
+        return _react.Children.toArray(state.root.children);
+    }, [
+        state.root.children
+    ]);
+    // Add motion to the children.
+    const childrenWithMotion = _react.useMemo(()=>childrenArray.map((child, index)=>{
+            // Throw error if the child is not a valid React element or is a Fragment.
+            if (!/*#__PURE__*/ _react.isValidElement(child) || child.type === _react.Fragment) {
+                throw new Error('You should only use PromptStarter components as the children of PromptStarterList.');
+            }
+            // In the collapsed state, if there is one column, we show three children.
+            // If there are two or three columns, we show two or three. All children
+            // are shown in the expanded state.
+            const visibility = numberOfColumns === 1 && index < 3 || index < numberOfColumns || isExpanded;
+            return /*#__PURE__*/ _react.createElement(_promptStarterMotion.PromptStarterMotion, {
+                appear: animateOnMount,
+                key: index,
+                index: index,
+                visible: visibility,
+                numberOfColumns: numberOfColumns
+            }, child);
+        }), [
+        childrenArray,
+        numberOfColumns,
+        isExpanded
+    ]);
+    state.root.children = childrenWithMotion;
+    if (state.expandButton) {
+        state.expandButton.onClick = (0, _reactcomponents.mergeCallbacks)(state.expandButton.onClick, ()=>setIsExpanded(!isExpanded));
+    }
+    return state;
+};

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptStarterList.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  Button,\n  useArrowNavigationGroup,\n  mergeCallbacks,\n  useFluent,\n  useMergedRefs,\n} from '@fluentui/react-components';\nimport type { PromptStarterListProps, PromptStarterListState } from './PromptStarterList.types';\nimport { useDesignVersion } from '@fluentui-copilot/react-provider';\nimport { ChevronDown12Regular } from '@fluentui/react-icons';\nimport { PromptStarterMotion } from '../PromptStarter/promptStarterMotion';\n\n/**\n * Create the state required to render PromptStarterList.\n *\n * The returned state can be modified with hooks such as usePromptStarterListStyles_unstable,\n * before being passed to renderPromptStarterList_unstable.\n *\n * @param props - props from this instance of PromptStarterList\n * @param ref - reference to root HTMLElement of PromptStarterList\n */\nexport const usePromptStarterList_unstable = (\n  props: PromptStarterListProps,\n  ref: React.Ref<HTMLDivElement>,\n): PromptStarterListState => {\n  const {\n    arrowNavigationOptions,\n    expandButtonLabel = 'Show more',\n    collapseButtonLabel = 'Show less',\n    animateOnMount = true,\n  } = props;\n  const designVersion = useDesignVersion(props.designVersion);\n  const focusAttrs = useArrowNavigationGroup({\n    ...arrowNavigationOptions,\n    axis: arrowNavigationOptions?.axis ?? 'both',\n    memorizeCurrent: arrowNavigationOptions?.memorizeCurrent ?? true,\n  });\n\n  const [isExpanded, setIsExpanded] = React.useState(false);\n  const [numberOfColumns, setNumberOfColumns] = React.useState<number>(3);\n\n  const gridWrapperRef = React.useRef<HTMLDivElement>(null);\n  const { targetDocument } = useFluent();\n  const win = targetDocument?.defaultView;\n\n  React.useEffect(() => {\n    if (!win || !gridWrapperRef.current) return;\n\n    const promptStarterGrid = gridWrapperRef.current;\n\n    const updateNumberOfColumns = () => {\n      const numColumns = win.getComputedStyle(promptStarterGrid).gridTemplateColumns.split(' ').length;\n      setNumberOfColumns(numColumns);\n    };\n\n    const ro = new win.ResizeObserver(updateNumberOfColumns);\n    ro.observe(promptStarterGrid);\n\n    return () => {\n      ro.unobserve(promptStarterGrid);\n    };\n  }, [win]);\n\n  const state: PromptStarterListState = {\n    numberOfColumns: numberOfColumns,\n    isExpanded,\n    designVersion,\n    components: {\n      root: 'div',\n      gridWrapper: 'div',\n      actions: 'span',\n      expandButton: Button,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    gridWrapper: slot.always(props.gridWrapper, {\n      defaultProps: {\n        role: 'list',\n        ...focusAttrs,\n      },\n      elementType: 'div',\n    }),\n    actions: slot.optional(props.actions, {\n      elementType: 'span',\n    }),\n    expandButton: slot.optional(props.expandButton, {\n      defaultProps: {\n        appearance: 'subtle',\n        size: 'small',\n        shape: 'rounded',\n        icon: <ChevronDown12Regular />,\n        iconPosition: 'after',\n        'aria-expanded': isExpanded,\n        children: isExpanded ? collapseButtonLabel : expandButtonLabel,\n      },\n      renderByDefault: true,\n      elementType: Button,\n    }),\n  };\n\n  state.gridWrapper.ref = useMergedRefs(gridWrapperRef, state.gridWrapper.ref);\n\n  // Get the array of children.\n  const childrenArray = React.useMemo<\n    (React.ReactElement<any> | number | string | Iterable<React.ReactNode> | React.ReactPortal)[]\n  >(() => {\n    return React.Children.toArray(state.root.children);\n  }, [state.root.children]);\n\n  // Add motion to the children.\n  const childrenWithMotion = React.useMemo(\n    () =>\n      childrenArray.map((child, index) => {\n        // Throw error if the child is not a valid React element or is a Fragment.\n        if (!React.isValidElement(child) || child.type === React.Fragment) {\n          throw new Error('You should only use PromptStarter components as the children of PromptStarterList.');\n        }\n\n        // In the collapsed state, if there is one column, we show three children.\n        // If there are two or three columns, we show two or three. All children\n        // are shown in the expanded state.\n        const visibility = (numberOfColumns === 1 && index < 3) || index < numberOfColumns || isExpanded;\n\n        return (\n          <PromptStarterMotion\n            appear={animateOnMount}\n            key={index}\n            index={index}\n            visible={visibility}\n            numberOfColumns={numberOfColumns}\n          >\n            {child}\n          </PromptStarterMotion>\n        );\n      }),\n    [childrenArray, numberOfColumns, isExpanded],\n  );\n\n  state.root.children = childrenWithMotion;\n\n  if (state.expandButton) {\n    state.expandButton.onClick = mergeCallbacks(\n      state.expandButton.onClick as React.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement>,\n      () => setIsExpanded(!isExpanded),\n    );\n  }\n\n  return state;\n};\n"],"names":["usePromptStarterList_unstable","props","ref","arrowNavigationOptions","expandButtonLabel","collapseButtonLabel","animateOnMount","designVersion","useDesignVersion","focusAttrs","useArrowNavigationGroup","axis","memorizeCurrent","isExpanded","setIsExpanded","React","useState","numberOfColumns","setNumberOfColumns","gridWrapperRef","useRef","targetDocument","useFluent","win","defaultView","useEffect","current","promptStarterGrid","updateNumberOfColumns","numColumns","getComputedStyle","gridTemplateColumns","split","length","ro","ResizeObserver","observe","unobserve","state","components","root","gridWrapper","actions","expandButton","Button","slot","always","getIntrinsicElementProps","elementType","defaultProps","role","optional","appearance","size","shape","icon","createElement","ChevronDown12Regular","iconPosition","children","renderByDefault","useMergedRefs","childrenArray","useMemo","Children","toArray","childrenWithMotion","map","child","index","isValidElement","type","Fragment","Error","visibility","PromptStarterMotion","appear","key","visible","onClick","mergeCallbacks"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterListContextValues.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "usePromptStarterListContextValues", {
+    enumerable: true,
+    get: function() {
+        return usePromptStarterListContextValues;
+    }
+});
+function usePromptStarterListContextValues(state) {
+    const { numberOfColumns } = state;
+    return {
+        numberOfColumns
+    };
+}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterListContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptStarterListContextValues.ts"],"sourcesContent":["import type { PromptStarterListContextValue, PromptStarterListState } from './PromptStarterList.types';\n\nexport function usePromptStarterListContextValues(state: PromptStarterListState): PromptStarterListContextValue {\n  const { numberOfColumns } = state;\n\n  return {\n    numberOfColumns,\n  };\n}\n"],"names":["usePromptStarterListContextValues","state","numberOfColumns"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":";;;;+BAEgBA;;;eAAAA;;;AAAT,SAASA,kCAAkCC,KAA6B;IAC7E,MAAM,EAAEC,eAAe,EAAE,GAAGD;IAE5B,OAAO;QACLC;IACF;AACF"}

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterListStyles.styles.js

@@ -0,0 +1,126 @@
+"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, {
+    promptStarterListClassNames: function() {
+        return promptStarterListClassNames;
+    },
+    usePromptStarterListStyles_unstable: function() {
+        return usePromptStarterListStyles_unstable;
+    }
+});
+const _reactcomponents = require("@fluentui/react-components");
+const promptStarterListClassNames = {
+    root: 'fai-PromptStarterList',
+    gridWrapper: 'fai-PromptStarterList__gridWrapper',
+    actions: 'fai-PromptStarterList__actions',
+    expandButton: 'fai-PromptStarterList__expandButton'
+};
+/**
+ * Styles for the root slot
+ */ const useRootClassName = (0, _reactcomponents.__resetStyles)("r1svwxtk", null, [
+    ".r1svwxtk{display:grid;grid-template-columns:1fr max-content max-content;grid-template-rows:max-content max-content;grid-template-areas:\"grid grid grid\" \". actions expandButton\";max-width:772px;row-gap:var(--spacingVerticalXL);column-gap:var(--spacingHorizontalSNudge);}"
+]);
+const useStyles = (0, _reactcomponents.__styles)({
+    gridWrapper: {
+        Bw0ie65: 0,
+        Br312pm: 0,
+        nk6f5a: 0,
+        Ijaq50: 0,
+        Bq1tomu: "fl4njfv",
+        mc9l5x: "f13qh94s",
+        i8kkvl: 0,
+        Belr9w4: 0,
+        rmohyg: "f1p93rwu",
+        t4k1zu: "f4wu0r3",
+        Budl1dq: "fvo7o13",
+        Bxotwcr: "f1nkeedh"
+    },
+    actions: {
+        Bw0ie65: 0,
+        Br312pm: 0,
+        nk6f5a: 0,
+        Ijaq50: 0,
+        Bq1tomu: "fceb517"
+    },
+    expandButton: {
+        Bw0ie65: 0,
+        Br312pm: 0,
+        nk6f5a: 0,
+        Ijaq50: 0,
+        Bq1tomu: "f1najgz0",
+        wrk2wx: "f11k2d1d",
+        dutsh0: "f1iwh30k",
+        B4u5nao: "fn63aq9",
+        Bbdnnc7: "fm7zj7h",
+        x3br3k: "fuzcl37"
+    },
+    expandButtonExpanded: {
+        Bs9jjb3: [
+            "f5l68jj",
+            "f1i29bk4"
+        ]
+    }
+}, {
+    d: [
+        [
+            ".fl4njfv{grid-area:grid;}",
+            {
+                p: -1
+            }
+        ],
+        ".f13qh94s{display:grid;}",
+        [
+            ".f1p93rwu{gap:var(--spacingHorizontalL);}",
+            {
+                p: -1
+            }
+        ],
+        ".f4wu0r3{grid-auto-columns:max-content;}",
+        ".fvo7o13{grid-template-columns:repeat(auto-fit, minmax(214px, 1fr));}",
+        ".f1nkeedh{grid-auto-flow:unset;}",
+        [
+            ".fceb517{grid-area:actions;}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1najgz0{grid-area:expandButton;}",
+            {
+                p: -1
+            }
+        ],
+        ".f11k2d1d .fui-Button__icon{font-size:12px;}",
+        ".f1iwh30k .fui-Button__icon{height:12px;}",
+        ".fn63aq9 .fui-Button__icon{width:12px;}",
+        ".f5l68jj>.fui-Button__icon{transform:rotate(180deg);}",
+        ".f1i29bk4>.fui-Button__icon{transform:rotate(-180deg);}"
+    ],
+    h: [
+        ".fm7zj7h:hover .fui-Button__icon{color:var(--colorNeutralForeground2Hover);}",
+        ".fuzcl37:hover:active .fui-Button__icon{color:var(--colorNeutralForeground2Pressed);}"
+    ]
+});
+const usePromptStarterListStyles_unstable = (state)=>{
+    'use no memo';
+    const { isExpanded } = state;
+    const rootClassName = useRootClassName();
+    const styles = useStyles();
+    state.root.className = (0, _reactcomponents.mergeClasses)(promptStarterListClassNames.root, rootClassName, state.root.className);
+    state.gridWrapper.className = (0, _reactcomponents.mergeClasses)(promptStarterListClassNames.gridWrapper, styles.gridWrapper, state.gridWrapper.className);
+    if (state.actions) {
+        state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterListClassNames.actions, styles.actions, state.actions.className);
+    }
+    if (state.expandButton) {
+        state.expandButton.className = (0, _reactcomponents.mergeClasses)(promptStarterListClassNames.expandButton, styles.expandButton, isExpanded && styles.expandButtonExpanded, state.expandButton.className);
+    }
+    return state;
+}; //# sourceMappingURL=usePromptStarterListStyles.styles.js.map

package/lib-commonjs/components/PromptStarterV2/PromptStarterList/usePromptStarterListStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptStarterListStyles.styles.ts"],"sourcesContent":["import { buttonClassNames, makeResetStyles, makeStyles, mergeClasses } from '@fluentui/react-components';\nimport type { PromptStarterListSlots, PromptStarterListState } from './PromptStarterList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\n\nexport const promptStarterListClassNames: SlotClassNames<PromptStarterListSlots> = {\n  root: 'fai-PromptStarterList',\n  gridWrapper: 'fai-PromptStarterList__gridWrapper',\n  actions: 'fai-PromptStarterList__actions',\n  expandButton: 'fai-PromptStarterList__expandButton',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n  display: 'grid',\n  gridTemplateColumns: '1fr max-content max-content',\n  gridTemplateRows: 'max-content max-content',\n  gridTemplateAreas: `\"grid grid grid\"\n                      \". actions expandButton\"`,\n  maxWidth: '772px',\n  rowGap: tokens.spacingVerticalXL,\n  columnGap: tokens.spacingHorizontalSNudge,\n});\n\nconst useStyles = makeStyles({\n  gridWrapper: {\n    gridArea: 'grid',\n    display: 'grid',\n    gap: tokens.spacingHorizontalL,\n    gridAutoColumns: 'max-content',\n\n    gridTemplateColumns: `repeat(auto-fit, minmax(214px, 1fr))`,\n    gridAutoFlow: 'unset',\n  },\n\n  actions: {\n    gridArea: 'actions',\n  },\n\n  expandButton: {\n    gridArea: 'expandButton',\n    [`& .${buttonClassNames.icon}`]: {\n      fontSize: '12px',\n      height: '12px',\n      width: '12px',\n    },\n    ':hover': {\n      [`& .${buttonClassNames.icon}`]: {\n        color: tokens.colorNeutralForeground2Hover,\n      },\n    },\n    ':hover:active': {\n      [`& .${buttonClassNames.icon}`]: {\n        color: tokens.colorNeutralForeground2Pressed,\n      },\n    },\n  },\n\n  expandButtonExpanded: {\n    [`& > .${buttonClassNames.icon}`]: {\n      transform: 'rotate(180deg)',\n    },\n  },\n});\n\n/**\n * Apply styling to the PromptStarterList slots based on the state\n */\nexport const usePromptStarterListStyles_unstable = (state: PromptStarterListState): PromptStarterListState => {\n  'use no memo';\n\n  const { isExpanded } = state;\n\n  const rootClassName = useRootClassName();\n  const styles = useStyles();\n  state.root.className = mergeClasses(promptStarterListClassNames.root, rootClassName, state.root.className);\n  state.gridWrapper.className = mergeClasses(\n    promptStarterListClassNames.gridWrapper,\n    styles.gridWrapper,\n    state.gridWrapper.className,\n  );\n  if (state.actions) {\n    state.actions.className = mergeClasses(\n      promptStarterListClassNames.actions,\n      styles.actions,\n      state.actions.className,\n    );\n  }\n  if (state.expandButton) {\n    state.expandButton.className = mergeClasses(\n      promptStarterListClassNames.expandButton,\n      styles.expandButton,\n      isExpanded && styles.expandButtonExpanded,\n      state.expandButton.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["promptStarterListClassNames","gridWrapper","root","actions","expandButton","display","__resetStyles","gridTemplateColumns","gridTemplateRows","gridTemplateAreas","maxWidth","rowGap","tokens","columnGap","mc9l5x","i8kkvl","useStyles","gridArea","gridAutoColumns","gridAutoFlow","Bw0ie65","Ijaq50","buttonClassNames","fontSize","height","width","expandButtonExpanded","p","usePromptStarterListStyles_unstable","state","isExpanded","rootClassName","useRootClassName","styles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,2BAAAA;eAAAA;;IAyELC,mCACJD;eADIC;;;iCA9E4D;AAK7D,MAAMD,8BAAsE;UACjFE;iBACAD;aACAE;kBACAC;AACF;AAEA;;CAEC,SAECC,mBAASC,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MACTC,YAAAA,IAAAA,yBAAqB,EAAA;iBACrBC;QACAC,SAAAA;;QAEAC,QAAAA;QACAC,QAAQC;QACRC,SAAAA;QACFC,QAAA;QAEAC,QAAMC;QACJf,SAAAA;gBACEgB;gBACAZ;iBACKO;iBACLM;;aAGAC;QACFC,SAAA;QAEAjB,SAAS;gBACPc;QACFI,QAAA;QAEAjB,SAAAA;;kBAESkB;iBACLC;iBACAC;gBACAC;gBACF;iBACA;gBACE;;iBAEA;iBACF;gBACA;;0BAEWb;iBACT;YAAA;YAAA;SAAA;;;OAIJc;QAAAA;YAAAA;YAAsB;oBACpB;;;;QACa;YAAA;YAAA;oBACb;;SACF;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBACFC,GAAA,CAAA;YAEA;SAAA;QAAA;YAAA;YAAA;;YAEC;SACD;QAAA;QAAaC;QAAuCC;QAAAA;QAAAA;KAAAA;OAClD;QAAA;QAAA;KAAA;;AAOAA,MAAM5B,sCACJD,CAAAA;;UAUF,EACA8B,UAAU1B;UAOV2B,gBAAAC;UAEAC,SAAOJ;IACPA,MAAA3B,IAAA,CAAAgC,SAAA,GAAAC,IAAAA,6BAAA,EAAAnC,4BAAAE,IAAA,EAAA6B,eAAAF,MAAA3B,IAAA,CAAAgC,SAAA"}