@fluentui/react-spinbutton 9.0.8 → 9.0.10

package/lib-amd/components/SpinButton/useSpinButtonStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSpinButtonStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButton/useSpinButtonStyles.ts"],"names":[],"mappings":";;;;;IAMa,QAAA,oBAAoB,GAAoC;QACnE,IAAI,EAAE,gBAAgB;QACtB,KAAK,EAAE,uBAAuB;QAC9B,eAAe,EAAE,iCAAiC;QAClD,eAAe,EAAE,iCAAiC;KACnD,CAAC;IAEF,IAAM,yBAAyB,GAAG;QAChC,YAAY,EAAE,+BAA+B;KAC9C,CAAC;IAEF,IAAM,aAAa,GAAG,kBAAU,CAAC;QAC/B,IAAI,sCACF,OAAO,EAAE,aAAa,EACtB,mBAAmB,EAAE,UAAU,EAC/B,gBAAgB,EAAE,SAAS,EAC3B,SAAS,EAAE,oBAAM,CAAC,mBAAmB,EACrC,MAAM,EAAE,CAAC,EACT,YAAY,EAAE,CAAC,EACf,QAAQ,EAAE,UAAU,IAEjB,kBAAU,CAAC,MAAM,CAAC,GAAG,CAAC,KACzB,SAAS,EAAE,SAAS;YAEpB,sDAAsD;YACtD,oDAAoD;YACpD,2BAA2B;YAC3B,yDAAyD;YACzD,2DAA2D;YAC3D,6DAA6D;YAC7D,2DAA2D;YAC3D,6DAA6D;YAC7D,qCAAqC;YACrC,+DAA+D;YAC/D,sEAAsE;YACtE,UAAU,sCACR,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,YAAY,EACvB,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,CAAC,EACN,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,CAAC,EACT,IAAI,EAAE,CAAC,IACJ,kBAAU,CAAC,YAAY,CAAC,oBAAM,CAAC,kBAAkB,CAAC,KACrD,aAAa,EAAE,MAAM,EACrB,MAAM,EAAE,EAAE,KAGZ,SAAS,EAAE;gBACT,KAAK,EAAE,CAAC;gBACR,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,CAAC;gBACP,MAAM,EAAE,EAAE;aACX,GACF;QAED,KAAK,EAAE;YACL,WAAW,EAAE,oBAAM,CAAC,kBAAkB;SACvC;QAED,sBAAsB;QACtB,MAAM,EAAE,EAAE;QAEV,OAAO,EAAE;YACP,UAAU,wCACL,kBAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,oBAAM,CAAC,mBAAmB,CAAC,KAChE,iBAAiB,EAAE,oBAAM,CAAC,4BAA4B,GACvD;SACF;QAED,kBAAkB,EAAE;YAClB,QAAQ,EAAE;gBACR,UAAU,wCACL,kBAAU,CAAC,WAAW,CAAC,oBAAM,CAAC,wBAAwB,CAAC,KAC1D,iBAAiB,EAAE,oBAAM,CAAC,iCAAiC,GAC5D;aACF;YACD,oFAAoF;YACpF,uBAAuB,EAAE;gBACvB,UAAU,wCACL,kBAAU,CAAC,WAAW,CAAC,oBAAM,CAAC,0BAA0B,CAAC,KAC5D,iBAAiB,EAAE,oBAAM,CAAC,mCAAmC,GAC9D;aACF;SACF;QAED,SAAS,EAAE;YACT,UAAU,wCACL,kBAAU,CAAC,YAAY,CAAC,CAAC,CAAC,GAC1B,kBAAU,CAAC,YAAY,CAAC,KAAK,EAAE,OAAO,EAAE,oBAAM,CAAC,4BAA4B,CAAC,CAChF;SACF;QAED,oBAAoB,EAAE;YACpB,QAAQ,EAAE;gBACR,UAAU,EAAE;oBACV,iBAAiB,EAAE,oBAAM,CAAC,iCAAiC;iBAC5D;aACF;YACD,oFAAoF;YACpF,uBAAuB,EAAE;gBACvB,UAAU,EAAE;oBACV,iBAAiB,EAAE,oBAAM,CAAC,mCAAmC;iBAC9D;aACF;SACF;QAED,MAAM,EAAE;YACN,UAAU,uBACL,kBAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,oBAAM,CAAC,sBAAsB,CAAC,CACpE;SACF;QAED,iBAAiB,EAAE;YACjB,oFAAoF;YACpF,sBAAsB,EAAE;gBACtB,UAAU,uBAEL,kBAAU,CAAC,WAAW,CAAC,oBAAM,CAAC,iCAAiC,CAAC,CACpE;aACF;SACF;QAED,OAAO,EAAE;YACP,+CAA+C,EAAE;gBAC/C,UAAU,uBACL,kBAAU,CAAC,WAAW,CAAC,oBAAM,CAAC,sBAAsB,CAAC,CACzD;aACF;SACF;QAED,QAAQ,EAAE;YACR,UAAU,wCACL,kBAAU,CAAC,WAAW,CAAC,oBAAM,CAAC,0BAA0B,CAAC,KAE5D,gCAAgC,uBAC3B,kBAAU,CAAC,WAAW,CAAC,UAAU,CAAC,IAExC;SACF;KACF,CAAC,CAAC;IAEH,IAAM,cAAc,GAAG,kBAAU,CAAC;QAChC,IAAI,qBACF,eAAe,EAAE,GAAG,EACpB,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,GAAG,EACf,YAAY,EAAE,MAAM,IACjB,kBAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CACzB;KACF,CAAC,CAAC;IAEH,IAAM,eAAe,GAAG,kBAAU,CAAC;QACjC,IAAI,sCACF,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,MAAM,EACb,UAAU,EAAE,QAAQ,EACpB,cAAc,EAAE,QAAQ,IACrB,kBAAU,CAAC,MAAM,CAAC,CAAC,CAAC,KACvB,QAAQ,EAAE,UAAU,EAEpB,YAAY,EAAE,MAAM,EACpB,MAAM,EAAE,MAAM,EAEd,gBAAgB,EAAE;gBAChB,MAAM,EAAE,SAAS;aAClB,EAED,SAAS,EAAE;gBACT,YAAY,EAAE,MAAM;aACrB,EAED,WAAW,EAAE;gBACX,MAAM,EAAE,aAAa;aACtB,GACF;QAED,eAAe,qBACb,eAAe,EAAE,GAAG,EACpB,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,GAAG,IACZ,kBAAU,CAAC,YAAY,CAAC,CAAC,EAAE,oBAAM,CAAC,kBAAkB,EAAE,CAAC,EAAE,CAAC,CAAC,CAC/D;QAED,uDAAuD;QACvD,mCAAmC;QACnC,2EAA2E;QAC3E,gDAAgD;QAChD,8DAA8D;QAC9D,kCAAkC;QAClC,oBAAoB,uBACf,kBAAU,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAClD;QAED,qBAAqB,uBAChB,kBAAU,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAClD;QAED,eAAe,qBACb,eAAe,EAAE,GAAG,EACpB,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,GAAG,IACZ,kBAAU,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,oBAAM,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAC/D;QAED,oBAAoB,uBACf,kBAAU,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAClD;QAED,qBAAqB,uBAChB,kBAAU,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAClD;QAED,OAAO,EAAE;YACP,eAAe,EAAE,aAAa;YAC9B,KAAK,EAAE,oBAAM,CAAC,uBAAuB;YACrC,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,4BAA4B;wBAC1C,eAAe,EAAE,oBAAM,CAAC,0BAA0B;qBACnD;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;qBACrD;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;iBACrD;mBACF;YACD,WAAW,EAAE;gBACX,KAAK,EAAE,oBAAM,CAAC,8BAA8B;aAC7C;SACF;QAED,SAAS,EAAE;YACT,eAAe,EAAE,aAAa;YAC9B,KAAK,EAAE,oBAAM,CAAC,uBAAuB;YACrC,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,4BAA4B;wBAC1C,eAAe,EAAE,oBAAM,CAAC,0BAA0B;qBACnD;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;qBACrD;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;iBACrD;mBACF;YACD,WAAW,EAAE;gBACX,KAAK,EAAE,oBAAM,CAAC,8BAA8B;aAC7C;SACF;QACD,eAAe,EAAE;YACf,eAAe,EAAE,aAAa;YAC9B,KAAK,EAAE,oBAAM,CAAC,uBAAuB;YAErC,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,4BAA4B;wBAC1C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;qBACrD;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,oBAAM,CAAC,8BAA8B;qBACvD;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,oBAAM,CAAC,8BAA8B;iBACvD;mBACF;YACD,WAAW,EAAE;gBACX,KAAK,EAAE,oBAAM,CAAC,8BAA8B;aAC7C;SACF;QACD,gBAAgB,EAAE;YAChB,eAAe,EAAE,aAAa;YAC9B,KAAK,EAAE,oBAAM,CAAC,uBAAuB;YAErC,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,4BAA4B;wBAC1C,eAAe,EAAE,oBAAM,CAAC,4BAA4B;qBACrD;;gBACD,GAAC,eAAa,yBAAyB,CAAC,YAAc,IAAG;oBACvD,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,oBAAM,CAAC,8BAA8B;iBACvD;mBACF;YACD,WAAW,EAAE;gBACX,KAAK,EAAE,oBAAM,CAAC,8BAA8B;aAC7C;SACF;KACF,CAAC,CAAC;IAEH,oDAAoD;IACpD,sCAAsC;IACtC,IAAM,uBAAuB,GAAG,kBAAU,CAAC;QACzC,IAAI,EAAE;YACJ,MAAM,EAAE,aAAa;YAErB,QAAQ,EAAE;gBACR,MAAM,EAAE,aAAa;aACtB;SACF;QAED,OAAO,EAAE;YACP,KAAK,EAAE,oBAAM,CAAC,8BAA8B;YAC5C,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,aAAa;iBAC/B;mBACF;SACF;QAED,SAAS,EAAE;YACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;YAC5C,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,aAAa;iBAC/B;mBACF;SACF;QAED,eAAe,EAAE;YACf,KAAK,EAAE,oBAAM,CAAC,8BAA8B;YAC5C,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,aAAa;iBAC/B;mBACF;SACF;QAED,gBAAgB,EAAE;YAChB,KAAK,EAAE,oBAAM,CAAC,8BAA8B;YAC5C,UAAU;oBACR,QAAQ,EAAE;wBACR,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;oBACD,SAAS,EAAE;wBACT,KAAK,EAAE,oBAAM,CAAC,8BAA8B;wBAC5C,eAAe,EAAE,aAAa;qBAC/B;;gBACD,GAAC,OAAK,yBAAyB,CAAC,YAAc,IAAG;oBAC/C,KAAK,EAAE,oBAAM,CAAC,8BAA8B;oBAC5C,eAAe,EAAE,aAAa;iBAC/B;mBACF;SACF;KACF,CAAC,CAAC;IAEH;;OAEG;IACI,IAAM,4BAA4B,GAAG,UAAC,KAAsB;QACzD,IAAA,UAAU,GAA+B,KAAK,WAApC,EAAE,OAAO,GAAsB,KAAK,QAA3B,EAAE,SAAS,GAAW,KAAK,UAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QACvD,IAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC;QACtC,IAAM,OAAO,GAAG,KAAG,KAAK,CAAC,KAAK,CAAC,cAAc,CAAG,KAAK,MAAM,CAAC;QAC5D,IAAM,MAAM,GAAG,UAAU,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QAE/C,IAAM,UAAU,GAAG,aAAa,EAAE,CAAC;QACnC,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;QACvC,IAAM,oBAAoB,GAAG,uBAAuB,EAAE,CAAC;QACvD,IAAM,WAAW,GAAG,cAAc,EAAE,CAAC;QAErC,kEAAkE;QAClE,IAAM,aAAa,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC;QAC3C,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QACjC,mEAAmE;QACnE,qCAAuB,CAAC;YACtB,IAAI,MAAA;YACJ,UAAU,YAAA;YACV,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,IAAI,EAAE,KAAK,CAAC,IAAI;YAChB,UAAU,EAAE;gBACV,IAAI,EAAE,MAAM;gBACZ,KAAK,EAAE,OAAO;gBACd,aAAa,EAAE,MAAM;gBACrB,YAAY,EAAE,MAAM;aACrB;SACF,CAAC,CAAC;QAEH,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,oBAAY,CACjC,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE,+CAA+C;QACrE,4BAAoB,CAAC,IAAI,EACzB,UAAU,CAAC,IAAI,EACf,UAAU,CAAC,IAAI,CAAC,EAChB,UAAU,KAAK,SAAS,IAAI,UAAU,CAAC,OAAO,EAC9C,UAAU,KAAK,WAAW,IAAI,UAAU,CAAC,SAAS,EAClD,MAAM,IAAI,UAAU,CAAC,MAAM,EAC3B,CAAC,QAAQ,IAAI,UAAU,KAAK,SAAS,IAAI,UAAU,CAAC,kBAAkB,EACtE,CAAC,QAAQ,IAAI,UAAU,KAAK,WAAW,IAAI,UAAU,CAAC,oBAAoB,EAC1E,CAAC,QAAQ,IAAI,MAAM,IAAI,UAAU,CAAC,iBAAiB,EACnD,CAAC,QAAQ,IAAI,OAAO,IAAI,UAAU,CAAC,OAAO,EAC1C,QAAQ,IAAI,UAAU,CAAC,QAAQ,EAC/B,aAAa,CACd,CAAC;QAEF,KAAK,CAAC,eAAe,CAAC,SAAS,GAAG,oBAAY,CAC5C,4BAAoB,CAAC,eAAe,EACpC,SAAS,KAAK,IAAI,IAAI,KAAG,yBAAyB,CAAC,YAAc,EACjE,YAAY,CAAC,IAAI,EACjB,YAAY,CAAC,eAAe,EAC5B,YAAY,CAAC,UAAU,CAAC,EACxB,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,CAAC,YAAY,CAAC,qBAAqB,EACzF,CAAC,OAAO,KAAK,KAAK,IAAI,OAAO,KAAK,MAAM,CAAC,IAAI,oBAAoB,CAAC,IAAI,EACtE,CAAC,OAAO,KAAK,KAAK,IAAI,OAAO,KAAK,MAAM,CAAC,IAAI,oBAAoB,CAAC,UAAU,CAAC,EAC7E,KAAK,CAAC,eAAe,CAAC,SAAS,CAChC,CAAC;QACF,KAAK,CAAC,eAAe,CAAC,SAAS,GAAG,oBAAY,CAC5C,4BAAoB,CAAC,eAAe,EACpC,SAAS,KAAK,MAAM,IAAI,KAAG,yBAAyB,CAAC,YAAc,EACnE,YAAY,CAAC,IAAI,EACjB,YAAY,CAAC,eAAe,EAC5B,YAAY,CAAC,UAAU,CAAC,EACxB,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,CAAC,YAAY,CAAC,qBAAqB,EACzF,CAAC,OAAO,KAAK,KAAK,IAAI,OAAO,KAAK,MAAM,CAAC,IAAI,oBAAoB,CAAC,IAAI,EACtE,CAAC,OAAO,KAAK,KAAK,IAAI,OAAO,KAAK,MAAM,CAAC,IAAI,oBAAoB,CAAC,UAAU,CAAC,EAC7E,KAAK,CAAC,eAAe,CAAC,SAAS,CAChC,CAAC;QAEF,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,oBAAY,CAAC,4BAAoB,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;QAE1G,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAtEW,QAAA,4BAA4B,gCAsEvC","sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';\nimport { tokens } from '@fluentui/react-theme';\nimport { useInputStyles_unstable } from '@fluentui/react-input';\n\nexport const spinButtonClassNames: SlotClassNames<SpinButtonSlots> = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton',\n};\n\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active',\n};\n\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'inline-grid',\n    gridTemplateColumns: `1fr 24px`,\n    gridTemplateRows: '1fr 1fr',\n    columnGap: tokens.spacingHorizontalXS,\n    rowGap: 0,\n    paddingRight: 0,\n    position: 'relative',\n    // Remove the border styles from react-input\n    ...shorthands.border('0'),\n    isolation: 'isolate',\n\n    // Apply border styles on the ::before pseudo element.\n    // We cannot use ::after since react-input uses that\n    // for the selector styles.\n    // Using the pseudo element allows us to place the border\n    // above content in the component which ensures the buttons\n    // line up visually with the border as expected. Without this\n    // there is a bit of a gap which can become very noticeable\n    // at high zoom or when OS zoom levels are not divisible by 2\n    // (e.g., 150% on Windows in Firefox)\n    // This is most noticeable on the \"outline\" appearance which is\n    // also the default so it feels worth the extra ceremony to get right.\n    '::before': {\n      content: '\"\"',\n      boxSizing: 'border-box',\n      position: 'absolute',\n      top: 0,\n      right: 0,\n      bottom: 0,\n      left: 0,\n      ...shorthands.borderRadius(tokens.borderRadiusMedium),\n      pointerEvents: 'none',\n      zIndex: 10,\n    },\n\n    '::after': {\n      right: 0,\n      bottom: 0,\n      left: 0,\n      zIndex: 20,\n    },\n  },\n\n  small: {\n    paddingLeft: tokens.spacingHorizontalS,\n  },\n\n  // intentionally empty\n  medium: {},\n\n  outline: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke1),\n      borderBottomColor: tokens.colorNeutralStrokeAccessible,\n    },\n  },\n\n  outlineInteractive: {\n    ':hover': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  underline: {\n    '::before': {\n      ...shorthands.borderRadius(0), // corners look strange if rounded\n      ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n    },\n  },\n\n  underlineInteractive: {\n    ':hover': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  filled: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n    },\n  },\n\n  filledInteractive: {\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':hover,:focus-within': {\n      '::before': {\n        // also handles pressed border color (:active)\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n      },\n    },\n  },\n\n  invalid: {\n    ':not(:focus-within),:hover:not(:focus-within)': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n      },\n    },\n  },\n\n  disabled: {\n    '::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n      '@media (forced-colors: active)': {\n        ...shorthands.borderColor('GrayText'),\n      },\n    },\n  },\n});\n\nconst useInputStyles = makeStyles({\n  base: {\n    gridColumnStart: '1',\n    gridColumnEnd: '2',\n    gridRowStart: '1',\n    gridRowEnd: '3',\n    outlineStyle: 'none',\n    ...shorthands.padding(0),\n  },\n});\n\nconst useButtonStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    width: '24px',\n    alignItems: 'center',\n    justifyContent: 'center',\n    ...shorthands.border(0),\n    position: 'absolute',\n\n    outlineStyle: 'none',\n    height: '100%',\n\n    ':enabled:hover': {\n      cursor: 'pointer',\n    },\n\n    ':active': {\n      outlineStyle: 'none',\n    },\n\n    ':disabled': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  incrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '1',\n    gridRowEnd: '2',\n    ...shorthands.borderRadius(0, tokens.borderRadiusMedium, 0, 0),\n  },\n\n  // Padding values numbers don't align with design specs\n  // but visually the padding aligns.\n  // The icons are set in a 16x16px square but the artwork is inset from that\n  // so these padding values are computed by hand.\n  // Additionally the design uses fractional values so these are\n  // rounded to the nearest integer.\n  incrementButtonSmall: {\n    ...shorthands.padding('3px', '6px', '0px', '4px'),\n  },\n\n  incrementButtonMedium: {\n    ...shorthands.padding('4px', '5px', '1px', '5px'),\n  },\n\n  decrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '2',\n    gridRowEnd: '3',\n    ...shorthands.borderRadius(0, 0, tokens.borderRadiusMedium, 0),\n  },\n\n  decrementButtonSmall: {\n    ...shorthands.padding('0px', '6px', '3px', '4px'),\n  },\n\n  decrementButtonMedium: {\n    ...shorthands.padding('1px', '5px', '4px', '5px'),\n  },\n\n  outline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n\n  underline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-darker': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground3Hover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-lighter': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground1Hover,\n      },\n      [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground1Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n  base: {\n    cursor: 'not-allowed',\n\n    ':hover': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  outline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  underline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-darker': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-lighter': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = (state: SpinButtonState): SpinButtonState => {\n  const { appearance, atBound, spinState, size } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n\n  // Grab the root className here so we can be sure to merge is last\n  const rootClassName = state.root.className;\n  state.root.className = undefined;\n  // Reuse react-input's styles without re-using the Input component.\n  useInputStyles_unstable({\n    size,\n    appearance,\n    input: state.input,\n    root: state.root,\n    components: {\n      root: 'span',\n      input: 'input',\n      contentBefore: 'span',\n      contentAfter: 'span',\n    },\n  });\n\n  state.root.className = mergeClasses(\n    state.root.className, // Get the classes from useInputStyles_unstable\n    spinButtonClassNames.root,\n    rootStyles.base,\n    rootStyles[size],\n    appearance === 'outline' && rootStyles.outline,\n    appearance === 'underline' && rootStyles.underline,\n    filled && rootStyles.filled,\n    !disabled && appearance === 'outline' && rootStyles.outlineInteractive,\n    !disabled && appearance === 'underline' && rootStyles.underlineInteractive,\n    !disabled && filled && rootStyles.filledInteractive,\n    !disabled && invalid && rootStyles.invalid,\n    disabled && rootStyles.disabled,\n    rootClassName, // Make sure any original class name is applied last\n  );\n\n  state.incrementButton.className = mergeClasses(\n    spinButtonClassNames.incrementButton,\n    spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.incrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.incrementButtonSmall : buttonStyles.incrementButtonMedium,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.incrementButton.className,\n  );\n  state.decrementButton.className = mergeClasses(\n    spinButtonClassNames.decrementButton,\n    spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.decrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.decrementButtonSmall : buttonStyles.decrementButtonMedium,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.decrementButton.className,\n  );\n\n  state.input.className = mergeClasses(spinButtonClassNames.input, state.input.className, inputStyles.base);\n\n  return state;\n};\n"]}

