@backstage/plugin-home 0.4.6 → 0.4.10

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @backstage/plugin-home
 
+## 0.4.10
+
+### Patch Changes
+
+- bdf1419d20: Adds two new home components - CompanyLogo and Toolkit.
+- Updated dependencies
+  - @backstage/core-components@0.8.4
+  - @backstage/core-plugin-api@0.5.0
+  - @backstage/plugin-search@0.5.5
+
+## 0.4.9
+
+### Patch Changes
+
+- 4ce51ab0f1: Internal refactor of the `react-use` imports to use `react-use/lib/*` instead.
+- Updated dependencies
+  - @backstage/core-plugin-api@0.4.1
+  - @backstage/core-components@0.8.3
+
+## 0.4.8
+
+### Patch Changes
+
+- 6d36220ef2: Fix undefined identity bug in `WelcomeTitle` caused by using deprecated methods of the IdentityApi
+- Updated dependencies
+  - @backstage/core-plugin-api@0.4.0
+  - @backstage/core-components@0.8.2
+
+## 0.4.7
+
+### Patch Changes
+
+- cd450844f6: Moved React dependencies to `peerDependencies` and allow both React v16 and v17 to be used.
+- Updated dependencies
+  - @backstage/core-components@0.8.0
+  - @backstage/core-plugin-api@0.3.0
+
 ## 0.4.6
 
 ### Patch Changes

package/README.md

@@ -1,9 +1,5 @@
 # Home
 
