@industry-theme/principal-view-panels 0.11.22 → 0.11.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/panels/StoryboardListPanel.d.ts.map +1 -1
  2. package/dist/panels.bundle.js +162 -151
  3. package/dist/panels.bundle.js.map +1 -1
  4. package/package.json +1 -1
package/dist/panels/StoryboardListPanel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StoryboardListPanel.d.ts","sourceRoot":"","sources":["../../src/panels/StoryboardListPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,UAAU,CAAC;AAqE9D;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CA2tBvE,CAAC"}
1
+ {"version":3,"file":"StoryboardListPanel.d.ts","sourceRoot":"","sources":["../../src/panels/StoryboardListPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AACtE,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,UAAU,CAAC;AAqE9D;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAmuBvE,CAAC"}
package/dist/panels.bundle.js CHANGED
@@ -99417,200 +99417,211 @@ const StoryboardListPanel = ({
99417
99417
  style: {
99418
99418
  flexShrink: 0,
99419
99419
  display: "flex",
99420
- alignItems: "center",
99421
- justifyContent: "space-between",
99422
- gap: "12px",
99420
+ flexDirection: "column",
99421
+ gap: "8px",
99423
99422
  paddingLeft: "clamp(16px, 4vw, 24px)",
99424
- paddingRight: "clamp(8px, 2vw, 16px)",
99425
- flexWrap: "wrap"
99423
+ paddingRight: "clamp(8px, 2vw, 16px)"
99426
99424
  },
99427
99425
  children: [
99428
- /* @__PURE__ */ jsx(
99429
- "h2",
99426
+ /* @__PURE__ */ jsxs(
99427
+ "div",
99430
99428
  {
99431
99429
  style: {
99432
- margin: 0,
99433
- fontSize: theme2.fontSizes[4],
99434
- color: theme2.colors.text
99430
+ display: "flex",
99431
+ alignItems: "center",
99432
+ justifyContent: "space-between",
99433
+ gap: "8px"
99435
99434
  },
99436
- children: "Storyboards"
99437
- }
99438
- ),
99439
- /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px", flex: storyboards.length >= 10 ? "1 1 200px" : "0 0 auto", maxWidth: storyboards.length >= 10 ? "400px" : "none" }, children: [
99440
- /* @__PURE__ */ jsxs("div", { style: {
99441
- display: "flex",
99442
- alignItems: "center",
99443
- gap: "4px",
99444
- background: theme2.colors.backgroundSecondary,
99445
- border: `1px solid ${theme2.colors.border}`,
99446
- borderRadius: theme2.radii[2],
99447
- padding: "4px"
99448
- }, children: [
99449
- /* @__PURE__ */ jsx(
99450
- "button",
99451
- {
99452
- onClick: () => setCanvasTypeFilter("otel"),
99453
- style: {
99454
- background: canvasTypeFilter === "otel" ? theme2.colors.primary : "transparent",
99455
- border: "none",
99456
- borderRadius: theme2.radii[1],
99457
- padding: "6px 12px",
99458
- cursor: "pointer",
99459
- fontSize: theme2.fontSizes[1],
99460
- fontFamily: theme2.fonts.body,
99461
- fontWeight: canvasTypeFilter === "otel" ? 600 : 400,
99462
- color: canvasTypeFilter === "otel" ? "white" : theme2.colors.text,
99463
- transition: "all 0.2s ease"
99464
- },
99465
- title: "Runtime validated .otel.canvas files",
99466
- children: "OTEL"
99467
- }
99468
- ),
99469
- /* @__PURE__ */ jsx(
99470
- "button",
99471
- {
99472
- onClick: () => setCanvasTypeFilter("regular"),
99473
- style: {
99474
- background: canvasTypeFilter === "regular" ? theme2.colors.primary : "transparent",
99475
- border: "none",
99476
- borderRadius: theme2.radii[1],
99477
- padding: "6px 12px",
99478
- cursor: "pointer",
99479
- fontSize: theme2.fontSizes[1],
99480
- fontFamily: theme2.fonts.body,
99481
- fontWeight: canvasTypeFilter === "regular" ? 600 : 400,
99482
- color: canvasTypeFilter === "regular" ? "white" : theme2.colors.text,
99483
- transition: "all 0.2s ease"
99484
- },
99485
- title: "Static documentation .canvas files",
99486
- children: "Static"
99487
- }
99488
- )
99489
- ] }),
99490
- storyboards.length >= 10 && /* @__PURE__ */ jsxs(
99491
- "div",
99492
- {
99493
- style: {
99494
- position: "relative",
99495
- flex: 1,
99496
- minWidth: "150px"
99497
- },
99498
- children: [
99499
- /* @__PURE__ */ jsx(
99500
- Search,
99501
- {
99502
- size: 16,
99503
- color: theme2.colors.textSecondary,
99504
- style: {
99505
- position: "absolute",
99506
- left: "10px",
99507
- top: "50%",
99508
- transform: "translateY(-50%)",
99509
- pointerEvents: "none"
99510
- }
99511
- }
99512
- ),
99435
+ children: [
99436
+ /* @__PURE__ */ jsx(
99437
+ "h2",
99438
+ {
99439
+ style: {
99440
+ margin: 0,
99441
+ fontSize: theme2.fontSizes[4],
99442
+ color: theme2.colors.text,
99443
+ whiteSpace: "nowrap"
99444
+ },
99445
+ children: "Storyboards"
99446
+ }
99447
+ ),
99448
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "4px", flexShrink: 0 }, children: [
99513
99449
  /* @__PURE__ */ jsx(
99514
- "input",
99450
+ "button",
99515
99451
  {
99516
- type: "text",
99517
- placeholder: "Search storyboards...",
99518
- value: searchQuery,
99519
- onChange: (e) => setSearchQuery(e.target.value),
99452
+ onClick: handleRefresh,
99453
+ disabled: isRefreshing || isLoading,
99520
99454
  style: {
99521
- width: "100%",
99522
- padding: "8px 32px 8px 32px",
99523
- fontSize: theme2.fontSizes[1],
99524
- fontFamily: theme2.fonts.body,
99525
- border: `1px solid ${theme2.colors.border}`,
99526
- borderRadius: theme2.radii[2],
99527
99455
  background: theme2.colors.backgroundSecondary,
99528
- color: theme2.colors.text,
99529
- outline: "none",
99530
- boxSizing: "border-box"
99531
- }
99456
+ border: `1px solid ${theme2.colors.border}`,
99457
+ borderRadius: theme2.radii[1],
99458
+ padding: "6px",
99459
+ cursor: isRefreshing ? "wait" : "pointer",
99460
+ display: "flex",
99461
+ alignItems: "center",
99462
+ justifyContent: "center",
99463
+ transition: "all 0.2s ease"
99464
+ },
99465
+ title: "Refresh storyboards",
99466
+ children: /* @__PURE__ */ jsx(
99467
+ RefreshCw,
99468
+ {
99469
+ size: 14,
99470
+ color: theme2.colors.textSecondary,
99471
+ style: {
99472
+ animation: isRefreshing ? "spin 1s linear infinite" : "none"
99473
+ }
99474
+ }
99475
+ )
99532
99476
  }
99533
99477
  ),
99534
- searchQuery && /* @__PURE__ */ jsx(
99478
+ /* @__PURE__ */ jsx(
99535
99479
  "button",
99536
99480
  {
99537
- onClick: () => setSearchQuery(""),
99481
+ onClick: toggleHelp,
99538
99482
  style: {
99539
- position: "absolute",
99540
- right: "6px",
99541
- top: "50%",
99542
- transform: "translateY(-50%)",
99543
- background: "transparent",
99544
- border: "none",
99545
- padding: "4px",
99483
+ background: showHelp ? theme2.colors.primary : theme2.colors.backgroundSecondary,
99484
+ border: `1px solid ${theme2.colors.border}`,
99485
+ borderRadius: theme2.radii[1],
99486
+ padding: "6px",
99546
99487
  cursor: "pointer",
99547
99488
  display: "flex",
99548
99489
  alignItems: "center",
99549
99490
  justifyContent: "center",
99550
- color: theme2.colors.textSecondary
99491
+ transition: "all 0.2s ease"
99551
99492
  },
99552
- "aria-label": "Clear search",
99553
- children: /* @__PURE__ */ jsx(X, { size: 14 })
99493
+ title: "Help & Getting Started",
99494
+ children: /* @__PURE__ */ jsx(
99495
+ CircleQuestionMark,
99496
+ {
99497
+ size: 14,
99498
+ color: showHelp ? "white" : theme2.colors.textSecondary
99499
+ }
99500
+ )
99554
99501
  }
99555
99502
  )
99556
- ]
99557
- }
99558
- ),
99503
+ ] })
99504
+ ]
99505
+ }
99506
+ ),
99507
+ /* @__PURE__ */ jsxs("div", { style: {
99508
+ display: "flex",
99509
+ alignItems: "center",
99510
+ background: theme2.colors.backgroundSecondary,
99511
+ border: `1px solid ${theme2.colors.border}`,
99512
+ borderRadius: theme2.radii[2],
99513
+ padding: "3px"
99514
+ }, children: [
99559
99515
  /* @__PURE__ */ jsx(
99560
99516
  "button",
99561
99517
  {
99562
- onClick: handleRefresh,
99563
- disabled: isRefreshing || isLoading,
99518
+ onClick: () => setCanvasTypeFilter("otel"),
99564
99519
  style: {
99565
- background: theme2.colors.backgroundSecondary,
99566
- border: `1px solid ${theme2.colors.border}`,
99520
+ flex: 1,
99521
+ background: canvasTypeFilter === "otel" ? theme2.colors.primary : "transparent",
99522
+ border: "none",
99567
99523
  borderRadius: theme2.radii[1],
99568
- padding: "8px",
99569
- cursor: isRefreshing ? "wait" : "pointer",
99570
- display: "flex",
99571
- alignItems: "center",
99572
- justifyContent: "center",
99524
+ padding: "6px 12px",
99525
+ cursor: "pointer",
99526
+ fontSize: theme2.fontSizes[1],
99527
+ fontFamily: theme2.fonts.body,
99528
+ fontWeight: canvasTypeFilter === "otel" ? 600 : 400,
99529
+ color: canvasTypeFilter === "otel" ? "white" : theme2.colors.text,
99573
99530
  transition: "all 0.2s ease"
99574
99531
  },
99575
- title: "Refresh storyboards",
99576
- children: /* @__PURE__ */ jsx(
99577
- RefreshCw,
99578
- {
99579
- size: 16,
99580
- color: theme2.colors.textSecondary,
99581
- style: {
99582
- animation: isRefreshing ? "spin 1s linear infinite" : "none"
99583
- }
99584
- }
99585
- )
99532
+ title: "Runtime validated .otel.canvas files",
99533
+ children: "OTEL"
99586
99534
  }
99587
99535
  ),
99588
99536
  /* @__PURE__ */ jsx(
99589
99537
  "button",
99590
99538
  {
99591
- onClick: toggleHelp,
99539
+ onClick: () => setCanvasTypeFilter("regular"),
99592
99540
  style: {
99593
- background: showHelp ? theme2.colors.primary : theme2.colors.backgroundSecondary,
99594
- border: `1px solid ${theme2.colors.border}`,
99541
+ flex: 1,
99542
+ background: canvasTypeFilter === "regular" ? theme2.colors.primary : "transparent",
99543
+ border: "none",
99595
99544
  borderRadius: theme2.radii[1],
99596
- padding: "8px",
99545
+ padding: "6px 12px",
99597
99546
  cursor: "pointer",
99598
- display: "flex",
99599
- alignItems: "center",
99600
- justifyContent: "center",
99547
+ fontSize: theme2.fontSizes[1],
99548
+ fontFamily: theme2.fonts.body,
99549
+ fontWeight: canvasTypeFilter === "regular" ? 600 : 400,
99550
+ color: canvasTypeFilter === "regular" ? "white" : theme2.colors.text,
99601
99551
  transition: "all 0.2s ease"
99602
99552
  },
99603
- title: "Help & Getting Started",
99604
- children: /* @__PURE__ */ jsx(
99605
- CircleQuestionMark,
99553
+ title: "Static documentation .canvas files",
99554
+ children: "Static"
99555
+ }
99556
+ )
99557
+ ] }),
99558
+ storyboards.length >= 10 && /* @__PURE__ */ jsxs(
99559
+ "div",
99560
+ {
99561
+ style: {
99562
+ position: "relative"
99563
+ },
99564
+ children: [
99565
+ /* @__PURE__ */ jsx(
99566
+ Search,
99606
99567
  {
99607
99568
  size: 16,
99608
- color: showHelp ? "white" : theme2.colors.textSecondary
99569
+ color: theme2.colors.textSecondary,
99570
+ style: {
99571
+ position: "absolute",
99572
+ left: "10px",
99573
+ top: "50%",
99574
+ transform: "translateY(-50%)",
99575
+ pointerEvents: "none"
99576
+ }
99577
+ }
99578
+ ),
99579
+ /* @__PURE__ */ jsx(
99580
+ "input",
99581
+ {
99582
+ type: "text",
99583
+ placeholder: "Search storyboards...",
99584
+ value: searchQuery,
99585
+ onChange: (e) => setSearchQuery(e.target.value),
99586
+ style: {
99587
+ width: "100%",
99588
+ padding: "8px 32px 8px 32px",
99589
+ fontSize: theme2.fontSizes[1],
99590
+ fontFamily: theme2.fonts.body,
99591
+ border: `1px solid ${theme2.colors.border}`,
99592
+ borderRadius: theme2.radii[2],
99593
+ background: theme2.colors.backgroundSecondary,
99594
+ color: theme2.colors.text,
99595
+ outline: "none",
99596
+ boxSizing: "border-box"
99597
+ }
99598
+ }
99599
+ ),
99600
+ searchQuery && /* @__PURE__ */ jsx(
99601
+ "button",
99602
+ {
99603
+ onClick: () => setSearchQuery(""),
99604
+ style: {
99605
+ position: "absolute",
99606
+ right: "6px",
99607
+ top: "50%",
99608
+ transform: "translateY(-50%)",
99609
+ background: "transparent",
99610
+ border: "none",
99611
+ padding: "4px",
99612
+ cursor: "pointer",
99613
+ display: "flex",
99614
+ alignItems: "center",
99615
+ justifyContent: "center",
99616
+ color: theme2.colors.textSecondary
99617
+ },
99618
+ "aria-label": "Clear search",
99619
+ children: /* @__PURE__ */ jsx(X, { size: 14 })
99609
99620
  }
99610
99621
  )
99611
- }
99612
- )
99613
- ] })
99622
+ ]
99623
+ }
99624
+ )
99614
99625
  ]
99615
99626
  }
99616
99627
  ),