| 12 | import { remToPx } from '@/lib/remToPx' |
| 13 | |
| 14 | function createSectionStore(sections) { |
| 15 | return createStore()((set) => ({ |
| 16 | sections, |
| 17 | visibleSections: [], |
| 18 | setVisibleSections: (visibleSections) => |
| 19 | set((state) => |
| 20 | state.visibleSections.join() === visibleSections.join() |
| 21 | ? {} |
| 22 | : { visibleSections }, |
| 23 | ), |
| 24 | registerHeading: ({ id, ref, offsetRem }) => |
| 25 | set((state) => { |
| 26 | return { |
| 27 | sections: state.sections.map((section) => { |
| 28 | if (section.id === id) { |
| 29 | return { |
| 30 | ...section, |
| 31 | headingRef: ref, |
| 32 | offsetRem, |
| 33 | } |
| 34 | } |
| 35 | return section |
| 36 | }), |
| 37 | } |
| 38 | }), |
| 39 | })) |
| 40 | } |
| 41 | |
| 42 | function useVisibleSections(sectionStore) { |
| 43 | let setVisibleSections = useStore(sectionStore, (s) => s.setVisibleSections) |