package/lib-amd/components/SpinButtonField/SpinButtonField.js

@@ -0,0 +1,13 @@
+define(["require", "exports", "react", "@fluentui/react-field", "../../SpinButton"], function (require, exports, React, react_field_1, SpinButton_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.SpinButtonField = exports.spinButtonFieldClassNames = void 0;
+    exports.spinButtonFieldClassNames = react_field_1.getFieldClassNames('SpinButtonField');
+    exports.SpinButtonField = React.forwardRef(function (props, ref) {
+        var state = react_field_1.useField_unstable(props, ref, { component: SpinButton_1.SpinButton, classNames: exports.spinButtonFieldClassNames });
+        react_field_1.useFieldStyles_unstable(state);
+        return react_field_1.renderField_unstable(state);
+    });
+    exports.SpinButtonField.displayName = 'SpinButtonField';
+});
+//# sourceMappingURL=SpinButtonField.js.map

package/lib-amd/components/SpinButtonField/SpinButtonField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpinButtonField.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButtonField/SpinButtonField.tsx"],"names":[],"mappings":";;;;IAaa,QAAA,yBAAyB,GAAG,gCAAkB,CAAC,iBAAiB,CAAC,CAAC;IAElE,QAAA,eAAe,GAA8C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACpG,IAAM,KAAK,GAAG,+BAAiB,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,SAAS,EAAE,uBAAU,EAAE,UAAU,EAAE,iCAAyB,EAAE,CAAC,CAAC;QAC9G,qCAAuB,CAAC,KAAK,CAAC,CAAC;QAC/B,OAAO,kCAAoB,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,uBAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["import * as React from 'react';\nimport type { FieldProps } from '@fluentui/react-field';\nimport {\n  getFieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n} from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { SpinButton } from '../../SpinButton';\n\nexport type SpinButtonFieldProps = FieldProps<typeof SpinButton>;\n\nexport const spinButtonFieldClassNames = getFieldClassNames('SpinButtonField');\n\nexport const SpinButtonField: ForwardRefComponent<SpinButtonFieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref, { component: SpinButton, classNames: spinButtonFieldClassNames });\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nSpinButtonField.displayName = 'SpinButtonField';\n"]}

