{"_id":"@apvee/spfx-m365-actionable-provisioning","name":"@apvee/spfx-m365-actionable-provisioning","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@apvee/spfx-m365-actionable-provisioning","version":"1.0.0","description":"Reusable SPFx UI, hooks, and property pane controls for M365 actionable provisioning.","keywords":["spfx","m365","sharepoint","provisioning","fluentui"],"license":"MIT","publishConfig":{"access":"public"},"main":"lib/index.js","types":"lib/index.d.ts","exports":{".":{"types":"./lib/index.d.ts","default":"./lib/index.js"},"./package.json":"./package.json"},"scripts":{"build":"npm run clean && tsc -p tsconfig.json && node scripts/copy-loc.cjs","clean":"node -e \"require('fs').rmSync('lib', { recursive: true, force: true })\"","postinstall":"node scripts/post-install.cjs","prepack":"npm run build"},"dependencies":{"tslib":"2.3.1"},"peerDependencies":{"@apvee/m365-actionable-provisioning":"1.0.0","@apvee/react-layout-kit":"^1.2.0","@fluentui/react":"^8.106.4","@fluentui/react-components":"^9.72.9","@fluentui/react-icons":"^2.0.316","@fluentui/react-migration-v8-v9":"^9.9.18","@fluentui/react-motion-components-preview":"^0.14.2","@microsoft/sp-component-base":"1.21.1","@microsoft/sp-core-library":"1.21.1","@microsoft/sp-property-pane":"1.21.1","@microsoft/sp-webpart-base":"1.21.1","@pnp/graph":"^4.17.0","@pnp/sp":"^4.17.0","react":"17.0.1","react-dom":"17.0.1"},"devDependencies":{"@apvee/m365-actionable-provisioning":"1.0.0","@apvee/react-layout-kit":"^1.2.0","@fluentui/react":"^8.106.4","@fluentui/react-components":"^9.72.9","@fluentui/react-icons":"^2.0.316","@fluentui/react-migration-v8-v9":"^9.9.18","@fluentui/react-motion-components-preview":"^0.14.2","@microsoft/sp-component-base":"1.21.1","@microsoft/sp-core-library":"1.21.1","@microsoft/sp-property-pane":"1.21.1","@microsoft/sp-webpart-base":"1.21.1","@pnp/graph":"^4.17.0","@pnp/sp":"^4.17.0","react":"17.0.1","react-dom":"17.0.1"},"_id":"@apvee/spfx-m365-actionable-provisioning@1.0.0","gitHead":"3ee971d5bfde889463afd8968cfa1661fc7408b8","_nodeVersion":"22.14.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-zmVyu54EJcj56M+cmT0BJYR9pTQyyX7L3Pg1YXVC1BChsWs7cj+ONsyHxiaD1c0ruybqh+Ers75xhWaqykOzWw==","shasum":"ba52ae36e6b08c42592be442234b3c300257bf69","tarball":"https://registry.npmjs.org/@apvee/spfx-m365-actionable-provisioning/-/spfx-m365-actionable-provisioning-1.0.0.tgz","fileCount":257,"unpackedSize":732761,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDa6P3b1HFu9rbW0RqtW5yxUxpOoCQXKveUZp96FXATZAIgNdKv5WwIFmc5Tc61NapuZdRAoiMPFtmGeXgbSpnEmI0="}]},"_npmUser":{"name":"fabiofranzini","email":"fabio@apvee.com"},"directories":{},"maintainers":[{"name":"fabiofranzini","email":"fabio@apvee.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/spfx-m365-actionable-provisioning_1.0.0_1782129381491_0.4890496740725465"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-22T11:56:21.269Z","1.0.0":"2026-06-22T11:56:21.617Z","modified":"2026-06-22T11:56:21.912Z"},"maintainers":[{"name":"fabiofranzini","email":"fabio@apvee.com"}],"description":"Reusable SPFx UI, hooks, and property pane controls for M365 actionable provisioning.","keywords":["spfx","m365","sharepoint","provisioning","fluentui"],"license":"MIT","readme":"# @apvee/spfx-m365-actionable-provisioning\n\nReusable SPFx UI, hooks, property pane fields, theme bridge, localization, and activity utilities for `@apvee/m365-actionable-provisioning`.\n\n![@apvee/spfx-m365-actionable-provisioning](https://raw.githubusercontent.com/apvee/m365-actionable-provisioning/refs/heads/main/docs/spfx-m365-actionable-provisioning.jpeg)\n\nThis package does not implement provisioning actions. It adapts the core M365 provisioning engine to SharePoint Framework applications.\n\n## Installation\n\n```bash\nnpm install @apvee/spfx-m365-actionable-provisioning @apvee/m365-actionable-provisioning\n```\n\nSPFx applications must also provide the package peer dependencies, including SPFx 1.21, React 17, Fluent UI 8/9, `@apvee/react-layout-kit`, `@pnp/sp`, and `@pnp/graph`.\n\n## Public API\n\n- `ProvisioningDialog`: Fluent UI dialog for provisioning and compliance checks.\n- `SPFxFluentProvider`: SPFx theme-aware Fluent UI 9 provider.\n- `useSPFxProvisioningEngine`: hook that creates authenticated PnPjs `spfi` and `graphClient` clients from SPFx context and runs the core engine.\n- `useProvisioningDerivedState`: derives UI state from engine snapshots.\n- `PropertyPaneProvisioningField`: property pane command field for provision, deprovision, compliance check, and state persistence.\n- `PropertyPaneSiteSelectorField`: property pane site selection field.\n- Utility builders for provisioning/compliance activity entries and SPFx-to-Fluent theme conversion.\n\n## Localization\n\nThe package uses the SPFx localized resource name `SPFxProvisioningUIStrings`.\n\nThe npm package exposes only the package root (`@apvee/spfx-m365-actionable-provisioning`) and `./package.json`. Import public APIs from the package root; deep import paths are not part of the package export contract.\n\nThe `postinstall` script adds this entry automatically when it can locate an SPFx `config/config.json` and the resource name is not already mapped:\n\n```json\n{\n  \"localizedResources\": {\n    \"SPFxProvisioningUIStrings\": \"node_modules/@apvee/spfx-m365-actionable-provisioning/lib/loc/{locale}.js\"\n  }\n}\n```\n\nIf your build process skips package lifecycle scripts, add the mapping manually. If the resource name already exists with a different path, the script leaves it unchanged and reports the conflict instead of overwriting your SPFx config.\n\n## Graph Permissions\n\n`useSPFxProvisioningEngine` creates both SharePoint and Graph PnPjs clients:\n\n```typescript\nclients: { spfi, graphClient }\n```\n\nSharePoint-only actions run with the current user's SharePoint permissions. Content type actions use Microsoft Graph and require `Sites.Manage.All` or a higher Graph permission such as `Sites.FullControl.All`.\n\nSPFx solutions that use content type actions should include:\n\n```json\n\"webApiPermissionRequests\": [\n  {\n    \"resource\": \"Microsoft Graph\",\n    \"scope\": \"Sites.Manage.All\"\n  }\n]\n```\n\n## React Usage\n\nWrap SPFx React content with `SPFxFluentProvider` so Fluent UI 9 components receive the current SPFx theme:\n\n```tsx\nimport * as React from 'react';\nimport type { WebPartContext } from '@microsoft/sp-webpart-base';\nimport { Button } from '@fluentui/react-components';\nimport {\n  ProvisioningDialog,\n  SPFxFluentProvider,\n} from '@apvee/spfx-m365-actionable-provisioning';\nimport { createLogger, consoleSink } from '@apvee/m365-actionable-provisioning';\nimport { provisioningPlan } from './provisioning-plan';\n\nexport const MyWebPart: React.FC<{ context: WebPartContext }> = ({ context }) => {\n  const [open, setOpen] = React.useState(false);\n  const logger = React.useMemo(\n    () => createLogger({ level: 'info', sink: consoleSink }),\n    []\n  );\n\n  return (\n    <SPFxFluentProvider context={context}>\n      <Button onClick={() => setOpen(true)}>Configure site</Button>\n\n      <ProvisioningDialog\n        open={open}\n        onClose={() => setOpen(false)}\n        context={context}\n        planTemplate={provisioningPlan}\n        logger={logger}\n        targetSiteUrl={context.pageContext.web.absoluteUrl}\n        enableComplianceCheck={true}\n      />\n    </SPFxFluentProvider>\n  );\n};\n```\n\n## Hook Usage\n\nUse `useSPFxProvisioningEngine` when you need custom UI around the engine:\n\n```typescript\nconst { snapshot, run, cancel, checkCompliance } = useSPFxProvisioningEngine({\n  context,\n  targetSiteUrl,\n  planTemplate,\n  logger,\n  initialScope,\n  engineOptions,\n});\n```\n\nWhen `targetSiteUrl` is provided, the hook seeds `siteUrl`, `webUrl`, and `web` in the initial scope unless the caller-provided `initialScope` overrides them.\n\n## Property Pane Usage\n\n```typescript\nimport {\n  PropertyPaneProvisioningField,\n  PropertyPaneSiteSelectorField,\n  type TemplateAppliedState,\n} from '@apvee/spfx-m365-actionable-provisioning';\n\nexport interface IMyWebPartProps {\n  targetSiteUrl?: string;\n  provisioningState?: TemplateAppliedState;\n}\n\nPropertyPaneSiteSelectorField('targetSiteUrl', {\n  label: 'Target site',\n  context: this.context,\n  value: this.properties.targetSiteUrl,\n});\n\nPropertyPaneProvisioningField('provisioningState', {\n  context: this.context,\n  label: 'Site configuration',\n  provisioningActionPlan,\n  deprovisioningActionPlan,\n  targetSiteUrl: this.properties.targetSiteUrl,\n  effectiveState: this.properties.provisioningState,\n  enableComplianceCheck: true,\n});\n```\n\n`TemplateAppliedState` is:\n\n```typescript\ntype TemplateAppliedState = 'applied' | 'notApplied' | 'unknown';\n```\n\nThe bound `targetProperty` stores the next effective state when the field changes. Pass the persisted value back through `effectiveState`.\n\n## Package Scripts\n\n```bash\nnpm run build -w @apvee/spfx-m365-actionable-provisioning\n```\n\n## Deeper Documentation\n\n- [Introduction](../../docs/introduction.md)\n- [Core engine](../../docs/core/engine.md)\n- [SPFx integration](../../docs/spfx/integration.md)\n- [ProvisioningDialog](../../docs/spfx/provisioning-dialog.md)\n- [Property pane fields](../../docs/spfx/property-pane-fields.md)\n- [Demo SPFx app](../../apps/test-spfx)\n","readmeFilename":"README.md","_rev":"1-902e68f1ccdb80752afabffdaf637680"}