Skip to content

Commit 68fddf6

Browse files
pomberpomber
authored
Merge pull request #75 from code-hike/spring-prop
Add spring config
2 parents 18f1a5e + 9e3cd0e commit 68fddf6

File tree

19 files changed

+317
-3292
lines changed

19 files changed

+317
-3292
lines changed

‎packages/classer/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@
2020
},
2121
"homepage": "https://codehike.org",
2222
"repository": "code-hike/codehike",
23+
"publishConfig": {
24+
"access": "public"
25+
},
2326
"author": "Rodrigo Pombo",
2427
"license": "MIT",
2528
"funding": {

‎packages/code-diff/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,9 @@
2222
},
2323
"homepage": "https://codehike.org",
2424
"repository": "code-hike/codehike",
25+
"publishConfig": {
26+
"access": "public"
27+
},
2528
"author": "Rodrigo Pombo",
2629
"license": "MIT",
2730
"funding": {

‎packages/mini-browser/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,9 @@
3434
],
3535
"homepage": "https://codehike.org",
3636
"repository": "code-hike/codehike",
37+
"publishConfig": {
38+
"access": "public"
39+
},
3740
"author": "Rodrigo Pombo",
3841
"license": "MIT",
3942
"funding": {

‎packages/mini-editor/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,9 @@
3131
],
3232
"homepage": "https://codehike.org",
3333
"repository": "code-hike/codehike",
34+
"publishConfig": {
35+
"access": "public"
36+
},
3437
"author": "Rodrigo Pombo",
3538
"license": "MIT",
3639
"funding": {

‎packages/mini-editor/src/mini-editor-spring.tsx

Lines changed: 38 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,15 @@ import { EditorFrameProps } from "./editor-frame"
77

88
export { MiniEditor, MiniEditorProps }
99

10+
type SpringConfig = Parameters<typeof useSpring>[1]
11+
12+
const defaultSpring = {
13+
stiffness: 120,
14+
damping: 24,
15+
mass: 0.2,
16+
decimals: 3,
17+
}
18+
1019
type SingleFileEditorProps = {
1120
code: string
1221
lang: string
@@ -15,17 +24,20 @@ type SingleFileEditorProps = {
1524
terminal?: string
1625
frameProps?: Partial<EditorFrameProps>
1726
codeProps?: Partial<CodeProps>
27+
springConfig?: SpringConfig
1828
}
1929
type SinglePanelEditorProps = {
2030
files: StepFile[]
2131
active: string
2232
terminal?: string
2333
frameProps?: Partial<EditorFrameProps>
2434
codeProps?: Partial<CodeProps>
35+
springConfig?: SpringConfig
2536
}
2637
type TwoPanelEditorProps = EditorStep & {
2738
frameProps?: Partial<EditorFrameProps>
2839
codeProps?: Partial<CodeProps>
40+
springConfig?: SpringConfig
2941
}
3042
type MiniEditorProps =
3143
| SingleFileEditorProps
@@ -48,8 +60,8 @@ function SingleFileEditor({
4860
focus,
4961
filename = "",
5062
terminal,
51-
frameProps,
52-
codeProps,
63+
springConfig,
64+
...props
5365
}: SingleFileEditorProps) {
5466
const step = React.useMemo(() => {
5567
const step: EditorStep = {
@@ -64,24 +76,26 @@ function SingleFileEditor({
6476
return step
6577
}, [code, lang, focus, filename, terminal])
6678

67-
const { prev, next, t } = useStepSpring(step)
79+
const { prev, next, t } = useStepSpring(
80+
step,
81+
springConfig
82+
)
6883
return (
6984
<MiniEditorTween
70-
frameProps={frameProps}
7185
t={t}
7286
backward={false}
7387
prev={prev}
7488
next={next}
75-
codeProps={codeProps}
89+
{...props}
7690
/>
7791
)
7892
}
7993
function SinglePanelEditor({
8094
files,
8195
active,
8296
terminal,
83-
frameProps,
84-
codeProps,
97+
springConfig,
98+
...props
8599
}: SinglePanelEditorProps) {
86100
const step = React.useMemo(() => {
87101
const tabs = files.map(file => file.name)
@@ -97,25 +111,27 @@ function SinglePanelEditor({
97111
return step
98112
}, [files, active, terminal])
99113

100-
const { prev, next, t } = useStepSpring(step)
114+
const { prev, next, t } = useStepSpring(
115+
step,
116+
springConfig
117+
)
101118
return (
102119
<MiniEditorTween
103-
frameProps={frameProps}
104120
t={t}
105121
backward={false}
106122
prev={prev}
107123
next={next}
108-
codeProps={codeProps}
124+
{...props}
109125
/>
110126
)
111127
}
112128
function TwoPanelEditor({
113-
frameProps,
114-
codeProps,
115129
northPanel,
116130
southPanel,
117131
files,
118132
terminal,
133+
springConfig,
134+
...props
119135
}: TwoPanelEditorProps) {
120136
const step = React.useMemo(() => {
121137
return {
@@ -126,20 +142,25 @@ function TwoPanelEditor({
126142
}
127143
}, [northPanel, southPanel, files, terminal])
128144

129-
const { prev, next, t } = useStepSpring(step)
145+
const { prev, next, t } = useStepSpring(
146+
step,
147+
springConfig
148+
)
130149
return (
131150
<MiniEditorTween
132-
frameProps={frameProps}
133151
t={t}
134152
backward={false}
135153
prev={prev}
136154
next={next}
137-
codeProps={codeProps}
155+
{...props}
138156
/>
139157
)
140158
}
141159

142-
function useStepSpring(step: EditorStep) {
160+
function useStepSpring(
161+
step: EditorStep,
162+
springConfig: SpringConfig = defaultSpring
163+
) {
143164
const [{ target, prev, next }, setState] = React.useState(
144165
{
145166
target: 0,
@@ -158,12 +179,7 @@ function useStepSpring(step: EditorStep) {
158179
}
159180
}, [step])
160181

161-
const [progress] = useSpring(target, {
162-
stiffness: 256,
163-
damping: 24,
164-
mass: 0.2,
165-
decimals: 3,
166-
})
182+
const [progress] = useSpring(target, springConfig)
167183

168184
const t = progress % 1
169185

‎packages/mini-frame/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,9 @@
2424
],
2525
"homepage": "https://codehike.org",
2626
"repository": "code-hike/codehike",
27+
"publishConfig": {
28+
"access": "public"
29+
},
2730
"author": "Rodrigo Pombo",
2831
"license": "MIT",
2932
"funding": {

‎packages/mini-terminal/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,9 @@
2626
],
2727
"homepage": "https://codehike.org",
2828
"repository": "code-hike/codehike",
29+
"publishConfig": {
30+
"access": "public"
31+
},
2932
"author": "Rodrigo Pombo",
3033
"license": "MIT",
3134
"funding": {

‎packages/player/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@
2323
],
2424
"homepage": "https://codehike.org",
2525
"repository": "code-hike/codehike",
26+
"publishConfig": {
27+
"access": "public"
28+
},
2629
"author": "Rodrigo Pombo",
2730
"license": "MIT",
2831
"funding": {

‎packages/scroller/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,9 @@
2323
],
2424
"homepage": "https://codehike.org",
2525
"repository": "code-hike/codehike",
26+
"publishConfig": {
27+
"access": "public"
28+
},
2629
"author": "Rodrigo Pombo",
2730
"license": "MIT",
2831
"funding": {

‎packages/scrollycoding/package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
"@code-hike/mini-browser": "^0.3.0-next.0",
2323
"@code-hike/mini-editor": "^0.3.0-next.0",
2424
"@code-hike/scroller": "^0.3.0-next.0",
25-
"@codesandbox/sandpack-react": "^0.0.1",
25+
"@codesandbox/sandpack-react": "0.1.2",
2626
"object-hash": "^2.1.1",
2727
"server-side-media-queries-for-react": "^0.0.5"
2828
},
@@ -34,6 +34,9 @@
3434
],
3535
"homepage": "https://codehike.org",
3636
"repository": "code-hike/codehike",
37+
"publishConfig": {
38+
"access": "public"
39+
},
3740
"author": "Rodrigo Pombo",
3841
"license": "MIT",
3942
"funding": {

0 commit comments

Comments
 (0)