package/lib-amd/components/SpinButtonField/index.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./SpinButtonField"], function (require, exports, tslib_1, SpinButtonField_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(SpinButtonField_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/SpinButtonField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinbutton/src/components/SpinButtonField/index.ts"],"names":[],"mappings":";;;IAAA,iDAAkC","sourcesContent":["export * from './SpinButtonField';\n"]}

package/lib-amd/index.js

@@ -0,0 +1,13 @@
+define(["require", "exports", "./SpinButton", "./SpinButtonField"], function (require, exports, SpinButton_1, SpinButtonField_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.spinButtonFieldClassNames = exports.SpinButtonField_unstable = exports.useSpinButton_unstable = exports.useSpinButtonStyles_unstable = exports.spinButtonClassNames = exports.renderSpinButton_unstable = exports.SpinButton = void 0;
+    Object.defineProperty(exports, "SpinButton", { enumerable: true, get: function () { return SpinButton_1.SpinButton; } });
+    Object.defineProperty(exports, "renderSpinButton_unstable", { enumerable: true, get: function () { return SpinButton_1.renderSpinButton_unstable; } });
+    Object.defineProperty(exports, "spinButtonClassNames", { enumerable: true, get: function () { return SpinButton_1.spinButtonClassNames; } });
+    Object.defineProperty(exports, "useSpinButtonStyles_unstable", { enumerable: true, get: function () { return SpinButton_1.useSpinButtonStyles_unstable; } });
+    Object.defineProperty(exports, "useSpinButton_unstable", { enumerable: true, get: function () { return SpinButton_1.useSpinButton_unstable; } });
+    Object.defineProperty(exports, "SpinButtonField_unstable", { enumerable: true, get: function () { return SpinButtonField_1.SpinButtonField; } });
+    Object.defineProperty(exports, "spinButtonFieldClassNames", { enumerable: true, get: function () { return SpinButtonField_1.spinButtonFieldClassNames; } });
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinbutton/src/index.ts"],"names":[],"mappings":";;;;IACE,wGAAA,UAAU,OAAA;IACV,uHAAA,yBAAyB,OAAA;IACzB,kHAAA,oBAAoB,OAAA;IACpB,0HAAA,4BAA4B,OAAA;IAC5B,oHAAA,sBAAsB,OAAA;IAYf,2HAAA,eAAe,OAA4B;IAAE,4HAAA,yBAAyB,OAAA","sourcesContent":["export {\n  SpinButton,\n  renderSpinButton_unstable,\n  spinButtonClassNames,\n  useSpinButtonStyles_unstable,\n  useSpinButton_unstable,\n} from './SpinButton';\nexport type {\n  SpinButtonOnChangeData,\n  SpinButtonChangeEvent,\n  SpinButtonProps,\n  SpinButtonSlots,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonBounds,\n} from './SpinButton';\n\nexport { SpinButtonField as SpinButtonField_unstable, spinButtonFieldClassNames } from './SpinButtonField';\nexport type { SpinButtonFieldProps as SpinButtonFieldProps_unstable } from './SpinButtonField';\n"]}

package/lib-amd/utils/clamp.js

@@ -0,0 +1,30 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.clamp = void 0;
+    var clamp = function (value, min, max) {
+        var nextValue = value;
+        if (min !== undefined) {
+            if (max !== undefined && min > max) {
+                var error = new Error();
+                if (process.env.NODE_ENV !== 'production') {
+                    // eslint-disable-next-line no-console
+                    console.error([
+                        "\"min\" value \"" + min + "\" is greater than \"max\" value \"" + max + "\".",
+                        '"min" must be less than or equal to "max".',
+                        "Returning value \"" + value + "\".",
+                        error.stack,
+                    ].join());
+                }
+                return value;
+            }
+            nextValue = Math.max(min, nextValue);
+        }
+        if (max !== undefined) {
+            nextValue = Math.min(max, nextValue);
+        }
+        return nextValue;
+    };
+    exports.clamp = clamp;
+});
+//# sourceMappingURL=clamp.js.map

package/lib-amd/utils/clamp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clamp.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-spinbutton/src/utils/clamp.ts"],"names":[],"mappings":";;;;IAAO,IAAM,KAAK,GAAG,UAAC,KAAa,EAAE,GAAY,EAAE,GAAY;QAC7D,IAAI,SAAS,GAAG,KAAK,CAAC;QACtB,IAAI,GAAG,KAAK,SAAS,EAAE;YACrB,IAAI,GAAG,KAAK,SAAS,IAAI,GAAG,GAAG,GAAG,EAAE;gBAClC,IAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;gBAC1B,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;oBACzC,sCAAsC;oBACtC,OAAO,CAAC,KAAK,CACX;wBACE,qBAAgB,GAAG,2CAAkC,GAAG,QAAI;wBAC5D,4CAA4C;wBAC5C,uBAAoB,KAAK,QAAI;wBAC7B,KAAK,CAAC,KAAK;qBACZ,CAAC,IAAI,EAAE,CACT,CAAC;iBACH;gBACD,OAAO,KAAK,CAAC;aACd;YAED,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS,CAAC,CAAC;SACtC;QAED,IAAI,GAAG,KAAK,SAAS,EAAE;YACrB,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS,CAAC,CAAC;SACtC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC,CAAC;IA3BW,QAAA,KAAK,SA2BhB","sourcesContent":["export const clamp = (value: number, min?: number, max?: number): number => {\n  let nextValue = value;\n  if (min !== undefined) {\n    if (max !== undefined && min > max) {\n      const error = new Error();\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error(\n          [\n            `\"min\" value \"${min}\" is greater than \"max\" value \"${max}\".`,\n            '\"min\" must be less than or equal to \"max\".',\n            `Returning value \"${value}\".`,\n            error.stack,\n          ].join(),\n        );\n      }\n      return value;\n    }\n\n    nextValue = Math.max(min, nextValue);\n  }\n\n  if (max !== undefined) {\n    nextValue = Math.min(max, nextValue);\n  }\n\n  return nextValue;\n};\n"]}

package/lib-amd/utils/getBound.js

@@ -0,0 +1,19 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.getBound = void 0;
+    var getBound = function (value, min, max) {
+        if (min !== undefined && value === min) {
+            if (max === min) {
+                return 'both';
+            }
+            return 'min';
+        }
+        else if (max !== undefined && value === max) {
+            return 'max';
+        }
+        return 'none';
+    };
+    exports.getBound = getBound;
+});
+//# sourceMappingURL=getBound.js.map

package/lib-amd/utils/getBound.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getBound.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-spinbutton/src/utils/getBound.ts"],"names":[],"mappings":";;;;IAEO,IAAM,QAAQ,GAAG,UAAC,KAAa,EAAE,GAAY,EAAE,GAAY;QAChE,IAAI,GAAG,KAAK,SAAS,IAAI,KAAK,KAAK,GAAG,EAAE;YACtC,IAAI,GAAG,KAAK,GAAG,EAAE;gBACf,OAAO,MAAM,CAAC;aACf;YACD,OAAO,KAAK,CAAC;SACd;aAAM,IAAI,GAAG,KAAK,SAAS,IAAI,KAAK,KAAK,GAAG,EAAE;YAC7C,OAAO,KAAK,CAAC;SACd;QAED,OAAO,MAAM,CAAC;IAChB,CAAC,CAAC;IAXW,QAAA,QAAQ,YAWnB","sourcesContent":["import type { SpinButtonBounds } from '../SpinButton';\n\nexport const getBound = (value: number, min?: number, max?: number): SpinButtonBounds => {\n  if (min !== undefined && value === min) {\n    if (max === min) {\n      return 'both';\n    }\n    return 'min';\n  } else if (max !== undefined && value === max) {\n    return 'max';\n  }\n\n  return 'none';\n};\n"]}

package/lib-amd/utils/index.js

