@smallwebco/tinypivot-react 1.0.13 → 1.0.15
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/index.cjs +89 -33
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/index.js +105 -49
- package/dist/index.js.map +1 -1
- package/dist/style.css +119 -3
- package/package.json +2 -2
package/dist/style.css
CHANGED
|
@@ -221,16 +221,22 @@
|
|
|
221
221
|
}
|
|
222
222
|
|
|
223
223
|
.vpg-search-input {
|
|
224
|
-
border: none;
|
|
225
|
-
outline: none;
|
|
224
|
+
border: none !important;
|
|
225
|
+
outline: none !important;
|
|
226
|
+
box-shadow: none !important;
|
|
226
227
|
background: transparent;
|
|
227
228
|
font-size: 0.8125rem;
|
|
228
229
|
color: #334155;
|
|
229
230
|
width: 200px;
|
|
230
231
|
}
|
|
231
232
|
|
|
233
|
+
.vpg-search-input:focus,
|
|
234
|
+
.vpg-search-input:focus-visible {
|
|
235
|
+
outline: none !important;
|
|
236
|
+
border: none !important;
|
|
237
|
+
box-shadow: none !important;
|
|
238
|
+
}
|
|
232
239
|
.vpg-search-input::-moz-placeholder { color: #94a3b8; }
|
|
233
|
-
|
|
234
240
|
.vpg-search-input::placeholder { color: #94a3b8; }
|
|
235
241
|
|
|
236
242
|
.vpg-search-clear {
|
|
@@ -1798,3 +1804,113 @@
|
|
|
1798
1804
|
font-size: 0.625rem;
|
|
1799
1805
|
}
|
|
1800
1806
|
|
|
1807
|
+
/* Filter tooltip */
|
|
1808
|
+
.vpg-filter-tooltip {
|
|
1809
|
+
position: absolute;
|
|
1810
|
+
top: calc(100% + 0.5rem);
|
|
1811
|
+
right: 0;
|
|
1812
|
+
min-width: 220px;
|
|
1813
|
+
max-width: 320px;
|
|
1814
|
+
background: white;
|
|
1815
|
+
border: 1px solid #e2e8f0;
|
|
1816
|
+
border-radius: 0.5rem;
|
|
1817
|
+
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.15), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
|
|
1818
|
+
z-index: 100;
|
|
1819
|
+
overflow: hidden;
|
|
1820
|
+
}
|
|
1821
|
+
|
|
1822
|
+
.vpg-tooltip-header {
|
|
1823
|
+
padding: 0.5rem 0.75rem;
|
|
1824
|
+
font-size: 0.6875rem;
|
|
1825
|
+
font-weight: 700;
|
|
1826
|
+
color: #475569;
|
|
1827
|
+
background: #f8fafc;
|
|
1828
|
+
border-bottom: 1px solid #e2e8f0;
|
|
1829
|
+
text-transform: uppercase;
|
|
1830
|
+
letter-spacing: 0.05em;
|
|
1831
|
+
}
|
|
1832
|
+
|
|
1833
|
+
.vpg-tooltip-filter {
|
|
1834
|
+
padding: 0.5rem 0.75rem;
|
|
1835
|
+
border-bottom: 1px solid #f1f5f9;
|
|
1836
|
+
}
|
|
1837
|
+
|
|
1838
|
+
.vpg-tooltip-filter:last-of-type {
|
|
1839
|
+
border-bottom: none;
|
|
1840
|
+
}
|
|
1841
|
+
|
|
1842
|
+
.vpg-tooltip-column {
|
|
1843
|
+
font-size: 0.6875rem;
|
|
1844
|
+
font-weight: 600;
|
|
1845
|
+
color: #1e293b;
|
|
1846
|
+
margin-bottom: 0.375rem;
|
|
1847
|
+
}
|
|
1848
|
+
|
|
1849
|
+
.vpg-tooltip-values {
|
|
1850
|
+
display: flex;
|
|
1851
|
+
flex-wrap: wrap;
|
|
1852
|
+
gap: 0.25rem;
|
|
1853
|
+
}
|
|
1854
|
+
|
|
1855
|
+
.vpg-tooltip-value {
|
|
1856
|
+
padding: 0.125rem 0.375rem;
|
|
1857
|
+
font-size: 0.625rem;
|
|
1858
|
+
background: #fef3c7;
|
|
1859
|
+
color: #92400e;
|
|
1860
|
+
border-radius: 0.25rem;
|
|
1861
|
+
border: 1px solid #fde68a;
|
|
1862
|
+
}
|
|
1863
|
+
|
|
1864
|
+
.vpg-tooltip-more {
|
|
1865
|
+
padding: 0.125rem 0.375rem;
|
|
1866
|
+
font-size: 0.625rem;
|
|
1867
|
+
color: #64748b;
|
|
1868
|
+
font-style: italic;
|
|
1869
|
+
}
|
|
1870
|
+
|
|
1871
|
+
.vpg-tooltip-summary {
|
|
1872
|
+
padding: 0.5rem 0.75rem;
|
|
1873
|
+
font-size: 0.625rem;
|
|
1874
|
+
color: #64748b;
|
|
1875
|
+
background: #f8fafc;
|
|
1876
|
+
border-top: 1px solid #e2e8f0;
|
|
1877
|
+
text-align: center;
|
|
1878
|
+
}
|
|
1879
|
+
|
|
1880
|
+
/* Filter tooltip - dark mode */
|
|
1881
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-filter-tooltip {
|
|
1882
|
+
background: #1e293b !important;
|
|
1883
|
+
border-color: #475569 !important;
|
|
1884
|
+
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.4), 0 8px 10px -6px rgba(0, 0, 0, 0.3);
|
|
1885
|
+
}
|
|
1886
|
+
|
|
1887
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-header {
|
|
1888
|
+
background: #0f172a !important;
|
|
1889
|
+
border-color: #334155 !important;
|
|
1890
|
+
color: #94a3b8 !important;
|
|
1891
|
+
}
|
|
1892
|
+
|
|
1893
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-filter {
|
|
1894
|
+
border-color: #334155 !important;
|
|
1895
|
+
}
|
|
1896
|
+
|
|
1897
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-column {
|
|
1898
|
+
color: #e2e8f0 !important;
|
|
1899
|
+
}
|
|
1900
|
+
|
|
1901
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-value {
|
|
1902
|
+
background: rgba(245, 158, 11, 0.2) !important;
|
|
1903
|
+
color: #fbbf24 !important;
|
|
1904
|
+
border-color: rgba(245, 158, 11, 0.4) !important;
|
|
1905
|
+
}
|
|
1906
|
+
|
|
1907
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-more {
|
|
1908
|
+
color: #94a3b8 !important;
|
|
1909
|
+
}
|
|
1910
|
+
|
|
1911
|
+
.vpg-theme-dark .vpg-pivot-skeleton .vpg-tooltip-summary {
|
|
1912
|
+
background: #0f172a !important;
|
|
1913
|
+
border-color: #334155 !important;
|
|
1914
|
+
color: #94a3b8 !important;
|
|
1915
|
+
}
|
|
1916
|
+
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smallwebco/tinypivot-react",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.15",
|
|
4
4
|
"description": "TinyPivot React - Excel-like data grid and pivot table components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@tanstack/react-table": "^8.20.0",
|
|
29
|
-
"@smallwebco/tinypivot-core": "1.0.
|
|
29
|
+
"@smallwebco/tinypivot-core": "1.0.15"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"@types/react": "^18.2.0",
|