@mittwald/flow-react-components 0.1.0-alpha.328 → 0.1.0-alpha.329
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/CHANGELOG.md +13 -0
- package/dist/css/CodeBlock.css +1 -1
- package/dist/js/CodeBlock.js +12 -10
- package/dist/js/all.css +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,19 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [0.1.0-alpha.329](https://github.com/mittwald/flow/compare/0.1.0-alpha.328...0.1.0-alpha.329) (2024-11-06)
|
|
7
|
+
|
|
8
|
+
### Bug Fixes
|
|
9
|
+
|
|
10
|
+
- **CodeBlock:** Placement of the Copy Button
|
|
11
|
+
([#947](https://github.com/mittwald/flow/issues/947))
|
|
12
|
+
([fa9e494](https://github.com/mittwald/flow/commit/fa9e49416a767f8de402b0c9f9c81b1a2ef4dfc2))
|
|
13
|
+
|
|
14
|
+
# Change Log
|
|
15
|
+
|
|
16
|
+
All notable changes to this project will be documented in this file. See
|
|
17
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
18
|
+
|
|
6
19
|
# [0.1.0-alpha.328](https://github.com/mittwald/flow/compare/0.1.0-alpha.327...0.1.0-alpha.328) (2024-11-05)
|
|
7
20
|
|
|
8
21
|
**Note:** Version bump only for package @mittwald/flow-react-components
|
package/dist/css/CodeBlock.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.flow--code-block{display:flex;align-items:flex-start;justify-content:space-between;border-radius:var(--code--corner-radius);
|
|
1
|
+
.flow--code-block{display:flex;align-items:flex-start;justify-content:space-between;border-radius:var(--code--corner-radius);column-gap:var(--code--spacing);font-size:var(--code--font-size);font-family:FiraCode,"monospace";max-width:100%}.flow--code-block>pre{overflow-x:auto;padding:var(--code--padding)}.flow--code-block>pre>code{text-shadow:none}.flow--code-block .flow--code-block--copy-button{margin-top:var(--code--padding);margin-right:var(--code--padding)}.flow--code-block:where(.flow--code-block--default){color:var(--code--default-content-color);background-color:var(--code--default-background-color)}.flow--code-block:where(.flow--code-block--default) .hljs-subst{color:var(--code--default-content-color)}.flow--code-block:where(.flow--code-block--default) .hljs-addition{color:var(--code--default-syntax-color-addition)}.flow--code-block:where(.flow--code-block--default) .hljs-built_in{color:var(--code--default-syntax-color-built-in)}.flow--code-block:where(.flow--code-block--default) .hljs-bullet{color:var(--code--default-syntax-color-bullet)}.flow--code-block:where(.flow--code-block--default) .hljs-code{color:var(--code--default-syntax-color-code)}.flow--code-block:where(.flow--code-block--default) .hljs-comment{color:var(--code--default-syntax-color-comment)}.flow--code-block:where(.flow--code-block--default) .hljs-deletion{color:var(--code--default-syntax-color-deletion)}.flow--code-block:where(.flow--code-block--default) .hljs-link{color:var(--code--default-syntax-color-link)}.flow--code-block:where(.flow--code-block--default) .hljs-literal{color:var(--code--default-syntax-color-literal)}.flow--code-block:where(.flow--code-block--default) .hljs-meta{color:var(--code--default-syntax-color-meta)}.flow--code-block:where(.flow--code-block--default) .hljs-meta-string{color:var(--code--default-syntax-color-meta-string)}.flow--code-block:where(.flow--code-block--default) .hljs-number{color:var(--code--default-syntax-color-number)}.flow--code-block:where(.flow--code-block--default) .hljs-quote{color:var(--code--default-syntax-color-quote)}.flow--code-block:where(.flow--code-block--default) .hljs-regexp{color:var(--code--default-syntax-color-regexp)}.flow--code-block:where(.flow--code-block--default) .hljs-section{color:var(--code--default-syntax-color-section)}.flow--code-block:where(.flow--code-block--default) .hljs-selector-attr{color:var(--code--default-syntax-color-selector-attr)}.flow--code-block:where(.flow--code-block--default) .hljs-selector-class{color:var(--code--default-syntax-color-selector-class)}.flow--code-block:where(.flow--code-block--default) .hljs-selector-id{color:var(--code--default-syntax-color-selector-id)}.flow--code-block:where(.flow--code-block--default) .hljs-selector-pseudo{color:var(--code--default-syntax-color-selector-pseudo)}.flow--code-block:where(.flow--code-block--default) .hljs-string{color:var(--code--default-syntax-color-string)}.flow--code-block:where(.flow--code-block--default) .hljs-symbol{color:var(--code--default-syntax-color-symbol)}.flow--code-block:where(.flow--code-block--default) .hljs-template-tag{color:var(--code--default-syntax-color-template-tag)}.flow--code-block:where(.flow--code-block--default) .hljs-template-variable{color:var(--code--default-syntax-color-template-variable)}.flow--code-block:where(.flow--code-block--default) .hljs-title{color:var(--code--default-syntax-color-title)}.flow--code-block:where(.flow--code-block--default) .hljs-type{color:var(--code--default-syntax-color-type)}.flow--code-block:where(.flow--code-block--default) .hljs-variable{color:var(--code--default-syntax-color-variable)}.flow--code-block:where(.flow--code-block--light){color:var(--code--light-content-color);background-color:var(--code--light-background-color)}.flow--code-block:where(.flow--code-block--light) .hljs-subst{color:var(--code--light-content-color)}.flow--code-block:where(.flow--code-block--light) .hljs-addition{color:var(--code--light-syntax-color-addition)}.flow--code-block:where(.flow--code-block--light) .hljs-built_in{color:var(--code--light-syntax-color-built-in)}.flow--code-block:where(.flow--code-block--light) .hljs-bullet{color:var(--code--light-syntax-color-bullet)}.flow--code-block:where(.flow--code-block--light) .hljs-code{color:var(--code--light-syntax-color-code)}.flow--code-block:where(.flow--code-block--light) .hljs-comment{color:var(--code--light-syntax-color-comment)}.flow--code-block:where(.flow--code-block--light) .hljs-deletion{color:var(--code--light-syntax-color-deletion)}.flow--code-block:where(.flow--code-block--light) .hljs-link{color:var(--code--light-syntax-color-link)}.flow--code-block:where(.flow--code-block--light) .hljs-literal{color:var(--code--light-syntax-color-literal)}.flow--code-block:where(.flow--code-block--light) .hljs-meta{color:var(--code--light-syntax-color-meta)}.flow--code-block:where(.flow--code-block--light) .hljs-meta-string{color:var(--code--light-syntax-color-meta-string)}.flow--code-block:where(.flow--code-block--light) .hljs-number{color:var(--code--light-syntax-color-number)}.flow--code-block:where(.flow--code-block--light) .hljs-quote{color:var(--code--light-syntax-color-quote)}.flow--code-block:where(.flow--code-block--light) .hljs-regexp{color:var(--code--light-syntax-color-regexp)}.flow--code-block:where(.flow--code-block--light) .hljs-section{color:var(--code--light-syntax-color-section)}.flow--code-block:where(.flow--code-block--light) .hljs-selector-attr{color:var(--code--light-syntax-color-selector-attr)}.flow--code-block:where(.flow--code-block--light) .hljs-selector-class{color:var(--code--light-syntax-color-selector-class)}.flow--code-block:where(.flow--code-block--light) .hljs-selector-id{color:var(--code--light-syntax-color-selector-id)}.flow--code-block:where(.flow--code-block--light) .hljs-selector-pseudo{color:var(--code--light-syntax-color-selector-pseudo)}.flow--code-block:where(.flow--code-block--light) .hljs-string{color:var(--code--light-syntax-color-string)}.flow--code-block:where(.flow--code-block--light) .hljs-symbol{color:var(--code--light-syntax-color-symbol)}.flow--code-block:where(.flow--code-block--light) .hljs-template-tag{color:var(--code--light-syntax-color-template-tag)}.flow--code-block:where(.flow--code-block--light) .hljs-template-variable{color:var(--code--light-syntax-color-template-variable)}.flow--code-block:where(.flow--code-block--light) .hljs-title{color:var(--code--light-syntax-color-title)}.flow--code-block:where(.flow--code-block--light) .hljs-type{color:var(--code--light-syntax-color-type)}.flow--code-block:where(.flow--code-block--light) .hljs-variable{color:var(--code--light-syntax-color-variable)}.flow--code-block:where(.flow--code-block--dark){color:var(--code--dark-content-color);background-color:var(--code--dark-background-color)}.flow--code-block:where(.flow--code-block--dark) .hljs-subst{color:var(--code--dark-content-color)}.flow--code-block:where(.flow--code-block--dark) .hljs-addition{color:var(--code--dark-syntax-color-addition)}.flow--code-block:where(.flow--code-block--dark) .hljs-built_in{color:var(--code--dark-syntax-color-built-in)}.flow--code-block:where(.flow--code-block--dark) .hljs-bullet{color:var(--code--dark-syntax-color-bullet)}.flow--code-block:where(.flow--code-block--dark) .hljs-code{color:var(--code--dark-syntax-color-code)}.flow--code-block:where(.flow--code-block--dark) .hljs-comment{color:var(--code--dark-syntax-color-comment)}.flow--code-block:where(.flow--code-block--dark) .hljs-deletion{color:var(--code--dark-syntax-color-deletion)}.flow--code-block:where(.flow--code-block--dark) .hljs-link{color:var(--code--dark-syntax-color-link)}.flow--code-block:where(.flow--code-block--dark) .hljs-literal{color:var(--code--dark-syntax-color-literal)}.flow--code-block:where(.flow--code-block--dark) .hljs-meta{color:var(--code--dark-syntax-color-meta)}.flow--code-block:where(.flow--code-block--dark) .hljs-meta-string{color:var(--code--dark-syntax-color-meta-string)}.flow--code-block:where(.flow--code-block--dark) .hljs-number{color:var(--code--dark-syntax-color-number)}.flow--code-block:where(.flow--code-block--dark) .hljs-quote{color:var(--code--dark-syntax-color-quote)}.flow--code-block:where(.flow--code-block--dark) .hljs-regexp{color:var(--code--dark-syntax-color-regexp)}.flow--code-block:where(.flow--code-block--dark) .hljs-section{color:var(--code--dark-syntax-color-section)}.flow--code-block:where(.flow--code-block--dark) .hljs-selector-attr{color:var(--code--dark-syntax-color-selector-attr)}.flow--code-block:where(.flow--code-block--dark) .hljs-selector-class{color:var(--code--dark-syntax-color-selector-class)}.flow--code-block:where(.flow--code-block--dark) .hljs-selector-id{color:var(--code--dark-syntax-color-selector-id)}.flow--code-block:where(.flow--code-block--dark) .hljs-selector-pseudo{color:var(--code--dark-syntax-color-selector-pseudo)}.flow--code-block:where(.flow--code-block--dark) .hljs-string{color:var(--code--dark-syntax-color-string)}.flow--code-block:where(.flow--code-block--dark) .hljs-symbol{color:var(--code--dark-syntax-color-symbol)}.flow--code-block:where(.flow--code-block--dark) .hljs-template-tag{color:var(--code--dark-syntax-color-template-tag)}.flow--code-block:where(.flow--code-block--dark) .hljs-template-variable{color:var(--code--dark-syntax-color-template-variable)}.flow--code-block:where(.flow--code-block--dark) .hljs-title{color:var(--code--dark-syntax-color-title)}.flow--code-block:where(.flow--code-block--dark) .hljs-type{color:var(--code--dark-syntax-color-type)}.flow--code-block:where(.flow--code-block--dark) .hljs-variable{color:var(--code--dark-syntax-color-variable)}
|
package/dist/js/CodeBlock.js
CHANGED
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
"use client"
|
|
2
2
|
/* */
|
|
3
|
-
import
|
|
3
|
+
import t from "react";
|
|
4
4
|
import d from "react-syntax-highlighter";
|
|
5
5
|
import m from "clsx";
|
|
6
6
|
import { C as f } from "./CopyButton-e2EjDU95.js";
|
|
7
|
-
const i = "flow--code-block", k = "flow--code-block--
|
|
7
|
+
const i = "flow--code-block", k = "flow--code-block--copy-button", u = "flow--code-block--light", p = "flow--code-block--dark", e = {
|
|
8
8
|
codeBlock: i,
|
|
9
|
+
copyButton: k,
|
|
9
10
|
default: "flow--code-block--default",
|
|
10
|
-
light:
|
|
11
|
-
dark:
|
|
12
|
-
}, h = (
|
|
13
|
-
const { code:
|
|
14
|
-
return /* @__PURE__ */
|
|
11
|
+
light: u,
|
|
12
|
+
dark: p
|
|
13
|
+
}, h = (l) => {
|
|
14
|
+
const { code: c, className: a, copyable: n, color: o = "default", ...s } = l, r = m(e.codeBlock, e[o], a);
|
|
15
|
+
return /* @__PURE__ */ t.createElement("div", { className: r }, /* @__PURE__ */ t.createElement(
|
|
15
16
|
d,
|
|
16
17
|
{
|
|
17
18
|
customStyle: {
|
|
@@ -22,13 +23,14 @@ const i = "flow--code-block", k = "flow--code-block--light", u = "flow--code-blo
|
|
|
22
23
|
useInlineStyles: !1,
|
|
23
24
|
...s
|
|
24
25
|
},
|
|
25
|
-
|
|
26
|
-
),
|
|
26
|
+
c
|
|
27
|
+
), n && /* @__PURE__ */ t.createElement(
|
|
27
28
|
f,
|
|
28
29
|
{
|
|
30
|
+
className: e.copyButton,
|
|
29
31
|
size: "s",
|
|
30
32
|
color: o === "default" ? "dark" : o,
|
|
31
|
-
text:
|
|
33
|
+
text: c
|
|
32
34
|
}
|
|
33
35
|
));
|
|
34
36
|
};
|