@@ -0,0 +1,8 @@
+define(["require", "exports", "tslib", "./clamp", "./getBound", "./precision"], function (require, exports, tslib_1, clamp_1, getBound_1, precision_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(clamp_1, exports);
+    tslib_1.__exportStar(getBound_1, exports);
+    tslib_1.__exportStar(precision_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-spinbutton/src/utils/index.ts"],"names":[],"mappings":";;;IAAA,uCAAwB;IACxB,0CAA2B;IAC3B,2CAA4B","sourcesContent":["export * from './clamp';\nexport * from './getBound';\nexport * from './precision';\n"]}

package/lib-amd/utils/precision.js

@@ -0,0 +1,44 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.precisionRound = exports.calculatePrecision = void 0;
+    /**
+     * Calculates a number's precision based on the number of trailing
+     * zeros if the number does not have a decimal indicated by a negative
+     * precision. Otherwise, it calculates the number of digits after
+     * the decimal point indicated by a positive precision.
+     * @param value - the value to determine the precision of
+     */
+    function calculatePrecision(value) {
+        /**
+         * Group 1:
+         * [1-9]([0]+$) matches trailing zeros
+         * Group 2:
+         * \.([0-9]*) matches all digits after a decimal point.
+         */
+        var groups = /[1-9]([0]+$)|\.([0-9]*)/.exec(String(value));
+        if (!groups) {
+            return 0;
+        }
+        if (groups[1]) {
+            return -groups[1].length;
+        }
+        if (groups[2]) {
+            return groups[2].length;
+        }
+        return 0;
+    }
+    exports.calculatePrecision = calculatePrecision;
+    /**
+     * Rounds a number to a certain level of precision. Accepts negative precision.
+     * @param value - The value that is being rounded.
+     * @param precision - The number of decimal places to round the number to
+     */
+    function precisionRound(value, precision, base) {
+        if (base === void 0) { base = 10; }
+        var exp = Math.pow(base, precision);
+        return Math.round(value * exp) / exp;
+    }
+    exports.precisionRound = precisionRound;
+});
+//# sourceMappingURL=precision.js.map

package/lib-amd/utils/precision.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"precision.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-spinbutton/src/utils/precision.ts"],"names":[],"mappings":";;;;IAAA;;;;;;OAMG;IACH,SAAgB,kBAAkB,CAAC,KAAsB;QACvD;;;;;WAKG;QACH,IAAM,MAAM,GAAG,yBAAyB,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;QAC7D,IAAI,CAAC,MAAM,EAAE;YACX,OAAO,CAAC,CAAC;SACV;QACD,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE;YACb,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;SAC1B;QACD,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE;YACb,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;SACzB;QACD,OAAO,CAAC,CAAC;IACX,CAAC;IAlBD,gDAkBC;IAED;;;;OAIG;IACH,SAAgB,cAAc,CAAC,KAAa,EAAE,SAAiB,EAAE,IAAiB;QAAjB,qBAAA,EAAA,SAAiB;QAChF,IAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;QACtC,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IACvC,CAAC;IAHD,wCAGC","sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n  /**\n   * Group 1:\n   * [1-9]([0]+$) matches trailing zeros\n   * Group 2:\n   * \\.([0-9]*) matches all digits after a decimal point.\n   */\n  const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n  if (!groups) {\n    return 0;\n  }\n  if (groups[1]) {\n    return -groups[1].length;\n  }\n  if (groups[2]) {\n    return groups[2].length;\n  }\n  return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n  const exp = Math.pow(base, precision);\n  return Math.round(value * exp) / exp;\n}\n"]}

