@qaick/runner 0.2.0-alpha.8 → 0.28.0-alpha.5

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.
@@ -1,60 +1,42 @@
1
- :root { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #182234; background: #f7f9fc; font-size: 13px; color-scheme: light; }
1
+ :root { font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: #182234; background: #f7f8fc; font-size: 13px; color-scheme: light; }
2
2
  :root[data-theme='dark'] { color: #e6edf7; background: #111827; color-scheme: dark; }
3
3
  * { box-sizing: border-box; } body { margin: 0; min-width: 1120px; } button, select { font: inherit; }
4
- .runner-shell { height: 100vh; min-height: 100vh; display: grid; grid-template-rows: 58px minmax(0, 1fr); } .runner-header { display: flex; align-items: center; gap: 18px; padding: 0 12px 0 16px; border-bottom: 1px solid #dfe4ec; background: #fff; font-size: 13px; }
5
- .runner-brand { display: flex; align-items: baseline; gap: 6px; flex: none; } .runner-brand-mark { color: #3569d4; font-size: 13px; font-weight: 700; letter-spacing: .04em; } .runner-brand-product { color: #182234; font-size: 13px; font-weight: 500; } .runner-brand .about-button { height: 25px; margin-left: 6px; padding: 0 9px; border: 0; border-radius: 4px; background: transparent; color: #40516c; font-size: 12px; font-weight: 650; } .runner-brand .about-button:hover { background: #f0f3f8; color: #182234; } .runner-logo { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: white; background: #3569d4; font-size: 13px; } .alpha-label { color: #70809a; font-size: 13px; } .header-spacer, .panel-spacer { flex: 1; }
4
+ .runner-shell { height: 100vh; min-height: 100vh; display: grid; grid-template-rows: 44px minmax(0, 1fr); } .runner-header { display: flex; align-items: center; gap: 18px; padding: 0 12px 0 16px; border-bottom: 1px solid #cbd1d8; background: #fff; font-size: 13px; }
5
+ .runner-brand { display: flex; align-items: baseline; gap: 6px; flex: none; } .runner-brand-mark { color: #4f46d8; font-size: 13px; font-weight: 700; letter-spacing: .04em; } .runner-brand-product { color: #182234; font-size: 13px; font-weight: 500; } .runner-brand .about-button { height: 25px; margin-left: 6px; padding: 0 9px; border: 0; border-radius: 4px; background: transparent; color: #34435b; font-size: 12px; font-weight: 650; } .runner-brand .about-button:hover { background: #f0f3f8; color: #182234; } .runner-logo { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: white; background: #4f46d8; font-size: 13px; } .alpha-label { color: #70809a; font-size: 13px; } .header-spacer, .panel-spacer { flex: 1; }
6
6
  .engine-status { display: flex; align-items: center; gap: 7px; color: #14804a; font-size: 12px; font-weight: 700; } .engine-status i { width: 8px; height: 8px; border-radius: 50%; background: #19a463; }
7
- .theme-picker { display: flex; align-items: center; gap: 7px; color: #596a82; font-size: 12px; font-weight: 700; } .theme-picker select { min-width: 82px; height: 30px; padding: 0 8px; border: 1px solid #cdd7e5; border-radius: 6px; background: white; color: #182234; }
8
- .runner-main { display: grid; grid-template-columns: 218px minmax(560px, 1fr) 350px; min-height: 0; overflow: hidden; } .runner-nav, .inspector { min-height: 0; overflow-y: auto; background: #fff; } .runner-nav { padding: 18px 12px; border-right: 1px solid #dfe4ec; }
7
+ .theme-picker { display: flex; align-items: center; gap: 7px; color: #617089; font-size: 12px; font-weight: 700; } .theme-picker select { min-width: 82px; height: 30px; padding: 0 8px; border: 1px solid #cfd5dd; border-radius: 6px; background: white; color: #182234; }
8
+ .runner-main { display: grid; grid-template-columns: 218px minmax(560px, 1fr) 350px; min-height: 0; overflow: hidden; } .runner-nav, .inspector { min-height: 0; overflow-y: auto; background: #fff; } .runner-nav { padding: 18px 12px; border-right: 1px solid #cbd1d8; }
9
9
  .nav-label, .eyebrow { color: #8794a8; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .nav-label { margin: 4px 12px 10px; }
10
- .nav-item { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 7px; color: #40516c; font-size: 14px; text-decoration: none; cursor: pointer; } .nav-item span { width: 20px; text-align: center; } .nav-item.active { color: #2458c4; background: #e9f0ff; font-weight: 700; }
11
- .package-card { margin: 24px 8px 0; padding: 12px; border: 1px solid #dce4f0; border-radius: 8px; background: #f8faff; } .package-card small { display: block; color: #77869b; } .package-card strong { display: block; margin: 5px 0; font-size: 12px; overflow-wrap: anywhere; }
12
- .runner-workspace { min-height: 0; overflow-y: auto; padding: 26px 30px; background: #f7f9fc; } .eyebrow { color: #687a95; } h1 { margin: 5px 0 4px; font-size: 25px; letter-spacing: -.02em; } .description { margin: 0; color: #66758c; }
13
- .run-controls { display: flex; align-items: end; flex-wrap: wrap; gap: 10px 14px; margin-top: 25px; } label { display: grid; gap: 6px; color: #596a82; font-size: 12px; font-weight: 700; } select { min-width: 145px; height: 36px; padding: 0 10px; border: 1px solid #cdd7e5; border-radius: 6px; background: white; color: #182234; }
14
- .button { height: 36px; padding: 0 15px; border: 1px solid #cdd7e5; border-radius: 6px; background: white; color: #334560; font-weight: 700; cursor: pointer; } .button.primary { border-color: #3569d4; background: #3569d4; color: white; } .button.dry-run { border-color: #8a9fc4; color: #315da9; background: #eef3fc; } .button.stop { color: #b33a30; }
15
- .file-button { position: relative; display: inline-grid; height: 36px; padding: 0 15px; place-items: center; border: 1px solid #cdd7e5; border-radius: 6px; background: white; color: #334560; cursor: pointer; } .file-button input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; } .load-error { margin: 12px 0 -8px; color: #b33a30; font-size: 12px; font-weight: 700; }
16
- .inputs-panel { margin-top: 18px; } .input-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 16px; } .input-field { color: #596a82; } .input-field input { width: 100%; height: 34px; padding: 0 9px; border: 1px solid #cdd7e5; border-radius: 6px; color: #182234; background: #fff; font: inherit; font-weight: 500; } .input-hint { color: #7a899d; font-size: 11px; }
10
+ .nav-item { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border-radius: 7px; color: #34435b; font-size: 14px; text-decoration: none; cursor: pointer; } .nav-item span { width: 20px; text-align: center; } .nav-item.active { color: #3f37b8; background: #e8eeff; font-weight: 700; }
11
+ .package-card { margin: 24px 8px 0; padding: 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8faff; } .package-card small { display: block; color: #77869b; } .package-card strong { display: block; margin: 5px 0; font-size: 12px; overflow-wrap: anywhere; }
12
+ .runner-workspace { min-height: 0; overflow-y: auto; padding: 26px 30px; background: #f7f8fc; } .eyebrow { color: #7c8aa0; } h1 { margin: 5px 0 4px; font-size: 25px; letter-spacing: -.02em; } .description { margin: 0; color: #617089; }
13
+ .run-controls { display: flex; align-items: end; flex-wrap: wrap; gap: 10px 14px; margin-top: 25px; } label { display: grid; gap: 6px; color: #617089; font-size: 12px; font-weight: 700; } select { min-width: 145px; height: 36px; padding: 0 10px; border: 1px solid #cfd5dd; border-radius: 6px; background: white; color: #182234; }
14
+ .button { height: 36px; padding: 0 15px; border: 1px solid #cfd5dd; border-radius: 6px; background: white; color: #334560; font-weight: 700; cursor: pointer; } .button.primary { border-color: #4f46d8; background: #4f46d8; color: white; } .button.dry-run { border-color: #8a9fc4; color: #315da9; background: #eef3fc; } .button.stop { color: #b33a30; }
15
+ .file-button { position: relative; display: inline-grid; height: 36px; padding: 0 15px; place-items: center; border: 1px solid #cfd5dd; border-radius: 6px; background: white; color: #334560; cursor: pointer; } .file-button input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; } .load-error { margin: 12px 0 -8px; color: #b33a30; font-size: 12px; font-weight: 700; }
16
+ .inputs-panel { margin-top: 18px; } .input-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 16px; } .input-field { color: #617089; } .input-field input { width: 100%; height: 34px; padding: 0 9px; border: 1px solid #cfd5dd; border-radius: 6px; color: #182234; background: #fff; font: inherit; font-weight: 500; } .input-hint { color: #7a899d; font-size: 11px; }
17
17
  .history-view-banner { margin-top: 12px; padding: 9px 12px; border: 1px solid #b9cbed; border-radius: 6px; color: #315da9; background: #eaf2ff; font-size: 12px; font-weight: 700; }
18
- .panel { margin-top: 24px; border: 1px solid #dce4ed; border-radius: 8px; background: white; overflow: hidden; } .panel-heading { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid #e6ebf2; } h2 { margin: 0; font-size: 16px; } .running { color: #14804a; font-size: 12px; font-weight: 750; } .stopped { color: #b33a30; font-size: 12px; font-weight: 750; }
19
- table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding: 10px 14px; color: #7b899d; background: #fafbfd; font-size: 11px; text-align: left; text-transform: uppercase; letter-spacing: .04em; } td { padding: 13px 14px; border-top: 1px solid #edf0f5; } tr.parent-row td { background: #fbfdff; } tr.nested-row td { background: #f3f7fd; } tr.selected td { background: #dce8ff !important; border-top-color: #9db9ed; } tr.selected td:first-child { border-left: 4px solid #3569d4; } tr.selected .hierarchy-name { color: #173e91; font-weight: 700; } tbody tr { cursor: pointer; }
20
- .hierarchy-hint { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px solid #dbe6fa; color: #315da9; background: #f2f6ff; font-size: 11px; } .hierarchy-hint span { color: #637897; } .hierarchy-action { padding: 4px 7px; border: 1px solid #b9cbed; border-radius: 4px; color: #315da9; background: #fff; font-size: 10px; font-weight: 700; cursor: pointer; } .hierarchy-action:first-of-type { margin-left: auto; } .hierarchy-name { display: inline-flex; align-items: center; gap: 7px; min-height: 22px; } .collapse-toggle { display: inline-grid; width: 18px; height: 18px; place-items: center; padding: 0; border: 1px solid #9eb5df; border-radius: 4px; color: #315da9; background: #eaf1ff; font-size: 14px; line-height: 1; cursor: pointer; } .branch-marker { color: #5d82ca; font-size: 18px; font-weight: 400; } .kind-label { display: inline-flex; padding: 3px 5px; border-radius: 4px; color: #6c7890; background: #edf1f7; font-size: 9px; font-weight: 800; letter-spacing: .05em; } .nested-label { color: #315da9; background: #e5efff; } .nested-row td:first-child { border-left: 3px solid #8eaded; } .parent-row td:first-child { border-left: 3px solid transparent; }
18
+ .panel { margin-top: 24px; border: 1px solid #e5e7eb; border-radius: 8px; background: white; overflow: hidden; } .panel-heading { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid #e5e7eb; } h2 { margin: 0; font-size: 16px; } .running { color: #14804a; font-size: 12px; font-weight: 750; } .stopped { color: #b33a30; font-size: 12px; font-weight: 750; }
19
+ table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding: 10px 14px; color: #7b899d; background: #fafbfd; font-size: 11px; text-align: left; text-transform: uppercase; letter-spacing: .04em; } td { padding: 13px 14px; border-top: 1px solid #edf0f7; } tr.parent-row td { background: #ffffff; } tr.nested-row td { background: #f3f7fd; } tr.selected td { background: #dce8ff !important; border-top-color: #9db9ed; } tr.selected td:first-child { border-left: 4px solid #4f46d8; } tr.selected .hierarchy-name { color: #173e91; font-weight: 700; } tbody tr { cursor: pointer; }
20
+ .hierarchy-hint { display: flex; align-items: center; gap: 10px; padding: 9px 16px; border-bottom: 1px solid #dbe6fa; color: #315da9; background: #f2f6ff; font-size: 11px; } .hierarchy-hint span { color: #637897; } .hierarchy-action { padding: 4px 7px; border: 1px solid #b9cbed; border-radius: 4px; color: #315da9; background: #fff; font-size: 10px; font-weight: 700; cursor: pointer; } .hierarchy-action:first-of-type { margin-left: auto; } .hierarchy-name { display: inline-flex; align-items: center; gap: 7px; min-height: 22px; } .collapse-toggle { display: inline-grid; width: 18px; height: 18px; place-items: center; padding: 0; border: 1px solid #9eb5df; border-radius: 4px; color: #315da9; background: #eaf1ff; font-size: 14px; line-height: 1; cursor: pointer; } .branch-marker { color: #5d82ca; font-size: 18px; font-weight: 400; } .kind-label { display: inline-flex; padding: 3px 5px; border-radius: 4px; color: #6c7890; background: #edf0f7; font-size: 9px; font-weight: 800; letter-spacing: .05em; } .nested-label { color: #315da9; background: #e5efff; } .nested-row td:first-child { border-left: 3px solid #8eaded; } .parent-row td:first-child { border-left: 3px solid transparent; }
21
21
  .step-icon { display: inline-grid; width: 20px; height: 20px; margin-right: 7px; place-items: center; border-radius: 50%; color: white; background: #18a15d; font-size: 11px; } .nested-row .step-icon { margin-left: 18px; } .nested-row .hierarchy-name { padding-left: 0 !important; } .step-icon.waiting { background: #efaa18; } .step-icon.skipped { color: #62738c; background: #edf1f6; } .step-icon.failed, .step-icon.cancelled { background: #c94b42; } .step-icon.pending { border: 2px solid #aab6c7; background: transparent; }
22
- .selected-label { display: inline-flex; margin-left: 8px; padding: 3px 5px; border-radius: 4px; color: #2458c4; background: #c4d7ff; font-size: 9px; font-weight: 800; letter-spacing: .05em; }
22
+ .selected-label { display: inline-flex; margin-left: 8px; padding: 3px 5px; border-radius: 4px; color: #3f37b8; background: #c4d7ff; font-size: 9px; font-weight: 800; letter-spacing: .05em; }
23
23
  .status { display: inline-flex; padding: 4px 8px; border-radius: 5px; font-size: 10px; font-weight: 800; letter-spacing: .03em; } .status.finished { color: #14804a; background: #e7f6ed; } .status.waiting { color: #98660b; background: #fff2d5; } .status.pending, .status.skipped { color: #62738c; background: #edf1f6; } .status.failed, .status.cancelled { color: #a33a32; background: #ffebe8; }
24
- .loop-row td { background: #f5f8fe; border-top: 1px solid #c8d7f0; border-bottom: 1px solid #dce6f6; } .loop-row td:first-child { border-left: 3px solid #668bd2; border-radius: 9px 0 0 0; } .loop-row td:last-child { border-right: 1px solid #c8d7f0; border-radius: 0 9px 0 0; } .loop-icon { color: #fff; background: #668bd2; font-size: 15px; } .loop-label { color: #315da9; background: #e7efff; } .loop-progress { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 8px; min-width: 220px; margin-bottom: 4px; color: #315da9; font-size: 10px; letter-spacing: .02em; } .loop-progress small { flex-basis: 100%; color: #71839c; font-size: 10px; } .loop-bar { width: 92px; height: 6px; overflow: hidden; border-radius: 99px; background: #dce6f6; } .loop-bar i { display: block; height: 100%; border-radius: inherit; background: #668bd2; transition: width .2s ease; } .loop-content td { border-top: 0; border-bottom: 0; background: #fbfdff; } .loop-content td:first-child { border-left: 3px solid #c8d7f0; } .loop-content td:last-child { border-right: 1px solid #c8d7f0; } .loop-end td { border-bottom: 1px solid #c8d7f0; } .loop-end td:first-child { border-radius: 0 0 0 9px; } .loop-end td:last-child { border-radius: 0 0 9px 0; }
24
+ .loop-row td { background: #f5f8fe; border-top: 1px solid #c8d7f0; border-bottom: 1px solid #dce6f6; } .loop-row td:first-child { border-left: 3px solid #668bd2; border-radius: 9px 0 0 0; } .loop-row td:last-child { border-right: 1px solid #c8d7f0; border-radius: 0 9px 0 0; } .loop-icon { color: #fff; background: #668bd2; font-size: 15px; } .loop-label { color: #315da9; background: #e7efff; } .loop-progress { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 8px; min-width: 220px; margin-bottom: 4px; color: #315da9; font-size: 10px; letter-spacing: .02em; } .loop-progress small { flex-basis: 100%; color: #71839c; font-size: 10px; } .loop-bar { width: 92px; height: 6px; overflow: hidden; border-radius: 99px; background: #dce6f6; } .loop-bar i { display: block; height: 100%; border-radius: inherit; background: #668bd2; transition: width .2s ease; } .loop-content td { border-top: 0; border-bottom: 0; background: #ffffff; } .loop-content td:first-child { border-left: 3px solid #c8d7f0; } .loop-content td:last-child { border-right: 1px solid #c8d7f0; } .loop-end td { border-bottom: 1px solid #c8d7f0; } .loop-end td:first-child { border-radius: 0 0 0 9px; } .loop-end td:last-child { border-radius: 0 0 9px 0; }
25
25
  .event-panel { margin-top: 18px; } .event-row td { padding: 9px 14px; font-size: 12px; } code { color: #294d9c; font-family: ui-monospace, monospace; font-size: 11px; }
26
- .inspector { padding: 22px 18px; border-left: 1px solid #dfe4ec; } .inspector h2 { font-size: 17px; } .selected-detail-name { margin: 6px 0 0; color: #2458c4; font-size: 13px; } .run-id { margin: 5px 0 20px; color: #7a899d; font-family: ui-monospace, monospace; font-size: 10px; } .inspector-section { padding: 17px 0; border-top: 1px solid #e6ebf2; } .inspector-section h3 { margin: 0 0 11px; font-size: 13px; }
26
+ .inspector { padding: 22px 18px; border-left: 1px solid #cbd1d8; } .inspector h2 { font-size: 17px; } .selected-detail-name { margin: 6px 0 0; color: #3f37b8; font-size: 13px; } .run-id { margin: 5px 0 20px; color: #7a899d; font-family: ui-monospace, monospace; font-size: 10px; } .inspector-section { padding: 17px 0; border-top: 1px solid #e5e7eb; } .inspector-section h3 { margin: 0 0 11px; font-size: 13px; }
27
27
  .selection-nav { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; } .selection-nav .button { padding: 5px 8px; font-size: 11px; }
28
- .parallel-event { color: #66758c; font-size: 10px; }
28
+ .parallel-event { color: #617089; font-size: 10px; }
29
29
  .event-filter { min-width: 120px; padding: 6px 8px; font-size: 11px; }
30
30
  .key-values { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #e0e6ef; border-radius: 6px; overflow: hidden; font-size: 12px; } .key-values span { padding: 9px 10px; border-bottom: 1px solid #e9edf3; } .key-values span:nth-child(odd) { color: #63738a; background: #fafbfd; } .key-values span:nth-last-child(-n+2) { border-bottom: 0; }
31
- .iteration-history { display: grid; gap: 7px; } .iteration-entry { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid #dce4ed; border-radius: 6px; background: #fbfdff; font-size: 11px; } .iteration-entry span { color: #637897; font-size: 10px; } .iteration-entry small { color: #71839c; line-height: 1.35; } .timing-details { display: grid; gap: 4px; margin-top: 8px; padding: 9px 10px; border: 1px solid #dce4ed; border-radius: 6px; color: #637897; background: #fbfdff; font-size: 10px; } .timing-details strong { color: #40516c; font-size: 11px; }
32
- .notice { padding: 12px; border-radius: 6px; color: #59708e; background: #f3f6fa; font-size: 12px; line-height: 1.5; } .draft-badge { position: fixed; right: 18px; bottom: 14px; padding: 7px 10px; border: 1px solid #e5c987; border-radius: 5px; color: #85600e; background: #fff7df; font-size: 11px; font-weight: 750; }
33
- .about-button { height: 30px; padding: 0 10px; border: 1px solid #cdd7e5; border-radius: 6px; background: white; color: #40516c; font-size: 12px; font-weight: 700; cursor: pointer; }
31
+ .iteration-history { display: grid; gap: 7px; } .iteration-entry { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid #e5e7eb; border-radius: 6px; background: #ffffff; font-size: 11px; } .iteration-entry span { color: #637897; font-size: 10px; } .iteration-entry small { color: #71839c; line-height: 1.35; } .timing-details { display: grid; gap: 4px; margin-top: 8px; padding: 9px 10px; border: 1px solid #e5e7eb; border-radius: 6px; color: #637897; background: #ffffff; font-size: 10px; } .timing-details strong { color: #34435b; font-size: 11px; }
32
+ .notice { padding: 12px; border-radius: 6px; color: #59708e; background: #edf0f7; font-size: 12px; line-height: 1.5; } .draft-badge { position: fixed; right: 18px; bottom: 14px; padding: 7px 10px; border: 1px solid #e5c987; border-radius: 5px; color: #85600e; background: #fff7df; font-size: 11px; font-weight: 750; }
33
+ .about-button { height: 30px; padding: 0 10px; border: 1px solid #cfd5dd; border-radius: 6px; background: white; color: #34435b; font-size: 12px; font-weight: 700; cursor: pointer; }
34
34
  .about-backdrop { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; background: rgb(7 12 24 / 48%); }
35
- .about-dialog { position: relative; width: min(360px, calc(100vw - 40px)); padding: 28px; border: 1px solid #dce4ed; border-radius: 12px; background: white; color: #40516c; box-shadow: 0 20px 60px rgb(0 0 0 / 24%); text-align: center; }
36
- .about-dialog .runner-logo { margin: 0 auto 14px; }.about-dialog h2 { margin: 0 0 8px; color: #182234; }.about-dialog p { margin: 0 0 8px; color: #66758c; line-height: 1.5; }.about-dialog small { color: #8794a8; }.about-dialog footer { margin-top: 24px; color: #7a899d; font-size: 11px; }.about-close { position: absolute; top: 10px; right: 12px; border: 0; background: transparent; color: #7a899d; font-size: 22px; cursor: pointer; }
35
+ .about-dialog { position: relative; width: min(360px, calc(100vw - 40px)); padding: 28px; border: 1px solid #e5e7eb; border-radius: 12px; background: white; color: #34435b; box-shadow: 0 20px 60px rgb(0 0 0 / 24%); text-align: center; }
36
+ .about-dialog .runner-logo { margin: 0 auto 14px; }.about-dialog h2 { margin: 0 0 8px; color: #182234; }.about-dialog p { margin: 0 0 8px; color: #617089; line-height: 1.5; }.about-dialog small { color: #8794a8; }.about-dialog footer { margin-top: 24px; color: #7a899d; font-size: 11px; }.about-close { position: absolute; top: 10px; right: 12px; border: 0; background: transparent; color: #7a899d; font-size: 22px; cursor: pointer; }
37
37
  .error-notice { padding: 12px; border: 1px solid #f0c5c1; border-radius: 6px; color: #9d332b; background: #fff1ef; font-size: 12px; line-height: 1.5; } .dry-run-issues { display: grid; gap: 8px; } .dry-run-issues .error-notice { font-size: 11px; } .dry-run-issues small { display: block; margin-top: 5px; color: inherit; opacity: .8; }
38
38
  .validation-panel { display: flex; gap: 11px; align-items: flex-start; margin-top: 18px; padding: 13px 16px; border: 1px solid; border-radius: 8px; font-size: 12px; } .validation-panel strong { display: block; } .validation-panel small { display: block; margin-top: 3px; color: inherit; opacity: .8; } .validation-pass { border-color: #b9dfca; color: #176d41; background: #effaf3; } .validation-failed { display: grid; gap: 11px; border-color: #edc2bd; color: #963b33; background: #fff5f3; } .validation-heading { display: flex; gap: 11px; align-items: flex-start; } .validation-icon, .issue-icon { display: inline-grid; flex: 0 0 auto; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: white; background: #1b9a5b; font-size: 14px; font-weight: 800; } .validation-failed .validation-icon, .issue-icon { background: #c94b42; } .validation-issues { display: grid; gap: 6px; padding-left: 33px; } .validation-issue { display: flex; gap: 8px; align-items: flex-start; padding: 8px 9px; border: 1px solid #f0d1cd; border-radius: 5px; background: rgba(255,255,255,.55); } .validation-issue .issue-icon { width: 16px; height: 16px; font-size: 12px; } .validation-issue span, .validation-issue small { display: block; } .validation-issue strong { font-size: 10px; letter-spacing: .04em; } .validation-issue span { margin-top: 2px; font-size: 11px; } .validation-issue small { margin-top: 3px; opacity: .75; }
39
39
 
40
- :root[data-theme='dark'] .runner-header, :root[data-theme='dark'] .runner-nav, :root[data-theme='dark'] .inspector, :root[data-theme='dark'] .panel, :root[data-theme='dark'] .key-values, :root[data-theme='dark'] .button, :root[data-theme='dark'] select, :root[data-theme='dark'] .input-field input { border-color: #334155; background: #182235; color: #e6edf7; }
41
- :root[data-theme='dark'] .runner-workspace { background: #111827; } :root[data-theme='dark'] .runner-header { border-color: #334155; } :root[data-theme='dark'] .runner-nav { border-color: #334155; } :root[data-theme='dark'] .inspector { border-color: #334155; }
42
- :root[data-theme='dark'] .description, :root[data-theme='dark'] .nav-item, :root[data-theme='dark'] .run-id, :root[data-theme='dark'] .input-hint, :root[data-theme='dark'] .theme-picker, :root[data-theme='dark'] label { color: #a8b6ca; }
43
- :root[data-theme='dark'] .nav-item.active { color: #b8d0ff; background: #243b68; } :root[data-theme='dark'] .package-card, :root[data-theme='dark'] .notice { border-color: #334155; background: #202c40; color: #b9c8dc; }
44
- :root[data-theme='dark'] th { color: #9aaac0; background: #1c293d; } :root[data-theme='dark'] td { border-color: #2b3a50; } :root[data-theme='dark'] tr.parent-row td { background: #182235; } :root[data-theme='dark'] tr.nested-row td { background: #202c40; } :root[data-theme='dark'] tr.selected td { background: #243b68 !important; border-top-color: #496da8; } :root[data-theme='dark'] tr.selected .hierarchy-name { color: #d4e2ff; } :root[data-theme='dark'] .selected-detail-name { color: #a9c5ff; }
45
- :root[data-theme='dark'] .hierarchy-hint { border-color: #314d80; color: #b8d0ff; background: #1b3159; } :root[data-theme='dark'] .hierarchy-hint span { color: #b0bfd5; } :root[data-theme='dark'] .hierarchy-action { border-color: #496da8; color: #c5d9ff; background: #202c40; } :root[data-theme='dark'] .collapse-toggle { border-color: #496da8; color: #c5d9ff; background: #294b80; } :root[data-theme='dark'] .kind-label { color: #b5c2d4; background: #334155; } :root[data-theme='dark'] .nested-label { color: #c5d9ff; background: #294b80; } :root[data-theme='dark'] .nested-row td:first-child { border-color: #6f96e5; } :root[data-theme='dark'] .branch-marker { color: #9ab9ff; }
46
- :root[data-theme='dark'] .panel-heading, :root[data-theme='dark'] .inspector-section { border-color: #334155; } :root[data-theme='dark'] .key-values span { border-color: #334155; } :root[data-theme='dark'] .key-values span:nth-child(odd) { background: #1c293d; color: #a8b6ca; }
47
- :root[data-theme='dark'] .iteration-entry { border-color: #334155; background: #1c293d; } :root[data-theme='dark'] .iteration-entry span, :root[data-theme='dark'] .iteration-entry small { color: #a8b6ca; }
48
- :root[data-theme='dark'] .status.pending { color: #b5c2d4; background: #334155; } :root[data-theme='dark'] .file-button { border-color: #334155; background: #182235; color: #e6edf7; } :root[data-theme='dark'] .error-notice { border-color: #7f3434; background: #3a2025; color: #ffb4ad; }
49
- :root[data-theme='dark'] body { background: #111827; } :root[data-theme='dark'] .runner-header strong, :root[data-theme='dark'] h1, :root[data-theme='dark'] h2, :root[data-theme='dark'] h3, :root[data-theme='dark'] td, :root[data-theme='dark'] .package-card strong { color: #e6edf7; }
50
- :root[data-theme='dark'] .alpha-label, :root[data-theme='dark'] .nav-label, :root[data-theme='dark'] .eyebrow, :root[data-theme='dark'] .package-card small { color: #9aaac0; } :root[data-theme='dark'] code { color: #a9c7ff; }
51
- :root[data-theme='dark'] .step-icon.pending { border-color: #718096; } :root[data-theme='dark'] .status.finished { color: #8ee0b1; background: #173b2d; } :root[data-theme='dark'] .status.waiting { color: #ffd27a; background: #4a3511; } :root[data-theme='dark'] .status.skipped { color: #b5c2d4; background: #334155; } :root[data-theme='dark'] .status.failed, :root[data-theme='dark'] .status.cancelled { color: #ffaaa2; background: #4a2428; }
52
- :root[data-theme='dark'] .running { color: #8ee0b1; } :root[data-theme='dark'] .stopped, :root[data-theme='dark'] .load-error { color: #ffaaa2; } :root[data-theme='dark'] .draft-badge { border-color: #806a2e; color: #f4d477; background: #322b17; }
53
- :root[data-theme='dark'] .loop-row td { background: #1c2b47; border-color: #405b8b; } :root[data-theme='dark'] .loop-row td:first-child { border-color: #79a1ff; } :root[data-theme='dark'] .loop-icon { color: #fff; background: #668bd2; } :root[data-theme='dark'] .loop-label { color: #d2e0ff; background: #294b80; } :root[data-theme='dark'] .loop-progress { color: #c5d9ff; } :root[data-theme='dark'] .loop-progress small { color: #b0bfd5; } :root[data-theme='dark'] .loop-bar { background: #334155; } :root[data-theme='dark'] .loop-bar i { background: #79a1ff; } :root[data-theme='dark'] .loop-content td { border-color: #405b8b; background: #151f31; } :root[data-theme='dark'] .loop-content td:first-child { border-color: #405b8b; } :root[data-theme='dark'] .loop-end td { border-color: #405b8b; }
54
- :root[data-theme='dark'] .button:hover, :root[data-theme='dark'] .file-button:hover { border-color: #6289d9; background: #22324d; } :root[data-theme='dark'] .button.primary { border-color: #4d7fe0; background: #3f70d2; color: #fff; } :root[data-theme='dark'] .button.stop { color: #ffaaa2; }
55
- :root[data-theme='dark'] .button.dry-run { border-color: #496da8; color: #c5d9ff; background: #202c40; }
56
- :root[data-theme='dark'] .about-button, :root[data-theme='dark'] .about-dialog { border-color: #334155; background: #182235; color: #e6edf7; } :root[data-theme='dark'] .about-dialog h2 { color: #e6edf7; } :root[data-theme='dark'] .about-dialog p, :root[data-theme='dark'] .about-dialog footer { color: #a8b6ca; }
57
- :root[data-theme='dark'] .validation-pass { border-color: #2d7653; color: #9be5b9; background: #173b2d; } :root[data-theme='dark'] .validation-failed { border-color: #7f3434; color: #ffb4ad; background: #3a2025; } :root[data-theme='dark'] .validation-issue { border-color: #6c3b3c; background: rgba(24, 20, 28, .45); }
58
40
  .event-search { min-width: 180px; }
59
41
  .empty-state { margin: 0; padding: 18px; color: var(--muted-text); }
60
42
  .history-panel { margin-top: 16px; }
@@ -64,13 +46,13 @@ table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding:
64
46
  .history-retention select { min-width: 92px; height: 30px; font-size: 11px; }
65
47
  .history-delete { margin-left: 6px; color: #a33a32; }
66
48
  .validation-issue[data-step-id] { cursor: pointer; }
67
- .branch-path { display: grid; gap: 6px; margin-top: 8px; padding: 9px 10px; border: 1px solid #dce4ed; border-radius: 6px; background: #fbfdff; font-size: 11px; }
49
+ .branch-path { display: grid; gap: 6px; margin-top: 8px; padding: 9px 10px; border: 1px solid #e5e7eb; border-radius: 6px; background: #ffffff; font-size: 11px; }
68
50
  .branch-path-row { display: grid; grid-template-columns: auto 1fr auto; gap: 7px; align-items: center; }
69
51
  .branch-path-row small { color: #71839c; font-size: 10px; }
70
52
  .parallel-details { color: #637897; }
71
53
  .parallel-details > span { font-size: 10px; }
72
- .result-summary { display: grid; gap: 4px; margin-top: 8px; padding: 9px 10px; border: 1px solid #dce4ed; border-radius: 6px; color: #637897; background: #fbfdff; font-size: 10px; }
73
- .result-summary strong { color: #40516c; font-size: 11px; }
54
+ .result-summary { display: grid; gap: 4px; margin-top: 8px; padding: 9px 10px; border: 1px solid #e5e7eb; border-radius: 6px; color: #637897; background: #ffffff; font-size: 10px; }
55
+ .result-summary strong { color: #34435b; font-size: 11px; }
74
56
  .demo-entry { padding: 7px 10px; border: 1px solid var(--border); border-radius: 5px; background: var(--panel); color: var(--accent); font-size: 12px; font-weight: 650; text-decoration: none; }
75
57
 
76
58
  .breakpoint-toggle { border: 0; background: transparent; color: var(--muted, #718096); cursor: pointer; margin-left: .4rem; padding: 0 .2rem; }
@@ -87,7 +69,21 @@ table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding:
87
69
  .runner-context-menu button:hover { background: #edf3ff; color: #173e91; }
88
70
  .breakpoint-marker { display: inline-grid; width: 22px; height: 22px; place-items: center; color: #fff; background: #b93645; clip-path: polygon(30% 0, 70% 0, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0 70%, 0 30%); filter: drop-shadow(0 1px 1px rgba(62, 20, 27, .25)); font-family: Arial, sans-serif; font-size: 4.5px; font-weight: 900; letter-spacing: .06em; line-height: 1; }
89
71
 
90
- .button.resume-highlight { border-color: #3569d4; background: #3569d4; color: #fff; box-shadow: 0 0 0 3px rgba(53, 105, 212, .18); }
72
+ .button.resume-highlight { border-color: #4f46d8; background: #4f46d8; color: #fff; box-shadow: 0 0 0 3px rgba(53, 105, 212, .18); }
73
+
74
+ /* Match Studio's compact toolbar rhythm and quiet menu controls. */
75
+ .runner-header { border-color: var(--runner-line); background: var(--runner-surface); }
76
+ .runner-brand { align-items: baseline; gap: 6px; }
77
+ .runner-brand-mark { color: var(--runner-blue); font-size: 13px; letter-spacing: .04em; }
78
+ .runner-brand-product { color: var(--runner-ink); font-size: 13px; font-weight: 500; }
79
+ .alpha-label { padding-left: 2px; color: var(--runner-faint); font-family: ui-monospace, monospace; font-size: 9.5px; }
80
+ .runner-header .about-button,
81
+ .runner-header .demo-entry { height: 25px; padding: 0 9px; border: 0; border-radius: 4px; background: transparent; color: var(--runner-ink-2); font-size: 12px; font-weight: 400; }
82
+ .runner-header .about-button:hover,
83
+ .runner-header .demo-entry:hover { background: var(--runner-surface-3); color: var(--runner-ink); }
84
+ .runner-header .demo-entry { display: inline-flex; align-items: center; text-decoration: none; }
85
+ .theme-picker { gap: 7px; color: var(--runner-ink-2); font-size: 12px; font-weight: 700; white-space: nowrap; }
86
+ .theme-picker select { min-width: 82px; height: 30px; padding: 0 8px; border-color: var(--runner-line); border-radius: 6px; background: var(--runner-surface); color: var(--runner-ink); font: inherit; font-weight: 400; }
91
87
 
92
88
  /* Keep Runner aligned with the shared QAICK Studio design tokens. These are
93
89
  Runner-scoped names so the integrated stylesheet does not overwrite Studio's
@@ -104,7 +100,9 @@ table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding:
104
100
  --runner-surface: #fff;
105
101
  --runner-surface-2: #f7f8fc;
106
102
  --runner-surface-3: #edf0f7;
107
- --runner-pane: #eef0f2;
103
+ --runner-canvas: #fff;
104
+ --runner-pane-explorer: #eef0f2;
105
+ --runner-pane-properties: #f4f5f6;
108
106
  --runner-heading: #e1e4e8;
109
107
  --runner-divider: #cbd1d8;
110
108
  --runner-line: #e5e7eb;
@@ -129,7 +127,9 @@ table { width: 100%; border-collapse: collapse; font-size: 13px; } th { padding:
129
127
  --runner-surface: #171b24;
130
128
  --runner-surface-2: #1d2230;
131
129
  --runner-surface-3: #282f3e;
132
- --runner-pane: #1b202a;
130
+ --runner-canvas: #11151d;
131
+ --runner-pane-explorer: #1b202a;
132
+ --runner-pane-properties: #1d222c;
133
133
  --runner-heading: #252c37;
134
134
  --runner-divider: #3b4555;
135
135
  --runner-line: #303949;
@@ -184,10 +184,11 @@ td,
184
184
  .theme-picker,
185
185
  label { color: var(--runner-muted); }
186
186
  .runner-workspace { background: var(--runner-surface-2); }
187
- .runner-nav { border-color: var(--runner-divider); }
188
- .inspector { border-color: var(--runner-divider); }
187
+ .runner-workspace { background: var(--runner-canvas); }
188
+ .runner-nav { border-color: var(--runner-divider); background: var(--runner-pane-explorer); }
189
+ .inspector { border-color: var(--runner-divider); background: var(--runner-pane-properties); }
189
190
  .nav-item { color: var(--runner-muted); }
190
- .nav-item.active { color: var(--runner-blue-strong); background: var(--runner-blue-soft); }
191
+ .nav-item.active { color: var(--runner-ink); background: var(--runner-surface-3); font-weight: 700; }
191
192
  .package-card,
192
193
  .notice { border-color: var(--runner-line); background: var(--runner-surface-3); color: var(--runner-muted); }
193
194
  .button:hover,
@@ -246,3 +247,35 @@ code { color: var(--runner-blue-strong); }
246
247
  :root[data-theme='dark'] .package-card,
247
248
  :root[data-theme='dark'] .notice,
248
249
  :root[data-theme='dark'] .kind-label { background: var(--runner-surface-3); color: var(--runner-ink-2); }
250
+
251
+ .runner-demo { min-height: 100vh; padding: 24px 32px 34px; box-sizing: border-box; background: #edf2f8; color: #243654; }
252
+ .runner-demo-title { display: flex; align-items: center; justify-content: space-between; max-width: 1420px; margin: 0 auto 24px; }
253
+ .runner-demo-title div { display: flex; align-items: baseline; gap: 14px; }
254
+ .runner-demo-title strong { color: #2563eb; font-size: 21px; }
255
+ .runner-demo-title span { color: #75849b; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
256
+ .runner-demo-title a { color: #3d6095; font-size: 12px; text-decoration: none; }
257
+ .runner-demo-content { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 28px; max-width: 1420px; margin: auto; }
258
+ .runner-demo-copy { padding: 12px 0; }
259
+ .runner-demo-copy > small { color: #4b79bd; font-size: 10px; font-weight: 700; letter-spacing: .1em; }
260
+ .runner-demo-copy h1 { margin: 14px 0 8px; color: #243654; font-size: 27px; font-weight: 650; }
261
+ .runner-demo-copy h2 { margin: 0 0 12px; color: #4d6587; font-size: 14px; font-weight: 550; }
262
+ .runner-demo-copy p { margin: 0 0 24px; color: #6b7b94; font-size: 13px; line-height: 1.6; }
263
+ .runner-demo-copy nav { display: grid; gap: 4px; }
264
+ .runner-demo-copy nav button { display: grid; grid-template-columns: 28px 1fr; gap: 8px; padding: 9px 8px; border: 0; border-radius: 5px; background: transparent; color: #6b7b94; text-align: left; cursor: pointer; font-size: 12px; }
265
+ .runner-demo-copy nav button span { color: #a4b0c2; font-family: monospace; }
266
+ .runner-demo-copy nav button.active { background: #dce9fc; color: #245bc5; font-weight: 650; }
267
+ .runner-demo-copy nav button.active span { color: #245bc5; }
268
+ .runner-demo-stage { min-width: 0; }
269
+ .runner-demo-screen { position: relative; overflow: hidden; min-height: 590px; border: 1px solid #cbd6e5; border-radius: 8px; background: #f8fafc; box-shadow: 0 12px 28px rgb(38 67 106 / 10%); }
270
+ .runner-demo-top { display: flex; align-items: center; gap: 15px; height: 42px; padding: 0 14px; border-bottom: 1px solid #dce3ef; background: #fff; color: #74839a; font-size: 10px; }
271
+ .runner-demo-top b { color: #2563eb; font-size: 13px; }.runner-demo-top span:nth-child(2) { color: #96a3b7; }.runner-demo-menu { flex: 1; color: #52637e; }.runner-demo-top button { padding: 6px 9px; border: 1px solid #cbd6e5; border-radius: 4px; background: #fff; color: #30558f; font-size: 10px; }
272
+ .runner-demo-body { display: grid; grid-template-columns: 40px 190px minmax(0, 1fr) 220px; min-height: 510px; }
273
+ .runner-demo-nav { display: grid; align-content: start; gap: 18px; padding-top: 18px; border-right: 1px solid #dce3ef; background: #f1f4f8; }.runner-demo-nav b { padding: 7px 3px; color: #7d8ba1; font-size: 9px; text-align: center; writing-mode: vertical-rl; transform: rotate(180deg); }.runner-demo-nav b:first-child { color: #2563eb; background: #e5efff; }
274
+ .runner-demo-left, .runner-demo-right { padding: 17px 13px; border-right: 1px solid #dce3ef; background: #fbfcfe; color: #52637e; font-size: 11px; }.runner-demo-right { border-right: 0; border-left: 1px solid #dce3ef; }.runner-demo-left small, .runner-demo-right small { display: block; margin: 0 0 7px; color: #8491a7; font-size: 9px; letter-spacing: .08em; }.runner-demo-left strong { display: block; margin-bottom: 14px; overflow-wrap: anywhere; color: #2d4264; font-size: 11px; }.runner-demo-left div { margin: 5px -6px; padding: 7px 6px; }.runner-demo-left div.is-selected { background: #e6efff; color: #255bc4; }.runner-demo-left button { display: block; margin: 0 0 18px; padding: 5px 7px; border: 1px solid #cbd6e5; border-radius: 4px; background: #fff; color: #315b96; font-size: 10px; }
275
+ .runner-demo-main { padding: 20px 18px; background: #f6f8fb; }.runner-demo-heading { display: flex; align-items: baseline; gap: 9px; margin-bottom: 20px; }.runner-demo-heading small { color: #6e87aa; font-size: 9px; letter-spacing: .08em; }.runner-demo-heading b { color: #263b5c; font-size: 16px; }.runner-demo-heading span { margin-left: auto; color: #29805a; font-size: 10px; }.runner-demo-rows { display: grid; gap: 9px; }.runner-demo-row { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 7px; padding: 12px 13px; border: 1px solid #d7e0ec; border-radius: 6px; background: #fff; }.runner-demo-row i { color: #319266; font-style: normal; }.runner-demo-row b { color: #314969; font-size: 12px; }.runner-demo-row em { color: #8491a7; font-size: 10px; font-style: normal; }.runner-demo-loop { padding: 9px; border: 1px solid #9db9de; border-radius: 7px; background: #eaf2ff; }.runner-demo-loop header { display: flex; align-items: center; gap: 8px; padding: 4px; color: #315b96; font-size: 11px; }.runner-demo-loop header i { color: #2563eb; font-style: normal; }.runner-demo-loop header span { margin-left: auto; font-size: 9px; }.runner-demo-row.nested { margin-top: 6px; padding: 8px 10px; border-color: #cbdcf2; }.runner-demo-row.nested.alt { background: #f5f9ff; }.runner-demo-bar { height: 4px; margin: 9px 2px 2px; border-radius: 4px; background: #cbdcf2; }.runner-demo-bar span { display: block; height: 100%; border-radius: inherit; background: #4c8ed4; }
276
+ .runner-demo-right > b { display: block; margin-bottom: 20px; color: #344b6c; font-size: 13px; }.runner-demo-right > strong { display: block; margin: 4px 0 20px; color: #288158; font-size: 18px; }.demo-output, .demo-history, .demo-event, .demo-filter { margin: 8px 0; padding: 8px; border: 1px solid #dce3ef; border-radius: 4px; background: #fff; color: #52637e; font-size: 10px; }.demo-error { margin: 8px 0; color: #288158; font-size: 13px; }.demo-filter { color: #70829d; }.demo-event { font-family: monospace; }.demo-history { color: #315b96; }
277
+ .runner-demo-bottom { display: flex; justify-content: space-between; padding: 10px 14px; border-top: 1px solid #dce3ef; background: #f1f4f8; color: #70809a; font-size: 10px; }.runner-demo-bottom b { color: #52637e; }
278
+ .runner-demo-callouts { position: absolute; inset: 0; pointer-events: none; }.runner-demo-balloon { position: absolute; width: max-content; max-width: 190px; padding: 7px 10px; border: 1px solid #7da8df; border-radius: 999px; background: rgb(255 255 255 / 88%); color: #4d6587; box-shadow: 0 3px 10px rgb(38 67 106 / 10%); font-size: 10px; }.runner-demo-balloon strong { display: block; color: #245bc5; font-size: 10px; }.runner-demo-balloon span { display: none; }.demo-callout-left { top: 85px; left: 48px; }.demo-callout-canvas { top: 92px; left: 52%; }.demo-callout-right { top: 118px; right: 12px; }.demo-callout-package, .demo-callout-configure { top: 130px; left: 45px; }.demo-callout-preflight { top: 82px; right: 25px; }.demo-callout-hierarchy { top: 215px; left: 48%; }.demo-callout-events { bottom: 80px; right: 18px; }.demo-callout-results { top: 105px; right: 18px; }
279
+ .runner-demo-controls { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 12px; color: #718097; font-size: 11px; }.runner-demo-controls button { padding: 7px 12px; border: 1px solid #cbd6e5; border-radius: 5px; background: #fff; color: #30558f; cursor: pointer; }.runner-demo-controls button:disabled { cursor: default; opacity: .45; }
280
+ @media (max-width: 1050px) { .runner-demo-content { grid-template-columns: 210px minmax(0, 1fr); }.runner-demo-body { grid-template-columns: 34px 160px minmax(0, 1fr); }.runner-demo-right { display: none; } }
281
+ @media (max-width: 720px) { .runner-demo { padding: 16px; }.runner-demo-content { display: block; }.runner-demo-copy { margin-bottom: 20px; }.runner-demo-copy nav { display: flex; overflow-x: auto; }.runner-demo-copy nav button { min-width: 145px; }.runner-demo-menu { display: none; }.runner-demo-body { grid-template-columns: 34px 150px minmax(0, 1fr); }.runner-demo-left { padding: 12px 8px; }.runner-demo-main { padding: 12px 8px; }.runner-demo-row { grid-template-columns: 18px 1fr; }.runner-demo-row em { grid-column: 2; }.runner-demo-balloon { display: none; } }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@qaick/runner",
3
3
  "description": "Reusable QAick Runner module and standalone execution application.",
4
- "version": "0.2.0-alpha.8",
4
+ "version": "0.28.0-alpha.5",
5
5
  "type": "module",
6
6
  "files": [
7
7
  "package-dist",
@@ -38,6 +38,8 @@
38
38
  "pack:tarball": "npm run build:package && npm pack",
39
39
  "publish:alpha": "npm run check:package && npm publish --tag alpha",
40
40
  "package:standalone": "npm run build && node scripts/package-standalone.mjs",
41
+ "electron:build": "tsc -p tsconfig.electron.json && node scripts/copy-electron-preload.mjs",
42
+ "desktop:run": "npm run build && npm run electron:build && electron electron-dist/electron/main.js",
41
43
  "smoke": "node scripts/smoke-check.mjs",
42
44
  "smoke:deployment": "node scripts/smoke-check.mjs --deployment",
43
45
  "lint": "oxlint",
@@ -52,10 +54,10 @@
52
54
  "typecheck": "tsc -b"
53
55
  },
54
56
  "dependencies": {
55
- "@qaick/contract": "0.2.10",
56
- "@qaick/executor": "0.1.0-alpha.1",
57
- "@qaick/http-executor": "0.1.0-alpha.1",
58
- "@qaick/runtime": "0.1.0-alpha.2",
57
+ "@qaick/contract": "0.2.11",
58
+ "@qaick/executor": "0.1.0-alpha.2",
59
+ "@qaick/http-executor": "^0.1.0-alpha.9",
60
+ "@qaick/runtime": "0.1.0-alpha.6",
59
61
  "zustand": "^5.0.15"
60
62
  },
61
63
  "peerDependencies": {
@@ -63,18 +65,19 @@
63
65
  "react-dom": ">=19.0.0"
64
66
  },
65
67
  "devDependencies": {
66
- "@vitejs/plugin-react": "^6.1.1",
67
68
  "@testing-library/dom": "^10.4.2",
68
69
  "@testing-library/react": "^16.3.3",
69
70
  "@types/node": "^24.13.3",
70
71
  "@types/react": "^19.2.18",
71
72
  "@types/react-dom": "^19.2.7",
73
+ "@vitejs/plugin-react": "^6.1.1",
72
74
  "jsdom": "^30.0.1",
73
75
  "oxlint": "^1.81.0",
74
76
  "react": "^19.2.8",
75
77
  "react-dom": "^19.2.8",
76
78
  "typescript": "~6.0.2",
77
79
  "vite": "^8.3.0",
78
- "vitest": "^5.0.0"
80
+ "vitest": "^5.0.0",
81
+ "electron": "^44.4.5"
79
82
  }
80
83
  }