@fluentui-react-native/use-slots 0.10.12 → 0.11.0
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.
- package/CHANGELOG.json +1 -1
- package/CHANGELOG.md +39 -2
- package/lib/buildUseSlots.d.ts +11 -10
- package/lib/buildUseSlots.d.ts.map +1 -1
- package/lib/buildUseSlots.js +16 -14
- package/lib/buildUseSlots.js.map +1 -1
- package/lib/buildUseSlots.test.d.ts +1 -1
- package/lib/buildUseSlots.test.js +27 -17
- package/lib/buildUseSlots.test.js.map +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/useSlots.samples.test.d.ts +1 -1
- package/lib/useSlots.samples.test.js +228 -187
- package/lib/useSlots.samples.test.js.map +1 -1
- package/lib-commonjs/buildUseSlots.d.ts +11 -10
- package/lib-commonjs/buildUseSlots.d.ts.map +1 -1
- package/lib-commonjs/buildUseSlots.js +20 -19
- package/lib-commonjs/buildUseSlots.js.map +1 -1
- package/lib-commonjs/buildUseSlots.test.d.ts +1 -1
- package/lib-commonjs/buildUseSlots.test.js +82 -45
- package/lib-commonjs/buildUseSlots.test.js.map +1 -1
- package/lib-commonjs/index.d.ts +1 -1
- package/lib-commonjs/index.js +10 -5
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/useSlots.samples.test.d.ts +1 -1
- package/lib-commonjs/useSlots.samples.test.js +297 -215
- package/lib-commonjs/useSlots.samples.test.js.map +1 -1
- package/package.json +44 -44
- package/src/__snapshots__/useSlots.samples.test.tsx.snap +42 -42
- package/src/buildUseSlots.test.tsx +8 -5
- package/src/buildUseSlots.ts +8 -5
- package/src/useSlots.samples.test.tsx +42 -42
package/CHANGELOG.json
CHANGED
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,49 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/use-slots
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
## 0.11.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- d7adbdd: # Migration from Beachball to Changesets
|
|
8
|
+
|
|
9
|
+
This changeset represents the migration from Beachball to Changesets for version management and consolidates all changes from 440+ beachball change files that were in the `change/` directory.
|
|
10
|
+
|
|
11
|
+
All 75 affected packages receive a minor version bump to acknowledge the accumulated changes from the beachball era.
|
|
12
|
+
|
|
13
|
+
## What Changed
|
|
14
|
+
|
|
15
|
+
Going forward, all version management uses Changesets via `yarn changeset`. The following beachball infrastructure has been removed:
|
|
16
|
+
|
|
17
|
+
- ❌ 440+ beachball change files from `change/` directory
|
|
18
|
+
- ❌ `beachball` package dependency
|
|
19
|
+
- ❌ Beachball scripts from `package.json`
|
|
20
|
+
- ❌ `beachball.config.js` configuration file
|
|
21
|
+
- ❌ Beachball publish steps from Azure Pipelines
|
|
22
|
+
|
|
23
|
+
## New Workflow
|
|
24
|
+
|
|
25
|
+
✅ **Create changes**: Run `yarn changeset` to document changes
|
|
26
|
+
✅ **Version bump PRs**: Automatically created by GitHub Actions
|
|
27
|
+
✅ **Publishing**: Handled by Azure Pipelines using `changeset publish`
|
|
28
|
+
✅ **Validation**: CI validates changesets and blocks major version bumps
|
|
29
|
+
|
|
30
|
+
For details, see `CHANGESETS_SETUP.md` and `CONTRIBUTING.md`.
|
|
31
|
+
|
|
32
|
+
### Patch Changes
|
|
33
|
+
|
|
34
|
+
- d1d8c26: We were pinning @types/react and react-native-macos via resolutions. This fixes that which uncovered a bunch of type inconsistencies that needed to be addressed.
|
|
35
|
+
- Updated dependencies [d7adbdd]
|
|
36
|
+
- Updated dependencies [d1d8c26]
|
|
37
|
+
- @fluentui-react-native/framework-base@0.3.0
|
|
38
|
+
- @fluentui-react-native/use-slot@0.7.0
|
|
39
|
+
|
|
40
|
+
<!-- This log was last generated on Tue, 05 Aug 2025 18:50:39 GMT and should not be manually modified. -->
|
|
4
41
|
|
|
5
42
|
<!-- Start content -->
|
|
6
43
|
|
|
7
44
|
## 0.10.12
|
|
8
45
|
|
|
9
|
-
Tue, 05 Aug 2025 18:
|
|
46
|
+
Tue, 05 Aug 2025 18:50:39 GMT
|
|
10
47
|
|
|
11
48
|
### Patches
|
|
12
49
|
|
package/lib/buildUseSlots.d.ts
CHANGED
|
@@ -1,17 +1,18 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { type ComponentType } from '@fluentui-react-native/use-slot';
|
|
2
|
+
import type { FunctionComponent, PropsFilter } from '@fluentui-react-native/framework-base';
|
|
2
3
|
export type Slots<TSlotProps> = {
|
|
3
|
-
|
|
4
|
+
[K in keyof TSlotProps]: FunctionComponent<TSlotProps[K]>;
|
|
4
5
|
};
|
|
5
6
|
export type UseSlotOptions<TSlotProps> = {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
7
|
+
slots: {
|
|
8
|
+
[K in keyof TSlotProps]: ComponentType<TSlotProps[K]>;
|
|
9
|
+
};
|
|
10
|
+
filters?: {
|
|
11
|
+
[K in keyof TSlotProps]?: PropsFilter;
|
|
12
|
+
};
|
|
13
|
+
useStyling?: TSlotProps | GetSlotProps<TSlotProps>;
|
|
13
14
|
};
|
|
14
15
|
export type GetSlotProps<TSlotProps> = (...args: any[]) => TSlotProps;
|
|
15
16
|
export type UseSlotsBase<TSlotProps> = (...args: any[]) => Slots<TSlotProps>;
|
|
16
17
|
export declare function buildUseSlots<TSlotProps>(options: UseSlotOptions<TSlotProps>): UseSlotsBase<TSlotProps>;
|
|
17
|
-
//# sourceMappingURL=buildUseSlots.d.ts.map
|
|
18
|
+
//# sourceMappingURL=buildUseSlots.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseSlots.d.ts","sourceRoot":"","sources":["../src/buildUseSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"buildUseSlots.d.ts","sourceRoot":"","sources":["../src/buildUseSlots.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAC9E,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAS5F,MAAM,MAAM,KAAK,CAAC,UAAU,IAAI;KAAG,CAAC,IAAI,MAAM,UAAU,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAE9F,MAAM,MAAM,cAAc,CAAC,UAAU,IAAI;IACvC,KAAK,EAAE;SAAG,CAAC,IAAI,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;KAAE,CAAC;IACjE,OAAO,CAAC,EAAE;SAAG,CAAC,IAAI,MAAM,UAAU,CAAC,CAAC,EAAE,WAAW;KAAE,CAAC;IACpD,UAAU,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AAEF,MAAM,MAAM,YAAY,CAAC,UAAU,IAAI,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,UAAU,CAAC;AAEtE,MAAM,MAAM,YAAY,CAAC,UAAU,IAAI,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,KAAK,CAAC,UAAU,CAAC,CAAC;AAE7E,wBAAgB,aAAa,CAAC,UAAU,EAAE,OAAO,EAAE,cAAc,CAAC,UAAU,CAAC,GAAG,YAAY,CAAC,UAAU,CAAC,CAqBvG"}
|
package/lib/buildUseSlots.js
CHANGED
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
import { useSlot } from '@fluentui-react-native/use-slot';
|
|
2
2
|
export function buildUseSlots(options) {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
3
|
+
const { slots, filters = {}, useStyling } = options;
|
|
4
|
+
return (...args) => {
|
|
5
|
+
// get the baseline slot props to render with the slots
|
|
6
|
+
const slotProps = typeof useStyling === 'function' ? useStyling(...args) : useStyling || {};
|
|
7
|
+
// build up a set of slots closures and store them in props
|
|
8
|
+
const builtSlots = {};
|
|
9
|
+
// for each slot go through and either cache the slot props or call part one render if it is staged
|
|
10
|
+
// note: changing this to a for..in loop causes rule of hooks violations
|
|
11
|
+
// eslint-disable-next-line @rnx-kit/no-foreach-with-captured-variables
|
|
12
|
+
Object.keys(slots).forEach((slotName) => {
|
|
13
|
+
builtSlots[slotName] = useSlot(slots[slotName], slotProps[slotName], filters[slotName]);
|
|
14
|
+
});
|
|
15
|
+
// return the prebuilt closures, these will have internal references to state.results
|
|
16
|
+
return builtSlots;
|
|
17
|
+
};
|
|
16
18
|
}
|
|
17
|
-
//# sourceMappingURL=buildUseSlots.js.map
|
|
19
|
+
//# sourceMappingURL=buildUseSlots.js.map
|
package/lib/buildUseSlots.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseSlots.js","sourceRoot":"","sources":["../src/buildUseSlots.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"buildUseSlots.js","sourceRoot":"","sources":["../src/buildUseSlots.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAsB,MAAM,iCAAiC,CAAC;AAsB9E,MAAM,UAAU,aAAa,CAAa,OAAmC,EAA4B;IACvG,MAAM,EAAE,KAAK,EAAE,OAAO,GAAG,EAAE,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;IACpD,OAAO,CAAC,GAAG,IAAW,EAAE,EAAE,CAAC;QACzB,uDAAuD;QACvD,MAAM,SAAS,GACb,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAE,UAAqC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAE,CAAC,UAAU,IAAI,EAAE,CAAgB,CAAC;QAE1H,2DAA2D;QAC3D,MAAM,UAAU,GAAsB,EAAuB,CAAC;QAE9D,mGAAmG;QAEnG,wEAAwE;QACxE,uEAAuE;QACvE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC;YACvC,UAAU,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC;QAAA,CACzF,CAAC,CAAC;QAEH,qFAAqF;QACrF,OAAO,UAAU,CAAC;IAAA,CACnB,CAAC;AAAA,CACH"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=buildUseSlots.test.d.ts.map
|
|
2
|
+
//# sourceMappingURL=buildUseSlots.test.d.ts.map
|
|
@@ -1,27 +1,37 @@
|
|
|
1
|
+
import { jsx as _jsx } from '@fluentui-react-native/framework-base/jsx-runtime';
|
|
2
|
+
/** @jsxImportSource @fluentui-react-native/framework-base */
|
|
3
|
+
import { act } from 'react';
|
|
1
4
|
import { View, Text } from 'react-native';
|
|
2
|
-
import {
|
|
5
|
+
import { stagedComponent } from '@fluentui-react-native/framework-base';
|
|
3
6
|
import * as renderer from 'react-test-renderer';
|
|
4
7
|
import { buildUseSlots } from './buildUseSlots';
|
|
5
8
|
const useSlotsBase = buildUseSlots({
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
slots: {
|
|
10
|
+
outer: View,
|
|
11
|
+
inner: View,
|
|
12
|
+
content: Text,
|
|
13
|
+
},
|
|
11
14
|
});
|
|
12
15
|
const CompBase = stagedComponent((props) => {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
16
|
+
const Slots = useSlotsBase(props);
|
|
17
|
+
return (extra) => {
|
|
18
|
+
const merged = { ...props, ...extra };
|
|
19
|
+
return _jsx(Slots.outer, {
|
|
20
|
+
...merged,
|
|
21
|
+
children: _jsx(Slots.inner, {
|
|
22
|
+
style: { backgroundColor: 'blue', width: 20, height: 10 },
|
|
23
|
+
children: _jsx(Slots.content, { children: 'Hello' }),
|
|
24
|
+
}),
|
|
25
|
+
});
|
|
26
|
+
};
|
|
20
27
|
});
|
|
21
28
|
describe('buildUseSlots test suite', () => {
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
29
|
+
it('Simple component render', () => {
|
|
30
|
+
let component;
|
|
31
|
+
act(() => {
|
|
32
|
+
component = renderer.create(_jsx(CompBase, { style: { width: 30, height: 20, borderColor: 'green', borderWidth: 1 } }));
|
|
25
33
|
});
|
|
34
|
+
expect(component.toJSON()).toMatchSnapshot();
|
|
35
|
+
});
|
|
26
36
|
});
|
|
27
|
-
//# sourceMappingURL=buildUseSlots.test.js.map
|
|
37
|
+
//# sourceMappingURL=buildUseSlots.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseSlots.test.js","sourceRoot":"","sources":["../src/buildUseSlots.test.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"buildUseSlots.test.js","sourceRoot":"","sources":["../src/buildUseSlots.test.tsx"],"names":[],"mappings":";AAAA,6DAA6D;AAC7D,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,KAAK,QAAQ,MAAM,qBAAqB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAQhD,MAAM,YAAY,GAAG,aAAa,CAAa;IAC7C,KAAK,EAAE;QACL,KAAK,EAAE,IAAI;QACX,KAAK,EAAE,IAAI;QACX,OAAO,EAAE,IAAI;KACd;CACF,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAG,eAAe,CAAC,CAAC,KAAgB,EAAE,EAAE,CAAC;IACrD,MAAM,KAAK,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAClC,OAAO,CAAC,KAAgB,EAAE,EAAE,CAAC;QAC3B,MAAM,MAAM,GAAG,EAAE,GAAG,KAAK,EAAE,GAAG,KAAK,EAAE,CAAC;QACtC,OAAO,CACL,KAAC,KAAK,CAAC,KAAK,OAAK,MAAM,YACrB,KAAC,KAAK,CAAC,KAAK,IAAC,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,YACpE,KAAC,KAAK,CAAC,OAAO,wBAAsB,GACxB,GACF,CACf,CAAC;IAAA,CACH,CAAC;AAAA,CACH,CAAC,CAAC;AAEH,QAAQ,CAAC,0BAA0B,EAAE,GAAG,EAAE,CAAC;IACzC,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE,CAAC;QAClC,IAAI,SAAqC,CAAC;QAC1C,GAAG,CAAC,GAAG,EAAE,CAAC;YACR,SAAS,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC,EAAE,GAAI,CAAC,CAAC;QAAA,CACnH,CAAC,CAAC;QACH,MAAM,CAAC,SAAU,CAAC,MAAM,EAAE,CAAC,CAAC,eAAe,EAAE,CAAC;IAAA,CAC/C,CAAC,CAAC;AAAA,CACJ,CAAC,CAAC"}
|
package/lib/index.d.ts
CHANGED
package/lib/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export { buildUseSlots } from './buildUseSlots';
|
|
2
|
-
//# sourceMappingURL=index.js.map
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export {};
|
|
2
|
-
//# sourceMappingURL=useSlots.samples.test.d.ts.map
|
|
2
|
+
//# sourceMappingURL=useSlots.samples.test.d.ts.map
|