Sp-dev-docs: Placeholder JSX control is missing

[rgueldenpfennig]

Category

• [X] Question
• [ ] Typo
• [ ] Bug
• [ ] Additional article idea

Expected or Desired Behavior

I want to use the Placeholder control from "microsoft/sp-webpart-base".

Observed Behavior

The Placeholder class can not be resolved anymore. Since I updated the Microsoft NPM packages to the latest version (1.1.1) the control seems to be moved to another package or has been removed.

The change log from \node_modules\@microsoft\sp-webpart-base\CHANGELOG.md mentions no changes at all:

## 1.1.1
Thu, 08 Jun 2017 19:39:03 GMT

*Changes not tracked*

Steps to Reproduce

Create a new HelloWorld web part with the SharePoint Yeoman template and try to reference and use the Placeholder control.

import { Placeholder } from '@microsoft/sp-webpart-base';

public render(): JSX.Element {
    return (
      <Fabric>                 
              <Placeholder
                  icon={ 'ms-Icon--ThumbnailView' }
                  iconText={ strings.ProductName }
                  description={ strings.GetStarted }
                  buttonLabel={ strings.Configure }
                  onAdd={ this._configureWebPart } />
      </Fabric>
    );
  }

A working Placeholder is used in the React-Todo-Basic exmple:
https://github.com/SharePoint/sp-dev-fx-webparts/blob/644ef15a1131e5ec30e8289b85971cc0576a3e94/samples/react-todo-basic/src/webparts/todo/components/TodoContainer/TodoContainer.tsx

[eoverfield]

I can confirm this issue as well. I dug more into it. In the GA release notes: https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-GA, we can see we should work with "@microsoft/sp-webpart-base": "~1.0.0". sp-webpart-base has a placeholder component exported from "./components/placeHolder/".

In the release notes for the Extension Preview: https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes---Extensions-Dev-Preview-Drop-1, we can now see that we are to use "@microsoft/sp-webpart-base": "~1.1.1". Ok, so we open up the new sp-webpart-base in v1.1.1 and we can see that PlaceHolder is now missing.

Yet if you look in sp-webpart-base then ./components/placeHolder, it seems that placeholder.d.ts is missing while all of the other pieces for PlaceHolder are there.

@patmill What are the chances we can get placeholder.d.ts added back into sp-webpart-base quickly?

If this was intentionally removed from the latest code drop, could I request that the release notes be updated to include what else was removed / changed in webpart-base and other base packages?

[patmill]

I'll look into this today and see what happened. In general the framework should not be removing functions, but at the same time the base framework should not be exposing any react controls directly.

The original placeholder code was marked as internal and not documented. We explicitly reserve the right to delete, modify, etc. those APIs. We've got additional work underway to make those attributes more obvious to people consuming them. However as you pointed out, we also released sample code that referenced the internal objects. That's bad. We're still investigating what we can do here.

[eoverfield]

@patmill Thanks for the update, fair enough on the undocumented part, yeah, understandable yet unfortunate. Is there another replacement for similar functionality though? That particular placeholder made it much more simple to create our own custom configuration screen.

@VesaJuvonen should I go back and look at another option for the PnP samples as well?

[VesaJuvonen]

Placeholder controls is now available from following open source library, which can be used for getting reusable controls for SPFx solutions - https://github.com/SharePoint/sp-dev-fx-controls-react. Closing this one for now since replacement functionality is available.

[msft-github-bot]

Issues that have been closed & had no follow-up activity for at least 7 days are automatically locked. Please refer to our wiki for more details, including how to remediate this action if you feel this was done prematurely or in error: Issue List: Our approach to locked issues