@khanacademy/perseus 7.2.0 → 7.2.1
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 +12 -0
- package/dist/es/index.css +61 -61
- package/dist/es/index.js +50 -119
- package/dist/es/index.js.map +1 -1
- package/dist/index.css +61 -61
- package/dist/index.js +39 -77
- package/dist/index.js.map +1 -1
- package/dist/widgets/plotter.d.ts +47 -13
- package/dist/widgets/plotter.js.flow +47 -13
- package/package.json +2 -2
- package/src/__tests__/item-renderer.test.tsx +1 -1
- package/src/components/__stories__/image-loader.stories.tsx +1 -0
- package/src/components/graph.tsx +1 -0
- package/src/components/icon.tsx +1 -0
- package/src/components/image-loader.tsx +1 -0
- package/src/components/number-input.tsx +1 -0
- package/src/components/sortable.tsx +1 -0
- package/src/components/svg-image.tsx +1 -0
- package/src/components/tex-buttons.tsx +1 -0
- package/src/components/text-input.tsx +1 -0
- package/src/components/text-list-editor.tsx +1 -0
- package/src/components/zoomable.tsx +1 -0
- package/src/hints-renderer.tsx +1 -0
- package/src/index.ts +1 -0
- package/src/item-renderer.tsx +1 -0
- package/src/mixins/provide-keypad.tsx +1 -0
- package/src/multi-items/multi-renderer.tsx +1 -0
- package/src/renderer.tsx +1 -0
- package/src/server-item-renderer.tsx +1 -0
- package/src/styles/articles.less +8 -4
- package/src/styles/perseus-renderer.less +47 -38
- package/src/styles/util.less +1 -1
- package/src/styles/variables.boostrap.less +158 -182
- package/src/styles/variables.less +20 -20
- package/src/styles/variables.shared.less +162 -168
- package/src/styles/widgets/categorizer.less +1 -2
- package/src/styles/widgets/expression.less +7 -4
- package/src/styles/widgets/grapher.less +2 -1
- package/src/styles/widgets/image.less +3 -2
- package/src/styles/widgets/interactive-graph.less +4 -2
- package/src/styles/widgets/label-image.less +2 -1
- package/src/styles/widgets/matrix.less +11 -7
- package/src/styles/widgets/orderer.less +2 -1
- package/src/styles/widgets/passage.less +2 -1
- package/src/styles/widgets/plotter.less +4 -3
- package/src/styles/widgets/radio.less +4 -2
- package/src/styles/widgets/sortable.less +1 -1
- package/src/styles/widgets/table.less +2 -1
- package/src/styles/widgets/transformer.less +2 -1
- package/src/styles/widgets/unit.less +2 -1
- package/src/widgets/__stories__/plotter.stories.tsx +27 -0
- package/src/widgets/__testdata__/plotter.testdata.ts +36 -0
- package/src/widgets/__tests__/__snapshots__/plotter.test.tsx.snap +863 -0
- package/src/widgets/__tests__/plotter.test.tsx +65 -0
- package/src/widgets/categorizer.tsx +1 -0
- package/src/widgets/graded-group-set.tsx +1 -0
- package/src/widgets/graded-group.tsx +1 -0
- package/src/widgets/interaction.tsx +1 -0
- package/src/widgets/label-image/marker.tsx +1 -0
- package/src/widgets/matcher.tsx +1 -0
- package/src/widgets/orderer.tsx +1 -0
- package/src/widgets/passage-ref-target.tsx +1 -0
- package/src/widgets/plotter.tsx +108 -98
- package/src/widgets/radio/base-radio.tsx +1 -0
- package/src/widgets/radio/choice-icon/choice-icon.tsx +1 -0
- package/src/widgets/sorter.tsx +1 -0
- package/src/widgets/transformer.tsx +1 -0
- package/tsconfig-build.tsbuildinfo +1 -1
package/dist/index.css
CHANGED
|
@@ -1666,9 +1666,9 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1666
1666
|
font-family: Courier, monospace;
|
|
1667
1667
|
}
|
|
1668
1668
|
.framework-perseus.perseus-article:not(.perseus-mobile) pre {
|
|
1669
|
-
background-color: #
|
|
1669
|
+
background-color: #f0f1f2;
|
|
1670
1670
|
border-radius: 4px;
|
|
1671
|
-
color: #
|
|
1671
|
+
color: #21242c;
|
|
1672
1672
|
font-size: 18px;
|
|
1673
1673
|
padding: 16px;
|
|
1674
1674
|
white-space: pre;
|
|
@@ -1679,29 +1679,29 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1679
1679
|
font-family: inherit;
|
|
1680
1680
|
font-size: 14px;
|
|
1681
1681
|
line-height: 1.25;
|
|
1682
|
-
color: #
|
|
1682
|
+
color: #21242c;
|
|
1683
1683
|
}
|
|
1684
1684
|
.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-option-content .perseus-renderer > .paragraph .paragraph {
|
|
1685
1685
|
font-family: inherit;
|
|
1686
1686
|
font-size: 14px;
|
|
1687
1687
|
line-height: 1.25;
|
|
1688
|
-
color: #
|
|
1688
|
+
color: #21242c;
|
|
1689
1689
|
}
|
|
1690
1690
|
.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-rationale-content .perseus-renderer > .paragraph {
|
|
1691
1691
|
font-family: inherit;
|
|
1692
1692
|
font-size: 14px;
|
|
1693
1693
|
line-height: 1.25;
|
|
1694
|
-
color: #
|
|
1694
|
+
color: #21242c;
|
|
1695
1695
|
}
|
|
1696
1696
|
.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph {
|
|
1697
1697
|
font-family: inherit;
|
|
1698
1698
|
font-size: 14px;
|
|
1699
1699
|
line-height: 1.25;
|
|
1700
|
-
color: #
|
|
1700
|
+
color: #21242c;
|
|
1701
1701
|
}
|
|
1702
1702
|
.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph .katex,
|
|
1703
1703
|
.framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph mjx-container {
|
|
1704
|
-
color: #
|
|
1704
|
+
color: #21242c;
|
|
1705
1705
|
}
|
|
1706
1706
|
.framework-perseus.perseus-mobile .perseus-article .perseus-widget-container.widget-float-left {
|
|
1707
1707
|
float: left;
|
|
@@ -1780,7 +1780,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1780
1780
|
font-family: inherit;
|
|
1781
1781
|
font-size: 24px;
|
|
1782
1782
|
line-height: 1.2;
|
|
1783
|
-
color: #
|
|
1783
|
+
color: #21242c;
|
|
1784
1784
|
}
|
|
1785
1785
|
.framework-perseus.perseus-mobile h2 {
|
|
1786
1786
|
font-weight: 700;
|
|
@@ -1788,7 +1788,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1788
1788
|
font-family: inherit;
|
|
1789
1789
|
font-size: 24px;
|
|
1790
1790
|
line-height: 1.2;
|
|
1791
|
-
color: #
|
|
1791
|
+
color: #3b3e40;
|
|
1792
1792
|
}
|
|
1793
1793
|
.framework-perseus.perseus-mobile h3,
|
|
1794
1794
|
.framework-perseus.perseus-mobile h4 {
|
|
@@ -1834,7 +1834,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1834
1834
|
font-size: 18px;
|
|
1835
1835
|
line-height: 1.4;
|
|
1836
1836
|
color: #626569;
|
|
1837
|
-
color: #
|
|
1837
|
+
color: #888d93;
|
|
1838
1838
|
}
|
|
1839
1839
|
.framework-perseus.perseus-mobile table {
|
|
1840
1840
|
font-family: inherit;
|
|
@@ -1846,44 +1846,44 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1846
1846
|
font-family: inherit;
|
|
1847
1847
|
font-size: 16px;
|
|
1848
1848
|
line-height: 1.25;
|
|
1849
|
-
color: #
|
|
1849
|
+
color: #21242c;
|
|
1850
1850
|
}
|
|
1851
1851
|
.framework-perseus.perseus-mobile .perseus-radio-option-content .perseus-renderer > .paragraph .paragraph {
|
|
1852
1852
|
font-family: inherit;
|
|
1853
1853
|
font-size: 16px;
|
|
1854
1854
|
line-height: 1.25;
|
|
1855
|
-
color: #
|
|
1855
|
+
color: #21242c;
|
|
1856
1856
|
}
|
|
1857
1857
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph {
|
|
1858
1858
|
font-family: inherit;
|
|
1859
1859
|
font-size: 16px;
|
|
1860
1860
|
line-height: 1.25;
|
|
1861
|
-
color: #
|
|
1861
|
+
color: #21242c;
|
|
1862
1862
|
}
|
|
1863
1863
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph {
|
|
1864
1864
|
font-family: inherit;
|
|
1865
1865
|
font-size: 16px;
|
|
1866
1866
|
line-height: 1.25;
|
|
1867
|
-
color: #
|
|
1867
|
+
color: #21242c;
|
|
1868
1868
|
}
|
|
1869
1869
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph .katex,
|
|
1870
1870
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph mjx-container {
|
|
1871
|
-
color: #
|
|
1871
|
+
color: #21242c;
|
|
1872
1872
|
}
|
|
1873
1873
|
.framework-perseus.perseus-mobile .perseus-image-caption .paragraph .paragraph {
|
|
1874
|
-
color: #
|
|
1874
|
+
color: #888d93;
|
|
1875
1875
|
font-size: 14px;
|
|
1876
1876
|
line-height: 1.3;
|
|
1877
1877
|
text-align: left;
|
|
1878
1878
|
}
|
|
1879
1879
|
.framework-perseus.perseus-mobile .perseus-image-caption.has-title .paragraph .paragraph strong:first-child {
|
|
1880
|
-
color: #
|
|
1880
|
+
color: #3b3e40;
|
|
1881
1881
|
}
|
|
1882
1882
|
.framework-perseus.perseus-mobile .katex,
|
|
1883
1883
|
.framework-perseus.perseus-mobile mjx-container {
|
|
1884
1884
|
font-size: 21px;
|
|
1885
1885
|
line-height: 1.2;
|
|
1886
|
-
color: #
|
|
1886
|
+
color: #21242c;
|
|
1887
1887
|
}
|
|
1888
1888
|
.framework-perseus.perseus-mobile .perseus-block-math .katex,
|
|
1889
1889
|
.framework-perseus.perseus-mobile .perseus-block-math mjx-container {
|
|
@@ -1899,9 +1899,9 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1899
1899
|
font-family: Courier, monospace;
|
|
1900
1900
|
}
|
|
1901
1901
|
.framework-perseus.perseus-mobile pre {
|
|
1902
|
-
background-color: #
|
|
1902
|
+
background-color: #f0f1f2;
|
|
1903
1903
|
border-radius: 4px;
|
|
1904
|
-
color: #
|
|
1904
|
+
color: #21242c;
|
|
1905
1905
|
font-size: 18px;
|
|
1906
1906
|
line-height: 1.6;
|
|
1907
1907
|
padding: 16px;
|
|
@@ -1923,7 +1923,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1923
1923
|
font-family: inherit;
|
|
1924
1924
|
font-size: 30px;
|
|
1925
1925
|
line-height: 1.1;
|
|
1926
|
-
color: #
|
|
1926
|
+
color: #21242c;
|
|
1927
1927
|
}
|
|
1928
1928
|
.framework-perseus.perseus-mobile h2 {
|
|
1929
1929
|
font-weight: 700;
|
|
@@ -1931,7 +1931,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1931
1931
|
font-family: inherit;
|
|
1932
1932
|
font-size: 30px;
|
|
1933
1933
|
line-height: 1.1;
|
|
1934
|
-
color: #
|
|
1934
|
+
color: #3b3e40;
|
|
1935
1935
|
}
|
|
1936
1936
|
.framework-perseus.perseus-mobile h3,
|
|
1937
1937
|
.framework-perseus.perseus-mobile h4 {
|
|
@@ -1977,7 +1977,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1977
1977
|
font-size: 20px;
|
|
1978
1978
|
line-height: 1.5;
|
|
1979
1979
|
color: #626569;
|
|
1980
|
-
color: #
|
|
1980
|
+
color: #888d93;
|
|
1981
1981
|
}
|
|
1982
1982
|
.framework-perseus.perseus-mobile table {
|
|
1983
1983
|
font-family: inherit;
|
|
@@ -1989,44 +1989,44 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
1989
1989
|
font-family: inherit;
|
|
1990
1990
|
font-size: 18px;
|
|
1991
1991
|
line-height: 1.25;
|
|
1992
|
-
color: #
|
|
1992
|
+
color: #21242c;
|
|
1993
1993
|
}
|
|
1994
1994
|
.framework-perseus.perseus-mobile .perseus-radio-option-content .perseus-renderer > .paragraph .paragraph {
|
|
1995
1995
|
font-family: inherit;
|
|
1996
1996
|
font-size: 18px;
|
|
1997
1997
|
line-height: 1.25;
|
|
1998
|
-
color: #
|
|
1998
|
+
color: #21242c;
|
|
1999
1999
|
}
|
|
2000
2000
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph {
|
|
2001
2001
|
font-family: inherit;
|
|
2002
2002
|
font-size: 18px;
|
|
2003
2003
|
line-height: 1.25;
|
|
2004
|
-
color: #
|
|
2004
|
+
color: #21242c;
|
|
2005
2005
|
}
|
|
2006
2006
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph {
|
|
2007
2007
|
font-family: inherit;
|
|
2008
2008
|
font-size: 18px;
|
|
2009
2009
|
line-height: 1.25;
|
|
2010
|
-
color: #
|
|
2010
|
+
color: #21242c;
|
|
2011
2011
|
}
|
|
2012
2012
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph .katex,
|
|
2013
2013
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph mjx-container {
|
|
2014
|
-
color: #
|
|
2014
|
+
color: #21242c;
|
|
2015
2015
|
}
|
|
2016
2016
|
.framework-perseus.perseus-mobile .perseus-image-caption .paragraph .paragraph {
|
|
2017
|
-
color: #
|
|
2017
|
+
color: #888d93;
|
|
2018
2018
|
font-size: 17px;
|
|
2019
2019
|
line-height: 1.4;
|
|
2020
2020
|
text-align: left;
|
|
2021
2021
|
}
|
|
2022
2022
|
.framework-perseus.perseus-mobile .perseus-image-caption.has-title .paragraph .paragraph strong:first-child {
|
|
2023
|
-
color: #
|
|
2023
|
+
color: #3b3e40;
|
|
2024
2024
|
}
|
|
2025
2025
|
.framework-perseus.perseus-mobile .katex,
|
|
2026
2026
|
.framework-perseus.perseus-mobile mjx-container {
|
|
2027
2027
|
font-size: 23px;
|
|
2028
2028
|
line-height: 1.3;
|
|
2029
|
-
color: #
|
|
2029
|
+
color: #21242c;
|
|
2030
2030
|
}
|
|
2031
2031
|
.framework-perseus.perseus-mobile .perseus-block-math .katex,
|
|
2032
2032
|
.framework-perseus.perseus-mobile .perseus-block-math mjx-container {
|
|
@@ -2042,9 +2042,9 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2042
2042
|
font-family: Courier, monospace;
|
|
2043
2043
|
}
|
|
2044
2044
|
.framework-perseus.perseus-mobile pre {
|
|
2045
|
-
background-color: #
|
|
2045
|
+
background-color: #f0f1f2;
|
|
2046
2046
|
border-radius: 4px;
|
|
2047
|
-
color: #
|
|
2047
|
+
color: #21242c;
|
|
2048
2048
|
font-size: 18px;
|
|
2049
2049
|
line-height: 1.6;
|
|
2050
2050
|
padding: 16px;
|
|
@@ -2066,7 +2066,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2066
2066
|
font-family: inherit;
|
|
2067
2067
|
font-size: 35px;
|
|
2068
2068
|
line-height: 1.1;
|
|
2069
|
-
color: #
|
|
2069
|
+
color: #21242c;
|
|
2070
2070
|
}
|
|
2071
2071
|
.framework-perseus.perseus-mobile h2 {
|
|
2072
2072
|
font-weight: 700;
|
|
@@ -2074,7 +2074,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2074
2074
|
font-family: inherit;
|
|
2075
2075
|
font-size: 35px;
|
|
2076
2076
|
line-height: 1.1;
|
|
2077
|
-
color: #
|
|
2077
|
+
color: #3b3e40;
|
|
2078
2078
|
}
|
|
2079
2079
|
.framework-perseus.perseus-mobile h3,
|
|
2080
2080
|
.framework-perseus.perseus-mobile h4 {
|
|
@@ -2120,7 +2120,7 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2120
2120
|
font-size: 22px;
|
|
2121
2121
|
line-height: 1.4;
|
|
2122
2122
|
color: #626569;
|
|
2123
|
-
color: #
|
|
2123
|
+
color: #888d93;
|
|
2124
2124
|
}
|
|
2125
2125
|
.framework-perseus.perseus-mobile table {
|
|
2126
2126
|
font-family: inherit;
|
|
@@ -2132,44 +2132,44 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2132
2132
|
font-family: inherit;
|
|
2133
2133
|
font-size: 20px;
|
|
2134
2134
|
line-height: 1.25;
|
|
2135
|
-
color: #
|
|
2135
|
+
color: #21242c;
|
|
2136
2136
|
}
|
|
2137
2137
|
.framework-perseus.perseus-mobile .perseus-radio-option-content .perseus-renderer > .paragraph .paragraph {
|
|
2138
2138
|
font-family: inherit;
|
|
2139
2139
|
font-size: 20px;
|
|
2140
2140
|
line-height: 1.25;
|
|
2141
|
-
color: #
|
|
2141
|
+
color: #21242c;
|
|
2142
2142
|
}
|
|
2143
2143
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph {
|
|
2144
2144
|
font-family: inherit;
|
|
2145
2145
|
font-size: 20px;
|
|
2146
2146
|
line-height: 1.25;
|
|
2147
|
-
color: #
|
|
2147
|
+
color: #21242c;
|
|
2148
2148
|
}
|
|
2149
2149
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph {
|
|
2150
2150
|
font-family: inherit;
|
|
2151
2151
|
font-size: 20px;
|
|
2152
2152
|
line-height: 1.25;
|
|
2153
|
-
color: #
|
|
2153
|
+
color: #21242c;
|
|
2154
2154
|
}
|
|
2155
2155
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph .katex,
|
|
2156
2156
|
.framework-perseus.perseus-mobile .perseus-radio-rationale-content .perseus-renderer > .paragraph .paragraph mjx-container {
|
|
2157
|
-
color: #
|
|
2157
|
+
color: #21242c;
|
|
2158
2158
|
}
|
|
2159
2159
|
.framework-perseus.perseus-mobile .perseus-image-caption .paragraph .paragraph {
|
|
2160
|
-
color: #
|
|
2160
|
+
color: #888d93;
|
|
2161
2161
|
font-size: 20px;
|
|
2162
2162
|
line-height: 1.4;
|
|
2163
2163
|
text-align: left;
|
|
2164
2164
|
}
|
|
2165
2165
|
.framework-perseus.perseus-mobile .perseus-image-caption.has-title .paragraph .paragraph strong:first-child {
|
|
2166
|
-
color: #
|
|
2166
|
+
color: #3b3e40;
|
|
2167
2167
|
}
|
|
2168
2168
|
.framework-perseus.perseus-mobile .katex,
|
|
2169
2169
|
.framework-perseus.perseus-mobile mjx-container {
|
|
2170
2170
|
font-size: 25px;
|
|
2171
2171
|
line-height: 1.2;
|
|
2172
|
-
color: #
|
|
2172
|
+
color: #21242c;
|
|
2173
2173
|
}
|
|
2174
2174
|
.framework-perseus.perseus-mobile .perseus-block-math .katex,
|
|
2175
2175
|
.framework-perseus.perseus-mobile .perseus-block-math mjx-container {
|
|
@@ -2185,9 +2185,9 @@ body.mobile ul.inequalities-one-line-radios > li {
|
|
|
2185
2185
|
font-family: Courier, monospace;
|
|
2186
2186
|
}
|
|
2187
2187
|
.framework-perseus.perseus-mobile pre {
|
|
2188
|
-
background-color: #
|
|
2188
|
+
background-color: #f0f1f2;
|
|
2189
2189
|
border-radius: 4px;
|
|
2190
|
-
color: #
|
|
2190
|
+
color: #21242c;
|
|
2191
2191
|
font-size: 18px;
|
|
2192
2192
|
line-height: 1.6;
|
|
2193
2193
|
padding: 16px;
|
|
@@ -2320,7 +2320,7 @@ img.zoom-img {
|
|
|
2320
2320
|
user-select: none;
|
|
2321
2321
|
}
|
|
2322
2322
|
.blank-background {
|
|
2323
|
-
background-color: #
|
|
2323
|
+
background-color: #fdfdfd;
|
|
2324
2324
|
}
|
|
2325
2325
|
#answer_area .blank-background {
|
|
2326
2326
|
background-color: transparent;
|
|
@@ -2331,7 +2331,7 @@ img.zoom-img {
|
|
|
2331
2331
|
}
|
|
2332
2332
|
.graphie.above-scratchpad,
|
|
2333
2333
|
.graphie-container.above-scratchpad {
|
|
2334
|
-
background-color: #
|
|
2334
|
+
background-color: #fdfdfd;
|
|
2335
2335
|
}
|
|
2336
2336
|
.perseus-mobile .graphie-container.above-scratchpad {
|
|
2337
2337
|
background: #ffffff;
|
|
@@ -2527,12 +2527,12 @@ img.zoom-img {
|
|
|
2527
2527
|
padding: 5px 10px;
|
|
2528
2528
|
text-align: left;
|
|
2529
2529
|
}
|
|
2530
|
-
.framework-perseus:not(.perseus-mobile) table th[align=center],
|
|
2531
|
-
.framework-perseus:not(.perseus-mobile) table td[align=center] {
|
|
2530
|
+
.framework-perseus:not(.perseus-mobile) table th[align="center"],
|
|
2531
|
+
.framework-perseus:not(.perseus-mobile) table td[align="center"] {
|
|
2532
2532
|
text-align: center;
|
|
2533
2533
|
}
|
|
2534
|
-
.framework-perseus:not(.perseus-mobile) table th[align=right],
|
|
2535
|
-
.framework-perseus:not(.perseus-mobile) table td[align=right] {
|
|
2534
|
+
.framework-perseus:not(.perseus-mobile) table th[align="right"],
|
|
2535
|
+
.framework-perseus:not(.perseus-mobile) table td[align="right"] {
|
|
2536
2536
|
text-align: right;
|
|
2537
2537
|
}
|
|
2538
2538
|
.framework-perseus:not(.perseus-mobile) table th {
|
|
@@ -2584,12 +2584,12 @@ img.zoom-img {
|
|
|
2584
2584
|
padding: 16px;
|
|
2585
2585
|
text-align: left;
|
|
2586
2586
|
}
|
|
2587
|
-
.framework-perseus.perseus-mobile table th[align=center],
|
|
2588
|
-
.framework-perseus.perseus-mobile table td[align=center] {
|
|
2587
|
+
.framework-perseus.perseus-mobile table th[align="center"],
|
|
2588
|
+
.framework-perseus.perseus-mobile table td[align="center"] {
|
|
2589
2589
|
text-align: center;
|
|
2590
2590
|
}
|
|
2591
|
-
.framework-perseus.perseus-mobile table th[align=right],
|
|
2592
|
-
.framework-perseus.perseus-mobile table td[align=right] {
|
|
2591
|
+
.framework-perseus.perseus-mobile table th[align="right"],
|
|
2592
|
+
.framework-perseus.perseus-mobile table td[align="right"] {
|
|
2593
2593
|
text-align: right;
|
|
2594
2594
|
}
|
|
2595
2595
|
.framework-perseus.perseus-mobile table td {
|
|
@@ -2967,7 +2967,7 @@ body.mobile .categorizer-container td.category input[type="radio"] + span:active
|
|
|
2967
2967
|
.perseus-matrix.the-matrix .matrix-bracket,
|
|
2968
2968
|
.perseus-matrix.the-matrix .matrix-left,
|
|
2969
2969
|
.perseus-matrix.the-matrix .matrix-right {
|
|
2970
|
-
border-color: #
|
|
2970
|
+
border-color: #29f139;
|
|
2971
2971
|
}
|
|
2972
2972
|
.perseus-matrix.the-matrix .matrix-input {
|
|
2973
2973
|
background: #222;
|
|
@@ -2975,7 +2975,7 @@ body.mobile .categorizer-container td.category input[type="radio"] + span:active
|
|
|
2975
2975
|
.perseus-matrix.the-matrix input,
|
|
2976
2976
|
.perseus-matrix.the-matrix .number-input {
|
|
2977
2977
|
background: #666;
|
|
2978
|
-
color: #
|
|
2978
|
+
color: #29f139;
|
|
2979
2979
|
font-weight: bold;
|
|
2980
2980
|
}
|
|
2981
2981
|
.perseus-matrix.the-matrix input.outside,
|
|
@@ -3204,7 +3204,7 @@ body.sat-section .perseus-widget-passage {
|
|
|
3204
3204
|
transform: rotate(-90deg);
|
|
3205
3205
|
}
|
|
3206
3206
|
.set-from-scale-box {
|
|
3207
|
-
border: 2px solid #
|
|
3207
|
+
border: 2px solid #eeeeee;
|
|
3208
3208
|
border-radius: 3px;
|
|
3209
3209
|
padding: 3px;
|
|
3210
3210
|
}
|
|
@@ -3212,7 +3212,7 @@ body.sat-section .perseus-widget-passage {
|
|
|
3212
3212
|
font-size: 14px;
|
|
3213
3213
|
}
|
|
3214
3214
|
.perseus-mobile .perseus-widget-plotter {
|
|
3215
|
-
border: solid 0.5px #
|
|
3215
|
+
border: solid 0.5px #babec2;
|
|
3216
3216
|
border-radius: 4px;
|
|
3217
3217
|
}
|
|
3218
3218
|
.perseus-mobile .perseus-widget-plotter .graphie-label .katex,
|
|
@@ -3737,7 +3737,7 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
|
|
|
3737
3737
|
border-color: white;
|
|
3738
3738
|
}
|
|
3739
3739
|
.keypad-input .mq-hasCursor:empty:not(.mq-root-block):after {
|
|
3740
|
-
content:
|
|
3740
|
+
content: "c";
|
|
3741
3741
|
}
|
|
3742
3742
|
.keypad-input .mq-math-mode .mq-selection .mq-non-leaf,
|
|
3743
3743
|
.keypad-input .mq-editable-field .mq-selection .mq-non-leaf {
|
package/dist/index.js
CHANGED
|
@@ -38310,26 +38310,11 @@ var PassageRefTarget$1 = {
|
|
|
38310
38310
|
const {
|
|
38311
38311
|
deepEq: deepEq$1
|
|
38312
38312
|
} = Util;
|
|
38313
|
-
const BAR = "bar"
|
|
38314
|
-
|
|
38315
|
-
|
|
38316
|
-
|
|
38317
|
-
|
|
38318
|
-
({
|
|
38319
|
-
type: PropTypes__default["default"].oneOf([BAR, LINE, PIC, HISTOGRAM, DOTPLOT]),
|
|
38320
|
-
labels: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
|
|
38321
|
-
categories: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].number, PropTypes__default["default"].string])),
|
|
38322
|
-
scaleY: PropTypes__default["default"].number,
|
|
38323
|
-
maxY: PropTypes__default["default"].number,
|
|
38324
|
-
snapsPerLine: PropTypes__default["default"].number,
|
|
38325
|
-
picSize: PropTypes__default["default"].number,
|
|
38326
|
-
pixBoxHeight: PropTypes__default["default"].number,
|
|
38327
|
-
picUrl: PropTypes__default["default"].string,
|
|
38328
|
-
plotDimensions: PropTypes__default["default"].arrayOf(PropTypes__default["default"].number),
|
|
38329
|
-
labelInterval: PropTypes__default["default"].number,
|
|
38330
|
-
starting: PropTypes__default["default"].arrayOf(PropTypes__default["default"].number),
|
|
38331
|
-
static: PropTypes__default["default"].bool
|
|
38332
|
-
});
|
|
38313
|
+
const BAR = "bar";
|
|
38314
|
+
const LINE = "line";
|
|
38315
|
+
const PIC = "pic";
|
|
38316
|
+
const HISTOGRAM = "histogram";
|
|
38317
|
+
const DOTPLOT = "dotplot";
|
|
38333
38318
|
class Plotter extends React__namespace.Component {
|
|
38334
38319
|
constructor() {
|
|
38335
38320
|
super(...arguments);
|
|
@@ -38368,11 +38353,11 @@ class Plotter extends React__namespace.Component {
|
|
|
38368
38353
|
self.graphie = graphie;
|
|
38369
38354
|
self.graphie.pics = [];
|
|
38370
38355
|
self.graphie.dotTicks = [];
|
|
38371
|
-
const isBar = self.props.type === BAR
|
|
38372
|
-
|
|
38373
|
-
|
|
38374
|
-
|
|
38375
|
-
|
|
38356
|
+
const isBar = self.props.type === BAR;
|
|
38357
|
+
const isLine = self.props.type === LINE;
|
|
38358
|
+
const isPic = self.props.type === PIC;
|
|
38359
|
+
const isHistogram = self.props.type === HISTOGRAM;
|
|
38360
|
+
const isDotplot = self.props.type === DOTPLOT;
|
|
38376
38361
|
const isTiledPlot = isPic || isDotplot;
|
|
38377
38362
|
const config = {};
|
|
38378
38363
|
const c = config; // c for short
|
|
@@ -38433,9 +38418,7 @@ class Plotter extends React__namespace.Component {
|
|
|
38433
38418
|
|
|
38434
38419
|
// TODO(michaelpolyak): Handle other plot types: Dot, Histogram, Line.
|
|
38435
38420
|
if (isMobile && (isBar || isTiledPlot)) {
|
|
38436
|
-
const maxCategoryHeight = Math.max(0,
|
|
38437
|
-
// @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'unknown' is not assignable to parameter of type 'number'.
|
|
38438
|
-
...Object.values(self.state.categoryHeights));
|
|
38421
|
+
const maxCategoryHeight = Math.max(0, ...Object.values(self.state.categoryHeights));
|
|
38439
38422
|
if (maxCategoryHeight) {
|
|
38440
38423
|
// Account for bottom label position, height.
|
|
38441
38424
|
let offsetY = 25;
|
|
@@ -38488,7 +38471,7 @@ class Plotter extends React__namespace.Component {
|
|
|
38488
38471
|
});
|
|
38489
38472
|
}
|
|
38490
38473
|
}
|
|
38491
|
-
if ((isBar || isLine) && isMobile) {
|
|
38474
|
+
if ((isBar || isLine) && isMobile && !this.props.static) {
|
|
38492
38475
|
self.graphie.dragPrompt = graphie.label([c.dimX / 2, c.dimY / 2], i18n__namespace._("Drag handles to make graph"), "center", false).css("font-weight", "bold").css("color", KhanColors.KA_GREEN).css("display", "none");
|
|
38493
38476
|
}
|
|
38494
38477
|
self.setupCategories(config);
|
|
@@ -38740,8 +38723,8 @@ class Plotter extends React__namespace.Component {
|
|
|
38740
38723
|
config.graph.bars[i].scale(1, Math.max(isMobile ? 0.2 : 0.01, height / config.scaleY), center[0], center[1]);
|
|
38741
38724
|
if (isHistogram) {
|
|
38742
38725
|
// Scale dividers between buckets
|
|
38743
|
-
const leftDivider = config.graph.dividers[i - 1]
|
|
38744
|
-
|
|
38726
|
+
const leftDivider = config.graph.dividers[i - 1];
|
|
38727
|
+
const rightDivider = config.graph.dividers[i];
|
|
38745
38728
|
if (leftDivider) {
|
|
38746
38729
|
const divHeight = Math.min(self.state.values[i - 1], height);
|
|
38747
38730
|
leftDivider.scale(1, Math.max(0.01, divHeight / config.scaleY), center[0], center[1]);
|
|
@@ -39066,38 +39049,13 @@ class Plotter extends React__namespace.Component {
|
|
|
39066
39049
|
return Plotter.validate(this.getUserInput(), rubric);
|
|
39067
39050
|
});
|
|
39068
39051
|
}
|
|
39069
|
-
render() {
|
|
39070
|
-
// TODO(kevinb) actually compute the size of the graphie correctly and
|
|
39071
|
-
// make it that size so we don't have to add extra padding. The value
|
|
39072
|
-
// was determined by eye-balling the layout. :(
|
|
39073
|
-
const paddingForBottomLabel = 75;
|
|
39074
|
-
const style = {
|
|
39075
|
-
marginBottom: this.props.labels[0] ? paddingForBottomLabel : 0
|
|
39076
|
-
};
|
|
39077
|
-
return /*#__PURE__*/React__namespace.createElement("div", {
|
|
39078
|
-
className: "perseus-widget-plotter graphie " + ClassNames.INTERACTIVE
|
|
39079
|
-
// eslint-disable-next-line react/no-string-refs
|
|
39080
|
-
,
|
|
39081
|
-
ref: "graphieDiv",
|
|
39082
|
-
style: style
|
|
39083
|
-
});
|
|
39084
|
-
}
|
|
39085
|
-
componentDidUpdate(prevProps, prevState) {
|
|
39086
|
-
this.shouldSetupGraphie = this.shouldSetupGraphie || !___default["default"].isEqual(this.state.categoryHeights, prevState.categoryHeights);
|
|
39087
|
-
if (this.shouldSetupGraphie) {
|
|
39088
|
-
this.setupGraphie(prevState);
|
|
39089
|
-
}
|
|
39090
|
-
}
|
|
39091
39052
|
componentDidMount() {
|
|
39092
39053
|
this._isMounted = true;
|
|
39093
39054
|
this.setupGraphie(this.state);
|
|
39094
39055
|
}
|
|
39095
39056
|
UNSAFE_componentWillReceiveProps(nextProps) {
|
|
39096
39057
|
const props = ["type", "labels", "categories", "scaleY", "maxY", "snapsPerLine", "picUrl", "labelInterval", "static"];
|
|
39097
|
-
this.shouldSetupGraphie = ___default["default"].any(props,
|
|
39098
|
-
// @ts-expect-error [FEI-5003] - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
|
|
39099
|
-
return !___default["default"].isEqual(this.props[prop], nextProps[prop]);
|
|
39100
|
-
}, this);
|
|
39058
|
+
this.shouldSetupGraphie = ___default["default"].any(props, prop => !___default["default"].isEqual(this.props[prop], nextProps[prop]), this);
|
|
39101
39059
|
if (!___default["default"].isEqual(this.props.starting, nextProps.starting) && !___default["default"].isEqual(this.state.values, nextProps.starting)) {
|
|
39102
39060
|
this.shouldSetupGraphie = true;
|
|
39103
39061
|
this.setState({
|
|
@@ -39105,16 +39063,32 @@ class Plotter extends React__namespace.Component {
|
|
|
39105
39063
|
});
|
|
39106
39064
|
}
|
|
39107
39065
|
}
|
|
39066
|
+
componentDidUpdate(prevProps, prevState) {
|
|
39067
|
+
this.shouldSetupGraphie = this.shouldSetupGraphie || !___default["default"].isEqual(this.state.categoryHeights, prevState.categoryHeights);
|
|
39068
|
+
if (this.shouldSetupGraphie) {
|
|
39069
|
+
this.setupGraphie(prevState);
|
|
39070
|
+
}
|
|
39071
|
+
}
|
|
39108
39072
|
componentWillUnmount() {
|
|
39109
39073
|
this._isMounted = false;
|
|
39110
39074
|
}
|
|
39075
|
+
render() {
|
|
39076
|
+
// TODO(kevinb) actually compute the size of the graphie correctly and
|
|
39077
|
+
// make it that size so we don't have to add extra padding. The value
|
|
39078
|
+
// was determined by eye-balling the layout. :(
|
|
39079
|
+
const paddingForBottomLabel = 75;
|
|
39080
|
+
const style = {
|
|
39081
|
+
marginBottom: this.props.labels[0] ? paddingForBottomLabel : 0
|
|
39082
|
+
};
|
|
39083
|
+
return /*#__PURE__*/React__namespace.createElement("div", {
|
|
39084
|
+
className: "perseus-widget-plotter graphie " + ClassNames.INTERACTIVE
|
|
39085
|
+
// eslint-disable-next-line react/no-string-refs
|
|
39086
|
+
,
|
|
39087
|
+
ref: "graphieDiv",
|
|
39088
|
+
style: style
|
|
39089
|
+
});
|
|
39090
|
+
}
|
|
39111
39091
|
}
|
|
39112
|
-
_defineProperty(Plotter, "propTypes", {
|
|
39113
|
-
onChange: PropTypes__default["default"].func.isRequired,
|
|
39114
|
-
trackInteraction: PropTypes__default["default"].func.isRequired
|
|
39115
|
-
// TODO(alex): Figure out why lint chokes on this line
|
|
39116
|
-
// ...widgetPropTypes,
|
|
39117
|
-
});
|
|
39118
39092
|
_defineProperty(Plotter, "defaultProps", {
|
|
39119
39093
|
type: BAR,
|
|
39120
39094
|
labels: ["", ""],
|
|
@@ -44147,17 +44121,7 @@ registerWidgets(allWidgets);
|
|
|
44147
44121
|
const ItemVersion = getVersionVector();
|
|
44148
44122
|
ItemVersion["::renderer::"] = version.itemDataVersion;
|
|
44149
44123
|
|
|
44150
|
-
|
|
44151
|
-
* A mixin that renders a custom software keypad in additional to the base
|
|
44152
|
-
* component. The base component will receive blur events when the keypad is
|
|
44153
|
-
* dismissed and can access the keypad element itself so as to manage its
|
|
44154
|
-
* activation and dismissal.
|
|
44155
|
-
*
|
|
44156
|
-
* TODO(charlie): This would make a nicer higher-order component, except that
|
|
44157
|
-
* we need to expose methods on the base component (i.e., `ItemRenderer`). When
|
|
44158
|
-
* `ItemRenderer` and friends are written as ES6 Classes, we can have them
|
|
44159
|
-
* extend a `ProvideKeypad` component instead of using this mixin.
|
|
44160
|
-
*/
|
|
44124
|
+
/* eslint-disable @khanacademy/ts-no-error-suppressions */
|
|
44161
44125
|
// NOTE: This is not a real component. It's a collection of methods used to
|
|
44162
44126
|
// create and manage a Keypad instances.
|
|
44163
44127
|
// TODO(LP-10789): replace this with a React Context object to pass information
|
|
@@ -47078,9 +47042,7 @@ const EditorJsonify = {
|
|
|
47078
47042
|
}
|
|
47079
47043
|
};
|
|
47080
47044
|
|
|
47081
|
-
|
|
47082
|
-
* Main entry point
|
|
47083
|
-
*/
|
|
47045
|
+
/* eslint-disable @khanacademy/ts-no-error-suppressions */
|
|
47084
47046
|
const apiVersion = version.apiVersion;
|
|
47085
47047
|
const itemDataVersion = version.itemDataVersion;
|
|
47086
47048
|
|