| @@ -1,4 +1,6 @@ | ||
| 1 | +import { TypographyValue } from "@tableberg/shared/utils/typography"; | |
| 2 | + | |
| 1 | 3 | import { ElementBindings } from "./dynamic-data/types"; |
| 2 | 4 | |
| 3 | 5 | export interface TablebergBlockAttrs { |
| 4 | 6 | version?: number; |
| @@ -175,8 +177,15 @@ | ||
| 175 | 177 | bottom: string; |
| 176 | 178 | left: string; |
| 177 | 179 | }; |
| 178 | 180 | |
| 181 | +export type Corners = { | |
| 182 | + topLeft: string; | |
| 183 | + topRight: string; | |
| 184 | + bottomRight: string; | |
| 185 | + bottomLeft: string; | |
| 186 | +}; | |
| 187 | + | |
| 179 | 188 | export interface TableConfig { |
| 180 | 189 | rows: number; |
| 181 | 190 | cols: number; |
| 182 | 191 | className?: string; |
| @@ -191,8 +200,11 @@ | ||
| 191 | 200 | tableWidth?: TableWidth; |
| 192 | 201 | tableAlignment?: TableAlignment; |
| 193 | 202 | cellSpacing?: CellSpacing; |
| 194 | 203 | tableBorder?: Border; |
| 204 | + // Table-wide typography, set on the table element so everything in the | |
| 205 | + // cells that does not carry its own value inherits it. | |
| 206 | + typography?: TypographyValue; | |
| 195 | 207 | margin?: Border; |
| 196 | 208 | padding?: Border; |
| 197 | 209 | fixedColumnWidths?: boolean; |
| 198 | 210 | pagination?: PaginationConfig; |
| @@ -215,8 +227,12 @@ | ||
| 215 | 227 | headerBackgroundColor: string; |
| 216 | 228 | footerBackgroundColor: string; |
| 217 | 229 | evenRowBackgroundColor: string; |
| 218 | 230 | oddRowBackgroundColor: string; |
| 231 | + /** | |
| 232 | + * Defaults to `1px solid currentColor`, like the core Table block, so the | |
| 233 | + * border follows the text colour instead of forcing black. | |
| 234 | + */ | |
| 219 | 235 | border: Border; |
| 220 | 236 | borderRadius: { |
| 221 | 237 | topLeft: string; |
| 222 | 238 | topRight: string; |
| @@ -299,8 +315,18 @@ | ||
| 299 | 315 | right: "", |
| 300 | 316 | bottom: "", |
| 301 | 317 | left: "", |
| 302 | 318 | }, |
| 319 | + typography: { | |
| 320 | + fontFamily: "", | |
| 321 | + fontSize: "", | |
| 322 | + fontStyle: "", | |
| 323 | + fontWeight: "", | |
| 324 | + lineHeight: "", | |
| 325 | + letterSpacing: "", | |
| 326 | + textDecoration: "", | |
| 327 | + textTransform: "", | |
| 328 | + }, | |
| 303 | 329 | margin: { |
| 304 | 330 | top: "", |
| 305 | 331 | right: "", |
| 306 | 332 | bottom: "", |
| @@ -356,12 +382,12 @@ | ||
| 356 | 382 | bottom: "var(--wp--preset--spacing--20)", |
| 357 | 383 | left: "var(--wp--preset--spacing--20)", |
| 358 | 384 | }, |
| 359 | 385 | border: { |
| 360 | - top: "1px solid black", | |
| 361 | - right: "1px solid black", | |
| 362 | - bottom: "1px solid black", | |
| 363 | - left: "1px solid black", | |
| 386 | + top: "1px solid currentColor", | |
| 387 | + right: "1px solid currentColor", | |
| 388 | + bottom: "1px solid currentColor", | |
| 389 | + left: "1px solid currentColor", | |
| 364 | 390 | }, |
| 365 | 391 | borderRadius: { |
| 366 | 392 | topLeft: "0px", |
| 367 | 393 | topRight: "0px", |
