fix(panel): initially closed panel should be hidden (#10308)

**Related Issue:** #10320

## Summary

- panel that is initially closed should not be displayed
- add story
- add test

packages/calcite-components/src/components/panel/panel.e2e.ts

@@ -219,6 +219,18 @@ describe("calcite-panel", () => {
     expect(await container.isVisible()).toBe(false);
   });
 
+  it("honors closed prop initially", async () => {
+    const page = await newE2EPage();
+
+    await page.setContent("<calcite-panel closed closable>test</calcite-panel>");
+
+    const container = await page.find(`calcite-panel >>> .${CSS.container}`);
+
+    await page.waitForChanges();
+
+    expect(await container.isVisible()).toBe(false);
+  });
+
   it("should handle rejected 'beforeClose' promise'", async () => {
     const page = await newE2EPage();
 

packages/calcite-components/src/components/panel/panel.tsx

@@ -180,6 +180,7 @@ export class Panel
 
   async componentWillLoad(): Promise<void> {
     setUpLoadableComponent(this);
+    this.isClosed = this.closed;
     await setUpMessages(this);
   }