@fluentui/react-timepicker-compat 0.4.7 → 0.4.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +13 -2
  2. package/lib/components/TimePicker/useTimePickerStyles.styles.raw.js +33 -0
  3. package/lib/components/TimePicker/useTimePickerStyles.styles.raw.js.map +1 -0
  4. package/lib-commonjs/components/TimePicker/useTimePickerStyles.styles.raw.js +49 -0
  5. package/lib-commonjs/components/TimePicker/useTimePickerStyles.styles.raw.js.map +1 -0
  6. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,12 +1,23 @@
1
1
  # Change Log - @fluentui/react-timepicker-compat
2
2
 
3
- This log was last generated on Fri, 11 Jul 2025 15:56:58 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 17 Jul 2025 13:45:50 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [0.4.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-timepicker-compat_v0.4.9)
8
+
9
+ Thu, 17 Jul 2025 13:45:50 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-timepicker-compat_v0.4.7..@fluentui/react-timepicker-compat_v0.4.9)
11
+
12
+ ### Patches
13
+
14
+ - feat: enable griffel raw styles ([PR #34853](https://github.com/microsoft/fluentui/pull/34853) by martinhochel@microsoft.com)
15
+ - Bump @fluentui/react-combobox to v9.16.0 ([PR #34862](https://github.com/microsoft/fluentui/pull/34862) by beachball)
16
+ - Bump @fluentui/react-field to v9.4.0 ([PR #34862](https://github.com/microsoft/fluentui/pull/34862) by beachball)
17
+
7
18
  ## [0.4.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-timepicker-compat_v0.4.7)
8
19
 
9
- Fri, 11 Jul 2025 15:56:58 GMT
20
+ Fri, 11 Jul 2025 15:59:24 GMT
10
21
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-timepicker-compat_v0.4.6..@fluentui/react-timepicker-compat_v0.4.7)
11
22
 
12
23
  ### Patches
package/lib/components/TimePicker/useTimePickerStyles.styles.raw.js ADDED
@@ -0,0 +1,33 @@
1
+ import { makeStyles, mergeClasses } from '@griffel/react';
2
+ import { useComboboxStyles_unstable } from '@fluentui/react-combobox';
3
+ export const timePickerClassNames = {
4
+ root: 'fui-TimePicker',
5
+ input: 'fui-TimePicker__input',
6
+ expandIcon: 'fui-TimePicker__expandIcon',
7
+ clearIcon: 'fui-TimePicker__clearIcon',
8
+ listbox: 'fui-TimePicker__listbox'
9
+ };
10
+ const useStyles = makeStyles({
11
+ listbox: {
12
+ maxHeight: 'min(80vh, 416px)'
13
+ }
14
+ });
15
+ /**
16
+ * Apply styling to the TimePicker slots based on the state
17
+ */ export const useTimePickerStyles_unstable = (state)=>{
18
+ 'use no memo';
19
+ const styles = useStyles();
20
+ state.root.className = mergeClasses(timePickerClassNames.root, state.root.className);
21
+ state.input.className = mergeClasses(timePickerClassNames.input, state.input.className);
22
+ if (state.expandIcon) {
23
+ state.expandIcon.className = mergeClasses(timePickerClassNames.expandIcon, state.expandIcon.className);
24
+ }
25
+ if (state.clearIcon) {
26
+ state.clearIcon.className = mergeClasses(timePickerClassNames.clearIcon, state.clearIcon.className);
27
+ }
28
+ if (state.listbox) {
29
+ state.listbox.className = mergeClasses(timePickerClassNames.listbox, styles.listbox, state.listbox.className);
30
+ }
31
+ useComboboxStyles_unstable(state);
32
+ return state;
33
+ };
package/lib/components/TimePicker/useTimePickerStyles.styles.raw.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/TimePicker/useTimePickerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { TimePickerSlots, TimePickerState } from './TimePicker.types';\nimport { useComboboxStyles_unstable } from '@fluentui/react-combobox';\n\nexport const timePickerClassNames: SlotClassNames<TimePickerSlots> = {\n root: 'fui-TimePicker',\n input: 'fui-TimePicker__input',\n expandIcon: 'fui-TimePicker__expandIcon',\n clearIcon: 'fui-TimePicker__clearIcon',\n listbox: 'fui-TimePicker__listbox',\n};\n\nconst useStyles = makeStyles({\n listbox: {\n maxHeight: 'min(80vh, 416px)', // height for 12 items or 80vh, whichever is smaller\n },\n});\n\n/**\n * Apply styling to the TimePicker slots based on the state\n */\nexport const useTimePickerStyles_unstable = (state: TimePickerState): TimePickerState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(timePickerClassNames.root, state.root.className);\n\n state.input.className = mergeClasses(timePickerClassNames.input, state.input.className);\n\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(timePickerClassNames.expandIcon, state.expandIcon.className);\n }\n\n if (state.clearIcon) {\n state.clearIcon.className = mergeClasses(timePickerClassNames.clearIcon, state.clearIcon.className);\n }\n\n if (state.listbox) {\n state.listbox.className = mergeClasses(timePickerClassNames.listbox, styles.listbox, state.listbox.className);\n }\n\n useComboboxStyles_unstable(state);\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","useComboboxStyles_unstable","timePickerClassNames","root","input","expandIcon","clearIcon","listbox","useStyles","maxHeight","useTimePickerStyles_unstable","state","styles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,SAASC,0BAA0B,QAAQ,2BAA2B;AAEtE,OAAO,MAAMC,uBAAwD;IACnEC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZC,WAAW;IACXC,SAAS;AACX,EAAE;AAEF,MAAMC,YAAYT,WAAW;IAC3BQ,SAAS;QACPE,WAAW;IACb;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3C;IAEA,MAAMC,SAASJ;IAEfG,MAAMR,IAAI,CAACU,SAAS,GAAGb,aAAaE,qBAAqBC,IAAI,EAAEQ,MAAMR,IAAI,CAACU,SAAS;IAEnFF,MAAMP,KAAK,CAACS,SAAS,GAAGb,aAAaE,qBAAqBE,KAAK,EAAEO,MAAMP,KAAK,CAACS,SAAS;IAEtF,IAAIF,MAAMN,UAAU,EAAE;QACpBM,MAAMN,UAAU,CAACQ,SAAS,GAAGb,aAAaE,qBAAqBG,UAAU,EAAEM,MAAMN,UAAU,CAACQ,SAAS;IACvG;IAEA,IAAIF,MAAML,SAAS,EAAE;QACnBK,MAAML,SAAS,CAACO,SAAS,GAAGb,aAAaE,qBAAqBI,SAAS,EAAEK,MAAML,SAAS,CAACO,SAAS;IACpG;IAEA,IAAIF,MAAMJ,OAAO,EAAE;QACjBI,MAAMJ,OAAO,CAACM,SAAS,GAAGb,aAAaE,qBAAqBK,OAAO,EAAEK,OAAOL,OAAO,EAAEI,MAAMJ,OAAO,CAACM,SAAS;IAC9G;IAEAZ,2BAA2BU;IAE3B,OAAOA;AACT,EAAE"}
package/lib-commonjs/components/TimePicker/useTimePickerStyles.styles.raw.js ADDED
@@ -0,0 +1,49 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ timePickerClassNames: function() {
13
+ return timePickerClassNames;
14
+ },
15
+ useTimePickerStyles_unstable: function() {
16
+ return useTimePickerStyles_unstable;
17
+ }
18
+ });
19
+ const _react = require("@griffel/react");
20
+ const _reactcombobox = require("@fluentui/react-combobox");
21
+ const timePickerClassNames = {
22
+ root: 'fui-TimePicker',
23
+ input: 'fui-TimePicker__input',
24
+ expandIcon: 'fui-TimePicker__expandIcon',
25
+ clearIcon: 'fui-TimePicker__clearIcon',
26
+ listbox: 'fui-TimePicker__listbox'
27
+ };
28
+ const useStyles = (0, _react.makeStyles)({
29
+ listbox: {
30
+ maxHeight: 'min(80vh, 416px)'
31
+ }
32
+ });
33
+ const useTimePickerStyles_unstable = (state)=>{
34
+ 'use no memo';
35
+ const styles = useStyles();
36
+ state.root.className = (0, _react.mergeClasses)(timePickerClassNames.root, state.root.className);
37
+ state.input.className = (0, _react.mergeClasses)(timePickerClassNames.input, state.input.className);
38
+ if (state.expandIcon) {
39
+ state.expandIcon.className = (0, _react.mergeClasses)(timePickerClassNames.expandIcon, state.expandIcon.className);
40
+ }
41
+ if (state.clearIcon) {
42
+ state.clearIcon.className = (0, _react.mergeClasses)(timePickerClassNames.clearIcon, state.clearIcon.className);
43
+ }
44
+ if (state.listbox) {
45
+ state.listbox.className = (0, _react.mergeClasses)(timePickerClassNames.listbox, styles.listbox, state.listbox.className);
46
+ }
47
+ (0, _reactcombobox.useComboboxStyles_unstable)(state);
48
+ return state;
49
+ };
package/lib-commonjs/components/TimePicker/useTimePickerStyles.styles.raw.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/TimePicker/useTimePickerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { TimePickerSlots, TimePickerState } from './TimePicker.types';\nimport { useComboboxStyles_unstable } from '@fluentui/react-combobox';\n\nexport const timePickerClassNames: SlotClassNames<TimePickerSlots> = {\n root: 'fui-TimePicker',\n input: 'fui-TimePicker__input',\n expandIcon: 'fui-TimePicker__expandIcon',\n clearIcon: 'fui-TimePicker__clearIcon',\n listbox: 'fui-TimePicker__listbox',\n};\n\nconst useStyles = makeStyles({\n listbox: {\n maxHeight: 'min(80vh, 416px)', // height for 12 items or 80vh, whichever is smaller\n },\n});\n\n/**\n * Apply styling to the TimePicker slots based on the state\n */\nexport const useTimePickerStyles_unstable = (state: TimePickerState): TimePickerState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(timePickerClassNames.root, state.root.className);\n\n state.input.className = mergeClasses(timePickerClassNames.input, state.input.className);\n\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(timePickerClassNames.expandIcon, state.expandIcon.className);\n }\n\n if (state.clearIcon) {\n state.clearIcon.className = mergeClasses(timePickerClassNames.clearIcon, state.clearIcon.className);\n }\n\n if (state.listbox) {\n state.listbox.className = mergeClasses(timePickerClassNames.listbox, styles.listbox, state.listbox.className);\n }\n\n useComboboxStyles_unstable(state);\n\n return state;\n};\n"],"names":["timePickerClassNames","useTimePickerStyles_unstable","root","input","expandIcon","clearIcon","listbox","useStyles","makeStyles","maxHeight","state","styles","className","mergeClasses","useComboboxStyles_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,oBAAAA;eAAAA;;IAiBAC,4BAAAA;eAAAA;;;uBAtB4B;+BAGE;AAEpC,MAAMD,uBAAwD;IACnEE,MAAM;IACNC,OAAO;IACPC,YAAY;IACZC,WAAW;IACXC,SAAS;AACX;AAEA,MAAMC,YAAYC,IAAAA,iBAAAA,EAAW;IAC3BF,SAAS;QACPG,WAAW;IACb;AACF;AAKO,MAAMR,+BAA+B,CAACS;IAC3C;IAEA,MAAMC,SAASJ;IAEfG,MAAMR,IAAI,CAACU,SAAS,GAAGC,IAAAA,mBAAAA,EAAab,qBAAqBE,IAAI,EAAEQ,MAAMR,IAAI,CAACU,SAAS;IAEnFF,MAAMP,KAAK,CAACS,SAAS,GAAGC,IAAAA,mBAAAA,EAAab,qBAAqBG,KAAK,EAAEO,MAAMP,KAAK,CAACS,SAAS;IAEtF,IAAIF,MAAMN,UAAU,EAAE;QACpBM,MAAMN,UAAU,CAACQ,SAAS,GAAGC,IAAAA,mBAAAA,EAAab,qBAAqBI,UAAU,EAAEM,MAAMN,UAAU,CAACQ,SAAS;IACvG;IAEA,IAAIF,MAAML,SAAS,EAAE;QACnBK,MAAML,SAAS,CAACO,SAAS,GAAGC,IAAAA,mBAAAA,EAAab,qBAAqBK,SAAS,EAAEK,MAAML,SAAS,CAACO,SAAS;IACpG;IAEA,IAAIF,MAAMJ,OAAO,EAAE;QACjBI,MAAMJ,OAAO,CAACM,SAAS,GAAGC,IAAAA,mBAAAA,EAAab,qBAAqBM,OAAO,EAAEK,OAAOL,OAAO,EAAEI,MAAMJ,OAAO,CAACM,SAAS;IAC9G;IAEAE,IAAAA,yCAAAA,EAA2BJ;IAE3B,OAAOA;AACT"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-timepicker-compat",
3
- "version": "0.4.7",
3
+ "version": "0.4.9",
4
4
  "description": "Fluent UI TimePicker Compat Component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -28,8 +28,8 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@fluentui/keyboard-keys": "^9.0.8",
31
- "@fluentui/react-combobox": "^9.15.7",
32
- "@fluentui/react-field": "^9.3.7",
31
+ "@fluentui/react-combobox": "^9.16.0",
32
+ "@fluentui/react-field": "^9.4.0",
33
33
  "@fluentui/react-jsx-runtime": "^9.1.2",
34
34
  "@fluentui/react-shared-contexts": "^9.24.0",
35
35
  "@fluentui/react-theme": "^9.1.24",