@activecollab/components 2.0.385 → 2.0.386
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.
- package/dist/cjs/components/StepSequence/StepSequence.js +13 -22
- package/dist/cjs/components/StepSequence/StepSequence.js.map +1 -1
- package/dist/cjs/components/StepSequence/Styles.js +2 -1
- package/dist/cjs/components/StepSequence/Styles.js.map +1 -1
- package/dist/cjs/presentation/shared/SourceCodeSection.js +32 -3
- package/dist/cjs/presentation/shared/SourceCodeSection.js.map +1 -1
- package/dist/esm/components/StepSequence/StepSequence.d.ts +15 -4
- package/dist/esm/components/StepSequence/StepSequence.d.ts.map +1 -1
- package/dist/esm/components/StepSequence/StepSequence.js +14 -20
- package/dist/esm/components/StepSequence/StepSequence.js.map +1 -1
- package/dist/esm/components/StepSequence/Styles.d.ts.map +1 -1
- package/dist/esm/components/StepSequence/Styles.js +3 -2
- package/dist/esm/components/StepSequence/Styles.js.map +1 -1
- package/dist/esm/presentation/shared/SourceCodeSection.d.ts.map +1 -1
- package/dist/esm/presentation/shared/SourceCodeSection.js +31 -2
- package/dist/esm/presentation/shared/SourceCodeSection.js.map +1 -1
- package/dist/index.js +15 -22
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import React, { Fragment } from "react";
|
|
2
2
|
import classnames from "classnames";
|
|
3
3
|
import { StyledStepSequence, StyledStepSequenceTrigger } from "./Styles";
|
|
4
|
-
import { CheckIcon, CloseIcon } from "../Icons";
|
|
5
4
|
import { Tooltip } from "../Tooltip";
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
|
|
6
|
+
/** Token colour role a step and its connector are painted with */
|
|
7
|
+
|
|
8
|
+
/** Ring style of a step: filled, toned outline or dashed outline */
|
|
9
|
+
|
|
8
10
|
export const StepSequence = _ref => {
|
|
9
11
|
let steps = _ref.steps,
|
|
10
12
|
onClick = _ref.onClick,
|
|
@@ -14,29 +16,21 @@ export const StepSequence = _ref => {
|
|
|
14
16
|
return null;
|
|
15
17
|
}
|
|
16
18
|
const content = steps.map((step, index) => {
|
|
17
|
-
var _step$key, _step$tooltip;
|
|
19
|
+
var _step$key, _step$connectorTone, _step$tooltip, _step$icon;
|
|
18
20
|
return /*#__PURE__*/React.createElement(Fragment, {
|
|
19
21
|
key: (_step$key = step.key) != null ? _step$key : "step-" + index
|
|
20
|
-
}, /*#__PURE__*/React.createElement(
|
|
22
|
+
}, index > 0 && /*#__PURE__*/React.createElement("span", {
|
|
23
|
+
className: classnames("c-step-sequence__connector", "c-step-sequence__connector--" + ((_step$connectorTone = step.connectorTone) != null ? _step$connectorTone : step.tone))
|
|
24
|
+
}), /*#__PURE__*/React.createElement(Tooltip, {
|
|
21
25
|
title: (_step$tooltip = step.tooltip) != null ? _step$tooltip : "",
|
|
22
26
|
disable: !step.tooltip
|
|
23
27
|
}, /*#__PURE__*/React.createElement("span", {
|
|
24
|
-
className: classnames("c-step-sequence__step", "c-step-sequence__step--" + step.
|
|
25
|
-
|
|
26
|
-
fill: "#fff",
|
|
27
|
-
width: 14,
|
|
28
|
-
height: 14
|
|
29
|
-
}), step.state === "failed" && /*#__PURE__*/React.createElement(CloseIcon, {
|
|
30
|
-
fill: "#fff",
|
|
31
|
-
width: 12,
|
|
32
|
-
height: 12
|
|
33
|
-
}), (step.state === "progress" || step.state === "todo") && /*#__PURE__*/React.createElement("span", {
|
|
34
|
-
className: classnames("c-step-sequence__dot", "c-step-sequence__dot--" + step.state)
|
|
35
|
-
}))), index < steps.length - 1 && /*#__PURE__*/React.createElement("span", {
|
|
36
|
-
className: classnames("c-step-sequence__connector", {
|
|
37
|
-
"c-step-sequence__connector--on": isReached(steps[index + 1].state)
|
|
28
|
+
className: classnames("c-step-sequence__step", "c-step-sequence__step--" + step.tone, "c-step-sequence__step--" + step.fill, {
|
|
29
|
+
"c-step-sequence__step--pulse": step.pulse
|
|
38
30
|
})
|
|
39
|
-
})
|
|
31
|
+
}, (_step$icon = step.icon) != null ? _step$icon : /*#__PURE__*/React.createElement("span", {
|
|
32
|
+
className: "c-step-sequence__dot"
|
|
33
|
+
}))));
|
|
40
34
|
});
|
|
41
35
|
if (onClick) {
|
|
42
36
|
return /*#__PURE__*/React.createElement(StyledStepSequenceTrigger, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepSequence.js","names":["React","Fragment","classnames","StyledStepSequence","StyledStepSequenceTrigger","
|
|
1
|
+
{"version":3,"file":"StepSequence.js","names":["React","Fragment","classnames","StyledStepSequence","StyledStepSequenceTrigger","Tooltip","StepSequence","_ref","steps","onClick","ariaLabel","className","length","content","map","step","index","_step$key","_step$connectorTone","_step$tooltip","_step$icon","createElement","key","connectorTone","tone","title","tooltip","disable","fill","pulse","icon","displayName"],"sources":["../../../../src/components/StepSequence/StepSequence.tsx"],"sourcesContent":["import React, {\n FC,\n Fragment,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport { StyledStepSequence, StyledStepSequenceTrigger } from \"./Styles\";\nimport { Tooltip } from \"../Tooltip\";\n\n/** Token colour role a step and its connector are painted with */\nexport type StepSequenceTone =\n | \"success\"\n | \"info\"\n | \"warning\"\n | \"danger\"\n | \"neutral\";\n\n/** Ring style of a step: filled, toned outline or dashed outline */\nexport type StepSequenceFill = \"solid\" | \"outline\" | \"dashed\";\n\nexport interface IStepSequenceStep {\n /** Colour role of the step, resolved to theme tokens */\n tone: StepSequenceTone;\n /** How the step's ring is drawn */\n fill: StepSequenceFill;\n /** Glyph rendered inside the step; a plain dot when omitted */\n icon?: ReactNode;\n /** Animates the glyph, marking a step as the one currently running */\n pulse?: boolean;\n /** Tooltip content shown when the step is hovered; no tooltip when omitted */\n tooltip?: ReactElement | string;\n /** Tone of the connector leading into this step; the step's own tone when omitted */\n connectorTone?: StepSequenceTone;\n /** Stable key for the step; falls back to the step index */\n key?: string;\n}\n\nexport interface IStepSequenceProps {\n /** Steps, rendered left to right and joined by connector lines */\n steps: IStepSequenceStep[];\n /** When provided the whole sequence is a single interactive button */\n onClick?: MouseEventHandler<HTMLButtonElement>;\n /** Accessible label, announced when the sequence is interactive */\n ariaLabel?: string;\n /** Class for the wrapper element */\n className?: string;\n}\n\nexport const StepSequence: FC<IStepSequenceProps> = ({\n steps,\n onClick,\n ariaLabel,\n className,\n}) => {\n if (!steps.length) {\n return null;\n }\n\n const content = steps.map((step, index) => (\n <Fragment key={step.key ?? `step-${index}`}>\n {index > 0 && (\n <span\n className={classnames(\n \"c-step-sequence__connector\",\n `c-step-sequence__connector--${step.connectorTone ?? step.tone}`\n )}\n />\n )}\n <Tooltip title={step.tooltip ?? \"\"} disable={!step.tooltip}>\n <span\n className={classnames(\n \"c-step-sequence__step\",\n `c-step-sequence__step--${step.tone}`,\n `c-step-sequence__step--${step.fill}`,\n { \"c-step-sequence__step--pulse\": step.pulse }\n )}\n >\n {step.icon ?? <span className=\"c-step-sequence__dot\" />}\n </span>\n </Tooltip>\n </Fragment>\n ));\n\n if (onClick) {\n return (\n <StyledStepSequenceTrigger\n className={classnames(\"c-step-sequence\", className)}\n onClick={onClick}\n aria-label={ariaLabel}\n >\n {content}\n </StyledStepSequenceTrigger>\n );\n }\n\n return (\n <StyledStepSequence\n className={classnames(\"c-step-sequence\", className)}\n aria-label={ariaLabel}\n >\n {content}\n </StyledStepSequence>\n );\n};\n\nStepSequence.displayName = \"StepSequence\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAEVC,QAAQ,QAIH,OAAO;AAEd,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,kBAAkB,EAAEC,yBAAyB,QAAQ,UAAU;AACxE,SAASC,OAAO,QAAQ,YAAY;;AAEpC;;AAQA;;AA+BA,OAAO,MAAMC,YAAoC,GAAGC,IAAA,IAK9C;EAAA,IAJJC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IACPC,SAAS,GAAAH,IAAA,CAATG,SAAS;IACTC,SAAS,GAAAJ,IAAA,CAATI,SAAS;EAET,IAAI,CAACH,KAAK,CAACI,MAAM,EAAE;IACjB,OAAO,IAAI;EACb;EAEA,MAAMC,OAAO,GAAGL,KAAK,CAACM,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK;IAAA,IAAAC,SAAA,EAAAC,mBAAA,EAAAC,aAAA,EAAAC,UAAA;IAAA,oBACpCpB,KAAA,CAAAqB,aAAA,CAACpB,QAAQ;MAACqB,GAAG,GAAAL,SAAA,GAAEF,IAAI,CAACO,GAAG,YAAAL,SAAA,aAAYD;IAAQ,GACxCA,KAAK,GAAG,CAAC,iBACRhB,KAAA,CAAAqB,aAAA;MACEV,SAAS,EAAET,UAAU,CACnB,4BAA4B,qCAAAgB,mBAAA,GACGH,IAAI,CAACQ,aAAa,YAAAL,mBAAA,GAAIH,IAAI,CAACS,IAAI,CAChE;IAAE,CACH,CACF,eACDxB,KAAA,CAAAqB,aAAA,CAAChB,OAAO;MAACoB,KAAK,GAAAN,aAAA,GAAEJ,IAAI,CAACW,OAAO,YAAAP,aAAA,GAAI,EAAG;MAACQ,OAAO,EAAE,CAACZ,IAAI,CAACW;IAAQ,gBACzD1B,KAAA,CAAAqB,aAAA;MACEV,SAAS,EAAET,UAAU,CACnB,uBAAuB,8BACGa,IAAI,CAACS,IAAI,8BACTT,IAAI,CAACa,IAAI,EACnC;QAAE,8BAA8B,EAAEb,IAAI,CAACc;MAAM,CAC/C;IAAE,IAAAT,UAAA,GAEDL,IAAI,CAACe,IAAI,YAAAV,UAAA,gBAAIpB,KAAA,CAAAqB,aAAA;MAAMV,SAAS,EAAC;IAAsB,CAAE,CAClD,CACC,CACD,CAAC;EAAA,CACZ,CAAC;EAEF,IAAIF,OAAO,EAAE;IACX,oBACET,KAAA,CAAAqB,aAAA,CAACjB,yBAAyB;MACxBO,SAAS,EAAET,UAAU,CAAC,iBAAiB,EAAES,SAAS,CAAE;MACpDF,OAAO,EAAEA,OAAQ;MACjB,cAAYC;IAAU,GAErBG,OACwB,CAAC;EAEhC;EAEA,oBACEb,KAAA,CAAAqB,aAAA,CAAClB,kBAAkB;IACjBQ,SAAS,EAAET,UAAU,CAAC,iBAAiB,EAAES,SAAS,CAAE;IACpD,cAAYD;EAAU,GAErBG,OACiB,CAAC;AAEzB,CAAC;AAEDP,YAAY,CAACyB,WAAW,GAAG,cAAc","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/StepSequence/Styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/StepSequence/Styles.ts"],"names":[],"mappings":"AA2GA,eAAO,MAAM,yBAAyB,uRAarC,CAAC;AAGF,eAAO,MAAM,kBAAkB,oEAE9B,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import styled, { css } from "styled-components";
|
|
1
|
+
import styled, { css, keyframes } from "styled-components";
|
|
2
2
|
import { BoxSizingStyle } from "../BoxSizingStyle";
|
|
3
3
|
import { Trigger } from "../Trigger";
|
|
4
|
-
const
|
|
4
|
+
const StepPulse = keyframes(["0%,100%{opacity:1;}50%{opacity:0.35;}"]);
|
|
5
|
+
const StepSequenceStyle = css(["", " display:inline-flex;align-items:center;padding:6px 8px;.c-step-sequence__step--success,.c-step-sequence__connector--success{--step-sequence-surface:var(--color-sucess-green);--step-sequence-ring:var(--color-sucess-green);--step-sequence-line:var(--color-sucess-green);}.c-step-sequence__step--info,.c-step-sequence__connector--info{--step-sequence-surface:var(--color-progress-blue);--step-sequence-ring:var(--color-progress-blue);--step-sequence-line:var(--color-progress-blue);}.c-step-sequence__step--warning,.c-step-sequence__connector--warning{--step-sequence-surface:var(--color-orange);--step-sequence-ring:var(--color-orange);--step-sequence-line:var(--color-orange);}.c-step-sequence__step--danger,.c-step-sequence__connector--danger{--step-sequence-surface:var(--red-alert);--step-sequence-ring:var(--red-alert);--step-sequence-line:var(--red-alert);}.c-step-sequence__step--neutral,.c-step-sequence__connector--neutral{--step-sequence-surface:var(--color-theme-500);--step-sequence-ring:var(--color-theme-400);--step-sequence-line:var(--color-theme-400);}.c-step-sequence__step{width:22px;height:22px;border-radius:50%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex-shrink:0;svg{display:block;}}.c-step-sequence__step--solid{background:var(--step-sequence-surface);}.c-step-sequence__step--outline{background:transparent;border:2px solid var(--step-sequence-ring);}.c-step-sequence__step--dashed{background:transparent;border:2px dashed var(--step-sequence-ring);}.c-step-sequence__step--pulse > *{animation:", " 1.4s ease-in-out infinite;}.c-step-sequence__dot{width:6px;height:6px;border-radius:50%;background:var(--step-sequence-surface);}.c-step-sequence__step--solid .c-step-sequence__dot{width:7px;height:7px;background:var(--only-white);}.c-step-sequence__connector{width:13px;height:2px;flex-shrink:0;background:var(--step-sequence-line);}"], BoxSizingStyle, StepPulse);
|
|
5
6
|
export const StyledStepSequenceTrigger = styled(Trigger).withConfig({
|
|
6
7
|
displayName: "Styles__StyledStepSequenceTrigger",
|
|
7
8
|
componentId: "sc-hp7ywn-0"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["styled","css","BoxSizingStyle","Trigger","StepSequenceStyle","StyledStepSequenceTrigger","withConfig","displayName","componentId","StyledStepSequence","div"],"sources":["../../../../src/components/StepSequence/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\n\nconst StepSequenceStyle = css`\n ${BoxSizingStyle}\n\n display: inline-flex;\n align-items: center;\n padding: 6px 8px;\n\n .c-step-sequence__step {\n width: 22px;\n height: 22px;\n border-radius: 50%;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["styled","css","keyframes","BoxSizingStyle","Trigger","StepPulse","StepSequenceStyle","StyledStepSequenceTrigger","withConfig","displayName","componentId","StyledStepSequence","div"],"sources":["../../../../src/components/StepSequence/Styles.ts"],"sourcesContent":["import styled, { css, keyframes } from \"styled-components\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\n\nconst StepPulse = keyframes`\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.35;\n }\n`;\n\nconst StepSequenceStyle = css`\n ${BoxSizingStyle}\n\n display: inline-flex;\n align-items: center;\n padding: 6px 8px;\n\n /* A tone resolves to three roles: the surface a solid step is filled with,\n the ring an outlined step is drawn with and the connector line. Only\n neutral needs them to differ — its line stays the faint, unreached grey. */\n .c-step-sequence__step--success,\n .c-step-sequence__connector--success {\n --step-sequence-surface: var(--color-sucess-green);\n --step-sequence-ring: var(--color-sucess-green);\n --step-sequence-line: var(--color-sucess-green);\n }\n .c-step-sequence__step--info,\n .c-step-sequence__connector--info {\n --step-sequence-surface: var(--color-progress-blue);\n --step-sequence-ring: var(--color-progress-blue);\n --step-sequence-line: var(--color-progress-blue);\n }\n .c-step-sequence__step--warning,\n .c-step-sequence__connector--warning {\n --step-sequence-surface: var(--color-orange);\n --step-sequence-ring: var(--color-orange);\n --step-sequence-line: var(--color-orange);\n }\n .c-step-sequence__step--danger,\n .c-step-sequence__connector--danger {\n --step-sequence-surface: var(--red-alert);\n --step-sequence-ring: var(--red-alert);\n --step-sequence-line: var(--red-alert);\n }\n .c-step-sequence__step--neutral,\n .c-step-sequence__connector--neutral {\n --step-sequence-surface: var(--color-theme-500);\n --step-sequence-ring: var(--color-theme-400);\n --step-sequence-line: var(--color-theme-400);\n }\n\n .c-step-sequence__step {\n width: 22px;\n height: 22px;\n border-radius: 50%;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n\n svg {\n display: block;\n }\n }\n\n .c-step-sequence__step--solid {\n background: var(--step-sequence-surface);\n }\n .c-step-sequence__step--outline {\n background: transparent;\n border: 2px solid var(--step-sequence-ring);\n }\n .c-step-sequence__step--dashed {\n background: transparent;\n border: 2px dashed var(--step-sequence-ring);\n }\n\n .c-step-sequence__step--pulse > * {\n animation: ${StepPulse} 1.4s ease-in-out infinite;\n }\n\n .c-step-sequence__dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--step-sequence-surface);\n }\n .c-step-sequence__step--solid .c-step-sequence__dot {\n width: 7px;\n height: 7px;\n background: var(--only-white);\n }\n\n .c-step-sequence__connector {\n width: 13px;\n height: 2px;\n flex-shrink: 0;\n background: var(--step-sequence-line);\n }\n`;\n\nexport const StyledStepSequenceTrigger = styled(Trigger)`\n ${StepSequenceStyle}\n\n border-radius: 8px;\n transition: background-color 200ms ease;\n\n &:hover {\n background-color: var(--color-theme-200);\n }\n &:focus-visible {\n outline: 2px solid var(--color-primary);\n outline-offset: 1px;\n }\n`;\nStyledStepSequenceTrigger.displayName = \"StyledStepSequenceTrigger\";\n\nexport const StyledStepSequence = styled.div`\n ${StepSequenceStyle}\n`;\nStyledStepSequence.displayName = \"StyledStepSequence\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,EAAEC,SAAS,QAAQ,mBAAmB;AAE1D,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,OAAO,QAAQ,YAAY;AAEpC,MAAMC,SAAS,GAAGH,SAAS,2CAQ1B;AAED,MAAMI,iBAAiB,GAAGL,GAAG,i3DACzBE,cAAc,EAoEDE,SAAS,CAqBzB;AAED,OAAO,MAAME,yBAAyB,GAAGP,MAAM,CAACI,OAAO,CAAC,CAAAI,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mMACpDJ,iBAAiB,CAYpB;AACDC,yBAAyB,CAACE,WAAW,GAAG,2BAA2B;AAEnE,OAAO,MAAME,kBAAkB,GAAGX,MAAM,CAACY,GAAG,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACxCJ,iBAAiB,CACpB;AACDK,kBAAkB,CAACF,WAAW,GAAG,oBAAoB","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SourceCodeSection.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/SourceCodeSection.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,WAAW,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;AA4G9E,KAAK,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;AAU1D,UAAU,KAAK;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,CAAC;IAClB,OAAO,EAAE,MAAM,EAAE,CAAC;CACnB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,WAAW,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mEAAmE;IACnE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;+CAC2C;IAC3C,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAC;CACtD;AAiDD,sEAAsE;AACtE,UAAU,UAAU;IAClB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,QAAQ,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,mEAAmE;IACnE,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,KAAK,UAAU,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE3D,kDAAkD;AAClD,UAAU,SAAS;IACjB,IAAI,EAAE,IAAI,GAAG,QAAQ,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qEAAqE;IACrE,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACjD,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,IAAI,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACjD,QAAQ,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,oEAAoE;IACpE,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,OAAO,EAAE,YAAY,EAAE,CAAC;CACzB;
|
|
1
|
+
{"version":3,"file":"SourceCodeSection.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/SourceCodeSection.tsx"],"names":[],"mappings":"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"}
|
|
@@ -783,15 +783,44 @@ const StyledSpineSequence = styled(StepSequence).withConfig({
|
|
|
783
783
|
displayName: "SourceCodeSection__StyledSpineSequence",
|
|
784
784
|
componentId: "sc-rvqbh5-0"
|
|
785
785
|
})(["align-self:center;flex-shrink:0;"]);
|
|
786
|
+
|
|
787
|
+
/** Stage state → the generic look `StepSequence` renders it with. */
|
|
788
|
+
const STAGE_STEP = {
|
|
789
|
+
done: {
|
|
790
|
+
tone: "success",
|
|
791
|
+
fill: "solid",
|
|
792
|
+
icon: /*#__PURE__*/React.createElement(CheckIcon, {
|
|
793
|
+
fill: "var(--only-white)",
|
|
794
|
+
width: 14,
|
|
795
|
+
height: 14
|
|
796
|
+
})
|
|
797
|
+
},
|
|
798
|
+
progress: {
|
|
799
|
+
tone: "info",
|
|
800
|
+
fill: "solid"
|
|
801
|
+
},
|
|
802
|
+
failed: {
|
|
803
|
+
tone: "danger",
|
|
804
|
+
fill: "solid",
|
|
805
|
+
icon: /*#__PURE__*/React.createElement(CloseIcon, {
|
|
806
|
+
fill: "var(--only-white)",
|
|
807
|
+
width: 12,
|
|
808
|
+
height: 12
|
|
809
|
+
})
|
|
810
|
+
},
|
|
811
|
+
todo: {
|
|
812
|
+
tone: "neutral",
|
|
813
|
+
fill: "outline"
|
|
814
|
+
}
|
|
815
|
+
};
|
|
786
816
|
const Spine = _ref3 => {
|
|
787
817
|
let items = _ref3.items,
|
|
788
818
|
onClick = _ref3.onClick;
|
|
789
819
|
return /*#__PURE__*/React.createElement(StyledSpineSequence, {
|
|
790
820
|
ariaLabel: "Open source code history",
|
|
791
821
|
onClick: onClick,
|
|
792
|
-
steps: items.map(s => ({
|
|
822
|
+
steps: items.map(s => _extends({}, STAGE_STEP[s.state], {
|
|
793
823
|
key: s.name,
|
|
794
|
-
state: s.state,
|
|
795
824
|
tooltip: /*#__PURE__*/React.createElement(StageTip, s)
|
|
796
825
|
}))
|
|
797
826
|
});
|