package/lib-commonjs/SpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SpinButton.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/SpinButton/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/SpinButton.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,+BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/SpinButton/index';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/SpinButtonField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SpinButtonField.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/SpinButtonField/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/SpinButtonField.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/SpinButtonField/index';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButton/SpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButton/SpinButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,qBAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,UAAA,gBAAmD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAC9F,MAAM,KAAK,GAAG,eAAA,CAAA,sBAAA,CAAuB,KAAvB,EAA8B,GAA9B,CAAd;EAEA,qBAAA,CAAA,4BAAA,CAA6B,KAA7B;EACA,OAAO,kBAAA,CAAA,yBAAA,CAA0B,KAA1B,CAAP;AACD,CAL+D,CAAnD;AAOb,OAAA,CAAA,UAAA,CAAW,WAAX,GAAyB,YAAzB","sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles';\nimport type { SpinButtonProps } from './SpinButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */\nexport const SpinButton: ForwardRefComponent<SpinButtonProps> = React.forwardRef((props, ref) => {\n  const state = useSpinButton_unstable(props, ref);\n\n  useSpinButtonStyles_unstable(state);\n  return renderSpinButton_unstable(state);\n});\n\nSpinButton.displayName = 'SpinButton';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButton/SpinButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,qBAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,UAAA,gBAAmD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAC9F,MAAM,KAAK,GAAG,eAAA,CAAA,sBAAA,CAAuB,KAAvB,EAA8B,GAA9B,CAAd;EAEA,qBAAA,CAAA,4BAAA,CAA6B,KAA7B;EACA,OAAO,kBAAA,CAAA,yBAAA,CAA0B,KAA1B,CAAP;AACD,CAL+D,CAAnD;AAOb,OAAA,CAAA,UAAA,CAAW,WAAX,GAAyB,YAAzB","sourcesContent":["import * as React from 'react';\nimport { useSpinButton_unstable } from './useSpinButton';\nimport { renderSpinButton_unstable } from './renderSpinButton';\nimport { useSpinButtonStyles_unstable } from './useSpinButtonStyles';\nimport type { SpinButtonProps } from './SpinButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * A SpinButton allows someone to incrementally adjust a value in small steps.\n */\nexport const SpinButton: ForwardRefComponent<SpinButtonProps> = React.forwardRef((props, ref) => {\n  const state = useSpinButton_unstable(props, ref);\n\n  useSpinButtonStyles_unstable(state);\n  return renderSpinButton_unstable(state);\n});\n\nSpinButton.displayName = 'SpinButton';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButton/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButton/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,uBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './SpinButton';\nexport * from './SpinButton.types';\nexport * from './renderSpinButton';\nexport * from './useSpinButton';\nexport * from './useSpinButtonStyles';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButton/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,uBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './SpinButton';\nexport * from './SpinButton.types';\nexport * from './renderSpinButton';\nexport * from './useSpinButton';\nexport * from './useSpinButtonStyles';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButton/renderSpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButton/renderSpinButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAA2B;EAClE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAA0B,KAA1B,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,eAAP,EAAsB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAtB,CAFF,EAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,eAAP,EAAsB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAtB,CAHF,CADF;AAOD,CAhCM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinButtonState, SpinButtonSlots } from './SpinButton.types';\n\n/**\n * Render the final JSX of SpinButton\n */\nexport const renderSpinButton_unstable = (state: SpinButtonState) => {\n  // Leaving this here for now.\n  // This is the approach using react-input's Input component.\n  // It has some Typescript problems and feels hacky.\n  // const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n  // const { contentAfter, ...otherInputSlotProps } = slotProps.input as SpinButtonSlots['input'];\n  // const inputContentAfter = {\n  //   ...contentAfter,\n  //   children: (\n  //     <>\n  //       <slots.incrementButton {...slotProps.incrementButton} />\n  //       <slots.decrementButton {...slotProps.decrementButton} />\n  //     </>\n  //   ),\n  // };\n\n  // return (\n  //   <slots.root {...slotProps.root}>\n  //     <slots.input {...otherInputSlotProps} contentAfter={inputContentAfter}/>\n  //   </slots.root>\n  // );\n\n  const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.input {...slotProps.input} />\n      <slots.incrementButton {...slotProps.incrementButton} />\n      <slots.decrementButton {...slotProps.decrementButton} />\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButton/renderSpinButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAA2B;EAClE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAA0B,KAA1B,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CADF,EAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,eAAP,EAAsB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAtB,CAFF,EAGE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,eAAP,EAAsB,EAAA,GAAK,SAAS,CAAC;EAAf,CAAtB,CAHF,CADF;AAOD,CAhCM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinButtonState, SpinButtonSlots } from './SpinButton.types';\n\n/**\n * Render the final JSX of SpinButton\n */\nexport const renderSpinButton_unstable = (state: SpinButtonState) => {\n  // Leaving this here for now.\n  // This is the approach using react-input's Input component.\n  // It has some Typescript problems and feels hacky.\n  // const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n  // const { contentAfter, ...otherInputSlotProps } = slotProps.input as SpinButtonSlots['input'];\n  // const inputContentAfter = {\n  //   ...contentAfter,\n  //   children: (\n  //     <>\n  //       <slots.incrementButton {...slotProps.incrementButton} />\n  //       <slots.decrementButton {...slotProps.decrementButton} />\n  //     </>\n  //   ),\n  // };\n\n  // return (\n  //   <slots.root {...slotProps.root}>\n  //     <slots.input {...otherInputSlotProps} contentAfter={inputContentAfter}/>\n  //   </slots.root>\n  // );\n\n  const { slots, slotProps } = getSlots<SpinButtonSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.input {...slotProps.input} />\n      <slots.incrementButton {...slotProps.incrementButton} />\n      <slots.decrementButton {...slotProps.decrementButton} />\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButton/useSpinButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButton/useSpinButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n  getPartitionedNativeProps,\n  mergeCallbacks,\n  resolveShorthand,\n  useControllableState,\n  useTimeout,\n} from '@fluentui/react-utilities';\nimport * as Keys from '@fluentui/keyboard-keys';\nimport {\n  SpinButtonProps,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonChangeEvent,\n  SpinButtonBounds,\n} from './SpinButton.types';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\n\ntype InternalState = {\n  value: number | null;\n  spinState: SpinButtonSpinState;\n  spinTime: number;\n  spinDelay: number;\n  previousTextValue?: string;\n  atBound: SpinButtonBounds;\n};\n\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n\n// This is here to give an ease the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start: number, end: number, percent: number): number => start + (end - start) * percent;\n\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props: SpinButtonProps, ref: React.Ref<HTMLInputElement>): SpinButtonState => {\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value'],\n  });\n\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton,\n  } = props;\n\n  const precision = React.useMemo(() => {\n    return precisionFromProps ?? Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0,\n  });\n\n  const isControlled = value !== undefined;\n\n  const [textValue, setTextValue] = React.useState<string | undefined>(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState<SpinButtonSpinState>('rest');\n\n  const internalState = React.useRef<InternalState>({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none',\n  });\n\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n\n  const stepValue = (\n    e: SpinButtonChangeEvent,\n    direction: 'up' | 'down' | 'upPage' | 'downPage',\n    startFrom?: string,\n  ) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n\n    commit(e, newValue);\n\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(\n          DEFAULT_SPIN_DELAY_MS,\n          MIN_SPIN_DELAY_MS,\n          internalState.current.spinTime / MAX_SPIN_TIME_MS,\n        );\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue;\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n\n  const handleIncrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n\n  const handleDecrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n\n  const handleStepMouseUpOrLeave = (e: React.MouseEvent<HTMLButtonElement>) => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    let nextKeyboardSpinState: SpinButtonSpinState = 'rest';\n\n    if (e.key === Keys.ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === Keys.PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Keys.Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Keys.End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Keys.Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n\n  const handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n\n  const commit = (e: SpinButtonChangeEvent, newValue?: number | null, newDisplayValue?: string) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged =\n      newDisplayValue !== undefined &&\n      internalState.current.previousTextValue !== undefined &&\n      internalState.current.previousTextValue !== newDisplayValue;\n\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue!, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue as string);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n\n    if (valueChanged || displayValueChanged) {\n      onChange?.(e, { value: roundedValue, displayValue: newDisplayValue });\n    }\n\n    setTextValue(undefined);\n  };\n\n  const state: SpinButtonState = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button',\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root,\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary,\n      },\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronUp16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button',\n      },\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronDown16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button',\n      },\n    }),\n  };\n\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue ?? '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue ?? String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue ?? undefined;\n  state.input['aria-valuetext'] = state.input['aria-valuetext'] ?? ((value !== undefined && displayValue) || undefined);\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButton/useSpinButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n  getPartitionedNativeProps,\n  mergeCallbacks,\n  resolveShorthand,\n  useControllableState,\n  useTimeout,\n} from '@fluentui/react-utilities';\nimport * as Keys from '@fluentui/keyboard-keys';\nimport {\n  SpinButtonProps,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonChangeEvent,\n  SpinButtonBounds,\n} from './SpinButton.types';\nimport { calculatePrecision, precisionRound, getBound, clamp } from '../../utils/index';\nimport { ChevronUp16Regular, ChevronDown16Regular } from '@fluentui/react-icons';\n\ntype InternalState = {\n  value: number | null;\n  spinState: SpinButtonSpinState;\n  spinTime: number;\n  spinDelay: number;\n  previousTextValue?: string;\n  atBound: SpinButtonBounds;\n};\n\nconst DEFAULT_SPIN_DELAY_MS = 150;\nconst MIN_SPIN_DELAY_MS = 80;\nconst MAX_SPIN_TIME_MS = 1000;\n\n// This is here to give an ease the mouse held down case.\n// Exact easing it to be defined. Once it is we'll likely\n// pull this out into a util function in the SpinButton package.\nconst lerp = (start: number, end: number, percent: number): number => start + (end - start) * percent;\n\n/**\n * Create the state required to render SpinButton.\n *\n * The returned state can be modified with hooks such as useSpinButtonStyles_unstable,\n * before being passed to renderSpinButton_unstable.\n *\n * @param props - props from this instance of SpinButton\n * @param ref - reference to root HTMLElement of SpinButton\n */\nexport const useSpinButton_unstable = (props: SpinButtonProps, ref: React.Ref<HTMLInputElement>): SpinButtonState => {\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'input',\n    excludedPropNames: ['defaultValue', 'max', 'min', 'onChange', 'size', 'value'],\n  });\n\n  const {\n    value,\n    displayValue,\n    defaultValue,\n    min,\n    max,\n    step = 1,\n    stepPage = 1,\n    precision: precisionFromProps,\n    onChange,\n    size = 'medium',\n    appearance = 'outline',\n    root,\n    input,\n    incrementButton,\n    decrementButton,\n  } = props;\n\n  const precision = React.useMemo(() => {\n    return precisionFromProps ?? Math.max(calculatePrecision(step), 0);\n  }, [precisionFromProps, step]);\n\n  const [currentValue, setCurrentValue] = useControllableState({\n    state: value,\n    defaultState: defaultValue,\n    initialState: 0,\n  });\n\n  const isControlled = value !== undefined;\n\n  const [textValue, setTextValue] = React.useState<string | undefined>(undefined);\n  const [keyboardSpinState, setKeyboardSpinState] = React.useState<SpinButtonSpinState>('rest');\n\n  const internalState = React.useRef<InternalState>({\n    value: currentValue,\n    spinState: 'rest',\n    spinTime: 0,\n    spinDelay: DEFAULT_SPIN_DELAY_MS,\n    atBound: currentValue !== null ? getBound(precisionRound(currentValue, precision), min, max) : 'none',\n  });\n\n  const [setStepTimeout, clearStepTimeout] = useTimeout();\n\n  const stepValue = (\n    e: SpinButtonChangeEvent,\n    direction: 'up' | 'down' | 'upPage' | 'downPage',\n    startFrom?: string,\n  ) => {\n    let startValue = internalState.current.value;\n    if (startFrom) {\n      const num = parseFloat(startFrom);\n      if (!isNaN(num)) {\n        startValue = num;\n      }\n    }\n    const val = startValue;\n    const dir = direction === 'up' || direction === 'upPage' ? 1 : -1;\n    const stepSize = direction === 'upPage' || direction === 'downPage' ? stepPage : step;\n\n    if (val === null) {\n      const stepStart = min === undefined ? 0 : min;\n      const nullStep = clamp(stepStart + stepSize * dir, min, max);\n      commit(e, nullStep);\n      return;\n    }\n\n    let newValue = val + stepSize * dir;\n    if (!Number.isNaN(newValue)) {\n      newValue = clamp(newValue, min, max);\n    }\n\n    commit(e, newValue);\n\n    if (internalState.current.spinState !== 'rest') {\n      setStepTimeout(() => {\n        // Ease the step speed a bit\n        internalState.current.spinTime += internalState.current.spinDelay;\n        internalState.current.spinDelay = lerp(\n          DEFAULT_SPIN_DELAY_MS,\n          MIN_SPIN_DELAY_MS,\n          internalState.current.spinTime / MAX_SPIN_TIME_MS,\n        );\n        stepValue(e, direction);\n      }, internalState.current.spinDelay);\n    }\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (!internalState.current.previousTextValue) {\n      internalState.current.previousTextValue = textValue;\n    }\n    const newValue = e.target.value;\n    setTextValue(newValue);\n  };\n\n  const handleIncrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'up';\n    stepValue(e, 'up');\n  };\n\n  const handleDecrementMouseDown = (e: React.MouseEvent<HTMLButtonElement>) => {\n    internalState.current.spinState = 'down';\n    stepValue(e, 'down');\n  };\n\n  const handleStepMouseUpOrLeave = (e: React.MouseEvent<HTMLButtonElement>) => {\n    clearStepTimeout();\n    internalState.current.spinState = 'rest';\n    internalState.current.spinDelay = DEFAULT_SPIN_DELAY_MS;\n    internalState.current.spinTime = 0;\n  };\n\n  const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n    commit(e, currentValue, textValue);\n    internalState.current.previousTextValue = undefined;\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    let nextKeyboardSpinState: SpinButtonSpinState = 'rest';\n\n    if (e.key === Keys.ArrowUp) {\n      stepValue(e, 'up', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.ArrowDown) {\n      stepValue(e, 'down', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (e.key === Keys.PageUp) {\n      e.preventDefault();\n      stepValue(e, 'upPage', textValue);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.PageDown) {\n      e.preventDefault();\n      stepValue(e, 'downPage', textValue);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Keys.Home && min !== undefined) {\n      commit(e, min);\n      nextKeyboardSpinState = 'down';\n    } else if (!e.shiftKey && e.key === Keys.End && max !== undefined) {\n      commit(e, max);\n      nextKeyboardSpinState = 'up';\n    } else if (e.key === Keys.Enter) {\n      commit(e, currentValue, textValue);\n      internalState.current.previousTextValue = undefined;\n    } else if (e.key === Keys.Escape) {\n      if (internalState.current.previousTextValue) {\n        setTextValue(undefined);\n        internalState.current.previousTextValue = undefined;\n      }\n    }\n\n    if (keyboardSpinState !== nextKeyboardSpinState) {\n      setKeyboardSpinState(nextKeyboardSpinState);\n    }\n  };\n\n  const handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (keyboardSpinState !== 'rest') {\n      setKeyboardSpinState('rest');\n      internalState.current.spinState = 'rest';\n    }\n  };\n\n  const commit = (e: SpinButtonChangeEvent, newValue?: number | null, newDisplayValue?: string) => {\n    const valueChanged = newValue !== undefined && currentValue !== newValue;\n    const displayValueChanged =\n      newDisplayValue !== undefined &&\n      internalState.current.previousTextValue !== undefined &&\n      internalState.current.previousTextValue !== newDisplayValue;\n\n    let roundedValue;\n    if (valueChanged) {\n      roundedValue = precisionRound(newValue!, precision);\n      setCurrentValue(roundedValue);\n    } else if (displayValueChanged && !isControlled) {\n      const nextValue = parseFloat(newDisplayValue as string);\n      if (!isNaN(nextValue)) {\n        setCurrentValue(precisionRound(nextValue, precision));\n      }\n    }\n\n    if (valueChanged || displayValueChanged) {\n      onChange?.(e, { value: roundedValue, displayValue: newDisplayValue });\n    }\n\n    setTextValue(undefined);\n  };\n\n  const state: SpinButtonState = {\n    size,\n    appearance,\n    spinState: keyboardSpinState,\n    atBound: internalState.current.atBound,\n\n    components: {\n      root: 'span',\n      input: 'input',\n      incrementButton: 'button',\n      decrementButton: 'button',\n    },\n    root: resolveShorthand(root, {\n      required: true,\n      defaultProps: nativeProps.root,\n    }),\n    input: resolveShorthand(input, {\n      required: true,\n      defaultProps: {\n        ref,\n        autoComplete: 'off',\n        role: 'spinbutton',\n        appearance,\n        type: 'text',\n        ...nativeProps.primary,\n      },\n    }),\n    incrementButton: resolveShorthand(incrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronUp16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Increment value',\n        type: 'button',\n      },\n    }),\n    decrementButton: resolveShorthand(decrementButton, {\n      required: true,\n      defaultProps: {\n        tabIndex: -1,\n        children: <ChevronDown16Regular />,\n        disabled: nativeProps.primary.disabled,\n        'aria-label': 'Decrement value',\n        type: 'button',\n      },\n    }),\n  };\n\n  let valueToDisplay;\n  if (textValue !== undefined) {\n    valueToDisplay = textValue;\n  } else if (value === null || currentValue === null) {\n    valueToDisplay = displayValue ?? '';\n    internalState.current.value = null;\n    internalState.current.atBound = 'none';\n  } else {\n    const roundedValue = precisionRound(currentValue, precision);\n    internalState.current.value = roundedValue;\n    internalState.current.atBound = getBound(roundedValue, min, max);\n    if (isControlled) {\n      valueToDisplay = displayValue ?? String(roundedValue);\n    } else {\n      valueToDisplay = String(roundedValue);\n    }\n  }\n\n  state.input.value = valueToDisplay;\n  state.input['aria-valuemin'] = min;\n  state.input['aria-valuemax'] = max;\n  state.input['aria-valuenow'] = currentValue ?? undefined;\n  state.input['aria-valuetext'] = state.input['aria-valuetext'] ?? ((value !== undefined && displayValue) || undefined);\n  state.input.onChange = mergeCallbacks(state.input.onChange, handleInputChange);\n  state.input.onBlur = mergeCallbacks(state.input.onBlur, handleBlur);\n  state.input.onKeyDown = mergeCallbacks(state.input.onKeyDown, handleKeyDown);\n  state.input.onKeyUp = mergeCallbacks(state.input.onKeyUp, handleKeyUp);\n\n  state.incrementButton.onMouseDown = mergeCallbacks(handleIncrementMouseDown, state.incrementButton.onMouseDown);\n  state.incrementButton.onMouseUp = mergeCallbacks(state.incrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.incrementButton.onMouseLeave = mergeCallbacks(state.incrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  state.decrementButton.onMouseDown = mergeCallbacks(handleDecrementMouseDown, state.decrementButton.onMouseDown);\n  state.decrementButton.onMouseUp = mergeCallbacks(state.decrementButton.onMouseUp, handleStepMouseUpOrLeave);\n  state.decrementButton.onMouseLeave = mergeCallbacks(state.decrementButton.onMouseLeave, handleStepMouseUpOrLeave);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButton/useSpinButtonStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButton/useSpinButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';\nimport { tokens } from '@fluentui/react-theme';\nimport { useInputStyles_unstable } from '@fluentui/react-input';\n\nexport const spinButtonClassNames: SlotClassNames<SpinButtonSlots> = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton',\n};\n\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active',\n};\n\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'inline-grid',\n    gridTemplateColumns: `1fr 24px`,\n    gridTemplateRows: '1fr 1fr',\n    columnGap: tokens.spacingHorizontalXS,\n    rowGap: 0,\n    paddingRight: 0,\n    position: 'relative',\n    // Remove the border styles from react-input\n    ...shorthands.border('0'),\n    isolation: 'isolate',\n\n    // Apply border styles on the ::before pseudo element.\n    // We cannot use ::after since react-input uses that\n    // for the selector styles.\n    // Using the pseudo element allows us to place the border\n    // above content in the component which ensures the buttons\n    // line up visually with the border as expected. Without this\n    // there is a bit of a gap which can become very noticeable\n    // at high zoom or when OS zoom levels are not divisible by 2\n    // (e.g., 150% on Windows in Firefox)\n    // This is most noticeable on the \"outline\" appearance which is\n    // also the default so it feels worth the extra ceremony to get right.\n    '::before': {\n      content: '\"\"',\n      boxSizing: 'border-box',\n      position: 'absolute',\n      top: 0,\n      right: 0,\n      bottom: 0,\n      left: 0,\n      ...shorthands.borderRadius(tokens.borderRadiusMedium),\n      pointerEvents: 'none',\n      zIndex: 10,\n    },\n\n    '::after': {\n      right: 0,\n      bottom: 0,\n      left: 0,\n      zIndex: 20,\n    },\n  },\n\n  small: {\n    paddingLeft: tokens.spacingHorizontalS,\n  },\n\n  // intentionally empty\n  medium: {},\n\n  outline: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke1),\n      borderBottomColor: tokens.colorNeutralStrokeAccessible,\n    },\n  },\n\n  outlineInteractive: {\n    ':hover': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  underline: {\n    '::before': {\n      ...shorthands.borderRadius(0), // corners look strange if rounded\n      ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n    },\n  },\n\n  underlineInteractive: {\n    ':hover': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  filled: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n    },\n  },\n\n  filledInteractive: {\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':hover,:focus-within': {\n      '::before': {\n        // also handles pressed border color (:active)\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n      },\n    },\n  },\n\n  invalid: {\n    ':not(:focus-within),:hover:not(:focus-within)': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n      },\n    },\n  },\n\n  disabled: {\n    '::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n      '@media (forced-colors: active)': {\n        ...shorthands.borderColor('GrayText'),\n      },\n    },\n  },\n});\n\nconst useInputStyles = makeStyles({\n  base: {\n    gridColumnStart: '1',\n    gridColumnEnd: '2',\n    gridRowStart: '1',\n    gridRowEnd: '3',\n    outlineStyle: 'none',\n    ...shorthands.padding(0),\n  },\n});\n\nconst useButtonStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    width: '24px',\n    alignItems: 'center',\n    justifyContent: 'center',\n    ...shorthands.border(0),\n    position: 'absolute',\n\n    outlineStyle: 'none',\n    height: '100%',\n\n    ':enabled:hover': {\n      cursor: 'pointer',\n    },\n\n    ':active': {\n      outlineStyle: 'none',\n    },\n\n    ':disabled': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  incrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '1',\n    gridRowEnd: '2',\n    ...shorthands.borderRadius(0, tokens.borderRadiusMedium, 0, 0),\n  },\n\n  // Padding values numbers don't align with design specs\n  // but visually the padding aligns.\n  // The icons are set in a 16x16px square but the artwork is inset from that\n  // so these padding values are computed by hand.\n  // Additionally the design uses fractional values so these are\n  // rounded to the nearest integer.\n  incrementButtonSmall: {\n    ...shorthands.padding('3px', '6px', '0px', '4px'),\n  },\n\n  incrementButtonMedium: {\n    ...shorthands.padding('4px', '5px', '1px', '5px'),\n  },\n\n  decrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '2',\n    gridRowEnd: '3',\n    ...shorthands.borderRadius(0, 0, tokens.borderRadiusMedium, 0),\n  },\n\n  decrementButtonSmall: {\n    ...shorthands.padding('0px', '6px', '3px', '4px'),\n  },\n\n  decrementButtonMedium: {\n    ...shorthands.padding('1px', '5px', '4px', '5px'),\n  },\n\n  outline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n\n  underline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-darker': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground3Hover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-lighter': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground1Hover,\n      },\n      [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground1Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n  base: {\n    cursor: 'not-allowed',\n\n    ':hover': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  outline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  underline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-darker': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-lighter': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = (state: SpinButtonState): SpinButtonState => {\n  const { appearance, atBound, spinState, size } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n\n  // Grab the root className here so we can be sure to merge is last\n  const rootClassName = state.root.className;\n  state.root.className = undefined;\n  // Reuse react-input's styles without re-using the Input component.\n  useInputStyles_unstable({\n    size,\n    appearance,\n    input: state.input,\n    root: state.root,\n    components: {\n      root: 'span',\n      input: 'input',\n      contentBefore: 'span',\n      contentAfter: 'span',\n    },\n  });\n\n  state.root.className = mergeClasses(\n    state.root.className, // Get the classes from useInputStyles_unstable\n    spinButtonClassNames.root,\n    rootStyles.base,\n    rootStyles[size],\n    appearance === 'outline' && rootStyles.outline,\n    appearance === 'underline' && rootStyles.underline,\n    filled && rootStyles.filled,\n    !disabled && appearance === 'outline' && rootStyles.outlineInteractive,\n    !disabled && appearance === 'underline' && rootStyles.underlineInteractive,\n    !disabled && filled && rootStyles.filledInteractive,\n    !disabled && invalid && rootStyles.invalid,\n    disabled && rootStyles.disabled,\n    rootClassName, // Make sure any original class name is applied last\n  );\n\n  state.incrementButton.className = mergeClasses(\n    spinButtonClassNames.incrementButton,\n    spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.incrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.incrementButtonSmall : buttonStyles.incrementButtonMedium,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.incrementButton.className,\n  );\n  state.decrementButton.className = mergeClasses(\n    spinButtonClassNames.decrementButton,\n    spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.decrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.decrementButtonSmall : buttonStyles.decrementButtonMedium,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.decrementButton.className,\n  );\n\n  state.input.className = mergeClasses(spinButtonClassNames.input, state.input.className, inputStyles.base);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButton/useSpinButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { SpinButtonSlots, SpinButtonState } from './SpinButton.types';\nimport { tokens } from '@fluentui/react-theme';\nimport { useInputStyles_unstable } from '@fluentui/react-input';\n\nexport const spinButtonClassNames: SlotClassNames<SpinButtonSlots> = {\n  root: 'fui-SpinButton',\n  input: 'fui-SpinButton__input',\n  incrementButton: 'fui-SpinButton__incrementButton',\n  decrementButton: 'fui-SpinButton__decrementButton',\n};\n\nconst spinButtonExtraClassNames = {\n  buttonActive: 'fui-SpinButton__button_active',\n};\n\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'inline-grid',\n    gridTemplateColumns: `1fr 24px`,\n    gridTemplateRows: '1fr 1fr',\n    columnGap: tokens.spacingHorizontalXS,\n    rowGap: 0,\n    paddingRight: 0,\n    position: 'relative',\n    // Remove the border styles from react-input\n    ...shorthands.border('0'),\n    isolation: 'isolate',\n\n    // Apply border styles on the ::before pseudo element.\n    // We cannot use ::after since react-input uses that\n    // for the selector styles.\n    // Using the pseudo element allows us to place the border\n    // above content in the component which ensures the buttons\n    // line up visually with the border as expected. Without this\n    // there is a bit of a gap which can become very noticeable\n    // at high zoom or when OS zoom levels are not divisible by 2\n    // (e.g., 150% on Windows in Firefox)\n    // This is most noticeable on the \"outline\" appearance which is\n    // also the default so it feels worth the extra ceremony to get right.\n    '::before': {\n      content: '\"\"',\n      boxSizing: 'border-box',\n      position: 'absolute',\n      top: 0,\n      right: 0,\n      bottom: 0,\n      left: 0,\n      ...shorthands.borderRadius(tokens.borderRadiusMedium),\n      pointerEvents: 'none',\n      zIndex: 10,\n    },\n\n    '::after': {\n      right: 0,\n      bottom: 0,\n      left: 0,\n      zIndex: 20,\n    },\n  },\n\n  small: {\n    paddingLeft: tokens.spacingHorizontalS,\n  },\n\n  // intentionally empty\n  medium: {},\n\n  outline: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke1),\n      borderBottomColor: tokens.colorNeutralStrokeAccessible,\n    },\n  },\n\n  outlineInteractive: {\n    ':hover': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  underline: {\n    '::before': {\n      ...shorthands.borderRadius(0), // corners look strange if rounded\n      ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStrokeAccessible),\n    },\n  },\n\n  underlineInteractive: {\n    ':hover': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessibleHover,\n      },\n    },\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':active,:focus-within': {\n      '::before': {\n        borderBottomColor: tokens.colorNeutralStrokeAccessiblePressed,\n      },\n    },\n  },\n\n  filled: {\n    '::before': {\n      ...shorthands.border('1px', 'solid', tokens.colorTransparentStroke),\n    },\n  },\n\n  filledInteractive: {\n    // DO NOT add a space between the selectors! It changes the behavior of make-styles.\n    ':hover,:focus-within': {\n      '::before': {\n        // also handles pressed border color (:active)\n        ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n      },\n    },\n  },\n\n  invalid: {\n    ':not(:focus-within),:hover:not(:focus-within)': {\n      '::before': {\n        ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n      },\n    },\n  },\n\n  disabled: {\n    '::before': {\n      ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n      '@media (forced-colors: active)': {\n        ...shorthands.borderColor('GrayText'),\n      },\n    },\n  },\n});\n\nconst useInputStyles = makeStyles({\n  base: {\n    gridColumnStart: '1',\n    gridColumnEnd: '2',\n    gridRowStart: '1',\n    gridRowEnd: '3',\n    outlineStyle: 'none',\n    ...shorthands.padding(0),\n  },\n});\n\nconst useButtonStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    width: '24px',\n    alignItems: 'center',\n    justifyContent: 'center',\n    ...shorthands.border(0),\n    position: 'absolute',\n\n    outlineStyle: 'none',\n    height: '100%',\n\n    ':enabled:hover': {\n      cursor: 'pointer',\n    },\n\n    ':active': {\n      outlineStyle: 'none',\n    },\n\n    ':disabled': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  incrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '1',\n    gridRowEnd: '2',\n    ...shorthands.borderRadius(0, tokens.borderRadiusMedium, 0, 0),\n  },\n\n  // Padding values numbers don't align with design specs\n  // but visually the padding aligns.\n  // The icons are set in a 16x16px square but the artwork is inset from that\n  // so these padding values are computed by hand.\n  // Additionally the design uses fractional values so these are\n  // rounded to the nearest integer.\n  incrementButtonSmall: {\n    ...shorthands.padding('3px', '6px', '0px', '4px'),\n  },\n\n  incrementButtonMedium: {\n    ...shorthands.padding('4px', '5px', '1px', '5px'),\n  },\n\n  decrementButton: {\n    gridColumnStart: '2',\n    gridColumnEnd: '3',\n    gridRowStart: '2',\n    gridRowEnd: '3',\n    ...shorthands.borderRadius(0, 0, tokens.borderRadiusMedium, 0),\n  },\n\n  decrementButtonSmall: {\n    ...shorthands.padding('0px', '6px', '3px', '4px'),\n  },\n\n  decrementButtonMedium: {\n    ...shorthands.padding('1px', '5px', '4px', '5px'),\n  },\n\n  outline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n\n  underline: {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorSubtleBackgroundHover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorSubtleBackgroundPressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-darker': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground3Hover,\n      },\n      ':active': {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground3Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n  'filled-lighter': {\n    backgroundColor: 'transparent',\n    color: tokens.colorNeutralForeground3,\n\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForeground3Hover,\n        backgroundColor: tokens.colorNeutralBackground1Hover,\n      },\n      [`:active,&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForeground3Pressed,\n        backgroundColor: tokens.colorNeutralBackground1Pressed,\n      },\n    },\n    ':disabled': {\n      color: tokens.colorNeutralForegroundDisabled,\n    },\n  },\n});\n\n// Cannot just disable button as they need to remain\n// exposed to ATs like screen readers.\nconst useButtonDisabledStyles = makeStyles({\n  base: {\n    cursor: 'not-allowed',\n\n    ':hover': {\n      cursor: 'not-allowed',\n    },\n  },\n\n  outline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  underline: {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-darker': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n\n  'filled-lighter': {\n    color: tokens.colorNeutralForegroundDisabled,\n    ':enabled': {\n      ':hover': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      ':active': {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n      [`&.${spinButtonExtraClassNames.buttonActive}`]: {\n        color: tokens.colorNeutralForegroundDisabled,\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n});\n\n/**\n * Apply styling to the SpinButton slots based on the state\n */\nexport const useSpinButtonStyles_unstable = (state: SpinButtonState): SpinButtonState => {\n  const { appearance, atBound, spinState, size } = state;\n  const disabled = state.input.disabled;\n  const invalid = `${state.input['aria-invalid']}` === 'true';\n  const filled = appearance.startsWith('filled');\n\n  const rootStyles = useRootStyles();\n  const buttonStyles = useButtonStyles();\n  const buttonDisabledStyles = useButtonDisabledStyles();\n  const inputStyles = useInputStyles();\n\n  // Grab the root className here so we can be sure to merge is last\n  const rootClassName = state.root.className;\n  state.root.className = undefined;\n  // Reuse react-input's styles without re-using the Input component.\n  useInputStyles_unstable({\n    size,\n    appearance,\n    input: state.input,\n    root: state.root,\n    components: {\n      root: 'span',\n      input: 'input',\n      contentBefore: 'span',\n      contentAfter: 'span',\n    },\n  });\n\n  state.root.className = mergeClasses(\n    state.root.className, // Get the classes from useInputStyles_unstable\n    spinButtonClassNames.root,\n    rootStyles.base,\n    rootStyles[size],\n    appearance === 'outline' && rootStyles.outline,\n    appearance === 'underline' && rootStyles.underline,\n    filled && rootStyles.filled,\n    !disabled && appearance === 'outline' && rootStyles.outlineInteractive,\n    !disabled && appearance === 'underline' && rootStyles.underlineInteractive,\n    !disabled && filled && rootStyles.filledInteractive,\n    !disabled && invalid && rootStyles.invalid,\n    disabled && rootStyles.disabled,\n    rootClassName, // Make sure any original class name is applied last\n  );\n\n  state.incrementButton.className = mergeClasses(\n    spinButtonClassNames.incrementButton,\n    spinState === 'up' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.incrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.incrementButtonSmall : buttonStyles.incrementButtonMedium,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'max' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.incrementButton.className,\n  );\n  state.decrementButton.className = mergeClasses(\n    spinButtonClassNames.decrementButton,\n    spinState === 'down' && `${spinButtonExtraClassNames.buttonActive}`,\n    buttonStyles.base,\n    buttonStyles.decrementButton,\n    buttonStyles[appearance],\n    size === 'small' ? buttonStyles.decrementButtonSmall : buttonStyles.decrementButtonMedium,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles.base,\n    (atBound === 'min' || atBound === 'both') && buttonDisabledStyles[appearance],\n    state.decrementButton.className,\n  );\n\n  state.input.className = mergeClasses(spinButtonClassNames.input, state.input.className, inputStyles.base);\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButtonField/SpinButtonField.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButtonField/SpinButtonField.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAOA,MAAA,YAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AAIa,OAAA,CAAA,yBAAA,gBAA4B,aAAA,CAAA,kBAAA,CAAmB,iBAAnB,CAA5B;AAEA,OAAA,CAAA,eAAA,gBAA6D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxG,MAAM,KAAK,GAAG,aAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,EAA8B;IAAE,SAAS,EAAE,YAAA,CAAA,UAAb;IAAyB,UAAU,EAAE,OAAA,CAAA;EAArC,CAA9B,CAAd;EACA,aAAA,CAAA,uBAAA,CAAwB,KAAxB;EACA,OAAO,aAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CAJyE,CAA7D;AAMb,OAAA,CAAA,eAAA,CAAgB,WAAhB,GAA8B,iBAA9B","sourcesContent":["import * as React from 'react';\nimport type { FieldProps } from '@fluentui/react-field';\nimport {\n  getFieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n} from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { SpinButton } from '../../SpinButton';\n\nexport type SpinButtonFieldProps = FieldProps<typeof SpinButton>;\n\nexport const spinButtonFieldClassNames = getFieldClassNames('SpinButtonField');\n\nexport const SpinButtonField: ForwardRefComponent<SpinButtonFieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref, { component: SpinButton, classNames: spinButtonFieldClassNames });\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nSpinButtonField.displayName = 'SpinButtonField';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButtonField/SpinButtonField.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAOA,MAAA,YAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AAIa,OAAA,CAAA,yBAAA,gBAA4B,aAAA,CAAA,kBAAA,CAAmB,iBAAnB,CAA5B;AAEA,OAAA,CAAA,eAAA,gBAA6D,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxG,MAAM,KAAK,GAAG,aAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,EAA8B;IAAE,SAAS,EAAE,YAAA,CAAA,UAAb;IAAyB,UAAU,EAAE,OAAA,CAAA;EAArC,CAA9B,CAAd;EACA,aAAA,CAAA,uBAAA,CAAwB,KAAxB;EACA,OAAO,aAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CAJyE,CAA7D;AAMb,OAAA,CAAA,eAAA,CAAgB,WAAhB,GAA8B,iBAA9B","sourcesContent":["import * as React from 'react';\nimport type { FieldProps } from '@fluentui/react-field';\nimport {\n  getFieldClassNames,\n  renderField_unstable,\n  useFieldStyles_unstable,\n  useField_unstable,\n} from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { SpinButton } from '../../SpinButton';\n\nexport type SpinButtonFieldProps = FieldProps<typeof SpinButton>;\n\nexport const spinButtonFieldClassNames = getFieldClassNames('SpinButtonField');\n\nexport const SpinButtonField: ForwardRefComponent<SpinButtonFieldProps> = React.forwardRef((props, ref) => {\n  const state = useField_unstable(props, ref, { component: SpinButton, classNames: spinButtonFieldClassNames });\n  useFieldStyles_unstable(state);\n  return renderField_unstable(state);\n});\n\nSpinButtonField.displayName = 'SpinButtonField';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/SpinButtonField/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/SpinButtonField/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './SpinButtonField';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/components/SpinButtonField/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './SpinButtonField';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,YAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,UAAA;EAAU;AAAV,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,8BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,4BAAA;EAA4B;AAA5B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;;AAYF,IAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AAA6C,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA","sourcesContent":["export {\n  SpinButton,\n  renderSpinButton_unstable,\n  spinButtonClassNames,\n  useSpinButtonStyles_unstable,\n  useSpinButton_unstable,\n} from './SpinButton';\nexport type {\n  SpinButtonOnChangeData,\n  SpinButtonChangeEvent,\n  SpinButtonProps,\n  SpinButtonSlots,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonBounds,\n} from './SpinButton';\n\nexport { SpinButtonField as SpinButtonField_unstable, spinButtonFieldClassNames } from './SpinButtonField';\nexport type { SpinButtonFieldProps as SpinButtonFieldProps_unstable } from './SpinButtonField';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,YAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,UAAA;EAAU;AAAV,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,8BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,4BAAA;EAA4B;AAA5B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,YAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;;AAYF,IAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AAA6C,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,iBAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA","sourcesContent":["export {\n  SpinButton,\n  renderSpinButton_unstable,\n  spinButtonClassNames,\n  useSpinButtonStyles_unstable,\n  useSpinButton_unstable,\n} from './SpinButton';\nexport type {\n  SpinButtonOnChangeData,\n  SpinButtonChangeEvent,\n  SpinButtonProps,\n  SpinButtonSlots,\n  SpinButtonState,\n  SpinButtonSpinState,\n  SpinButtonBounds,\n} from './SpinButton';\n\nexport { SpinButtonField as SpinButtonField_unstable, spinButtonFieldClassNames } from './SpinButtonField';\nexport type { SpinButtonFieldProps as SpinButtonFieldProps_unstable } from './SpinButtonField';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/utils/clamp.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utils/clamp.ts"],"names":[],"mappings":";;;;;;;AAAO,MAAM,KAAK,GAAG,CAAC,KAAD,EAAgB,GAAhB,EAA8B,GAA9B,KAAsD;EACzE,IAAI,SAAS,GAAG,KAAhB;;EACA,IAAI,GAAG,KAAK,SAAZ,EAAuB;IACrB,IAAI,GAAG,KAAK,SAAR,IAAqB,GAAG,GAAG,GAA/B,EAAoC;MAClC,MAAM,KAAK,GAAG,IAAI,KAAJ,EAAd;;MACA,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;QACzC;QACA,OAAO,CAAC,KAAR,CACE,CACE,gBAAgB,GAAG,kCAAkC,GAAG,IAD1D,EAEE,4CAFF,EAGE,oBAAoB,KAAK,IAH3B,EAIE,KAAK,CAAC,KAJR,EAKE,IALF,EADF;MAQD;;MACD,OAAO,KAAP;IACD;;IAED,SAAS,GAAG,IAAI,CAAC,GAAL,CAAS,GAAT,EAAc,SAAd,CAAZ;EACD;;EAED,IAAI,GAAG,KAAK,SAAZ,EAAuB;IACrB,SAAS,GAAG,IAAI,CAAC,GAAL,CAAS,GAAT,EAAc,SAAd,CAAZ;EACD;;EAED,OAAO,SAAP;AACD,CA3BM;;AAAM,OAAA,CAAA,KAAA,GAAK,KAAL","sourcesContent":["export const clamp = (value: number, min?: number, max?: number): number => {\n  let nextValue = value;\n  if (min !== undefined) {\n    if (max !== undefined && min > max) {\n      const error = new Error();\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error(\n          [\n            `\"min\" value \"${min}\" is greater than \"max\" value \"${max}\".`,\n            '\"min\" must be less than or equal to \"max\".',\n            `Returning value \"${value}\".`,\n            error.stack,\n          ].join(),\n        );\n      }\n      return value;\n    }\n\n    nextValue = Math.max(min, nextValue);\n  }\n\n  if (max !== undefined) {\n    nextValue = Math.min(max, nextValue);\n  }\n\n  return nextValue;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/utils/clamp.ts"],"names":[],"mappings":";;;;;;;AAAO,MAAM,KAAK,GAAG,CAAC,KAAD,EAAgB,GAAhB,EAA8B,GAA9B,KAAsD;EACzE,IAAI,SAAS,GAAG,KAAhB;;EACA,IAAI,GAAG,KAAK,SAAZ,EAAuB;IACrB,IAAI,GAAG,KAAK,SAAR,IAAqB,GAAG,GAAG,GAA/B,EAAoC;MAClC,MAAM,KAAK,GAAG,IAAI,KAAJ,EAAd;;MACA,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;QACzC;QACA,OAAO,CAAC,KAAR,CACE,CACE,gBAAgB,GAAG,kCAAkC,GAAG,IAD1D,EAEE,4CAFF,EAGE,oBAAoB,KAAK,IAH3B,EAIE,KAAK,CAAC,KAJR,EAKE,IALF,EADF;MAQD;;MACD,OAAO,KAAP;IACD;;IAED,SAAS,GAAG,IAAI,CAAC,GAAL,CAAS,GAAT,EAAc,SAAd,CAAZ;EACD;;EAED,IAAI,GAAG,KAAK,SAAZ,EAAuB;IACrB,SAAS,GAAG,IAAI,CAAC,GAAL,CAAS,GAAT,EAAc,SAAd,CAAZ;EACD;;EAED,OAAO,SAAP;AACD,CA3BM;;AAAM,OAAA,CAAA,KAAA,GAAK,KAAL","sourcesContent":["export const clamp = (value: number, min?: number, max?: number): number => {\n  let nextValue = value;\n  if (min !== undefined) {\n    if (max !== undefined && min > max) {\n      const error = new Error();\n      if (process.env.NODE_ENV !== 'production') {\n        // eslint-disable-next-line no-console\n        console.error(\n          [\n            `\"min\" value \"${min}\" is greater than \"max\" value \"${max}\".`,\n            '\"min\" must be less than or equal to \"max\".',\n            `Returning value \"${value}\".`,\n            error.stack,\n          ].join(),\n        );\n      }\n      return value;\n    }\n\n    nextValue = Math.max(min, nextValue);\n  }\n\n  if (max !== undefined) {\n    nextValue = Math.min(max, nextValue);\n  }\n\n  return nextValue;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/utils/getBound.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utils/getBound.ts"],"names":[],"mappings":";;;;;;;AAEO,MAAM,QAAQ,GAAG,CAAC,KAAD,EAAgB,GAAhB,EAA8B,GAA9B,KAAgE;EACtF,IAAI,GAAG,KAAK,SAAR,IAAqB,KAAK,KAAK,GAAnC,EAAwC;IACtC,IAAI,GAAG,KAAK,GAAZ,EAAiB;MACf,OAAO,MAAP;IACD;;IACD,OAAO,KAAP;EACD,CALD,MAKO,IAAI,GAAG,KAAK,SAAR,IAAqB,KAAK,KAAK,GAAnC,EAAwC;IAC7C,OAAO,KAAP;EACD;;EAED,OAAO,MAAP;AACD,CAXM;;AAAM,OAAA,CAAA,QAAA,GAAQ,QAAR","sourcesContent":["import type { SpinButtonBounds } from '../SpinButton';\n\nexport const getBound = (value: number, min?: number, max?: number): SpinButtonBounds => {\n  if (min !== undefined && value === min) {\n    if (max === min) {\n      return 'both';\n    }\n    return 'min';\n  } else if (max !== undefined && value === max) {\n    return 'max';\n  }\n\n  return 'none';\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/utils/getBound.ts"],"names":[],"mappings":";;;;;;;AAEO,MAAM,QAAQ,GAAG,CAAC,KAAD,EAAgB,GAAhB,EAA8B,GAA9B,KAAgE;EACtF,IAAI,GAAG,KAAK,SAAR,IAAqB,KAAK,KAAK,GAAnC,EAAwC;IACtC,IAAI,GAAG,KAAK,GAAZ,EAAiB;MACf,OAAO,MAAP;IACD;;IACD,OAAO,KAAP;EACD,CALD,MAKO,IAAI,GAAG,KAAK,SAAR,IAAqB,KAAK,KAAK,GAAnC,EAAwC;IAC7C,OAAO,KAAP;EACD;;EAED,OAAO,MAAP;AACD,CAXM;;AAAM,OAAA,CAAA,QAAA,GAAQ,QAAR","sourcesContent":["import type { SpinButtonBounds } from '../SpinButton';\n\nexport const getBound = (value: number, min?: number, max?: number): SpinButtonBounds => {\n  if (min !== undefined && value === min) {\n    if (max === min) {\n      return 'both';\n    }\n    return 'min';\n  } else if (max !== undefined && value === max) {\n    return 'max';\n  }\n\n  return 'none';\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utils/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './clamp';\nexport * from './getBound';\nexport * from './precision';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/utils/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,aAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './clamp';\nexport * from './getBound';\nexport * from './precision';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/utils/precision.js.map

