Initial commit

This commit is contained in:
2025-03-07 19:22:02 +01:00
commit 4a98255d83
55743 changed files with 5280367 additions and 0 deletions
+1
View File
@@ -0,0 +1 @@
export { Toolbar, renderToolbar_unstable, toolbarClassNames, useToolbarStyles_unstable, useToolbar_unstable } from './components/Toolbar/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/Toolbar.ts"],"sourcesContent":["export type {\n ToggableHandler,\n ToolbarCheckedValueChangeData,\n ToolbarCheckedValueChangeEvent,\n ToolbarContextValue,\n ToolbarContextValues,\n ToolbarProps,\n ToolbarSlots,\n ToolbarState,\n UninitializedToolbarState,\n} from './components/Toolbar/index';\nexport {\n Toolbar,\n renderToolbar_unstable,\n toolbarClassNames,\n useToolbarStyles_unstable,\n useToolbar_unstable,\n} from './components/Toolbar/index';\n"],"names":["Toolbar","renderToolbar_unstable","toolbarClassNames","useToolbarStyles_unstable","useToolbar_unstable"],"rangeMappings":"","mappings":"AAWA,SACEA,OAAO,EACPC,sBAAsB,EACtBC,iBAAiB,EACjBC,yBAAyB,EACzBC,mBAAmB,QACd,6BAA6B"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarButton, useToolbarButtonStyles_unstable, useToolbarButton_unstable } from './components/ToolbarButton/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarButton.ts"],"sourcesContent":["export type { ToolbarButtonProps, ToolbarButtonState } from './components/ToolbarButton/index';\nexport {\n ToolbarButton,\n useToolbarButtonStyles_unstable,\n useToolbarButton_unstable,\n} from './components/ToolbarButton/index';\n"],"names":["ToolbarButton","useToolbarButtonStyles_unstable","useToolbarButton_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,aAAa,EACbC,+BAA+B,EAC/BC,yBAAyB,QACpB,mCAAmC"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarDivider, useToolbarDividerStyles_unstable, useToolbarDivider_unstable } from './components/ToolbarDivider/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarDivider.ts"],"sourcesContent":["export type { ToolbarDividerProps, ToolbarDividerState } from './components/ToolbarDivider/index';\nexport {\n ToolbarDivider,\n useToolbarDividerStyles_unstable,\n useToolbarDivider_unstable,\n} from './components/ToolbarDivider/index';\n"],"names":["ToolbarDivider","useToolbarDividerStyles_unstable","useToolbarDivider_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,cAAc,EACdC,gCAAgC,EAChCC,0BAA0B,QACrB,oCAAoC"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarGroup, renderToolbarGroup_unstable, toolbarGroupClassNames, useToolbarGroupStyles_unstable, useToolbarGroup_unstable } from './components/ToolbarGroup/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarGroup.ts"],"sourcesContent":["export type { ToolbarGroupProps, ToolbarGroupSlots, ToolbarGroupState } from './components/ToolbarGroup/index';\nexport {\n ToolbarGroup,\n renderToolbarGroup_unstable,\n toolbarGroupClassNames,\n useToolbarGroupStyles_unstable,\n useToolbarGroup_unstable,\n} from './components/ToolbarGroup/index';\n"],"names":["ToolbarGroup","renderToolbarGroup_unstable","toolbarGroupClassNames","useToolbarGroupStyles_unstable","useToolbarGroup_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,kCAAkC"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarRadioButton, useToolbarRadioButtonStyles_unstable, useToolbarRadioButton_unstable } from './components/ToolbarRadioButton/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarRadioButton.ts"],"sourcesContent":["export type { ToolbarRadioButtonProps, ToolbarRadioButtonState } from './components/ToolbarRadioButton/index';\nexport {\n ToolbarRadioButton,\n useToolbarRadioButtonStyles_unstable,\n useToolbarRadioButton_unstable,\n} from './components/ToolbarRadioButton/index';\n"],"names":["ToolbarRadioButton","useToolbarRadioButtonStyles_unstable","useToolbarRadioButton_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,kBAAkB,EAClBC,oCAAoC,EACpCC,8BAA8B,QACzB,wCAAwC"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarRadioGroup } from './components/ToolbarRadioGroup/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarRadioGroup.ts"],"sourcesContent":["export type {\n ToolbarRadioGroupProps,\n ToolbarRadioGroupSlots,\n ToolbarRadioGroupState,\n} from './components/ToolbarRadioGroup/index';\nexport { ToolbarRadioGroup } from './components/ToolbarRadioGroup/index';\n"],"names":["ToolbarRadioGroup"],"rangeMappings":"","mappings":"AAKA,SAASA,iBAAiB,QAAQ,uCAAuC"}
+1
View File
@@ -0,0 +1 @@
export { ToolbarToggleButton, useToolbarToggleButtonStyles_unstable, useToolbarToggleButton_unstable } from './components/ToolbarToggleButton/index';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/ToolbarToggleButton.ts"],"sourcesContent":["export type { ToolbarToggleButtonProps, ToolbarToggleButtonState } from './components/ToolbarToggleButton/index';\nexport {\n ToolbarToggleButton,\n useToolbarToggleButtonStyles_unstable,\n useToolbarToggleButton_unstable,\n} from './components/ToolbarToggleButton/index';\n"],"names":["ToolbarToggleButton","useToolbarToggleButtonStyles_unstable","useToolbarToggleButton_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,mBAAmB,EACnBC,qCAAqC,EACrCC,+BAA+B,QAC1B,yCAAyC"}
+16
View File
@@ -0,0 +1,16 @@
import * as React from 'react';
import { useToolbar_unstable } from './useToolbar';
import { renderToolbar_unstable } from './renderToolbar';
import { useToolbarStyles_unstable } from './useToolbarStyles.styles';
import { useToolbarContextValues_unstable } from './useToolbarContextValues';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* Toolbar component
*/ export const Toolbar = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbar_unstable(props, ref);
const contextValues = useToolbarContextValues_unstable(state);
useToolbarStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarStyles_unstable')(state);
return renderToolbar_unstable(state, contextValues);
});
Toolbar.displayName = 'Toolbar';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbar_unstable } from './useToolbar';\nimport { renderToolbar_unstable } from './renderToolbar';\nimport { useToolbarStyles_unstable } from './useToolbarStyles.styles';\nimport type { ToolbarProps } from './Toolbar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarContextValues_unstable } from './useToolbarContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Toolbar component\n */\nexport const Toolbar: ForwardRefComponent<ToolbarProps> = React.forwardRef((props, ref) => {\n const state = useToolbar_unstable(props, ref);\n const contextValues = useToolbarContextValues_unstable(state);\n\n useToolbarStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarStyles_unstable')(state);\n\n return renderToolbar_unstable(state, contextValues);\n});\n\nToolbar.displayName = 'Toolbar';\n"],"names":["React","useToolbar_unstable","renderToolbar_unstable","useToolbarStyles_unstable","useToolbarContextValues_unstable","useCustomStyleHook_unstable","Toolbar","forwardRef","props","ref","state","contextValues","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,4BAA4B;AAGtE,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,wBAA6CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACjF,MAAMC,QAAQT,oBAAoBO,OAAOC;IACzC,MAAME,gBAAgBP,iCAAiCM;IAEvDP,0BAA0BO;IAE1BL,4BAA4B,6BAA6BK;IAEzD,OAAOR,uBAAuBQ,OAAOC;AACvC,GAAG;AAEHL,QAAQM,WAAW,GAAG"}
@@ -0,0 +1 @@
import * as React from 'react';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/Toolbar.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ToolbarSlots = {\n root: Slot<'div'>;\n};\n\nexport type ToolbarCheckedValueChangeData = {\n /** The items for this value that are checked */\n checkedItems: string[];\n /** The name of the value */\n name: string;\n};\n\nexport type ToolbarCheckedValueChangeEvent = React.MouseEvent | React.KeyboardEvent;\n\n/**\n * Toolbar Props\n */\nexport type ToolbarProps = ComponentProps<ToolbarSlots> & {\n /**\n * Toolbar can have small or medium size\n *\n * @default medium\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * Toolbar can be vertical styled\n * @default false\n */\n vertical?: boolean;\n\n /**\n * Map of all checked values\n */\n checkedValues?: Record<string, string[]>;\n\n /**\n * Default values to be checked on mount\n */\n defaultCheckedValues?: Record<string, string[]>;\n\n /**\n * Callback when checked items change for value with a name\n *\n * @param event - React's original SyntheticEvent\n * @param data - A data object with relevant information\n */\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onCheckedValueChange?: (e: ToolbarCheckedValueChangeEvent, data: ToolbarCheckedValueChangeData) => void;\n};\n\n/**\n * State used in rendering Toolbar\n */\nexport type ToolbarState = ComponentState<ToolbarSlots> &\n Required<Pick<ToolbarProps, 'size' | 'checkedValues' | 'vertical'>> &\n Pick<ToolbarProps, 'defaultCheckedValues' | 'onCheckedValueChange'> & {\n /*\n * Toggles the state of a ToggleButton item\n */\n handleToggleButton: ToggableHandler;\n /*\n * Toggles the state of a ToggleButton item\n */\n handleRadio: ToggableHandler;\n };\n\nexport type ToolbarContextValue = Pick<ToolbarState, 'size' | 'vertical' | 'checkedValues'> & {\n handleToggleButton?: ToggableHandler;\n handleRadio?: ToggableHandler;\n};\n\nexport type ToolbarContextValues = {\n toolbar: ToolbarContextValue;\n};\n\nexport type UninitializedToolbarState = Omit<ToolbarState, 'checkedValues' | 'handleToggleButton' | 'handleRadio'> &\n Partial<Pick<ToolbarState, 'checkedValues'>>;\n\nexport type ToggableHandler = (\n e: React.MouseEvent | React.KeyboardEvent,\n name: string,\n value: string,\n checked?: boolean,\n) => void;\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}
@@ -0,0 +1,10 @@
import { createContext, useContextSelector } from '@fluentui/react-context-selector';
export const ToolbarContext = createContext(undefined);
const toolbarContextDefaultValue = {
size: 'medium',
handleToggleButton: ()=>null,
handleRadio: ()=>null,
vertical: false,
checkedValues: {}
};
export const useToolbarContext_unstable = (selector)=>useContextSelector(ToolbarContext, (ctx = toolbarContextDefaultValue)=>selector(ctx));
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/ToolbarContext.ts"],"sourcesContent":["import { ContextSelector, createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { ToolbarContextValue } from './Toolbar.types';\n\nexport const ToolbarContext = createContext<ToolbarContextValue | undefined>(undefined) as Context<ToolbarContextValue>;\n\nconst toolbarContextDefaultValue: ToolbarContextValue = {\n size: 'medium' as 'medium',\n handleToggleButton: () => null,\n handleRadio: () => null,\n vertical: false,\n checkedValues: {},\n};\n\nexport const useToolbarContext_unstable = <T>(selector: ContextSelector<ToolbarContextValue, T>): T =>\n useContextSelector(ToolbarContext, (ctx = toolbarContextDefaultValue) => selector(ctx));\n"],"names":["createContext","useContextSelector","ToolbarContext","undefined","toolbarContextDefaultValue","size","handleToggleButton","handleRadio","vertical","checkedValues","useToolbarContext_unstable","selector","ctx"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,SAA0BA,aAAa,EAAEC,kBAAkB,QAAQ,mCAAmC;AAItG,OAAO,MAAMC,iBAAiBF,cAA+CG,WAA2C;AAExH,MAAMC,6BAAkD;IACtDC,MAAM;IACNC,oBAAoB,IAAM;IAC1BC,aAAa,IAAM;IACnBC,UAAU;IACVC,eAAe,CAAC;AAClB;AAEA,OAAO,MAAMC,6BAA6B,CAAIC,WAC5CV,mBAAmBC,gBAAgB,CAACU,MAAMR,0BAA0B,GAAKO,SAASC,MAAM"}
+4
View File
@@ -0,0 +1,4 @@
export { Toolbar } from './Toolbar';
export { renderToolbar_unstable } from './renderToolbar';
export { useToolbar_unstable } from './useToolbar';
export { toolbarClassNames, useToolbarStyles_unstable } from './useToolbarStyles.styles';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/index.ts"],"sourcesContent":["export { Toolbar } from './Toolbar';\nexport type {\n ToggableHandler,\n ToolbarCheckedValueChangeData,\n ToolbarCheckedValueChangeEvent,\n ToolbarContextValue,\n ToolbarContextValues,\n ToolbarProps,\n ToolbarSlots,\n ToolbarState,\n UninitializedToolbarState,\n} from './Toolbar.types';\nexport { renderToolbar_unstable } from './renderToolbar';\nexport { useToolbar_unstable } from './useToolbar';\nexport { toolbarClassNames, useToolbarStyles_unstable } from './useToolbarStyles.styles';\n"],"names":["Toolbar","renderToolbar_unstable","useToolbar_unstable","toolbarClassNames","useToolbarStyles_unstable"],"rangeMappings":";;;","mappings":"AAAA,SAASA,OAAO,QAAQ,YAAY;AAYpC,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,iBAAiB,EAAEC,yBAAyB,QAAQ,4BAA4B"}
@@ -0,0 +1,14 @@
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
import { assertSlots } from '@fluentui/react-utilities';
import { ToolbarContext } from './ToolbarContext';
/**
* Render the final JSX of Toolbar
*/ export const renderToolbar_unstable = (state, contextValues)=>{
assertSlots(state);
return /*#__PURE__*/ _jsx(ToolbarContext.Provider, {
value: contextValues.toolbar,
children: /*#__PURE__*/ _jsx(state.root, {
children: state.root.children
})
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/renderToolbar.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ToolbarState, ToolbarSlots, ToolbarContextValues } from './Toolbar.types';\nimport { ToolbarContext } from './ToolbarContext';\n\n/**\n * Render the final JSX of Toolbar\n */\nexport const renderToolbar_unstable = (state: ToolbarState, contextValues: ToolbarContextValues) => {\n assertSlots<ToolbarSlots>(state);\n\n return (\n <ToolbarContext.Provider value={contextValues.toolbar}>\n <state.root>{state.root.children}</state.root>\n </ToolbarContext.Provider>\n );\n};\n"],"names":["assertSlots","ToolbarContext","renderToolbar_unstable","state","contextValues","Provider","value","toolbar","root","children"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,cAAc,QAAQ,mBAAmB;AAElD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAqBC;IAC1DJ,YAA0BG;IAE1B,qBACE,KAACF,eAAeI,QAAQ;QAACC,OAAOF,cAAcG,OAAO;kBACnD,cAAA,KAACJ,MAAMK,IAAI;sBAAEL,MAAMK,IAAI,CAACC,QAAQ;;;AAGtC,EAAE"}
@@ -0,0 +1,112 @@
import * as React from 'react';
import { useEventCallback, useControllableState, getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
import { useArrowNavigationGroup } from '@fluentui/react-tabster';
/**
* Create the state required to render Toolbar.
*
* The returned state can be modified with hooks such as useToolbarStyles_unstable,
* before being passed to renderToolbar_unstable.
*
* @param props - props from this instance of Toolbar
* @param ref - reference to root HTMLElement of Toolbar
*/ export const useToolbar_unstable = (props, ref)=>{
const { size = 'medium', vertical = false } = props;
const arrowNavigationProps = useArrowNavigationGroup({
circular: true,
axis: 'both'
});
const initialState = {
size,
vertical,
// TODO add appropriate props/defaults
components: {
// TODO add each slot's element type or component
root: 'div'
},
// TODO add appropriate slots, for example:
// mySlot: resolveShorthand(props.mySlot),
root: slot.always(getIntrinsicElementProps('div', {
role: 'toolbar',
// FIXME:
// `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
// but since it would be a breaking change to fix it, we are casting ref to it's proper type
ref: ref,
...vertical && {
'aria-orientation': 'vertical'
},
...arrowNavigationProps,
...props
}), {
elementType: 'div'
})
};
const [checkedValues, onCheckedValueChange] = useToolbarSelectableState({
checkedValues: props.checkedValues,
defaultCheckedValues: props.defaultCheckedValues,
onCheckedValueChange: props.onCheckedValueChange
});
const handleToggleButton = useEventCallback((e, name, value, checked)=>{
if (name && value) {
const checkedItems = (checkedValues === null || checkedValues === void 0 ? void 0 : checkedValues[name]) || [];
const newCheckedItems = [
...checkedItems
];
if (checked) {
newCheckedItems.splice(newCheckedItems.indexOf(value), 1);
} else {
newCheckedItems.push(value);
}
onCheckedValueChange === null || onCheckedValueChange === void 0 ? void 0 : onCheckedValueChange(e, {
name,
checkedItems: newCheckedItems
});
}
});
const handleRadio = useEventCallback((e, name, value, checked)=>{
if (name && value) {
onCheckedValueChange === null || onCheckedValueChange === void 0 ? void 0 : onCheckedValueChange(e, {
name,
checkedItems: [
value
]
});
}
});
return {
...initialState,
handleToggleButton,
handleRadio,
checkedValues: checkedValues !== null && checkedValues !== void 0 ? checkedValues : {}
};
};
/**
* Adds appropriate state values and handlers for selectable items
* i.e checkboxes and radios
*/ const useToolbarSelectableState = (state)=>{
const [checkedValues, setCheckedValues] = useControllableState({
state: state.checkedValues,
defaultState: state.defaultCheckedValues,
initialState: {}
});
const { onCheckedValueChange: onCheckedValueChangeOriginal } = state;
const onCheckedValueChange = useEventCallback((e, { name, checkedItems })=>{
if (onCheckedValueChangeOriginal) {
onCheckedValueChangeOriginal(e, {
name,
checkedItems
});
}
setCheckedValues((s)=>{
return s ? {
...s,
[name]: checkedItems
} : {
[name]: checkedItems
};
});
});
return [
checkedValues,
onCheckedValueChange
];
};
File diff suppressed because one or more lines are too long
@@ -0,0 +1,14 @@
export function useToolbarContextValues_unstable(state) {
const { size, handleToggleButton, vertical, checkedValues, handleRadio } = state;
// This context is created with "@fluentui/react-context-selector", these is no sense to memoize it
const toolbar = {
size,
vertical,
handleToggleButton,
handleRadio,
checkedValues
};
return {
toolbar
};
}
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/Toolbar/useToolbarContextValues.tsx"],"sourcesContent":["import type { ToolbarContextValue, ToolbarContextValues, ToolbarState } from './Toolbar.types';\n\nexport function useToolbarContextValues_unstable(state: ToolbarState): ToolbarContextValues {\n const { size, handleToggleButton, vertical, checkedValues, handleRadio } = state;\n // This context is created with \"@fluentui/react-context-selector\", these is no sense to memoize it\n const toolbar: ToolbarContextValue = {\n size,\n vertical,\n handleToggleButton,\n handleRadio,\n checkedValues,\n };\n\n return { toolbar };\n}\n"],"names":["useToolbarContextValues_unstable","state","size","handleToggleButton","vertical","checkedValues","handleRadio","toolbar"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAEA,OAAO,SAASA,iCAAiCC,KAAmB;IAClE,MAAM,EAAEC,IAAI,EAAEC,kBAAkB,EAAEC,QAAQ,EAAEC,aAAa,EAAEC,WAAW,EAAE,GAAGL;IAC3E,mGAAmG;IACnG,MAAMM,UAA+B;QACnCL;QACAE;QACAD;QACAG;QACAD;IACF;IAEA,OAAO;QAAEE;IAAQ;AACnB"}
@@ -0,0 +1,67 @@
import { __styles, mergeClasses } from '@griffel/react';
export const toolbarClassNames = {
root: 'fui-Toolbar'
};
/**
* Styles for the root slot
*/
const useStyles = /*#__PURE__*/__styles({
root: {
mc9l5x: "f22iagw",
Bt984gj: "f122n59",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1yqiaad"
},
vertical: {
Beiy3e4: "f1vx9l62",
a9b677: "f1acs6jw"
},
small: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "fvz760z"
},
medium: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1yqiaad"
},
large: {
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1ms6bdn"
}
}, {
d: [".f22iagw{display:flex;}", ".f122n59{align-items:center;}", [".f1yqiaad{padding:4px 8px;}", {
p: -1
}], ".f1vx9l62{flex-direction:column;}", ".f1acs6jw{width:fit-content;}", [".fvz760z{padding:0px 4px;}", {
p: -1
}], [".f1yqiaad{padding:4px 8px;}", {
p: -1
}], [".f1ms6bdn{padding:4px 20px;}", {
p: -1
}]]
});
/**
* Apply styling to the Toolbar slots based on the state
*/
export const useToolbarStyles_unstable = state => {
'use no memo';
const styles = useStyles();
const {
vertical,
size
} = state;
state.root.className = mergeClasses(toolbarClassNames.root, styles.root, vertical && styles.vertical, size === 'small' && !vertical && styles.small, size === 'medium' && !vertical && styles.medium, size === 'large' && !vertical && styles.large, state.root.className);
return state;
};
@@ -0,0 +1 @@
{"version":3,"names":["__styles","mergeClasses","toolbarClassNames","root","useStyles","mc9l5x","Bt984gj","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","vertical","Beiy3e4","a9b677","small","medium","large","d","p","useToolbarStyles_unstable","state","styles","size","className"],"sources":["useToolbarStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const toolbarClassNames = {\n root: 'fui-Toolbar'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n padding: '4px 8px'\n },\n vertical: {\n flexDirection: 'column',\n width: 'fit-content'\n },\n small: {\n padding: '0px 4px'\n },\n medium: {\n padding: '4px 8px'\n },\n large: {\n padding: '4px 20px'\n }\n});\n/**\n * Apply styling to the Toolbar slots based on the state\n */ export const useToolbarStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const { vertical, size } = state;\n state.root.className = mergeClasses(toolbarClassNames.root, styles.root, vertical && styles.vertical, size === 'small' && !vertical && styles.small, size === 'medium' && !vertical && styles.medium, size === 'large' && !vertical && styles.large, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,iBAAiB,GAAG;EAC7BC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAR,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAK,MAAA;IAAAT,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAM,KAAA;IAAAV,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAO,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAmBrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,yBAAyB,GAAIC,KAAK,IAAG;EAClD,aAAa;;EACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B,MAAM;IAAEQ,QAAQ;IAAEW;EAAK,CAAC,GAAGF,KAAK;EAChCA,KAAK,CAAClB,IAAI,CAACqB,SAAS,GAAGvB,YAAY,CAACC,iBAAiB,CAACC,IAAI,EAAEmB,MAAM,CAACnB,IAAI,EAAES,QAAQ,IAAIU,MAAM,CAACV,QAAQ,EAAEW,IAAI,KAAK,OAAO,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACP,KAAK,EAAEQ,IAAI,KAAK,QAAQ,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACN,MAAM,EAAEO,IAAI,KAAK,OAAO,IAAI,CAACX,QAAQ,IAAIU,MAAM,CAACL,KAAK,EAAEI,KAAK,CAAClB,IAAI,CAACqB,SAAS,CAAC;EAC1Q,OAAOH,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -0,0 +1,16 @@
import * as React from 'react';
import { renderButton_unstable } from '@fluentui/react-button';
import { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles.styles';
import { useToolbarButton_unstable } from './useToolbarButton';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarButton component is a Button to be used inside Toolbar
* which will respect toolbar props such as `size`
*/ export const ToolbarButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarButton_unstable(props, ref);
useToolbarButtonStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarButtonStyles_unstable')(state);
return renderButton_unstable(state);
// Casting is required due to lack of distributive union to support unions on @types/react
});
ToolbarButton.displayName = 'ToolbarButton';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarButton/ToolbarButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarButtonProps } from './ToolbarButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderButton_unstable } from '@fluentui/react-button';\nimport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles.styles';\nimport { useToolbarButton_unstable } from './useToolbarButton';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarButton component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarButton: ForwardRefComponent<ToolbarButtonProps> = React.forwardRef((props, ref) => {\n const state = useToolbarButton_unstable(props, ref);\n\n useToolbarButtonStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarButtonStyles_unstable')(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarButtonProps>;\n\nToolbarButton.displayName = 'ToolbarButton';\n"],"names":["React","renderButton_unstable","useToolbarButtonStyles_unstable","useToolbarButton_unstable","useCustomStyleHook_unstable","ToolbarButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,+BAA+B,QAAQ,kCAAkC;AAClF,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQN,0BAA0BI,OAAOC;IAE/CN,gCAAgCO;IAEhCL,4BAA4B,mCAAmCK;IAE/D,OAAOR,sBAAsBQ;AAC7B,0FAA0F;AAC5F,GAA8C;AAE9CJ,cAAcK,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarButton
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarButton/ToolbarButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { ButtonProps, ButtonSlots, ButtonState } from '@fluentui/react-button';\n\n/**\n * ToolbarButton Props\n */\nexport type ToolbarButtonProps = ComponentProps<ButtonSlots> &\n Partial<Pick<ButtonProps, 'disabled' | 'disabledFocusable'>> & {\n appearance?: 'primary' | 'subtle' | 'transparent';\n } & {\n vertical?: boolean;\n };\n\n/**\n * State used in rendering ToolbarButton\n */\nexport type ToolbarButtonState = ComponentState<Partial<ButtonSlots>> &\n ButtonState &\n Required<Pick<ToolbarButtonProps, 'vertical'>>;\n"],"names":[],"rangeMappings":";;","mappings":"AAaA;;CAEC,GACD,WAEiD"}
@@ -0,0 +1,3 @@
export { ToolbarButton } from './ToolbarButton';
export { useToolbarButton_unstable } from './useToolbarButton';
export { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles.styles';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarButton/index.ts"],"sourcesContent":["export { ToolbarButton } from './ToolbarButton';\nexport type { ToolbarButtonProps, ToolbarButtonState } from './ToolbarButton.types';\nexport { useToolbarButton_unstable } from './useToolbarButton';\nexport { useToolbarButtonStyles_unstable } from './useToolbarButtonStyles.styles';\n"],"names":["ToolbarButton","useToolbarButton_unstable","useToolbarButtonStyles_unstable"],"rangeMappings":";;","mappings":"AAAA,SAASA,aAAa,QAAQ,kBAAkB;AAEhD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,+BAA+B,QAAQ,kCAAkC"}
@@ -0,0 +1,19 @@
import * as React from 'react';
import { useButton_unstable } from '@fluentui/react-button';
/**
* Given user props, defines default props for the Button, calls useButtonState and useChecked, and returns
* processed state.
* @param props - User provided props to the Button component.
* @param ref - User provided ref to be passed to the Button component.
*/ export const useToolbarButton_unstable = (props, ref)=>{
const { vertical = false, ...buttonProps } = props;
const state = useButton_unstable({
appearance: 'subtle',
...buttonProps,
size: 'medium'
}, ref);
return {
vertical,
...state
};
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarButton/useToolbarButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useButton_unstable } from '@fluentui/react-button';\nimport { ToolbarButtonProps, ToolbarButtonState } from './ToolbarButton.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useToolbarButton_unstable = (\n props: ToolbarButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToolbarButtonState => {\n const { vertical = false, ...buttonProps } = props;\n const state = useButton_unstable(\n {\n appearance: 'subtle',\n ...buttonProps,\n size: 'medium',\n },\n ref,\n );\n\n return {\n vertical,\n ...state,\n };\n};\n"],"names":["React","useButton_unstable","useToolbarButton_unstable","props","ref","vertical","buttonProps","state","appearance","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,yBAAyB;AAG5D;;;;;CAKC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC;IAEA,MAAM,EAAEC,WAAW,KAAK,EAAE,GAAGC,aAAa,GAAGH;IAC7C,MAAMI,QAAQN,mBACZ;QACEO,YAAY;QACZ,GAAGF,WAAW;QACdG,MAAM;IACR,GACAL;IAGF,OAAO;QACLC;QACA,GAAGE,KAAK;IACV;AACF,EAAE"}
@@ -0,0 +1,32 @@
import { __styles, mergeClasses } from '@griffel/react';
import { useButtonStyles_unstable } from '@fluentui/react-button';
const useBaseStyles = /*#__PURE__*/__styles({
vertical: {
Beiy3e4: "f1vx9l62"
},
verticalIcon: {
Be2twd7: "f1rt2boy",
jrapky: 0,
Frg6f3: 0,
t21cq0: 0,
B6of3ja: 0,
B74szlk: "f1s184ao"
}
}, {
d: [".f1vx9l62{flex-direction:column;}", ".f1rt2boy{font-size:24px;}", [".f1s184ao{margin:0;}", {
p: -1
}]]
});
/**
* Apply styling to the ToolbarButton slots based on the state
*/
export const useToolbarButtonStyles_unstable = state => {
'use no memo';
useButtonStyles_unstable(state);
const buttonStyles = useBaseStyles();
state.root.className = mergeClasses(state.root.className, state.vertical && buttonStyles.vertical);
if (state.icon) {
state.icon.className = mergeClasses(state.icon.className, state.vertical && buttonStyles.verticalIcon);
}
};
@@ -0,0 +1 @@
{"version":3,"names":["__styles","mergeClasses","useButtonStyles_unstable","useBaseStyles","vertical","Beiy3e4","verticalIcon","Be2twd7","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","d","p","useToolbarButtonStyles_unstable","state","buttonStyles","root","className","icon"],"sources":["useToolbarButtonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useButtonStyles_unstable } from '@fluentui/react-button';\nconst useBaseStyles = makeStyles({\n vertical: {\n flexDirection: 'column'\n },\n verticalIcon: {\n fontSize: '24px',\n margin: '0'\n }\n});\n/**\n * Apply styling to the ToolbarButton slots based on the state\n */ export const useToolbarButtonStyles_unstable = (state)=>{\n 'use no memo';\n useButtonStyles_unstable(state);\n const buttonStyles = useBaseStyles();\n state.root.className = mergeClasses(state.root.className, state.vertical && buttonStyles.vertical);\n if (state.icon) {\n state.icon.className = mergeClasses(state.icon.className, state.vertical && buttonStyles.verticalIcon);\n }\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,wBAAwB,QAAQ,wBAAwB;AACjE,MAAMC,aAAa,gBAAGH,QAAA;EAAAI,QAAA;IAAAC,OAAA;EAAA;EAAAC,YAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;AAAA,CAQrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,+BAA+B,GAAIC,KAAK,IAAG;EACxD,aAAa;;EACbd,wBAAwB,CAACc,KAAK,CAAC;EAC/B,MAAMC,YAAY,GAAGd,aAAa,CAAC,CAAC;EACpCa,KAAK,CAACE,IAAI,CAACC,SAAS,GAAGlB,YAAY,CAACe,KAAK,CAACE,IAAI,CAACC,SAAS,EAAEH,KAAK,CAACZ,QAAQ,IAAIa,YAAY,CAACb,QAAQ,CAAC;EAClG,IAAIY,KAAK,CAACI,IAAI,EAAE;IACZJ,KAAK,CAACI,IAAI,CAACD,SAAS,GAAGlB,YAAY,CAACe,KAAK,CAACI,IAAI,CAACD,SAAS,EAAEH,KAAK,CAACZ,QAAQ,IAAIa,YAAY,CAACX,YAAY,CAAC;EAC1G;AACJ,CAAC","ignoreList":[]}
@@ -0,0 +1,14 @@
import * as React from 'react';
import { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles.styles';
import { renderDivider_unstable } from '@fluentui/react-divider';
import { useToolbarDivider_unstable } from './useToolbarDivider';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarDivider component
*/ export const ToolbarDivider = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarDivider_unstable(props, ref);
useToolbarDividerStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarDividerStyles_unstable')(state);
return renderDivider_unstable(state);
});
ToolbarDivider.displayName = 'ToolbarDivider';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarDivider/ToolbarDivider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles.styles';\nimport type { ToolbarDividerProps } from './ToolbarDivider.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarDivider_unstable } from './useToolbarDivider';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarDivider component\n */\nexport const ToolbarDivider: ForwardRefComponent<ToolbarDividerProps> = React.forwardRef((props, ref) => {\n const state = useToolbarDivider_unstable(props, ref);\n\n useToolbarDividerStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarDividerStyles_unstable')(state);\n\n return renderDivider_unstable(state);\n});\n\nToolbarDivider.displayName = 'ToolbarDivider';\n"],"names":["React","useToolbarDividerStyles_unstable","renderDivider_unstable","useToolbarDivider_unstable","useCustomStyleHook_unstable","ToolbarDivider","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gCAAgC,QAAQ,mCAAmC;AAGpF,SAASC,sBAAsB,QAAQ,0BAA0B;AACjE,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQN,2BAA2BI,OAAOC;IAEhDP,iCAAiCQ;IAEjCL,4BAA4B,oCAAoCK;IAEhE,OAAOP,uBAAuBO;AAChC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarDivider
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarDivider/ToolbarDivider.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { DividerSlots, DividerState } from '@fluentui/react-divider';\n\n/**\n * ToolbarDivider Props\n */\nexport type ToolbarDividerProps = ComponentProps<Partial<DividerSlots>> & {\n /**\n * A divider can be horizontal or vertical (default).\n *\n * @default true\n */\n vertical?: boolean;\n};\n\n/**\n * State used in rendering ToolbarDivider\n */\nexport type ToolbarDividerState = ComponentState<Partial<DividerSlots>> & DividerState;\n"],"names":[],"rangeMappings":";;","mappings":"AAeA;;CAEC,GACD,WAAuF"}
@@ -0,0 +1,3 @@
export { ToolbarDivider } from './ToolbarDivider';
export { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles.styles';
export { useToolbarDivider_unstable } from './useToolbarDivider';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarDivider/index.ts"],"sourcesContent":["export { ToolbarDivider } from './ToolbarDivider';\nexport type { ToolbarDividerProps, ToolbarDividerState } from './ToolbarDivider.types';\nexport { useToolbarDividerStyles_unstable } from './useToolbarDividerStyles.styles';\nexport { useToolbarDivider_unstable } from './useToolbarDivider';\n"],"names":["ToolbarDivider","useToolbarDividerStyles_unstable","useToolbarDivider_unstable"],"rangeMappings":";;","mappings":"AAAA,SAASA,cAAc,QAAQ,mBAAmB;AAElD,SAASC,gCAAgC,QAAQ,mCAAmC;AACpF,SAASC,0BAA0B,QAAQ,sBAAsB"}
@@ -0,0 +1,18 @@
import * as React from 'react';
import { useDivider_unstable } from '@fluentui/react-divider';
import { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';
/**
* Create the state required to render ToolbarDivider.
*
* The returned state can be modified with hooks such as useToolbarDividerStyles_unstable,
* before being passed to renderToolbar_unstable.
*
* @param props - props from this instance of ToolbarDivider
* @param ref - reference to root HTMLElement of ToolbarDivider
*/ export const useToolbarDivider_unstable = (props, ref)=>{
const vertical = useToolbarContext_unstable((ctx)=>ctx.vertical);
return useDivider_unstable({
vertical: !vertical,
...props
}, ref);
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarDivider/useToolbarDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { ToolbarDividerProps, ToolbarDividerState } from './ToolbarDivider.types';\nimport { useDivider_unstable } from '@fluentui/react-divider';\nimport { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';\n\n/**\n * Create the state required to render ToolbarDivider.\n *\n * The returned state can be modified with hooks such as useToolbarDividerStyles_unstable,\n * before being passed to renderToolbar_unstable.\n *\n * @param props - props from this instance of ToolbarDivider\n * @param ref - reference to root HTMLElement of ToolbarDivider\n */\nexport const useToolbarDivider_unstable = (\n props: ToolbarDividerProps,\n ref: React.Ref<HTMLElement>,\n): ToolbarDividerState => {\n const vertical = useToolbarContext_unstable(ctx => ctx.vertical);\n return useDivider_unstable({ vertical: !vertical, ...props }, ref);\n};\n"],"names":["React","useDivider_unstable","useToolbarContext_unstable","useToolbarDivider_unstable","props","ref","vertical","ctx"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,mBAAmB,QAAQ,0BAA0B;AAC9D,SAASC,0BAA0B,QAAQ,4BAA4B;AAEvE;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,WAAWJ,2BAA2BK,CAAAA,MAAOA,IAAID,QAAQ;IAC/D,OAAOL,oBAAoB;QAAEK,UAAU,CAACA;QAAU,GAAGF,KAAK;IAAC,GAAGC;AAChE,EAAE"}
@@ -0,0 +1,34 @@
import { __styles, mergeClasses } from '@griffel/react';
import { useDividerStyles_unstable } from '@fluentui/react-divider';
const useBaseStyles = /*#__PURE__*/__styles({
root: {
mc9l5x: "ftuwxu6",
B2u0y6b: "f1lwjmbk",
Byoj8tv: 0,
uwmqm3: 0,
z189sj: 0,
z8tnut: 0,
B0ocmuz: "f1oic3e7"
},
vertical: {
B2u0y6b: "fe668z"
}
}, {
d: [".ftuwxu6{display:inline-flex;}", ".f1lwjmbk{max-width:1px;}", [".f1oic3e7{padding:0 12px;}", {
p: -1
}], ".fe668z{max-width:initial;}"]
});
/**
* Apply styling to the ToolbarDivider slots based on the state
*/
export const useToolbarDividerStyles_unstable = state => {
'use no memo';
useDividerStyles_unstable(state);
const {
vertical
} = state;
const toolbarDividerStyles = useBaseStyles();
state.root.className = mergeClasses(toolbarDividerStyles.root, !vertical && toolbarDividerStyles.vertical, state.root.className);
return state;
};
@@ -0,0 +1 @@
{"version":3,"names":["__styles","mergeClasses","useDividerStyles_unstable","useBaseStyles","root","mc9l5x","B2u0y6b","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","vertical","d","p","useToolbarDividerStyles_unstable","state","toolbarDividerStyles","className"],"sources":["useToolbarDividerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { useDividerStyles_unstable } from '@fluentui/react-divider';\nconst useBaseStyles = makeStyles({\n // Base styles\n root: {\n display: 'inline-flex',\n maxWidth: '1px',\n padding: '0 12px'\n },\n vertical: {\n maxWidth: 'initial'\n }\n});\n/**\n * Apply styling to the ToolbarDivider slots based on the state\n */ export const useToolbarDividerStyles_unstable = (state)=>{\n 'use no memo';\n useDividerStyles_unstable(state);\n const { vertical } = state;\n const toolbarDividerStyles = useBaseStyles();\n state.root.className = mergeClasses(toolbarDividerStyles.root, !vertical && toolbarDividerStyles.vertical, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,yBAAyB,QAAQ,yBAAyB;AACnE,MAAMC,aAAa,gBAAGH,QAAA;EAAAI,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAC,QAAA;IAAAN,OAAA;EAAA;AAAA;EAAAO,CAAA;IAAAC,CAAA;EAAA;AAAA,CAUrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,gCAAgC,GAAIC,KAAK,IAAG;EACzD,aAAa;;EACbd,yBAAyB,CAACc,KAAK,CAAC;EAChC,MAAM;IAAEJ;EAAS,CAAC,GAAGI,KAAK;EAC1B,MAAMC,oBAAoB,GAAGd,aAAa,CAAC,CAAC;EAC5Ca,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGjB,YAAY,CAACgB,oBAAoB,CAACb,IAAI,EAAE,CAACQ,QAAQ,IAAIK,oBAAoB,CAACL,QAAQ,EAAEI,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;EAChI,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -0,0 +1,16 @@
import * as React from 'react';
import { useToolbarGroup_unstable } from './useToolbarGroup';
import { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles.styles';
import { renderToolbarGroup_unstable } from './renderToolbarGroup';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarGroup component is a Button to be used inside Toolbar
* which will respect toolbar props such as `size`
*/ export const ToolbarGroup = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarGroup_unstable(props, ref);
useToolbarGroupStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarGroupStyles_unstable')(state);
return renderToolbarGroup_unstable(state);
// Casting is required due to lack of distributive union to support unions on @types/react
});
ToolbarGroup.displayName = 'ToolbarGroup';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarGroup/ToolbarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarGroupProps } from './ToolbarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useToolbarGroup_unstable } from './useToolbarGroup';\nimport { useToolbarGroupStyles_unstable } from './useToolbarGroupStyles.styles';\nimport { renderToolbarGroup_unstable } from './renderToolbarGroup';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarGroup: ForwardRefComponent<ToolbarGroupProps> = React.forwardRef((props, ref) => {\n const state = useToolbarGroup_unstable(props, ref);\n\n useToolbarGroupStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarGroupStyles_unstable')(state);\n\n return renderToolbarGroup_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarGroupProps>;\n\nToolbarGroup.displayName = 'ToolbarGroup';\n"],"names":["React","useToolbarGroup_unstable","useToolbarGroupStyles_unstable","renderToolbarGroup_unstable","useCustomStyleHook_unstable","ToolbarGroup","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,8BAA8B,QAAQ,iCAAiC;AAChF,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CN,+BAA+BO;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAON,4BAA4BM;AACnC,0FAA0F;AAC5F,GAA6C;AAE7CJ,aAAaK,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarButton
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarGroup/ToolbarGroup.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ToolbarGroupSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * ToolbarButton Props\n */\nexport type ToolbarGroupProps = ComponentProps<ToolbarGroupSlots>;\n\n/**\n * State used in rendering ToolbarButton\n */\nexport type ToolbarGroupState = ComponentState<ToolbarGroupSlots>;\n"],"names":[],"rangeMappings":";;","mappings":"AAWA;;CAEC,GACD,WAAkE"}
@@ -0,0 +1,4 @@
export { ToolbarGroup } from './ToolbarGroup';
export { useToolbarGroup_unstable } from './useToolbarGroup';
export { toolbarGroupClassNames, useToolbarGroupStyles_unstable } from './useToolbarGroupStyles.styles';
export { renderToolbarGroup_unstable } from './renderToolbarGroup';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarGroup/index.ts"],"sourcesContent":["export { ToolbarGroup } from './ToolbarGroup';\nexport type { ToolbarGroupProps, ToolbarGroupSlots, ToolbarGroupState } from './ToolbarGroup.types';\nexport { useToolbarGroup_unstable } from './useToolbarGroup';\nexport { toolbarGroupClassNames, useToolbarGroupStyles_unstable } from './useToolbarGroupStyles.styles';\nexport { renderToolbarGroup_unstable } from './renderToolbarGroup';\n"],"names":["ToolbarGroup","useToolbarGroup_unstable","toolbarGroupClassNames","useToolbarGroupStyles_unstable","renderToolbarGroup_unstable"],"rangeMappings":";;;","mappings":"AAAA,SAASA,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,iCAAiC;AACxG,SAASC,2BAA2B,QAAQ,uBAAuB"}
@@ -0,0 +1,10 @@
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
import { assertSlots } from '@fluentui/react-utilities';
/**
* Render the final JSX of ToolbarGroup
*/ export const renderToolbarGroup_unstable = (state)=>{
assertSlots(state);
return /*#__PURE__*/ _jsx(state.root, {
children: state.root.children
});
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarGroup/renderToolbarGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ToolbarGroupState, ToolbarGroupSlots } from './ToolbarGroup.types';\n\n/**\n * Render the final JSX of ToolbarGroup\n */\nexport const renderToolbarGroup_unstable = (state: ToolbarGroupState) => {\n assertSlots<ToolbarGroupSlots>(state);\n\n return <state.root>{state.root.children}</state.root>;\n};\n"],"names":["assertSlots","renderToolbarGroup_unstable","state","root","children"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;kBAAED,MAAMC,IAAI,CAACC,QAAQ;;AACzC,EAAE"}
@@ -0,0 +1,20 @@
import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
import * as React from 'react';
/**
* Given user props, defines default props for the Group
* @param props - User provided props to the Group component.
* @param ref - User provided ref to be passed to the Group component.
*/ export const useToolbarGroup_unstable = (props, ref)=>{
return {
components: {
root: 'div'
},
root: slot.always(getIntrinsicElementProps('div', {
ref,
role: 'presentation',
...props
}), {
elementType: 'div'
})
};
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarGroup/useToolbarGroup.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { ToolbarGroupProps, ToolbarGroupState } from './ToolbarGroup.types';\n\n/**\n * Given user props, defines default props for the Group\n * @param props - User provided props to the Group component.\n * @param ref - User provided ref to be passed to the Group component.\n */\nexport const useToolbarGroup_unstable = (\n props: ToolbarGroupProps,\n ref: React.Ref<HTMLDivElement>,\n): ToolbarGroupState => {\n return {\n components: {\n root: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps<React.HTMLAttributes<HTMLDivElement>>('div', {\n ref,\n role: 'presentation',\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["getIntrinsicElementProps","slot","React","useToolbarGroup_unstable","props","ref","components","root","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,YAAYC,WAAW,QAAQ;AAG/B;;;;CAIC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMN,KAAKO,MAAM,CACfR,yBAA+D,OAAO;YACpEK;YACAI,MAAM;YACN,GAAGL,KAAK;QACV,IACA;YAAEM,aAAa;QAAM;IAEzB;AACF,EAAE"}
@@ -0,0 +1,13 @@
import { mergeClasses } from '@griffel/react';
export const toolbarGroupClassNames = {
root: 'fui-ToolbarGroup'
};
/**
* Apply styling to the Toolbar slots based on the state
*/
export const useToolbarGroupStyles_unstable = state => {
'use no memo';
state.root.className = mergeClasses(toolbarGroupClassNames.root, state.root.className);
return state;
};
@@ -0,0 +1 @@
{"version":3,"names":["mergeClasses","toolbarGroupClassNames","root","useToolbarGroupStyles_unstable","state","className"],"sources":["useToolbarGroupStyles.styles.js"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nexport const toolbarGroupClassNames = {\n root: 'fui-ToolbarGroup'\n};\n/**\n * Apply styling to the Toolbar slots based on the state\n */ export const useToolbarGroupStyles_unstable = (state)=>{\n 'use no memo';\n state.root.className = mergeClasses(toolbarGroupClassNames.root, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB;AAC7C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD;AACA;AACA;AAAI,OAAO,MAAMC,8BAA8B,GAAIC,KAAK,IAAG;EACvD,aAAa;;EACbA,KAAK,CAACF,IAAI,CAACG,SAAS,GAAGL,YAAY,CAACC,sBAAsB,CAACC,IAAI,EAAEE,KAAK,CAACF,IAAI,CAACG,SAAS,CAAC;EACtF,OAAOD,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -0,0 +1,14 @@
import * as React from 'react';
import { renderToggleButton_unstable } from '@fluentui/react-button';
import { useToolbarRadioButton_unstable } from './useToolbarRadioButton';
import { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles.styles';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarRadioButton component
*/ export const ToolbarRadioButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarRadioButton_unstable(props, ref);
useToolbarRadioButtonStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarRadioButtonStyles_unstable')(state);
return renderToggleButton_unstable(state);
});
ToolbarRadioButton.displayName = 'ToolbarRadioButton';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioButton/ToolbarRadioButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioButtonProps } from './ToolbarRadioButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarRadioButton_unstable } from './useToolbarRadioButton';\nimport { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarRadioButton component\n */\nexport const ToolbarRadioButton: ForwardRefComponent<ToolbarRadioButtonProps> = React.forwardRef((props, ref) => {\n const state = useToolbarRadioButton_unstable(props, ref);\n\n useToolbarRadioButtonStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarRadioButtonStyles_unstable')(state);\n\n return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarRadioButtonProps>;\n\nToolbarRadioButton.displayName = 'ToolbarRadioButton';\n"],"names":["React","renderToggleButton_unstable","useToolbarRadioButton_unstable","useToolbarRadioButtonStyles_unstable","useCustomStyleHook_unstable","ToolbarRadioButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,oCAAoC,QAAQ,uCAAuC;AAC5F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,mCAAmEL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvG,MAAMC,QAAQP,+BAA+BK,OAAOC;IAEpDL,qCAAqCM;IAErCL,4BAA4B,wCAAwCK;IAEpE,OAAOR,4BAA4BQ;AACrC,GAAmD;AAEnDJ,mBAAmBK,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarRadioButton
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioButton/ToolbarRadioButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { ToggleButtonProps, ButtonSlots, ToggleButtonState } from '@fluentui/react-button';\n\n/**\n * ToolbarRadioButton Props\n */\nexport type ToolbarRadioButtonProps = ComponentProps<ButtonSlots> &\n Partial<Pick<ToggleButtonProps, 'disabled' | 'disabledFocusable' | 'size'>> & {\n appearance?: 'primary' | 'subtle' | 'transparent';\n name: string;\n value: string;\n };\n\n/**\n * State used in rendering ToolbarRadioButton\n */\nexport type ToolbarRadioButtonState = ComponentState<Partial<ButtonSlots>> &\n ToggleButtonState &\n Required<Pick<ToggleButtonProps, 'checked'>> &\n Pick<ToolbarRadioButtonProps, 'name' | 'value'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAaA;;CAEC,GACD,WAGkD"}
@@ -0,0 +1,3 @@
export { ToolbarRadioButton } from './ToolbarRadioButton';
export { useToolbarRadioButton_unstable } from './useToolbarRadioButton';
export { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles.styles';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioButton/index.ts"],"sourcesContent":["export { ToolbarRadioButton } from './ToolbarRadioButton';\nexport type { ToolbarRadioButtonProps, ToolbarRadioButtonState } from './ToolbarRadioButton.types';\nexport { useToolbarRadioButton_unstable } from './useToolbarRadioButton';\nexport { useToolbarRadioButtonStyles_unstable } from './useToolbarRadioButtonStyles.styles';\n"],"names":["ToolbarRadioButton","useToolbarRadioButton_unstable","useToolbarRadioButtonStyles_unstable"],"rangeMappings":";;","mappings":"AAAA,SAASA,kBAAkB,QAAQ,uBAAuB;AAE1D,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,oCAAoC,QAAQ,uCAAuC"}
@@ -0,0 +1,37 @@
import * as React from 'react';
import { useEventCallback } from '@fluentui/react-utilities';
import { useToggleButton_unstable } from '@fluentui/react-button';
import { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';
/**
* Given user props, defines default props for the RadioButton, calls useButtonState and useChecked, and returns
* processed state.
* @param props - User provided props to the RadioButton component.
* @param ref - User provided ref to be passed to the RadioButton component.
*/ export const useToolbarRadioButton_unstable = (props, ref)=>{
const handleRadio = useToolbarContext_unstable((ctx)=>ctx.handleRadio);
const checked = useToolbarContext_unstable((ctx)=>{
var _ctx_checkedValues_props_name;
return !!((_ctx_checkedValues_props_name = ctx.checkedValues[props.name]) === null || _ctx_checkedValues_props_name === void 0 ? void 0 : _ctx_checkedValues_props_name.includes(props.value));
});
const size = useToolbarContext_unstable((ctx)=>ctx.size);
const { onClick: onClickOriginal } = props;
const toggleButtonState = useToggleButton_unstable({
size,
checked,
role: 'radio',
'aria-checked': checked,
...props
}, ref);
const state = {
...toggleButtonState,
name: props.name,
value: props.value
};
const handleOnClick = useEventCallback((e)=>{
handleRadio === null || handleRadio === void 0 ? void 0 : handleRadio(e, state.name, state.value, state.checked);
onClickOriginal === null || onClickOriginal === void 0 ? void 0 : onClickOriginal(e);
});
state.root['aria-pressed'] = undefined;
state.root.onClick = handleOnClick;
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioButton/useToolbarRadioButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback } from '@fluentui/react-utilities';\nimport { useToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';\nimport { ToolbarRadioButtonProps, ToolbarRadioButtonState } from './ToolbarRadioButton.types';\n\n/**\n * Given user props, defines default props for the RadioButton, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the RadioButton component.\n * @param ref - User provided ref to be passed to the RadioButton component.\n */\nexport const useToolbarRadioButton_unstable = (\n props: ToolbarRadioButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToolbarRadioButtonState => {\n const handleRadio = useToolbarContext_unstable(ctx => ctx.handleRadio);\n const checked = useToolbarContext_unstable(ctx => !!ctx.checkedValues[props.name]?.includes(props.value));\n const size = useToolbarContext_unstable(ctx => ctx.size);\n\n const { onClick: onClickOriginal } = props;\n const toggleButtonState = useToggleButton_unstable(\n { size, checked, role: 'radio', 'aria-checked': checked, ...props },\n ref,\n );\n const state: ToolbarRadioButtonState = {\n ...toggleButtonState,\n name: props.name,\n value: props.value,\n };\n\n const handleOnClick = useEventCallback(\n (e: React.MouseEvent<HTMLButtonElement, MouseEvent> & React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {\n handleRadio?.(e, state.name, state.value, state.checked);\n onClickOriginal?.(e);\n },\n );\n state.root['aria-pressed'] = undefined;\n state.root.onClick = handleOnClick;\n return state;\n};\n"],"names":["React","useEventCallback","useToggleButton_unstable","useToolbarContext_unstable","useToolbarRadioButton_unstable","props","ref","handleRadio","ctx","checked","checkedValues","name","includes","value","size","onClick","onClickOriginal","toggleButtonState","role","state","handleOnClick","e","root","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,wBAAwB,QAAQ,yBAAyB;AAClE,SAASC,0BAA0B,QAAQ,4BAA4B;AAGvE;;;;;CAKC,GACD,OAAO,MAAMC,iCAAiC,CAC5CC,OACAC;IAEA,MAAMC,cAAcJ,2BAA2BK,CAAAA,MAAOA,IAAID,WAAW;IACrE,MAAME,UAAUN,2BAA2BK,CAAAA;YAASA;eAAF,CAAC,GAACA,gCAAAA,IAAIE,aAAa,CAACL,MAAMM,IAAI,CAAC,cAA7BH,oDAAAA,8BAA+BI,QAAQ,CAACP,MAAMQ,KAAK;;IACvG,MAAMC,OAAOX,2BAA2BK,CAAAA,MAAOA,IAAIM,IAAI;IAEvD,MAAM,EAAEC,SAASC,eAAe,EAAE,GAAGX;IACrC,MAAMY,oBAAoBf,yBACxB;QAAEY;QAAML;QAASS,MAAM;QAAS,gBAAgBT;QAAS,GAAGJ,KAAK;IAAC,GAClEC;IAEF,MAAMa,QAAiC;QACrC,GAAGF,iBAAiB;QACpBN,MAAMN,MAAMM,IAAI;QAChBE,OAAOR,MAAMQ,KAAK;IACpB;IAEA,MAAMO,gBAAgBnB,iBACpB,CAACoB;QACCd,wBAAAA,kCAAAA,YAAcc,GAAGF,MAAMR,IAAI,EAAEQ,MAAMN,KAAK,EAAEM,MAAMV,OAAO;QACvDO,4BAAAA,sCAAAA,gBAAkBK;IACpB;IAEFF,MAAMG,IAAI,CAAC,eAAe,GAAGC;IAC7BJ,MAAMG,IAAI,CAACP,OAAO,GAAGK;IACrB,OAAOD;AACT,EAAE"}
@@ -0,0 +1,21 @@
import { tokens } from '@fluentui/react-theme';
import { __styles, mergeClasses } from '@griffel/react';
import { useToggleButtonStyles_unstable } from '@fluentui/react-button';
const useBaseStyles = /*#__PURE__*/__styles({
selected: {
sj55zd: "f16muhyy"
}
}, {
d: [".f16muhyy{color:var(--colorBrandForeground1);}"]
});
/**
* Apply styling to the ToolbarRadioButton slots based on the state
*/
export const useToolbarRadioButtonStyles_unstable = state => {
'use no memo';
useToggleButtonStyles_unstable(state);
const toggleButtonStyles = useBaseStyles();
state.root.className = mergeClasses(state.root.className, state.checked && toggleButtonStyles.selected);
return state;
};
@@ -0,0 +1 @@
{"version":3,"names":["tokens","__styles","mergeClasses","useToggleButtonStyles_unstable","useBaseStyles","selected","sj55zd","d","useToolbarRadioButtonStyles_unstable","state","toggleButtonStyles","root","className","checked"],"sources":["useToolbarRadioButtonStyles.styles.js"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nconst useBaseStyles = makeStyles({\n selected: {\n color: tokens.colorBrandForeground1\n }\n});\n/**\n * Apply styling to the ToolbarRadioButton slots based on the state\n */ export const useToolbarRadioButtonStyles_unstable = (state)=>{\n 'use no memo';\n useToggleButtonStyles_unstable(state);\n const toggleButtonStyles = useBaseStyles();\n state.root.className = mergeClasses(state.root.className, state.checked && toggleButtonStyles.selected);\n return state;\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAAAC,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,8BAA8B,QAAQ,wBAAwB;AACvE,MAAMC,aAAa,gBAAGH,QAAA;EAAAI,QAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,oCAAoC,GAAIC,KAAK,IAAG;EAC7D,aAAa;;EACbN,8BAA8B,CAACM,KAAK,CAAC;EACrC,MAAMC,kBAAkB,GAAGN,aAAa,CAAC,CAAC;EAC1CK,KAAK,CAACE,IAAI,CAACC,SAAS,GAAGV,YAAY,CAACO,KAAK,CAACE,IAAI,CAACC,SAAS,EAAEH,KAAK,CAACI,OAAO,IAAIH,kBAAkB,CAACL,QAAQ,CAAC;EACvG,OAAOI,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -0,0 +1,17 @@
import * as React from 'react';
import { renderToolbarGroup_unstable, useToolbarGroupStyles_unstable, useToolbarGroup_unstable } from '../../ToolbarGroup';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarRadioGroup component is a Button to be used inside Toolbar
* which will respect toolbar props such as `size`
*/ export const ToolbarRadioGroup = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarGroup_unstable({
role: 'radiogroup',
...props
}, ref);
useToolbarGroupStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarGroupStyles_unstable')(state);
return renderToolbarGroup_unstable(state);
// Casting is required due to lack of distributive union to support unions on @types/react
});
ToolbarRadioGroup.displayName = 'ToolbarRadioGroup';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioGroup/ToolbarRadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarRadioGroupProps } from './ToolbarRadioGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport {\n renderToolbarGroup_unstable,\n useToolbarGroupStyles_unstable,\n useToolbarGroup_unstable,\n} from '../../ToolbarGroup';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarRadioGroup component is a Button to be used inside Toolbar\n * which will respect toolbar props such as `size`\n */\nexport const ToolbarRadioGroup: ForwardRefComponent<ToolbarRadioGroupProps> = React.forwardRef((props, ref) => {\n const state = useToolbarGroup_unstable({ role: 'radiogroup', ...props }, ref);\n\n useToolbarGroupStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarGroupStyles_unstable')(state);\n\n return renderToolbarGroup_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToolbarRadioGroupProps>;\n\nToolbarRadioGroup.displayName = 'ToolbarRadioGroup';\n"],"names":["React","renderToolbarGroup_unstable","useToolbarGroupStyles_unstable","useToolbarGroup_unstable","useCustomStyleHook_unstable","ToolbarRadioGroup","forwardRef","props","ref","state","role","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SACEC,2BAA2B,EAC3BC,8BAA8B,EAC9BC,wBAAwB,QACnB,qBAAqB;AAC5B,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,kCAAiEL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACrG,MAAMC,QAAQN,yBAAyB;QAAEO,MAAM;QAAc,GAAGH,KAAK;IAAC,GAAGC;IAEzEN,+BAA+BO;IAE/BL,4BAA4B,kCAAkCK;IAE9D,OAAOR,4BAA4BQ;AACnC,0FAA0F;AAC5F,GAAkD;AAElDJ,kBAAkBM,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarButton
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioGroup/ToolbarRadioGroup.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ToolbarRadioGroupSlots = {\n root: Slot<'div'>;\n};\n\n/**\n * ToolbarButton Props\n */\nexport type ToolbarRadioGroupProps = ComponentProps<ToolbarRadioGroupSlots>;\n\n/**\n * State used in rendering ToolbarButton\n */\nexport type ToolbarRadioGroupState = ComponentState<ToolbarRadioGroupSlots>;\n"],"names":[],"rangeMappings":";;","mappings":"AAWA;;CAEC,GACD,WAA4E"}
@@ -0,0 +1 @@
export { ToolbarRadioGroup } from './ToolbarRadioGroup';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarRadioGroup/index.ts"],"sourcesContent":["export { ToolbarRadioGroup } from './ToolbarRadioGroup';\nexport type { ToolbarRadioGroupProps, ToolbarRadioGroupSlots, ToolbarRadioGroupState } from './ToolbarRadioGroup.types';\n"],"names":["ToolbarRadioGroup"],"rangeMappings":"","mappings":"AAAA,SAASA,iBAAiB,QAAQ,sBAAsB"}
@@ -0,0 +1,14 @@
import * as React from 'react';
import { renderToggleButton_unstable } from '@fluentui/react-button';
import { useToolbarToggleButton_unstable } from './useToolbarToggleButton';
import { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles.styles';
import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
/**
* ToolbarToggleButton component
*/ export const ToolbarToggleButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
const state = useToolbarToggleButton_unstable(props, ref);
useToolbarToggleButtonStyles_unstable(state);
useCustomStyleHook_unstable('useToolbarToggleButtonStyles_unstable')(state);
return renderToggleButton_unstable(state);
});
ToolbarToggleButton.displayName = 'ToolbarToggleButton';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarToggleButton/ToolbarToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ToolbarToggleButtonProps } from './ToolbarToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { renderToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarToggleButton_unstable } from './useToolbarToggleButton';\nimport { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToolbarToggleButton component\n */\nexport const ToolbarToggleButton: ForwardRefComponent<ToolbarToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToolbarToggleButton_unstable(props, ref);\n\n useToolbarToggleButtonStyles_unstable(state);\n\n useCustomStyleHook_unstable('useToolbarToggleButtonStyles_unstable')(state);\n\n return renderToggleButton_unstable(state);\n}) as ForwardRefComponent<ToolbarToggleButtonProps>;\n\nToolbarToggleButton.displayName = 'ToolbarToggleButton';\n"],"names":["React","renderToggleButton_unstable","useToolbarToggleButton_unstable","useToolbarToggleButtonStyles_unstable","useCustomStyleHook_unstable","ToolbarToggleButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC,2BAA2B,QAAQ,yBAAyB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,qCAAqC,QAAQ,wCAAwC;AAC9F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,oCAAqEL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzG,MAAMC,QAAQP,gCAAgCK,OAAOC;IAErDL,sCAAsCM;IAEtCL,4BAA4B,yCAAyCK;IAErE,OAAOR,4BAA4BQ;AACrC,GAAoD;AAEpDJ,oBAAoBK,WAAW,GAAG"}
@@ -0,0 +1,3 @@
/**
* State used in rendering ToolbarToggleButton
*/ export { };
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarToggleButton/ToolbarToggleButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { ToggleButtonProps, ButtonSlots, ToggleButtonState } from '@fluentui/react-button';\n\n/**\n * ToolbarToggleButton Props\n */\nexport type ToolbarToggleButtonProps = ComponentProps<ButtonSlots> &\n Partial<Pick<ToggleButtonProps, 'disabled' | 'disabledFocusable' | 'size'>> & {\n appearance?: 'primary' | 'subtle' | 'transparent';\n name: string;\n value: string;\n };\n\n/**\n * State used in rendering ToolbarToggleButton\n */\nexport type ToolbarToggleButtonState = ComponentState<Partial<ButtonSlots>> &\n ToggleButtonState &\n Required<Pick<ToggleButtonProps, 'checked'>> &\n Pick<ToolbarToggleButtonProps, 'name' | 'value'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAaA;;CAEC,GACD,WAGmD"}
@@ -0,0 +1,3 @@
export { ToolbarToggleButton } from './ToolbarToggleButton';
export { useToolbarToggleButton_unstable } from './useToolbarToggleButton';
export { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles.styles';
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarToggleButton/index.ts"],"sourcesContent":["export { ToolbarToggleButton } from './ToolbarToggleButton';\nexport type { ToolbarToggleButtonProps, ToolbarToggleButtonState } from './ToolbarToggleButton.types';\nexport { useToolbarToggleButton_unstable } from './useToolbarToggleButton';\nexport { useToolbarToggleButtonStyles_unstable } from './useToolbarToggleButtonStyles.styles';\n"],"names":["ToolbarToggleButton","useToolbarToggleButton_unstable","useToolbarToggleButtonStyles_unstable"],"rangeMappings":";;","mappings":"AAAA,SAASA,mBAAmB,QAAQ,wBAAwB;AAE5D,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,qCAAqC,QAAQ,wCAAwC"}
@@ -0,0 +1,36 @@
import * as React from 'react';
import { useToggleButton_unstable } from '@fluentui/react-button';
import { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';
/**
* Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns
* processed state.
* @param props - User provided props to the ToggleButton component.
* @param ref - User provided ref to be passed to the ToggleButton component.
*/ export const useToolbarToggleButton_unstable = (props, ref)=>{
const handleToggleButton = useToolbarContext_unstable((ctx)=>ctx.handleToggleButton);
const checked = useToolbarContext_unstable((ctx)=>{
var _ctx_checkedValues_props_name;
return !!((_ctx_checkedValues_props_name = ctx.checkedValues[props.name]) === null || _ctx_checkedValues_props_name === void 0 ? void 0 : _ctx_checkedValues_props_name.includes(props.value));
});
const { onClick: onClickOriginal } = props;
const toggleButtonState = useToggleButton_unstable({
checked,
...props
}, ref);
const state = {
...toggleButtonState,
name: props.name,
value: props.value
};
const handleOnClick = (e)=>{
if (state.disabled) {
e.preventDefault();
e.stopPropagation();
return;
}
handleToggleButton === null || handleToggleButton === void 0 ? void 0 : handleToggleButton(e, state.name, state.value, state.checked);
onClickOriginal === null || onClickOriginal === void 0 ? void 0 : onClickOriginal(e);
};
state.root.onClick = handleOnClick;
return state;
};
@@ -0,0 +1 @@
{"version":3,"sources":["../src/components/ToolbarToggleButton/useToolbarToggleButton.ts"],"sourcesContent":["import * as React from 'react';\nimport { useToggleButton_unstable } from '@fluentui/react-button';\nimport { useToolbarContext_unstable } from '../Toolbar/ToolbarContext';\nimport { ToolbarToggleButtonProps, ToolbarToggleButtonState } from './ToolbarToggleButton.types';\n\n/**\n * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the ToggleButton component.\n * @param ref - User provided ref to be passed to the ToggleButton component.\n */\nexport const useToolbarToggleButton_unstable = (\n props: ToolbarToggleButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToolbarToggleButtonState => {\n const handleToggleButton = useToolbarContext_unstable(ctx => ctx.handleToggleButton);\n const checked = useToolbarContext_unstable(ctx => !!ctx.checkedValues[props.name]?.includes(props.value));\n\n const { onClick: onClickOriginal } = props;\n const toggleButtonState = useToggleButton_unstable({ checked, ...props }, ref);\n const state: ToolbarToggleButtonState = {\n ...toggleButtonState,\n name: props.name,\n value: props.value,\n };\n\n const handleOnClick = (\n e: React.MouseEvent<HTMLButtonElement, MouseEvent> & React.MouseEvent<HTMLAnchorElement, MouseEvent>,\n ) => {\n if (state.disabled) {\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n handleToggleButton?.(e, state.name, state.value, state.checked);\n onClickOriginal?.(e);\n };\n\n state.root.onClick = handleOnClick;\n return state;\n};\n"],"names":["React","useToggleButton_unstable","useToolbarContext_unstable","useToolbarToggleButton_unstable","props","ref","handleToggleButton","ctx","checked","checkedValues","name","includes","value","onClick","onClickOriginal","toggleButtonState","state","handleOnClick","e","disabled","preventDefault","stopPropagation","root"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,yBAAyB;AAClE,SAASC,0BAA0B,QAAQ,4BAA4B;AAGvE;;;;;CAKC,GACD,OAAO,MAAMC,kCAAkC,CAC7CC,OACAC;IAEA,MAAMC,qBAAqBJ,2BAA2BK,CAAAA,MAAOA,IAAID,kBAAkB;IACnF,MAAME,UAAUN,2BAA2BK,CAAAA;YAASA;eAAF,CAAC,GAACA,gCAAAA,IAAIE,aAAa,CAACL,MAAMM,IAAI,CAAC,cAA7BH,oDAAAA,8BAA+BI,QAAQ,CAACP,MAAMQ,KAAK;;IAEvG,MAAM,EAAEC,SAASC,eAAe,EAAE,GAAGV;IACrC,MAAMW,oBAAoBd,yBAAyB;QAAEO;QAAS,GAAGJ,KAAK;IAAC,GAAGC;IAC1E,MAAMW,QAAkC;QACtC,GAAGD,iBAAiB;QACpBL,MAAMN,MAAMM,IAAI;QAChBE,OAAOR,MAAMQ,KAAK;IACpB;IAEA,MAAMK,gBAAgB,CACpBC;QAEA,IAAIF,MAAMG,QAAQ,EAAE;YAClBD,EAAEE,cAAc;YAChBF,EAAEG,eAAe;YACjB;QACF;QAEAf,+BAAAA,yCAAAA,mBAAqBY,GAAGF,MAAMN,IAAI,EAAEM,MAAMJ,KAAK,EAAEI,MAAMR,OAAO;QAC9DM,4BAAAA,sCAAAA,gBAAkBI;IACpB;IAEAF,MAAMM,IAAI,CAACT,OAAO,GAAGI;IACrB,OAAOD;AACT,EAAE"}
@@ -0,0 +1,21 @@
import { tokens } from '@fluentui/react-theme';
import { __styles, mergeClasses } from '@griffel/react';
import { useToggleButtonStyles_unstable } from '@fluentui/react-button';
const useBaseStyles = /*#__PURE__*/__styles({
selected: {
sj55zd: "f16muhyy"
}
}, {
d: [".f16muhyy{color:var(--colorBrandForeground1);}"]
});
/**
* Apply styling to the ToolbarToggleButton slots based on the state
*/
export const useToolbarToggleButtonStyles_unstable = state => {
'use no memo';
useToggleButtonStyles_unstable(state);
const toggleButtonStyles = useBaseStyles();
state.root.className = mergeClasses(state.root.className, state.checked && toggleButtonStyles.selected);
return state;
};
@@ -0,0 +1 @@
{"version":3,"names":["tokens","__styles","mergeClasses","useToggleButtonStyles_unstable","useBaseStyles","selected","sj55zd","d","useToolbarToggleButtonStyles_unstable","state","toggleButtonStyles","root","className","checked"],"sources":["useToolbarToggleButtonStyles.styles.js"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { useToggleButtonStyles_unstable } from '@fluentui/react-button';\nconst useBaseStyles = makeStyles({\n selected: {\n color: tokens.colorBrandForeground1\n }\n});\n/**\n * Apply styling to the ToolbarToggleButton slots based on the state\n */ export const useToolbarToggleButtonStyles_unstable = (state)=>{\n 'use no memo';\n useToggleButtonStyles_unstable(state);\n const toggleButtonStyles = useBaseStyles();\n state.root.className = mergeClasses(state.root.className, state.checked && toggleButtonStyles.selected);\n return state;\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAAAC,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,8BAA8B,QAAQ,wBAAwB;AACvE,MAAMC,aAAa,gBAAGH,QAAA;EAAAI,QAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIrB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,qCAAqC,GAAIC,KAAK,IAAG;EAC9D,aAAa;;EACbN,8BAA8B,CAACM,KAAK,CAAC;EACrC,MAAMC,kBAAkB,GAAGN,aAAa,CAAC,CAAC;EAC1CK,KAAK,CAACE,IAAI,CAACC,SAAS,GAAGV,YAAY,CAACO,KAAK,CAACE,IAAI,CAACC,SAAS,EAAEH,KAAK,CAACI,OAAO,IAAIH,kBAAkB,CAACL,QAAQ,CAAC;EACvG,OAAOI,KAAK;AAChB,CAAC","ignoreList":[]}
+7
View File
@@ -0,0 +1,7 @@
export { Toolbar, renderToolbar_unstable, toolbarClassNames, useToolbarStyles_unstable, useToolbar_unstable } from './Toolbar';
export { ToolbarButton, useToolbarButtonStyles_unstable, useToolbarButton_unstable } from './ToolbarButton';
export { ToolbarDivider, useToolbarDividerStyles_unstable, useToolbarDivider_unstable } from './ToolbarDivider';
export { ToolbarToggleButton, useToolbarToggleButtonStyles_unstable, useToolbarToggleButton_unstable } from './ToolbarToggleButton';
export { ToolbarRadioButton, useToolbarRadioButtonStyles_unstable, useToolbarRadioButton_unstable } from './ToolbarRadioButton';
export { ToolbarGroup, useToolbarGroupStyles_unstable, useToolbarGroup_unstable, renderToolbarGroup_unstable, toolbarGroupClassNames } from './ToolbarGroup';
export { ToolbarRadioGroup } from './ToolbarRadioGroup';
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Toolbar,\n renderToolbar_unstable,\n toolbarClassNames,\n useToolbarStyles_unstable,\n useToolbar_unstable,\n} from './Toolbar';\nexport type { ToolbarContextValue, ToolbarContextValues, ToolbarProps, ToolbarSlots, ToolbarState } from './Toolbar';\nexport { ToolbarButton, useToolbarButtonStyles_unstable, useToolbarButton_unstable } from './ToolbarButton';\nexport type { ToolbarButtonProps, ToolbarButtonState } from './ToolbarButton';\nexport { ToolbarDivider, useToolbarDividerStyles_unstable, useToolbarDivider_unstable } from './ToolbarDivider';\nexport type { ToolbarDividerProps, ToolbarDividerState } from './ToolbarDivider';\nexport {\n ToolbarToggleButton,\n useToolbarToggleButtonStyles_unstable,\n useToolbarToggleButton_unstable,\n} from './ToolbarToggleButton';\nexport type { ToolbarToggleButtonProps, ToolbarToggleButtonState } from './ToolbarToggleButton';\nexport {\n ToolbarRadioButton,\n useToolbarRadioButtonStyles_unstable,\n useToolbarRadioButton_unstable,\n} from './ToolbarRadioButton';\nexport type { ToolbarRadioButtonProps, ToolbarRadioButtonState } from './ToolbarRadioButton';\nexport {\n ToolbarGroup,\n useToolbarGroupStyles_unstable,\n useToolbarGroup_unstable,\n renderToolbarGroup_unstable,\n toolbarGroupClassNames,\n} from './ToolbarGroup';\nexport type { ToolbarGroupProps, ToolbarGroupState } from './ToolbarGroup';\nexport { ToolbarRadioGroup } from './ToolbarRadioGroup';\nexport type { ToolbarRadioGroupProps, ToolbarRadioGroupState } from './ToolbarRadioGroup';\n"],"names":["Toolbar","renderToolbar_unstable","toolbarClassNames","useToolbarStyles_unstable","useToolbar_unstable","ToolbarButton","useToolbarButtonStyles_unstable","useToolbarButton_unstable","ToolbarDivider","useToolbarDividerStyles_unstable","useToolbarDivider_unstable","ToolbarToggleButton","useToolbarToggleButtonStyles_unstable","useToolbarToggleButton_unstable","ToolbarRadioButton","useToolbarRadioButtonStyles_unstable","useToolbarRadioButton_unstable","ToolbarGroup","useToolbarGroupStyles_unstable","useToolbarGroup_unstable","renderToolbarGroup_unstable","toolbarGroupClassNames","ToolbarRadioGroup"],"rangeMappings":";;;;;;","mappings":"AAAA,SACEA,OAAO,EACPC,sBAAsB,EACtBC,iBAAiB,EACjBC,yBAAyB,EACzBC,mBAAmB,QACd,YAAY;AAEnB,SAASC,aAAa,EAAEC,+BAA+B,EAAEC,yBAAyB,QAAQ,kBAAkB;AAE5G,SAASC,cAAc,EAAEC,gCAAgC,EAAEC,0BAA0B,QAAQ,mBAAmB;AAEhH,SACEC,mBAAmB,EACnBC,qCAAqC,EACrCC,+BAA+B,QAC1B,wBAAwB;AAE/B,SACEC,kBAAkB,EAClBC,oCAAoC,EACpCC,8BAA8B,QACzB,uBAAuB;AAE9B,SACEC,YAAY,EACZC,8BAA8B,EAC9BC,wBAAwB,EACxBC,2BAA2B,EAC3BC,sBAAsB,QACjB,iBAAiB;AAExB,SAASC,iBAAiB,QAAQ,sBAAsB"}