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
@@ -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":[]}