-Development is ongoing. You can follow the progress and contribute at the Backstage [Home Project Board](https://github.com/backstage/backstage/projects/7) or reach out to us in the [`#support` Discord channel](https://discord.com/channels/687207715902193673/687235481154617364).
-
-## Overview
-
 The Home plugin introduces a system for composing a Home Page for Backstage in order to surface relevant info and provide convenient shortcuts for common tasks. It's designed with composability in mind with an open ecosystem that allows anyone to contribute with any component, to be included in any Home Page.
 
 For App Integrators, the system is designed to be composable to give total freedom in designing a Home Page that suits the needs of the organization. From the perspective of a Component Developer who wishes to contribute with building blocks to be included in Home Pages, there's a convenient interface for bundling the different parts and exporting them with both error boundary and lazy loading handled under the surface.
@@ -90,6 +86,12 @@ Additionally, the App Integrator is provided an escape hatch in case the way the
 
 ## Contributing
 
+### Homepage Components
+
 We believe that people have great ideas for what makes a useful Home Page, and we want to make it easy for every to benefit from the effort you put in to create something cool for the Home Page. Therefore, a great way of contributing is by simply creating more Home Page Components, than can then be used by everyone when composing their own Home Page. If they are tightly coupled to an existing plugin, it is recommended to allow them to live within that plugin, for convenience and to limit complex dependencies. On the other hand, if there's no clear plugin that the component is based on, it's also fine to contribute them into the [home plugin](/plugins/home/src/homePageComponents)
 
 Additionally, the API is at a very early state, so contributing with additional use cases may expose weaknesses in the current solution that we may iterate on, to provide more flexibility and ease of use for those who wish to develop components for the Home Page.
+
+### Homepage Templates
+
+We are hoping that we together can build up a collection of Homepage templates. We therefore put together a place where we can collect all the templates for the Home Plugin in the [storybook](https://backstage.io/storybook/?path=/story/plugins-home-templates). If you would like to contribute with a template, start by taking a look at the [DefaultTemplate storybook example to create your own](/plugins/home/src/templates/DefaultTemplate.stories.tsx), and then open a PR with your suggestion.

package/dist/esm/{index-1baf251a.esm.js → index-22929ade.esm.js}

@@ -47,7 +47,7 @@ const useRandomJoke = () => {
 };
 
 const Actions = () => {
-  const {rerollJoke} = useRandomJoke();
+  const { rerollJoke } = useRandomJoke();
   return /* @__PURE__ */ React.createElement(Button, {
     variant: "contained",
     color: "primary",
@@ -56,14 +56,14 @@ const Actions = () => {
 };
 
 const Content = () => {
-  const {joke, loading} = useRandomJoke();
+  const { joke, loading } = useRandomJoke();
   if (loading)
     return /* @__PURE__ */ React.createElement("p", null, "Loading...");
   return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("p", null, joke.setup), /* @__PURE__ */ React.createElement("p", null, joke.punchline));
 };
 
 const Settings = () => {
-  const {type, handleChangeType} = useRandomJoke();
+  const { type, handleChangeType } = useRandomJoke();
   const JOKE_TYPES = ["any", "programming"];
   return /* @__PURE__ */ React.createElement(FormControl, {
     component: "fieldset"
@@ -82,4 +82,4 @@ const Settings = () => {
 };
 
 export { Actions, Content, ContextProvider, Settings };
-//# sourceMappingURL=index-1baf251a.esm.js.map
+//# sourceMappingURL=index-22929ade.esm.js.map

package/dist/esm/{index-1baf251a.esm.js.map → index-22929ade.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-1baf251a.esm.js","sources":["../../src/homePageComponents/RandomJoke/Context.tsx","../../src/homePageComponents/RandomJoke/Actions.tsx","../../src/homePageComponents/RandomJoke/Content.tsx","../../src/homePageComponents/RandomJoke/Settings.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { createContext } from 'react';\n\nexport type JokeType = 'any' | 'programming';\n\ntype Joke = {\n  setup: string;\n  punchline: string;\n};\n\ntype RandomJokeContextValue = {\n  loading: boolean;\n  joke: Joke;\n  type: JokeType;\n  rerollJoke: Function;\n  handleChangeType: Function;\n};\n\nconst Context = createContext<RandomJokeContextValue | undefined>(undefined);\n\nconst getNewJoke = (type: string): Promise<Joke> =>\n  fetch(\n    `https://official-joke-api.appspot.com/jokes${\n      type !== 'any' ? `/${type}` : ''\n    }/random`,\n  )\n    .then(res => res.json())\n    .then(data => (Array.isArray(data) ? data[0] : data));\n\nexport const ContextProvider = ({\n  children,\n  defaultCategory,\n}: {\n  children: JSX.Element;\n  defaultCategory?: JokeType;\n}) => {\n  const [loading, setLoading] = React.useState(true);\n  const [joke, setJoke] = React.useState<Joke>({\n    setup: '',\n    punchline: '',\n  });\n  const [type, setType] = React.useState<JokeType>(\n    defaultCategory || ('programming' as JokeType),\n  );\n\n  const rerollJoke = React.useCallback(() => {\n    setLoading(true);\n    getNewJoke(type).then(newJoke => setJoke(newJoke));\n  }, [type]);\n\n  const handleChangeType = (newType: JokeType) => {\n    setType(newType);\n  };\n\n  React.useEffect(() => {\n    setLoading(false);\n  }, [joke]);\n\n  React.useEffect(() => {\n    rerollJoke();\n  }, [rerollJoke]);\n\n  const value: RandomJokeContextValue = {\n    loading,\n    joke,\n    type,\n    rerollJoke,\n    handleChangeType,\n  };\n\n  return <Context.Provider value={value}>{children}</Context.Provider>;\n};\n\nexport const useRandomJoke = () => {\n  const value = React.useContext(Context);\n\n  if (value === undefined) {\n    throw new Error('useRandomJoke must be used within a RandomJokeProvider');\n  }\n\n  return value;\n};\n\nexport default Context;\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { Button } from '@material-ui/core';\nimport { useRandomJoke } from './Context';\n\nexport const Actions = () => {\n  const { rerollJoke } = useRandomJoke();\n  return (\n    <Button variant=\"contained\" color=\"primary\" onClick={() => rerollJoke()}>\n      Reroll\n    </Button>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { useRandomJoke } from './Context';\n\nexport const Content = () => {\n  const { joke, loading } = useRandomJoke();\n\n  if (loading) return <p>Loading...</p>;\n\n  return (\n    <div>\n      <p>{joke.setup}</p>\n      <p>{joke.punchline}</p>\n    </div>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  FormControl,\n  FormLabel,\n  RadioGroup,\n  FormControlLabel,\n  Radio,\n} from '@material-ui/core';\nimport React from 'react';\nimport { useRandomJoke, JokeType } from './Context';\nimport upperFirst from 'lodash/upperFirst';\n\nexport const Settings = () => {\n  const { type, handleChangeType } = useRandomJoke();\n  const JOKE_TYPES: JokeType[] = ['any' as JokeType, 'programming' as JokeType];\n  return (\n    <FormControl component=\"fieldset\">\n      <FormLabel component=\"legend\">Joke Type</FormLabel>\n      <RadioGroup\n        aria-label=\"joke type\"\n        value={type}\n        onChange={e => handleChangeType(e.target.value)}\n      >\n        {JOKE_TYPES.map(t => (\n          <FormControlLabel\n            key={t}\n            value={t}\n            control={<Radio />}\n            label={upperFirst(t)}\n          />\n        ))}\n      </RadioGroup>\n    </FormControl>\n  );\n};\n"],"names":[],"mappings":";;;;AAiCA,MAAM,UAAU,cAAkD;AAElE,MAAM,aAAa,CAAC,SAClB,MACE,8CACE,SAAS,QAAQ,IAAI,SAAS,aAG/B,KAAK,SAAO,IAAI,QAChB,KAAK,UAAS,MAAM,QAAQ,QAAQ,KAAK,KAAK;MAEtC,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,SAAS,cAAc,MAAM,SAAS;AAC7C,QAAM,CAAC,MAAM,WAAW,MAAM,SAAe;AAAA,IAC3C,OAAO;AAAA,IACP,WAAW;AAAA;AAEb,QAAM,CAAC,MAAM,WAAW,MAAM,SAC5B,mBAAoB;AAGtB,QAAM,aAAa,MAAM,YAAY,MAAM;AACzC,eAAW;AACX,eAAW,MAAM,KAAK,aAAW,QAAQ;AAAA,KACxC,CAAC;AAEJ,QAAM,mBAAmB,CAAC,YAAsB;AAC9C,YAAQ;AAAA;AAGV,QAAM,UAAU,MAAM;AACpB,eAAW;AAAA,KACV,CAAC;AAEJ,QAAM,UAAU,MAAM;AACpB;AAAA,KACC,CAAC;AAEJ,QAAM,QAAgC;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGF,6CAAQ,QAAQ,UAAT;AAAA,IAAkB;AAAA,KAAe;AAAA;MAG7B,gBAAgB,MAAM;AACjC,QAAM,QAAQ,MAAM,WAAW;AAE/B,MAAI,UAAU,QAAW;AACvB,UAAM,IAAI,MAAM;AAAA;AAGlB,SAAO;AAAA;;MC1EI,UAAU,MAAM;AAC3B,QAAM,CAAE,cAAe;AACvB,6CACG,QAAD;AAAA,IAAQ,SAAQ;AAAA,IAAY,OAAM;AAAA,IAAU,SAAS,MAAM;AAAA,KAAc;AAAA;;MCLhE,UAAU,MAAM;AAC3B,QAAM,CAAE,MAAM,WAAY;AAE1B,MAAI;AAAS,+CAAQ,KAAD,MAAG;AAEvB,6CACG,OAAD,0CACG,KAAD,MAAI,KAAK,4CACR,KAAD,MAAI,KAAK;AAAA;;MCDF,WAAW,MAAM;AAC5B,QAAM,CAAE,MAAM,oBAAqB;AACnC,QAAM,aAAyB,CAAC,OAAmB;AACnD,6CACG,aAAD;AAAA,IAAa,WAAU;AAAA,yCACpB,WAAD;AAAA,IAAW,WAAU;AAAA,KAAS,kDAC7B,YAAD;AAAA,IACE,cAAW;AAAA,IACX,OAAO;AAAA,IACP,UAAU,OAAK,iBAAiB,EAAE,OAAO;AAAA,KAExC,WAAW,IAAI,2CACb,kBAAD;AAAA,IACE,KAAK;AAAA,IACL,OAAO;AAAA,IACP,6CAAU,OAAD;AAAA,IACT,OAAO,WAAW;AAAA;AAAA;;;;"}
+{"version":3,"file":"index-22929ade.esm.js","sources":["../../src/homePageComponents/RandomJoke/Context.tsx","../../src/homePageComponents/RandomJoke/Actions.tsx","../../src/homePageComponents/RandomJoke/Content.tsx","../../src/homePageComponents/RandomJoke/Settings.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { createContext } from 'react';\n\nexport type JokeType = 'any' | 'programming';\n\ntype Joke = {\n  setup: string;\n  punchline: string;\n};\n\ntype RandomJokeContextValue = {\n  loading: boolean;\n  joke: Joke;\n  type: JokeType;\n  rerollJoke: Function;\n  handleChangeType: Function;\n};\n\nconst Context = createContext<RandomJokeContextValue | undefined>(undefined);\n\nconst getNewJoke = (type: string): Promise<Joke> =>\n  fetch(\n    `https://official-joke-api.appspot.com/jokes${\n      type !== 'any' ? `/${type}` : ''\n    }/random`,\n  )\n    .then(res => res.json())\n    .then(data => (Array.isArray(data) ? data[0] : data));\n\nexport const ContextProvider = ({\n  children,\n  defaultCategory,\n}: {\n  children: JSX.Element;\n  defaultCategory?: JokeType;\n}) => {\n  const [loading, setLoading] = React.useState(true);\n  const [joke, setJoke] = React.useState<Joke>({\n    setup: '',\n    punchline: '',\n  });\n  const [type, setType] = React.useState<JokeType>(\n    defaultCategory || ('programming' as JokeType),\n  );\n\n  const rerollJoke = React.useCallback(() => {\n    setLoading(true);\n    getNewJoke(type).then(newJoke => setJoke(newJoke));\n  }, [type]);\n\n  const handleChangeType = (newType: JokeType) => {\n    setType(newType);\n  };\n\n  React.useEffect(() => {\n    setLoading(false);\n  }, [joke]);\n\n  React.useEffect(() => {\n    rerollJoke();\n  }, [rerollJoke]);\n\n  const value: RandomJokeContextValue = {\n    loading,\n    joke,\n    type,\n    rerollJoke,\n    handleChangeType,\n  };\n\n  return <Context.Provider value={value}>{children}</Context.Provider>;\n};\n\nexport const useRandomJoke = () => {\n  const value = React.useContext(Context);\n\n  if (value === undefined) {\n    throw new Error('useRandomJoke must be used within a RandomJokeProvider');\n  }\n\n  return value;\n};\n\nexport default Context;\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { Button } from '@material-ui/core';\nimport { useRandomJoke } from './Context';\n\nexport const Actions = () => {\n  const { rerollJoke } = useRandomJoke();\n  return (\n    <Button variant=\"contained\" color=\"primary\" onClick={() => rerollJoke()}>\n      Reroll\n    </Button>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { useRandomJoke } from './Context';\n\nexport const Content = () => {\n  const { joke, loading } = useRandomJoke();\n\n  if (loading) return <p>Loading...</p>;\n\n  return (\n    <div>\n      <p>{joke.setup}</p>\n      <p>{joke.punchline}</p>\n    </div>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  FormControl,\n  FormLabel,\n  RadioGroup,\n  FormControlLabel,\n  Radio,\n} from '@material-ui/core';\nimport React from 'react';\nimport { useRandomJoke, JokeType } from './Context';\nimport upperFirst from 'lodash/upperFirst';\n\nexport const Settings = () => {\n  const { type, handleChangeType } = useRandomJoke();\n  const JOKE_TYPES: JokeType[] = ['any' as JokeType, 'programming' as JokeType];\n  return (\n    <FormControl component=\"fieldset\">\n      <FormLabel component=\"legend\">Joke Type</FormLabel>\n      <RadioGroup\n        aria-label=\"joke type\"\n        value={type}\n        onChange={e => handleChangeType(e.target.value)}\n      >\n        {JOKE_TYPES.map(t => (\n          <FormControlLabel\n            key={t}\n            value={t}\n            control={<Radio />}\n            label={upperFirst(t)}\n          />\n        ))}\n      </RadioGroup>\n    </FormControl>\n  );\n};\n"],"names":[],"mappings":";;;;AAiCA,MAAM,UAAU,cAAkD;AAElE,MAAM,aAAa,CAAC,SAClB,MACE,8CACE,SAAS,QAAQ,IAAI,SAAS,aAG/B,KAAK,SAAO,IAAI,QAChB,KAAK,UAAS,MAAM,QAAQ,QAAQ,KAAK,KAAK;MAEtC,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,SAAS,cAAc,MAAM,SAAS;AAC7C,QAAM,CAAC,MAAM,WAAW,MAAM,SAAe;AAAA,IAC3C,OAAO;AAAA,IACP,WAAW;AAAA;AAEb,QAAM,CAAC,MAAM,WAAW,MAAM,SAC5B,mBAAoB;AAGtB,QAAM,aAAa,MAAM,YAAY,MAAM;AACzC,eAAW;AACX,eAAW,MAAM,KAAK,aAAW,QAAQ;AAAA,KACxC,CAAC;AAEJ,QAAM,mBAAmB,CAAC,YAAsB;AAC9C,YAAQ;AAAA;AAGV,QAAM,UAAU,MAAM;AACpB,eAAW;AAAA,KACV,CAAC;AAEJ,QAAM,UAAU,MAAM;AACpB;AAAA,KACC,CAAC;AAEJ,QAAM,QAAgC;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGF,6CAAQ,QAAQ,UAAT;AAAA,IAAkB;AAAA,KAAe;AAAA;MAG7B,gBAAgB,MAAM;AACjC,QAAM,QAAQ,MAAM,WAAW;AAE/B,MAAI,UAAU,QAAW;AACvB,UAAM,IAAI,MAAM;AAAA;AAGlB,SAAO;AAAA;;MC1EI,UAAU,MAAM;AAC3B,QAAM,EAAE,eAAe;AACvB,6CACG,QAAD;AAAA,IAAQ,SAAQ;AAAA,IAAY,OAAM;AAAA,IAAU,SAAS,MAAM;AAAA,KAAc;AAAA;;MCLhE,UAAU,MAAM;AAC3B,QAAM,EAAE,MAAM,YAAY;AAE1B,MAAI;AAAS,+CAAQ,KAAD,MAAG;AAEvB,6CACG,OAAD,0CACG,KAAD,MAAI,KAAK,4CACR,KAAD,MAAI,KAAK;AAAA;;MCDF,WAAW,MAAM;AAC5B,QAAM,EAAE,MAAM,qBAAqB;AACnC,QAAM,aAAyB,CAAC,OAAmB;AACnD,6CACG,aAAD;AAAA,IAAa,WAAU;AAAA,yCACpB,WAAD;AAAA,IAAW,WAAU;AAAA,KAAS,kDAC7B,YAAD;AAAA,IACE,cAAW;AAAA,IACX,OAAO;AAAA,IACP,UAAU,OAAK,iBAAiB,EAAE,OAAO;AAAA,KAExC,WAAW,IAAI,2CACb,kBAAD;AAAA,IACE,KAAK;AAAA,IACL,OAAO;AAAA,IACP,6CAAU,OAAD;AAAA,IACT,OAAO,WAAW;AAAA;AAAA;;;;"}

package/dist/esm/{index-64b176b7.esm.js → index-405b0ea2.esm.js}

@@ -14,4 +14,4 @@ const HomepageCompositionRoot = (props) => {
 };
 
 export { HomepageCompositionRoot };
-//# sourceMappingURL=index-64b176b7.esm.js.map
+//# sourceMappingURL=index-405b0ea2.esm.js.map

package/dist/esm/{index-64b176b7.esm.js.map → index-405b0ea2.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-64b176b7.esm.js","sources":["../../src/components/HomepageCompositionRoot.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode } from 'react';\nimport { useOutlet } from 'react-router';\n\nexport const HomepageCompositionRoot = (props: {\n  title?: string;\n  children?: ReactNode;\n}) => {\n  const outlet = useOutlet();\n  const children = props.children ?? outlet;\n  return <>{children}</>;\n};\n"],"names":[],"mappings":";;;;;;;;MAmBa,0BAA0B,CAAC,UAGlC;AAtBN;AAuBE,QAAM,SAAS;AACf,QAAM,WAAW,YAAM,aAAN,YAAkB;AACnC,mEAAU;AAAA;;;;"}
+{"version":3,"file":"index-405b0ea2.esm.js","sources":["../../src/components/HomepageCompositionRoot.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { ReactNode } from 'react';\nimport { useOutlet } from 'react-router';\n\nexport const HomepageCompositionRoot = (props: {\n  title?: string;\n  children?: ReactNode;\n}) => {\n  const outlet = useOutlet();\n  const children = props.children ?? outlet;\n  return <>{children}</>;\n};\n"],"names":[],"mappings":";;;;;;;;MAmBa,0BAA0B,CAAC,UAGlC;AAtBN;AAuBE,QAAM,SAAS;AACf,QAAM,WAAW,YAAM,aAAN,YAAkB;AACnC,mEAAU;AAAA;;;;"}

package/dist/esm/{index-20e36a68.esm.js → index-56def6f8.esm.js}

@@ -1,6 +1,7 @@
-import { useApi, identityApiRef } from '@backstage/core-plugin-api';
+import { useApi, identityApiRef, alertApiRef } from '@backstage/core-plugin-api';
 import { Tooltip } from '@material-ui/core';
-import React, { useMemo } from 'react';
+import React, { useMemo, useEffect } from 'react';
+import useAsync from 'react-use/lib/useAsync';
 
 var English$2 = "Good morning";
 var Afrikaans$2 = "Goeiemôre, Môre";
@@ -606,13 +607,21 @@ function getTimeBasedGreeting() {
 
 const WelcomeTitle = () => {
   const identityApi = useApi(identityApiRef);
-  const profile = identityApi.getProfile();
-  const userId = identityApi.getUserId();
+  const alertApi = useApi(alertApiRef);
   const greeting = useMemo(() => getTimeBasedGreeting(), []);
+  const { value: profile, error } = useAsync(() => identityApi.getProfileInfo());
+  useEffect(() => {
+    if (error) {
+      alertApi.post({
+        message: `Failed to load user identity: ${error}`,
+        severity: "error"
+      });
+    }
+  }, [error, alertApi]);
   return /* @__PURE__ */ React.createElement(Tooltip, {
     title: greeting.language
-  }, /* @__PURE__ */ React.createElement("span", null, `${greeting.greeting}, ${profile.displayName || userId}!`));
+  }, /* @__PURE__ */ React.createElement("span", null, `${greeting.greeting}${(profile == null ? void 0 : profile.displayName) ? `, ${profile == null ? void 0 : profile.displayName}` : ""}!`));
 };
 
 export { WelcomeTitle };
-//# sourceMappingURL=index-20e36a68.esm.js.map
+//# sourceMappingURL=index-56def6f8.esm.js.map

package/dist/esm/{index-20e36a68.esm.js.map → index-56def6f8.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-20e36a68.esm.js","sources":["../../src/homePageComponents/WelcomeTitle/timeUtil.ts","../../src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport goodMorning from './locales/goodMorning.locales.json';\nimport goodAfternoon from './locales/goodAfternoon.locales.json';\nimport goodEvening from './locales/goodEvening.locales.json';\n\n// Select a large random integer at startup, to prevent the greetings to change\n// every time the user navigates.\nconst greetingRandomSeed = Math.floor(Math.random() * 1000000);\n\nexport function getTimeBasedGreeting(): { language: string; greeting: string } {\n  const random = (array: string[]) => array[greetingRandomSeed % array.length];\n\n  const currentHour = new Date(Date.now()).getHours();\n  if (currentHour >= 23) {\n    return {\n      language: 'Seriously',\n      greeting: 'Get some rest',\n    };\n  }\n  const timeOfDay = (hour: number): { [language: string]: string } => {\n    if (hour < 12) return goodMorning;\n    if (hour < 17) return goodAfternoon;\n    return goodEvening;\n  };\n  const greetings = timeOfDay(currentHour);\n  const greetingsKey = random(Object.keys(greetings));\n  return {\n    language: greetingsKey,\n    greeting: greetings[greetingsKey],\n  };\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\nimport { Tooltip } from '@material-ui/core';\nimport React, { useMemo } from 'react';\nimport { getTimeBasedGreeting } from './timeUtil';\n\nexport const WelcomeTitle = () => {\n  const identityApi = useApi(identityApiRef);\n  const profile = identityApi.getProfile();\n  const userId = identityApi.getUserId();\n  const greeting = useMemo(() => getTimeBasedGreeting(), []);\n\n  return (\n    <Tooltip title={greeting.language}>\n      <span>{`${greeting.greeting}, ${profile.displayName || userId}!`}</span>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,qBAAqB,KAAK,MAAM,KAAK,WAAW;gCAEyB;AAC7E,QAAM,SAAS,CAAC,UAAoB,MAAM,qBAAqB,MAAM;AAErE,QAAM,cAAc,IAAI,KAAK,KAAK,OAAO;AACzC,MAAI,eAAe,IAAI;AACrB,WAAO;AAAA,MACL,UAAU;AAAA,MACV,UAAU;AAAA;AAAA;AAGd,QAAM,YAAY,CAAC,SAAiD;AAClE,QAAI,OAAO;AAAI,aAAO;AACtB,QAAI,OAAO;AAAI,aAAO;AACtB,WAAO;AAAA;AAET,QAAM,YAAY,UAAU;AAC5B,QAAM,eAAe,OAAO,OAAO,KAAK;AACxC,SAAO;AAAA,IACL,UAAU;AAAA,IACV,UAAU,UAAU;AAAA;AAAA;;MCvBX,eAAe,MAAM;AAChC,QAAM,cAAc,OAAO;AAC3B,QAAM,UAAU,YAAY;AAC5B,QAAM,SAAS,YAAY;AAC3B,QAAM,WAAW,QAAQ,MAAM,wBAAwB;AAEvD,6CACG,SAAD;AAAA,IAAS,OAAO,SAAS;AAAA,yCACtB,QAAD,MAAO,GAAG,SAAS,aAAa,QAAQ,eAAe;AAAA;;;;"}
+{"version":3,"file":"index-56def6f8.esm.js","sources":["../../src/homePageComponents/WelcomeTitle/timeUtil.ts","../../src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport goodMorning from './locales/goodMorning.locales.json';\nimport goodAfternoon from './locales/goodAfternoon.locales.json';\nimport goodEvening from './locales/goodEvening.locales.json';\n\n// Select a large random integer at startup, to prevent the greetings to change\n// every time the user navigates.\nconst greetingRandomSeed = Math.floor(Math.random() * 1000000);\n\nexport function getTimeBasedGreeting(): { language: string; greeting: string } {\n  const random = (array: string[]) => array[greetingRandomSeed % array.length];\n\n  const currentHour = new Date(Date.now()).getHours();\n  if (currentHour >= 23) {\n    return {\n      language: 'Seriously',\n      greeting: 'Get some rest',\n    };\n  }\n  const timeOfDay = (hour: number): { [language: string]: string } => {\n    if (hour < 12) return goodMorning;\n    if (hour < 17) return goodAfternoon;\n    return goodEvening;\n  };\n  const greetings = timeOfDay(currentHour);\n  const greetingsKey = random(Object.keys(greetings));\n  return {\n    language: greetingsKey,\n    greeting: greetings[greetingsKey],\n  };\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  alertApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\nimport { Tooltip } from '@material-ui/core';\nimport React, { useEffect, useMemo } from 'react';\nimport useAsync from 'react-use/lib/useAsync';\nimport { getTimeBasedGreeting } from './timeUtil';\n\nexport const WelcomeTitle = () => {\n  const identityApi = useApi(identityApiRef);\n  const alertApi = useApi(alertApiRef);\n  const greeting = useMemo(() => getTimeBasedGreeting(), []);\n\n  const { value: profile, error } = useAsync(() =>\n    identityApi.getProfileInfo(),\n  );\n\n  useEffect(() => {\n    if (error) {\n      alertApi.post({\n        message: `Failed to load user identity: ${error}`,\n        severity: 'error',\n      });\n    }\n  }, [error, alertApi]);\n\n  return (\n    <Tooltip title={greeting.language}>\n      <span>{`${greeting.greeting}${\n        profile?.displayName ? `, ${profile?.displayName}` : ''\n      }!`}</span>\n    </Tooltip>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,qBAAqB,KAAK,MAAM,KAAK,WAAW;gCAEyB;AAC7E,QAAM,SAAS,CAAC,UAAoB,MAAM,qBAAqB,MAAM;AAErE,QAAM,cAAc,IAAI,KAAK,KAAK,OAAO;AACzC,MAAI,eAAe,IAAI;AACrB,WAAO;AAAA,MACL,UAAU;AAAA,MACV,UAAU;AAAA;AAAA;AAGd,QAAM,YAAY,CAAC,SAAiD;AAClE,QAAI,OAAO;AAAI,aAAO;AACtB,QAAI,OAAO;AAAI,aAAO;AACtB,WAAO;AAAA;AAET,QAAM,YAAY,UAAU;AAC5B,QAAM,eAAe,OAAO,OAAO,KAAK;AACxC,SAAO;AAAA,IACL,UAAU;AAAA,IACV,UAAU,UAAU;AAAA;AAAA;;MClBX,eAAe,MAAM;AAChC,QAAM,cAAc,OAAO;AAC3B,QAAM,WAAW,OAAO;AACxB,QAAM,WAAW,QAAQ,MAAM,wBAAwB;AAEvD,QAAM,EAAE,OAAO,SAAS,UAAU,SAAS,MACzC,YAAY;AAGd,YAAU,MAAM;AACd,QAAI,OAAO;AACT,eAAS,KAAK;AAAA,QACZ,SAAS,iCAAiC;AAAA,QAC1C,UAAU;AAAA;AAAA;AAAA,KAGb,CAAC,OAAO;AAEX,6CACG,SAAD;AAAA,IAAS,OAAO,SAAS;AAAA,yCACtB,QAAD,MAAO,GAAG,SAAS,WACjB,oCAAS,eAAc,KAAK,mCAAS,gBAAgB;AAAA;;;;"}

package/dist/esm/index-e6d55b70.esm.js

@@ -0,0 +1,47 @@
+import { Link } from '@backstage/core-components';
+import { makeStyles, List, ListItemIcon, ListItemText } from '@material-ui/core';
+import React from 'react';
+
+const useStyles = makeStyles((theme) => ({
+  toolkit: {
+    display: "flex",
+    flexWrap: "wrap",
+    textAlign: "center"
+  },
+  tool: {
+    margin: theme.spacing(0.5, 1)
+  },
+  label: {
+    marginTop: theme.spacing(1),
+    fontSize: "0.9em",
+    lineHeight: "1.25",
+    color: theme.palette.text.secondary
+  },
+  icon: {
+    width: "64px",
+    height: "64px",
+    borderRadius: "50px",
+    justifyContent: "center",
+    alignItems: "center",
+    boxShadow: theme.shadows[1],
+    backgroundColor: theme.palette.background.default
+  }
+}));
+const Content = (props) => {
+  const classes = useStyles();
+  return /* @__PURE__ */ React.createElement(List, {
+    className: classes.toolkit
+  }, props.tools.map((tool) => /* @__PURE__ */ React.createElement(Link, {
+    key: tool.url,
+    to: tool.url,
+    className: classes.tool
+  }, /* @__PURE__ */ React.createElement(ListItemIcon, {
+    className: classes.icon
+  }, tool.icon), /* @__PURE__ */ React.createElement(ListItemText, {
+    secondaryTypographyProps: { className: classes.label },
+    secondary: tool.label
+  }))));
+};
+
+export { Content };
+//# sourceMappingURL=index-e6d55b70.esm.js.map

package/dist/esm/index-e6d55b70.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-e6d55b70.esm.js","sources":["../../src/homePageComponents/Toolkit/Content.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Link } from '@backstage/core-components';\nimport {\n  makeStyles,\n  List,\n  ListItemIcon,\n  ListItemText,\n} from '@material-ui/core';\nimport React from 'react';\n\nconst useStyles = makeStyles(theme => ({\n  toolkit: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    textAlign: 'center',\n  },\n  tool: {\n    margin: theme.spacing(0.5, 1),\n  },\n  label: {\n    marginTop: theme.spacing(1),\n    fontSize: '0.9em',\n    lineHeight: '1.25',\n    color: theme.palette.text.secondary,\n  },\n  icon: {\n    width: '64px',\n    height: '64px',\n    borderRadius: '50px',\n    justifyContent: 'center',\n    alignItems: 'center',\n    boxShadow: theme.shadows[1],\n    backgroundColor: theme.palette.background.default,\n  },\n}));\n\ntype Tool = {\n  label: string;\n  url: string;\n  icon: React.ReactNode;\n};\n\n/**\n * Props for Toolkit content component {@link Content}.\n *\n * @public\n */\nexport type ToolkitContentProps = {\n  tools: Tool[];\n};\n\n/**\n * A component to display a list of tools for the user.\n *\n * @public\n */\nexport const Content = (props: ToolkitContentProps) => {\n  const classes = useStyles();\n\n  return (\n    <List className={classes.toolkit}>\n      {props.tools.map((tool: Tool) => (\n        <Link key={tool.url} to={tool.url} className={classes.tool}>\n          <ListItemIcon className={classes.icon}>{tool.icon}</ListItemIcon>\n          <ListItemText\n            secondaryTypographyProps={{ className: classes.label }}\n            secondary={tool.label}\n          />\n        </Link>\n      ))}\n    </List>\n  );\n};\n"],"names":[],"mappings":";;;;AAyBA,MAAM,YAAY,WAAW;AAAU,EACrC,SAAS;AAAA,IACP,SAAS;AAAA,IACT,UAAU;AAAA,IACV,WAAW;AAAA;AAAA,EAEb,MAAM;AAAA,IACJ,QAAQ,MAAM,QAAQ,KAAK;AAAA;AAAA,EAE7B,OAAO;AAAA,IACL,WAAW,MAAM,QAAQ;AAAA,IACzB,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO,MAAM,QAAQ,KAAK;AAAA;AAAA,EAE5B,MAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,WAAW,MAAM,QAAQ;AAAA,IACzB,iBAAiB,MAAM,QAAQ,WAAW;AAAA;AAAA;MAwBjC,UAAU,CAAC,UAA+B;AACrD,QAAM,UAAU;AAEhB,6CACG,MAAD;AAAA,IAAM,WAAW,QAAQ;AAAA,KACtB,MAAM,MAAM,IAAI,CAAC,6CACf,MAAD;AAAA,IAAM,KAAK,KAAK;AAAA,IAAK,IAAI,KAAK;AAAA,IAAK,WAAW,QAAQ;AAAA,yCACnD,cAAD;AAAA,IAAc,WAAW,QAAQ;AAAA,KAAO,KAAK,2CAC5C,cAAD;AAAA,IACE,0BAA0B,EAAE,WAAW,QAAQ;AAAA,IAC/C,WAAW,KAAK;AAAA;AAAA;;;;"}

package/dist/esm/index-e9dbf86a.esm.js

@@ -0,0 +1,16 @@
+import { Typography } from '@material-ui/core';
+import { useApi, configApiRef } from '@backstage/core-plugin-api';
+import React from 'react';
+
+const CompanyLogo = (props) => {
+  const { logo, className } = props;
+  const configApi = useApi(configApiRef);
+  return /* @__PURE__ */ React.createElement("div", {
+    className
+  }, logo ? /* @__PURE__ */ React.createElement(React.Fragment, null, logo) : /* @__PURE__ */ React.createElement(Typography, {
+    variant: "h1"
+  }, configApi.getString("app.title")));
+};
+
+export { CompanyLogo };
+//# sourceMappingURL=index-e9dbf86a.esm.js.map

package/dist/esm/index-e9dbf86a.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-e9dbf86a.esm.js","sources":["../../src/homePageComponents/CompanyLogo/CompanyLogo.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Typography } from '@material-ui/core';\nimport { configApiRef, useApi } from '@backstage/core-plugin-api';\nimport React from 'react';\n\ntype CompanyLogoProps = {\n  logo?: React.ReactNode;\n  className?: string;\n};\n\n/**\n * A component to display a company logo for the user.\n *\n * @public\n */\nexport const CompanyLogo = (props: CompanyLogoProps) => {\n  const { logo, className } = props;\n  const configApi = useApi(configApiRef);\n\n  return (\n    <div className={className}>\n      {logo ? (\n        <>{logo}</>\n      ) : (\n        <Typography variant=\"h1\">{configApi.getString('app.title')}</Typography>\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;MA6Ba,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,MAAM,cAAc;AAC5B,QAAM,YAAY,OAAO;AAEzB,6CACG,OAAD;AAAA,IAAK;AAAA,KACF,iEACI,4CAEF,YAAD;AAAA,IAAY,SAAQ;AAAA,KAAM,UAAU,UAAU;AAAA;;;;"}

package/dist/esm/{index-57301ff6.esm.js → index-eddf0731.esm.js}

@@ -62,9 +62,9 @@ const ComponentTabs = ({
   }, tabs.map((t) => /* @__PURE__ */ React.createElement(Tab, {
     key: t.label,
     label: t.label
-  }))), tabs.map(({Component}, idx) => /* @__PURE__ */ React.createElement("div", {
+  }))), tabs.map(({ Component }, idx) => /* @__PURE__ */ React.createElement("div", {
     key: idx,
-    ...idx !== value ? {style: {display: "none"}} : {}
+    ...idx !== value ? { style: { display: "none" } } : {}
   }, /* @__PURE__ */ React.createElement(Component, null))));
 };
 
@@ -80,4 +80,4 @@ const ComponentTab = ({
 };
 
 export { ComponentAccordion, ComponentTab, ComponentTabs };
-//# sourceMappingURL=index-57301ff6.esm.js.map
+//# sourceMappingURL=index-eddf0731.esm.js.map

package/dist/esm/{index-57301ff6.esm.js.map → index-eddf0731.esm.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-57301ff6.esm.js","sources":["../../src/componentRenderers/ComponentAccordion.tsx","../../src/componentRenderers/ComponentTabs/ComponentTabs.tsx","../../src/componentRenderers/ComponentTabs/ComponentTab.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Typography,\n  IconButton,\n  Theme,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport SettingsIcon from '@material-ui/icons/Settings';\n\nimport { SettingsModal } from '../components';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  settingsIconButton: {\n    padding: theme.spacing(0, 1, 0, 0),\n  },\n}));\n\nexport const ComponentAccordion = ({\n  title,\n  Content,\n  Actions,\n  Settings,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  const classes = useStyles();\n  const [settingsIsExpanded, setSettingsIsExpanded] = React.useState(false);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n\n  const handleOpenSettings = (e: any) => {\n    e.stopPropagation();\n    setSettingsIsExpanded(prevState => !prevState);\n  };\n\n  const innerContent = (\n    <>\n      {Settings && (\n        <SettingsModal\n          open={settingsIsExpanded}\n          close={() => setSettingsIsExpanded(false)}\n          componentName={title}\n        >\n          <Settings />\n        </SettingsModal>\n      )}\n      <Accordion\n        expanded={isExpanded}\n        onChange={(_e: any, expanded: boolean) => setIsExpanded(expanded)}\n      >\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          {Settings && (\n            <IconButton\n              onClick={handleOpenSettings}\n              className={classes.settingsIconButton}\n            >\n              <SettingsIcon />\n            </IconButton>\n          )}\n          <Typography>{title}</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <div>\n            <Content />\n            {Actions && <Actions />}\n          </div>\n        </AccordionDetails>\n      </Accordion>\n    </>\n  );\n\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>{innerContent}</ContextProvider>\n  ) : (\n    innerContent\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Tabs, Tab } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\n\ntype TabType = {\n  label: string;\n  Component: () => JSX.Element;\n};\n\nexport const ComponentTabs = ({\n  title,\n  tabs,\n}: {\n  title: string;\n  tabs: TabType[];\n}) => {\n  const [value, setValue] = React.useState(0);\n\n  const handleChange = (_event: any, newValue: number) => {\n    setValue(newValue);\n  };\n\n  return (\n    <InfoCard title={title}>\n      <Tabs value={value} onChange={handleChange}>\n        {tabs.map(t => (\n          <Tab key={t.label} label={t.label} />\n        ))}\n      </Tabs>\n      {tabs.map(({ Component }, idx) => (\n        <div\n          key={idx}\n          {...(idx !== value ? { style: { display: 'none' } } : {})}\n        >\n          <Component />\n        </div>\n      ))}\n    </InfoCard>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nexport const ComponentTab = ({\n  title,\n  Content,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>\n      <Content />\n    </ContextProvider>\n  ) : (\n    <Content />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA+BA,MAAM,YAAY,WAAW,CAAC;AAAkB,EAC9C,oBAAoB;AAAA,IAClB,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG;AAAA;AAAA;MAIvB,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAOC;AACJ,QAAM,UAAU;AAChB,QAAM,CAAC,oBAAoB,yBAAyB,MAAM,SAAS;AACnE,QAAM,CAAC,YAAY,iBAAiB,MAAM,SAAS;AAEnD,QAAM,qBAAqB,CAAC,MAAW;AACrC,MAAE;AACF,0BAAsB,eAAa,CAAC;AAAA;AAGtC,QAAM,yEAED,gDACE,eAAD;AAAA,IACE,MAAM;AAAA,IACN,OAAO,MAAM,sBAAsB;AAAA,IACnC,eAAe;AAAA,yCAEd,UAAD,4CAGH,WAAD;AAAA,IACE,UAAU;AAAA,IACV,UAAU,CAAC,IAAS,aAAsB,cAAc;AAAA,yCAEvD,kBAAD;AAAA,IAAkB,gDAAa,gBAAD;AAAA,KAC3B,gDACE,YAAD;AAAA,IACE,SAAS;AAAA,IACT,WAAW,QAAQ;AAAA,yCAElB,cAAD,4CAGH,YAAD,MAAa,6CAEd,kBAAD,0CACG,OAAD,0CACG,SAAD,OACC,+CAAY,SAAD;AAOtB,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,KAAa,gBAElC;AAAA;;MC1ES,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,OAAO,YAAY,MAAM,SAAS;AAEzC,QAAM,eAAe,CAAC,QAAa,aAAqB;AACtD,aAAS;AAAA;AAGX,6CACG,UAAD;AAAA,IAAU;AAAA,yCACP,MAAD;AAAA,IAAM;AAAA,IAAc,UAAU;AAAA,KAC3B,KAAK,IAAI,2CACP,KAAD;AAAA,IAAK,KAAK,EAAE;AAAA,IAAO,OAAO,EAAE;AAAA,QAG/B,KAAK,IAAI,CAAC,CAAE,YAAa,4CACvB,OAAD;AAAA,IACE,KAAK;AAAA,OACA,QAAQ,QAAQ,CAAE,OAAO,CAAE,SAAS,WAAa;AAAA,yCAErD,WAAD;AAAA;;MChCG,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAKC;AACJ,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,yCAClB,SAAD,6CAGD,SAAD;AAAA;;;;"}
+{"version":3,"file":"index-eddf0731.esm.js","sources":["../../src/componentRenderers/ComponentAccordion.tsx","../../src/componentRenderers/ComponentTabs/ComponentTabs.tsx","../../src/componentRenderers/ComponentTabs/ComponentTab.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Typography,\n  IconButton,\n  Theme,\n} from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport SettingsIcon from '@material-ui/icons/Settings';\n\nimport { SettingsModal } from '../components';\n\nconst useStyles = makeStyles((theme: Theme) => ({\n  settingsIconButton: {\n    padding: theme.spacing(0, 1, 0, 0),\n  },\n}));\n\nexport const ComponentAccordion = ({\n  title,\n  Content,\n  Actions,\n  Settings,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  const classes = useStyles();\n  const [settingsIsExpanded, setSettingsIsExpanded] = React.useState(false);\n  const [isExpanded, setIsExpanded] = React.useState(false);\n\n  const handleOpenSettings = (e: any) => {\n    e.stopPropagation();\n    setSettingsIsExpanded(prevState => !prevState);\n  };\n\n  const innerContent = (\n    <>\n      {Settings && (\n        <SettingsModal\n          open={settingsIsExpanded}\n          close={() => setSettingsIsExpanded(false)}\n          componentName={title}\n        >\n          <Settings />\n        </SettingsModal>\n      )}\n      <Accordion\n        expanded={isExpanded}\n        onChange={(_e: any, expanded: boolean) => setIsExpanded(expanded)}\n      >\n        <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n          {Settings && (\n            <IconButton\n              onClick={handleOpenSettings}\n              className={classes.settingsIconButton}\n            >\n              <SettingsIcon />\n            </IconButton>\n          )}\n          <Typography>{title}</Typography>\n        </AccordionSummary>\n        <AccordionDetails>\n          <div>\n            <Content />\n            {Actions && <Actions />}\n          </div>\n        </AccordionDetails>\n      </Accordion>\n    </>\n  );\n\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>{innerContent}</ContextProvider>\n  ) : (\n    innerContent\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Tabs, Tab } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\n\ntype TabType = {\n  label: string;\n  Component: () => JSX.Element;\n};\n\nexport const ComponentTabs = ({\n  title,\n  tabs,\n}: {\n  title: string;\n  tabs: TabType[];\n}) => {\n  const [value, setValue] = React.useState(0);\n\n  const handleChange = (_event: any, newValue: number) => {\n    setValue(newValue);\n  };\n\n  return (\n    <InfoCard title={title}>\n      <Tabs value={value} onChange={handleChange}>\n        {tabs.map(t => (\n          <Tab key={t.label} label={t.label} />\n        ))}\n      </Tabs>\n      {tabs.map(({ Component }, idx) => (\n        <div\n          key={idx}\n          {...(idx !== value ? { style: { display: 'none' } } : {})}\n        >\n          <Component />\n        </div>\n      ))}\n    </InfoCard>\n  );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nexport const ComponentTab = ({\n  title,\n  Content,\n  ContextProvider,\n  ...childProps\n}: {\n  title: string;\n  Content: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n}) => {\n  return ContextProvider ? (\n    <ContextProvider {...childProps}>\n      <Content />\n    </ContextProvider>\n  ) : (\n    <Content />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA+BA,MAAM,YAAY,WAAW,CAAC;AAAkB,EAC9C,oBAAoB;AAAA,IAClB,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG;AAAA;AAAA;MAIvB,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAOC;AACJ,QAAM,UAAU;AAChB,QAAM,CAAC,oBAAoB,yBAAyB,MAAM,SAAS;AACnE,QAAM,CAAC,YAAY,iBAAiB,MAAM,SAAS;AAEnD,QAAM,qBAAqB,CAAC,MAAW;AACrC,MAAE;AACF,0BAAsB,eAAa,CAAC;AAAA;AAGtC,QAAM,yEAED,gDACE,eAAD;AAAA,IACE,MAAM;AAAA,IACN,OAAO,MAAM,sBAAsB;AAAA,IACnC,eAAe;AAAA,yCAEd,UAAD,4CAGH,WAAD;AAAA,IACE,UAAU;AAAA,IACV,UAAU,CAAC,IAAS,aAAsB,cAAc;AAAA,yCAEvD,kBAAD;AAAA,IAAkB,gDAAa,gBAAD;AAAA,KAC3B,gDACE,YAAD;AAAA,IACE,SAAS;AAAA,IACT,WAAW,QAAQ;AAAA,yCAElB,cAAD,4CAGH,YAAD,MAAa,6CAEd,kBAAD,0CACG,OAAD,0CACG,SAAD,OACC,+CAAY,SAAD;AAOtB,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,KAAa,gBAElC;AAAA;;MC1ES,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,CAAC,OAAO,YAAY,MAAM,SAAS;AAEzC,QAAM,eAAe,CAAC,QAAa,aAAqB;AACtD,aAAS;AAAA;AAGX,6CACG,UAAD;AAAA,IAAU;AAAA,yCACP,MAAD;AAAA,IAAM;AAAA,IAAc,UAAU;AAAA,KAC3B,KAAK,IAAI,2CACP,KAAD;AAAA,IAAK,KAAK,EAAE;AAAA,IAAO,OAAO,EAAE;AAAA,QAG/B,KAAK,IAAI,CAAC,EAAE,aAAa,4CACvB,OAAD;AAAA,IACE,KAAK;AAAA,OACA,QAAQ,QAAQ,EAAE,OAAO,EAAE,SAAS,aAAa;AAAA,yCAErD,WAAD;AAAA;;MChCG,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAKC;AACJ,SAAO,sDACJ,iBAAD;AAAA,OAAqB;AAAA,yCAClB,SAAD,6CAGD,SAAD;AAAA;;;;"}

package/dist/index.d.ts

@@ -1,12 +1,13 @@
 /// <reference types="react" />
 import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
-import * as react from 'react';
+import * as React from 'react';
+import React__default from 'react';
 
 declare type ComponentRenderer = {
     Renderer?: (props: RendererProps) => JSX.Element;
 };
 declare type ComponentParts = {
-    Content: () => JSX.Element;
+    Content: (props?: any) => JSX.Element;
     Actions?: () => JSX.Element;
     Settings?: () => JSX.Element;
     ContextProvider?: (props: any) => JSX.Element;
@@ -14,20 +15,40 @@ declare type ComponentParts = {
 declare type RendererProps = {
     title: string;
 } & ComponentParts;
+declare type CardExtensionProps<T> = ComponentRenderer & {
+    title?: string;
+} & T;
+/**
+ * An extension creator to create card based components for the homepage
+ *
+ * @public
+ */
 declare function createCardExtension<T>({ title, components, name, }: {
     title: string;
     components: () => Promise<ComponentParts>;
     name?: string;
-}): _backstage_core_plugin_api.Extension<({ Renderer, title: overrideTitle, ...childProps }: ComponentRenderer & {
-    title?: string;
-} & T) => JSX.Element>;
+}): _backstage_core_plugin_api.Extension<(props: CardExtensionProps<T>) => JSX.Element>;
+
+declare type Tool = {
+    label: string;
+    url: string;
+    icon: React__default.ReactNode;
+};
+/**
+ * Props for Toolkit content component {@link Content}.
+ *
+ * @public
+ */
+declare type ToolkitContentProps = {
+    tools: Tool[];
+};
 
 declare const homePlugin: _backstage_core_plugin_api.BackstagePlugin<{
     root: _backstage_core_plugin_api.RouteRef<undefined>;
 }, {}>;
 declare const HomepageCompositionRoot: (props: {
     title?: string | undefined;
-    children?: react.ReactNode;
+    children?: React.ReactNode;
 }) => JSX.Element;
 declare const ComponentAccordion: ({ title, Content, Actions, Settings, ContextProvider, ...childProps }: {
     title: string;
@@ -54,11 +75,28 @@ declare const ComponentTab: ({ title, Content, ContextProvider, ...childProps }:
  * @public
  */
 declare const WelcomeTitle: () => JSX.Element;
-declare const HomePageRandomJoke: ({ Renderer, title: overrideTitle, ...childProps }: ComponentRenderer & {
+/**
+ * A component to display a company logo for the user.
+ *
+ * @public
+ */
+declare const HomePageCompanyLogo: (props: {
+    logo?: React.ReactNode;
+    className?: string | undefined;
+}) => JSX.Element;
+declare const HomePageRandomJoke: (props: ComponentRenderer & {
     title?: string | undefined;
 } & {
     defaultCategory?: "any" | "programming" | undefined;
 }) => JSX.Element;
+/**
+ * A component to display a list of tools for the user.
+ *
+ * @public
+ */
+declare const HomePageToolkit: (props: ComponentRenderer & {
+    title?: string | undefined;
+} & ToolkitContentProps) => JSX.Element;
 
 declare const SettingsModal: ({ open, close, componentName, children, }: {
     open: boolean;
@@ -75,4 +113,4 @@ declare const HeaderWorldClock: ({ clockConfigs, }: {
     clockConfigs: ClockConfig[];
 }) => JSX.Element | null;
 
-export { ClockConfig, ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageRandomJoke, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
+export { ClockConfig, ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };

package/dist/index.esm.js

@@ -46,7 +46,7 @@ function getTimes(clockConfigs) {
       label = "GMT";
     }
     const time = d.toLocaleTimeString(lang, options);
-    clocks.push({time, label});
+    clocks.push({ time, label });
   }
   return clocks;
 }
@@ -82,14 +82,11 @@ function createCardExtension({
   return createReactExtension({
     name,
     component: {
-      lazy: () => components().then(({Content, Actions, Settings, ContextProvider}) => {
-        const CardExtension = ({
-          Renderer,
-          title: overrideTitle,
-          ...childProps
-        }) => {
+      lazy: () => components().then(({ Content, Actions, Settings, ContextProvider }) => {
+        const CardExtension = (props) => {
+          const { Renderer, title: overrideTitle, ...childProps } = props;
           const app = useApp();
-          const {Progress} = app.getComponents();
+          const { Progress } = app.getComponents();
           const [settingsOpen, setSettingsOpen] = React.useState(false);
           if (Renderer) {
             return /* @__PURE__ */ React.createElement(Suspense, {
@@ -98,9 +95,9 @@ function createCardExtension({
               title: overrideTitle || title,
               ...{
                 Content,
-                ...Actions ? {Actions} : {},
-                ...Settings ? {Settings} : {},
-                ...ContextProvider ? {ContextProvider} : {},
+                ...Actions ? { Actions } : {},
+                ...Settings ? { Settings } : {},
+                ...ContextProvider ? { ContextProvider } : {},
                 ...childProps
               }
             }));
@@ -122,7 +119,9 @@ function createCardExtension({
             open: settingsOpen,
             componentName: title,
             close: () => setSettingsOpen(false)
-          }, /* @__PURE__ */ React.createElement(Settings, null)), /* @__PURE__ */ React.createElement(Content, null));
+          }, /* @__PURE__ */ React.createElement(Settings, null)), /* @__PURE__ */ React.createElement(Content, {
+            ...childProps
+          }));
           return /* @__PURE__ */ React.createElement(Suspense, {
             fallback: /* @__PURE__ */ React.createElement(Progress, null)
           }, ContextProvider ? /* @__PURE__ */ React.createElement(ContextProvider, {
@@ -147,38 +146,49 @@ const homePlugin = createPlugin({
 });
 const HomepageCompositionRoot = homePlugin.provide(createRoutableExtension({
   name: "HomepageCompositionRoot",
-  component: () => import('./esm/index-64b176b7.esm.js').then((m) => m.HomepageCompositionRoot),
+  component: () => import('./esm/index-405b0ea2.esm.js').then((m) => m.HomepageCompositionRoot),
   mountPoint: rootRouteRef
 }));
 const ComponentAccordion = homePlugin.provide(createComponentExtension({
   name: "ComponentAccordion",
   component: {
-    lazy: () => import('./esm/index-57301ff6.esm.js').then((m) => m.ComponentAccordion)
+    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentAccordion)
   }
 }));
 const ComponentTabs = homePlugin.provide(createComponentExtension({
   name: "ComponentTabs",
   component: {
-    lazy: () => import('./esm/index-57301ff6.esm.js').then((m) => m.ComponentTabs)
+    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentTabs)
   }
 }));
 const ComponentTab = homePlugin.provide(createComponentExtension({
   name: "ComponentTab",
   component: {
-    lazy: () => import('./esm/index-57301ff6.esm.js').then((m) => m.ComponentTab)
+    lazy: () => import('./esm/index-eddf0731.esm.js').then((m) => m.ComponentTab)
   }
 }));
 const WelcomeTitle = homePlugin.provide(createComponentExtension({
   name: "WelcomeTitle",
   component: {
-    lazy: () => import('./esm/index-20e36a68.esm.js').then((m) => m.WelcomeTitle)
+    lazy: () => import('./esm/index-56def6f8.esm.js').then((m) => m.WelcomeTitle)
+  }
+}));
+const HomePageCompanyLogo = homePlugin.provide(createComponentExtension({
+  name: "CompanyLogo",
+  component: {
+    lazy: () => import('./esm/index-e9dbf86a.esm.js').then((m) => m.CompanyLogo)
   }
 }));
 const HomePageRandomJoke = homePlugin.provide(createCardExtension({
   name: "HomePageRandomJoke",
   title: "Random Joke",
-  components: () => import('./esm/index-1baf251a.esm.js')
+  components: () => import('./esm/index-22929ade.esm.js')
+}));
+const HomePageToolkit = homePlugin.provide(createCardExtension({
+  name: "HomePageToolkit",
+  title: "Toolkit",
+  components: () => import('./esm/index-e6d55b70.esm.js')
 }));
 
-export { ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageRandomJoke, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
+export { ComponentAccordion, ComponentTab, ComponentTabs, HeaderWorldClock, HomePageCompanyLogo, HomePageRandomJoke, HomePageToolkit, HomepageCompositionRoot, SettingsModal, WelcomeTitle, createCardExtension, homePlugin };
 //# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../src/components/SettingsModal.tsx","../src/components/HeaderWorldClock/HeaderWorldClock.tsx","../src/extensions.tsx","../src/routes.ts","../src/plugin.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n} from '@material-ui/core';\n\nexport const SettingsModal = ({\n  open,\n  close,\n  componentName,\n  children,\n}: {\n  open: boolean;\n  close: Function;\n  componentName: string;\n  children: JSX.Element;\n}) => {\n  return (\n    <Dialog open={open} onClose={() => close()}>\n      <DialogTitle>Settings - {componentName}</DialogTitle>\n      <DialogContent>{children}</DialogContent>\n      <DialogActions>\n        <Button onClick={() => close()} color=\"primary\" variant=\"contained\">\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { HeaderLabel } from '@backstage/core-components';\n\nconst timeFormat: Intl.DateTimeFormatOptions = {\n  hour: '2-digit',\n  minute: '2-digit',\n};\n\ntype TimeObj = {\n  time: string;\n  label: string;\n};\n\nexport type ClockConfig = {\n  label: string;\n  timeZone: string;\n};\n\nfunction getTimes(clockConfigs: ClockConfig[]) {\n  const d = new Date();\n  const lang = window.navigator.language;\n\n  const clocks: TimeObj[] = [];\n\n  if (!clockConfigs) {\n    return clocks;\n  }\n\n  for (const clockConfig of clockConfigs) {\n    let label = clockConfig.label;\n\n    const options: Intl.DateTimeFormatOptions = {\n      timeZone: clockConfig.timeZone,\n      ...timeFormat,\n    };\n\n    try {\n      new Date().toLocaleString(lang, options);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `The timezone ${options.timeZone} is invalid. Defaulting to GMT`,\n      );\n      options.timeZone = 'GMT';\n      label = 'GMT';\n    }\n\n    const time = d.toLocaleTimeString(lang, options);\n    clocks.push({ time, label });\n  }\n\n  return clocks;\n}\n\nexport const HeaderWorldClock = ({\n  clockConfigs,\n}: {\n  clockConfigs: ClockConfig[];\n}) => {\n  const defaultTimes: TimeObj[] = [];\n  const [clocks, setTimes] = React.useState(defaultTimes);\n\n  React.useEffect(() => {\n    setTimes(getTimes(clockConfigs));\n\n    const intervalId = setInterval(() => {\n      setTimes(getTimes(clockConfigs));\n    }, 1000);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, [clockConfigs]);\n\n  if (clocks.length !== 0) {\n    return (\n      <>\n        {clocks.map(clock => (\n          <HeaderLabel\n            label={clock.label}\n            value={clock.time}\n            key={clock.label}\n          />\n        ))}\n      </>\n    );\n  }\n  return null;\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { Suspense } from 'react';\nimport { IconButton } from '@material-ui/core';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { InfoCard } from '@backstage/core-components';\nimport { SettingsModal } from './components';\nimport { createReactExtension, useApp } from '@backstage/core-plugin-api';\n\nexport type ComponentRenderer = {\n  Renderer?: (props: RendererProps) => JSX.Element;\n};\n\ntype ComponentParts = {\n  Content: () => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n};\n\ntype RendererProps = { title: string } & ComponentParts;\n\nexport function createCardExtension<T>({\n  title,\n  components,\n  name,\n}: {\n  title: string;\n  components: () => Promise<ComponentParts>;\n  name?: string;\n}) {\n  return createReactExtension({\n    name,\n    component: {\n      lazy: () =>\n        components().then(({ Content, Actions, Settings, ContextProvider }) => {\n          const CardExtension = ({\n            Renderer,\n            title: overrideTitle,\n            ...childProps\n          }: ComponentRenderer & { title?: string } & T) => {\n            const app = useApp();\n            const { Progress } = app.getComponents();\n            const [settingsOpen, setSettingsOpen] = React.useState(false);\n\n            if (Renderer) {\n              return (\n                <Suspense fallback={<Progress />}>\n                  <Renderer\n                    title={overrideTitle || title}\n                    {...{\n                      Content,\n                      ...(Actions ? { Actions } : {}),\n                      ...(Settings ? { Settings } : {}),\n                      ...(ContextProvider ? { ContextProvider } : {}),\n                      ...childProps,\n                    }}\n                  />\n                </Suspense>\n              );\n            }\n\n            const cardProps = {\n              title: overrideTitle ?? title,\n              ...(Settings\n                ? {\n                    action: (\n                      <IconButton onClick={() => setSettingsOpen(true)}>\n                        <SettingsIcon>Settings</SettingsIcon>\n                      </IconButton>\n                    ),\n                  }\n                : {}),\n              ...(Actions\n                ? {\n                    actions: <Actions />,\n                  }\n                : {}),\n            };\n\n            const innerContent = (\n              <InfoCard {...cardProps}>\n                {Settings && (\n                  <SettingsModal\n                    open={settingsOpen}\n                    componentName={title}\n                    close={() => setSettingsOpen(false)}\n                  >\n                    <Settings />\n                  </SettingsModal>\n                )}\n                <Content />\n              </InfoCard>\n            );\n\n            return (\n              <Suspense fallback={<Progress />}>\n                {ContextProvider ? (\n                  <ContextProvider {...childProps}>\n                    {innerContent}\n                  </ContextProvider>\n                ) : (\n                  innerContent\n                )}\n              </Suspense>\n            );\n          };\n          return CardExtension;\n        }),\n    },\n  });\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { createRouteRef } from '@backstage/core-plugin-api';\n\nexport const rootRouteRef = createRouteRef({\n  id: 'home',\n});\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  createComponentExtension,\n  createPlugin,\n  createRoutableExtension,\n} from '@backstage/core-plugin-api';\nimport { createCardExtension } from './extensions';\n\nimport { rootRouteRef } from './routes';\n\nexport const homePlugin = createPlugin({\n  id: 'home',\n  routes: {\n    root: rootRouteRef,\n  },\n});\n\nexport const HomepageCompositionRoot = homePlugin.provide(\n  createRoutableExtension({\n    name: 'HomepageCompositionRoot',\n    component: () =>\n      import('./components').then(m => m.HomepageCompositionRoot),\n    mountPoint: rootRouteRef,\n  }),\n);\n\nexport const ComponentAccordion = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentAccordion',\n    component: {\n      lazy: () =>\n        import('./componentRenderers').then(m => m.ComponentAccordion),\n    },\n  }),\n);\nexport const ComponentTabs = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTabs',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTabs),\n    },\n  }),\n);\nexport const ComponentTab = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTab',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTab),\n    },\n  }),\n);\n\n/**\n * A component to display a playful greeting for the user.\n *\n * @public\n */\nexport const WelcomeTitle = homePlugin.provide(\n  createComponentExtension({\n    name: 'WelcomeTitle',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/WelcomeTitle').then(m => m.WelcomeTitle),\n    },\n  }),\n);\n\nexport const HomePageRandomJoke = homePlugin.provide(\n  createCardExtension<{ defaultCategory?: 'any' | 'programming' }>({\n    name: 'HomePageRandomJoke',\n    title: 'Random Joke',\n    components: () => import('./homePageComponents/RandomJoke'),\n  }),\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.esm.js","sources":["../src/components/SettingsModal.tsx","../src/components/HeaderWorldClock/HeaderWorldClock.tsx","../src/extensions.tsx","../src/routes.ts","../src/plugin.ts"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n} from '@material-ui/core';\n\nexport const SettingsModal = ({\n  open,\n  close,\n  componentName,\n  children,\n}: {\n  open: boolean;\n  close: Function;\n  componentName: string;\n  children: JSX.Element;\n}) => {\n  return (\n    <Dialog open={open} onClose={() => close()}>\n      <DialogTitle>Settings - {componentName}</DialogTitle>\n      <DialogContent>{children}</DialogContent>\n      <DialogActions>\n        <Button onClick={() => close()} color=\"primary\" variant=\"contained\">\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { HeaderLabel } from '@backstage/core-components';\n\nconst timeFormat: Intl.DateTimeFormatOptions = {\n  hour: '2-digit',\n  minute: '2-digit',\n};\n\ntype TimeObj = {\n  time: string;\n  label: string;\n};\n\nexport type ClockConfig = {\n  label: string;\n  timeZone: string;\n};\n\nfunction getTimes(clockConfigs: ClockConfig[]) {\n  const d = new Date();\n  const lang = window.navigator.language;\n\n  const clocks: TimeObj[] = [];\n\n  if (!clockConfigs) {\n    return clocks;\n  }\n\n  for (const clockConfig of clockConfigs) {\n    let label = clockConfig.label;\n\n    const options: Intl.DateTimeFormatOptions = {\n      timeZone: clockConfig.timeZone,\n      ...timeFormat,\n    };\n\n    try {\n      new Date().toLocaleString(lang, options);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(\n        `The timezone ${options.timeZone} is invalid. Defaulting to GMT`,\n      );\n      options.timeZone = 'GMT';\n      label = 'GMT';\n    }\n\n    const time = d.toLocaleTimeString(lang, options);\n    clocks.push({ time, label });\n  }\n\n  return clocks;\n}\n\nexport const HeaderWorldClock = ({\n  clockConfigs,\n}: {\n  clockConfigs: ClockConfig[];\n}) => {\n  const defaultTimes: TimeObj[] = [];\n  const [clocks, setTimes] = React.useState(defaultTimes);\n\n  React.useEffect(() => {\n    setTimes(getTimes(clockConfigs));\n\n    const intervalId = setInterval(() => {\n      setTimes(getTimes(clockConfigs));\n    }, 1000);\n\n    return () => {\n      clearInterval(intervalId);\n    };\n  }, [clockConfigs]);\n\n  if (clocks.length !== 0) {\n    return (\n      <>\n        {clocks.map(clock => (\n          <HeaderLabel\n            label={clock.label}\n            value={clock.time}\n            key={clock.label}\n          />\n        ))}\n      </>\n    );\n  }\n  return null;\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { Suspense } from 'react';\nimport { IconButton } from '@material-ui/core';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { InfoCard } from '@backstage/core-components';\nimport { SettingsModal } from './components';\nimport { createReactExtension, useApp } from '@backstage/core-plugin-api';\n\nexport type ComponentRenderer = {\n  Renderer?: (props: RendererProps) => JSX.Element;\n};\n\ntype ComponentParts = {\n  Content: (props?: any) => JSX.Element;\n  Actions?: () => JSX.Element;\n  Settings?: () => JSX.Element;\n  ContextProvider?: (props: any) => JSX.Element;\n};\n\ntype RendererProps = { title: string } & ComponentParts;\n\ntype CardExtensionProps<T> = ComponentRenderer & { title?: string } & T;\n\n/**\n * An extension creator to create card based components for the homepage\n *\n * @public\n */\nexport function createCardExtension<T>({\n  title,\n  components,\n  name,\n}: {\n  title: string;\n  components: () => Promise<ComponentParts>;\n  name?: string;\n}) {\n  return createReactExtension({\n    name,\n    component: {\n      lazy: () =>\n        components().then(({ Content, Actions, Settings, ContextProvider }) => {\n          const CardExtension = (props: CardExtensionProps<T>) => {\n            const { Renderer, title: overrideTitle, ...childProps } = props;\n            const app = useApp();\n            const { Progress } = app.getComponents();\n            const [settingsOpen, setSettingsOpen] = React.useState(false);\n\n            if (Renderer) {\n              return (\n                <Suspense fallback={<Progress />}>\n                  <Renderer\n                    title={overrideTitle || title}\n                    {...{\n                      Content,\n                      ...(Actions ? { Actions } : {}),\n                      ...(Settings ? { Settings } : {}),\n                      ...(ContextProvider ? { ContextProvider } : {}),\n                      ...childProps,\n                    }}\n                  />\n                </Suspense>\n              );\n            }\n\n            const cardProps = {\n              title: overrideTitle ?? title,\n              ...(Settings\n                ? {\n                    action: (\n                      <IconButton onClick={() => setSettingsOpen(true)}>\n                        <SettingsIcon>Settings</SettingsIcon>\n                      </IconButton>\n                    ),\n                  }\n                : {}),\n              ...(Actions\n                ? {\n                    actions: <Actions />,\n                  }\n                : {}),\n            };\n\n            const innerContent = (\n              <InfoCard {...cardProps}>\n                {Settings && (\n                  <SettingsModal\n                    open={settingsOpen}\n                    componentName={title}\n                    close={() => setSettingsOpen(false)}\n                  >\n                    <Settings />\n                  </SettingsModal>\n                )}\n                <Content {...childProps} />\n              </InfoCard>\n            );\n\n            return (\n              <Suspense fallback={<Progress />}>\n                {ContextProvider ? (\n                  <ContextProvider {...childProps}>\n                    {innerContent}\n                  </ContextProvider>\n                ) : (\n                  innerContent\n                )}\n              </Suspense>\n            );\n          };\n          return CardExtension;\n        }),\n    },\n  });\n}\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { createRouteRef } from '@backstage/core-plugin-api';\n\nexport const rootRouteRef = createRouteRef({\n  id: 'home',\n});\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport {\n  createComponentExtension,\n  createPlugin,\n  createRoutableExtension,\n} from '@backstage/core-plugin-api';\nimport { createCardExtension } from './extensions';\nimport { ToolkitContentProps } from './homePageComponents';\n\nimport { rootRouteRef } from './routes';\n\nexport const homePlugin = createPlugin({\n  id: 'home',\n  routes: {\n    root: rootRouteRef,\n  },\n});\n\nexport const HomepageCompositionRoot = homePlugin.provide(\n  createRoutableExtension({\n    name: 'HomepageCompositionRoot',\n    component: () =>\n      import('./components').then(m => m.HomepageCompositionRoot),\n    mountPoint: rootRouteRef,\n  }),\n);\n\nexport const ComponentAccordion = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentAccordion',\n    component: {\n      lazy: () =>\n        import('./componentRenderers').then(m => m.ComponentAccordion),\n    },\n  }),\n);\nexport const ComponentTabs = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTabs',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTabs),\n    },\n  }),\n);\nexport const ComponentTab = homePlugin.provide(\n  createComponentExtension({\n    name: 'ComponentTab',\n    component: {\n      lazy: () => import('./componentRenderers').then(m => m.ComponentTab),\n    },\n  }),\n);\n\n/**\n * A component to display a playful greeting for the user.\n *\n * @public\n */\nexport const WelcomeTitle = homePlugin.provide(\n  createComponentExtension({\n    name: 'WelcomeTitle',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/WelcomeTitle').then(m => m.WelcomeTitle),\n    },\n  }),\n);\n\n/**\n * A component to display a company logo for the user.\n *\n * @public\n */\nexport const HomePageCompanyLogo = homePlugin.provide(\n  createComponentExtension({\n    name: 'CompanyLogo',\n    component: {\n      lazy: () =>\n        import('./homePageComponents/CompanyLogo').then(m => m.CompanyLogo),\n    },\n  }),\n);\n\nexport const HomePageRandomJoke = homePlugin.provide(\n  createCardExtension<{ defaultCategory?: 'any' | 'programming' }>({\n    name: 'HomePageRandomJoke',\n    title: 'Random Joke',\n    components: () => import('./homePageComponents/RandomJoke'),\n  }),\n);\n\n/**\n * A component to display a list of tools for the user.\n *\n * @public\n */\nexport const HomePageToolkit = homePlugin.provide(\n  createCardExtension<ToolkitContentProps>({\n    name: 'HomePageToolkit',\n    title: 'Toolkit',\n    components: () => import('./homePageComponents/Toolkit'),\n  }),\n);\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@backstage/plugin-home",
   "description": "A Backstage plugin that helps you build a home page",
-  "version": "0.4.6",
+  "version": "0.4.10",
   "main": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "license": "Apache-2.0",
@@ -21,24 +21,26 @@
     "clean": "backstage-cli clean"
   },
   "dependencies": {
-    "@backstage/core-components": "^0.7.4",
-    "@backstage/core-plugin-api": "^0.2.0",
-    "@backstage/theme": "^0.2.13",
+    "@backstage/core-components": "^0.8.4",
+    "@backstage/core-plugin-api": "^0.5.0",
+    "@backstage/plugin-search": "^0.5.5",
+    "@backstage/theme": "^0.2.14",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "4.0.0-alpha.57",
-    "@types/react": "*",
     "lodash": "^4.17.21",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-router": "6.0.0-beta.0",
     "react-use": "^17.2.4"
   },
+  "peerDependencies": {
+    "@types/react": "^16.13.1 || ^17.0.0",
+    "react": "^16.13.1 || ^17.0.0"
+  },
   "devDependencies": {
-    "@backstage/cli": "^0.9.0",
-    "@backstage/core-app-api": "^0.1.21",
-    "@backstage/dev-utils": "^0.2.13",
-    "@backstage/test-utils": "^0.1.22",
+    "@backstage/cli": "^0.11.0",
+    "@backstage/core-app-api": "^0.4.0",
+    "@backstage/dev-utils": "^0.2.17",
+    "@backstage/test-utils": "^0.2.2",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^11.2.5",
     "@testing-library/user-event": "^13.1.8",
@@ -50,5 +52,5 @@
   "files": [
     "dist"
   ],
-  "gitHead": "ddfdcd2b44dc9848cf550cea5346d5f9916a36d9"
+  "gitHead": "da66c61bdd63cdb3f0f0cd2e26dc9e6454d93c7b"
 }