@@ -1 +1 @@
-{"version":3,"sources":["utils/precision.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;AAMG;;AACH,SAAgB,kBAAhB,CAAmC,KAAnC,EAAyD;EACvD;;;;;AAKG;EACH,MAAM,MAAM,GAAG,0BAA0B,IAA1B,CAA+B,MAAM,CAAC,KAAD,CAArC,CAAf;;EACA,IAAI,CAAC,MAAL,EAAa;IACX,OAAO,CAAP;EACD;;EACD,IAAI,MAAM,CAAC,CAAD,CAAV,EAAe;IACb,OAAO,CAAC,MAAM,CAAC,CAAD,CAAN,CAAU,MAAlB;EACD;;EACD,IAAI,MAAM,CAAC,CAAD,CAAV,EAAe;IACb,OAAO,MAAM,CAAC,CAAD,CAAN,CAAU,MAAjB;EACD;;EACD,OAAO,CAAP;AACD;;AAlBD,OAAA,CAAA,kBAAA,GAAA,kBAAA;AAoBA;;;;AAIG;;AACH,SAAgB,cAAhB,CAA+B,KAA/B,EAA8C,SAA9C,EAAiE,IAAA,GAAe,EAAhF,EAAkF;EAChF,MAAM,GAAG,GAAG,IAAI,CAAC,GAAL,CAAS,IAAT,EAAe,SAAf,CAAZ;EACA,OAAO,IAAI,CAAC,KAAL,CAAW,KAAK,GAAG,GAAnB,IAA0B,GAAjC;AACD;;AAHD,OAAA,CAAA,cAAA,GAAA,cAAA","sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n  /**\n   * Group 1:\n   * [1-9]([0]+$) matches trailing zeros\n   * Group 2:\n   * \\.([0-9]*) matches all digits after a decimal point.\n   */\n  const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n  if (!groups) {\n    return 0;\n  }\n  if (groups[1]) {\n    return -groups[1].length;\n  }\n  if (groups[2]) {\n    return groups[2].length;\n  }\n  return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n  const exp = Math.pow(base, precision);\n  return Math.round(value * exp) / exp;\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinbutton/src/utils/precision.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;AAMG;;AACH,SAAgB,kBAAhB,CAAmC,KAAnC,EAAyD;EACvD;;;;;AAKG;EACH,MAAM,MAAM,GAAG,0BAA0B,IAA1B,CAA+B,MAAM,CAAC,KAAD,CAArC,CAAf;;EACA,IAAI,CAAC,MAAL,EAAa;IACX,OAAO,CAAP;EACD;;EACD,IAAI,MAAM,CAAC,CAAD,CAAV,EAAe;IACb,OAAO,CAAC,MAAM,CAAC,CAAD,CAAN,CAAU,MAAlB;EACD;;EACD,IAAI,MAAM,CAAC,CAAD,CAAV,EAAe;IACb,OAAO,MAAM,CAAC,CAAD,CAAN,CAAU,MAAjB;EACD;;EACD,OAAO,CAAP;AACD;;AAlBD,OAAA,CAAA,kBAAA,GAAA,kBAAA;AAoBA;;;;AAIG;;AACH,SAAgB,cAAhB,CAA+B,KAA/B,EAA8C,SAA9C,EAAiE,IAAA,GAAe,EAAhF,EAAkF;EAChF,MAAM,GAAG,GAAG,IAAI,CAAC,GAAL,CAAS,IAAT,EAAe,SAAf,CAAZ;EACA,OAAO,IAAI,CAAC,KAAL,CAAW,KAAK,GAAG,GAAnB,IAA0B,GAAjC;AACD;;AAHD,OAAA,CAAA,cAAA,GAAA,cAAA","sourcesContent":["/**\n * Calculates a number's precision based on the number of trailing\n * zeros if the number does not have a decimal indicated by a negative\n * precision. Otherwise, it calculates the number of digits after\n * the decimal point indicated by a positive precision.\n * @param value - the value to determine the precision of\n */\nexport function calculatePrecision(value: number | string): number {\n  /**\n   * Group 1:\n   * [1-9]([0]+$) matches trailing zeros\n   * Group 2:\n   * \\.([0-9]*) matches all digits after a decimal point.\n   */\n  const groups = /[1-9]([0]+$)|\\.([0-9]*)/.exec(String(value));\n  if (!groups) {\n    return 0;\n  }\n  if (groups[1]) {\n    return -groups[1].length;\n  }\n  if (groups[2]) {\n    return groups[2].length;\n  }\n  return 0;\n}\n\n/**\n * Rounds a number to a certain level of precision. Accepts negative precision.\n * @param value - The value that is being rounded.\n * @param precision - The number of decimal places to round the number to\n */\nexport function precisionRound(value: number, precision: number, base: number = 10): number {\n  const exp = Math.pow(base, precision);\n  return Math.round(value * exp) / exp;\n}\n"],"sourceRoot":"../src/"}