From 283a3038ee3563aa8279bfcedaf27e6a39e1ceef Mon Sep 17 00:00:00 2001 From: Gilad Gray Date: Mon, 11 Dec 2017 16:27:07 -0800 Subject: [PATCH 01/15] Intent string enum --- packages/core/src/common/classes.ts | 4 ++-- packages/core/src/common/intent.ts | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/packages/core/src/common/classes.ts b/packages/core/src/common/classes.ts index 500d96a16f..d4debfdec4 100644 --- a/packages/core/src/common/classes.ts +++ b/packages/core/src/common/classes.ts @@ -197,8 +197,8 @@ export function iconClass(iconName?: string) { } export function intentClass(intent = Intent.NONE) { - if (intent === Intent.NONE || Intent[intent] == null) { + if (intent == null || intent === Intent.NONE) { return undefined; } - return `pt-intent-${Intent[intent].toLowerCase()}`; + return `pt-intent-${intent.toLowerCase()}`; } diff --git a/packages/core/src/common/intent.ts b/packages/core/src/common/intent.ts index c2be82b703..8764b2810a 100644 --- a/packages/core/src/common/intent.ts +++ b/packages/core/src/common/intent.ts @@ -8,9 +8,9 @@ * The four basic intents. */ export enum Intent { - NONE = -1, - PRIMARY, - SUCCESS, - WARNING, - DANGER, + NONE = "none", + PRIMARY = "primary", + SUCCESS = "success", + WARNING = "warning", + DANGER = "danger", } From 8c04fb26f9c0e6befde5f4ace677bca112a03887 Mon Sep 17 00:00:00 2001 From: Gilad Gray Date: Mon, 11 Dec 2017 16:27:28 -0800 Subject: [PATCH 02/15] bunch of other core enums (not Position yet) --- packages/core/src/components/collapse/collapse.tsx | 10 +++++----- .../components/collapsible-list/collapsibleList.tsx | 4 ++-- .../core/src/components/hotkeys/hotkeysEvents.ts | 4 ++-- packages/core/src/components/popover/popover.tsx | 8 ++++---- packages/core/test/common/utils.ts | 12 ++++++------ 5 files changed, 19 insertions(+), 19 deletions(-) diff --git a/packages/core/src/components/collapse/collapse.tsx b/packages/core/src/components/collapse/collapse.tsx index c64e97faba..7cc174585d 100644 --- a/packages/core/src/components/collapse/collapse.tsx +++ b/packages/core/src/components/collapse/collapse.tsx @@ -49,11 +49,11 @@ export interface ICollapseState { } export enum AnimationStates { - CLOSED, - OPENING, - OPEN, - CLOSING_START, - CLOSING_END, + CLOSED = "closed", + OPENING = "opening", + OPEN = "open", + CLOSING_START = "closing-start", + CLOSING_END = "closing-end", } /* diff --git a/packages/core/src/components/collapsible-list/collapsibleList.tsx b/packages/core/src/components/collapsible-list/collapsibleList.tsx index d68ec2c557..d41ff69b04 100644 --- a/packages/core/src/components/collapsible-list/collapsibleList.tsx +++ b/packages/core/src/components/collapsible-list/collapsibleList.tsx @@ -18,8 +18,8 @@ import { IPopoverProps, Popover } from "../popover/popover"; type CollapsibleItem = React.ReactElement; export enum CollapseFrom { - START, - END, + START = "start", + END = "end", } export interface ICollapsibleListProps extends IProps { diff --git a/packages/core/src/components/hotkeys/hotkeysEvents.ts b/packages/core/src/components/hotkeys/hotkeysEvents.ts index 3a2594be87..f864021f3c 100644 --- a/packages/core/src/components/hotkeys/hotkeysEvents.ts +++ b/packages/core/src/components/hotkeys/hotkeysEvents.ts @@ -15,8 +15,8 @@ import { hideHotkeysDialogAfterDelay, isHotkeysDialogShowing, showHotkeysDialog const SHOW_DIALOG_KEY = "?"; export enum HotkeyScope { - LOCAL, - GLOBAL, + LOCAL = "local", + GLOBAL = "global", } export interface IHotkeyAction { diff --git a/packages/core/src/components/popover/popover.tsx b/packages/core/src/components/popover/popover.tsx index d109116afa..bbd8171108 100644 --- a/packages/core/src/components/popover/popover.tsx +++ b/packages/core/src/components/popover/popover.tsx @@ -36,10 +36,10 @@ const SMART_POSITIONING = { }; export enum PopoverInteractionKind { - CLICK, - CLICK_TARGET_ONLY, - HOVER, - HOVER_TARGET_ONLY, + CLICK = "click", + CLICK_TARGET_ONLY = "click-target", + HOVER = "hover", + HOVER_TARGET_ONLY = "hover-target", } export interface IPopoverProps extends IOverlayableProps, IProps { diff --git a/packages/core/test/common/utils.ts b/packages/core/test/common/utils.ts index 4259b8b511..4ee188d8da 100644 --- a/packages/core/test/common/utils.ts +++ b/packages/core/test/common/utils.ts @@ -35,12 +35,12 @@ export function dispatchTestKeyboardEvent(target: EventTarget, eventType: string * Enum of possible browsers */ enum Browser { - CHROME, - EDGE, - FIREFOX, - IE, - UNKNOWN, - WEBKIT, + CHROME = "Chrome", + EDGE = "Edge", + FIREFOX = "Firefox", + IE = "IE", + UNKNOWN = "unknown", + WEBKIT = "WebKit", } /** From e8d8c394f9ea5b52753d9d5a26a9a9a4f1430c33 Mon Sep 17 00:00:00 2001 From: Gilad Gray Date: Mon, 11 Dec 2017 16:27:39 -0800 Subject: [PATCH 03/15] datetime enums --- packages/datetime/src/common/dateUtils.ts | 4 ++-- packages/datetime/src/common/months.ts | 4 ++++ packages/datetime/src/timePicker.tsx | 6 +++--- 3 files changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/datetime/src/common/dateUtils.ts b/packages/datetime/src/common/dateUtils.ts index cfdaf4aa32..738b60ca45 100644 --- a/packages/datetime/src/common/dateUtils.ts +++ b/packages/datetime/src/common/dateUtils.ts @@ -12,8 +12,8 @@ export type DateRange = [Date | undefined, Date | undefined]; export type MomentDateRange = [moment.Moment, moment.Moment]; export enum DateRangeBoundary { - START, - END, + START = "start", + END = "end", } export function areEqual(date1: Date, date2: Date) { diff --git a/packages/datetime/src/common/months.ts b/packages/datetime/src/common/months.ts index 2e7dd0c51a..0b57ec7eb9 100644 --- a/packages/datetime/src/common/months.ts +++ b/packages/datetime/src/common/months.ts @@ -4,6 +4,10 @@ * Licensed under the terms of the LICENSE file distributed with this project. */ +/** + * Enumeration of calendar months. + * Note that the enum values are numbers (with January as `0`) so they can be easily compared to `date.getMonth()`. + */ export const enum Months { JANUARY, FEBRUARY, diff --git a/packages/datetime/src/timePicker.tsx b/packages/datetime/src/timePicker.tsx index f03b41bba3..942ba730d9 100644 --- a/packages/datetime/src/timePicker.tsx +++ b/packages/datetime/src/timePicker.tsx @@ -13,9 +13,9 @@ import * as DateUtils from "./common/dateUtils"; import * as Utils from "./common/utils"; export enum TimePickerPrecision { - MINUTE, - SECOND, - MILLISECOND, + MINUTE = "minute", + SECOND = "second", + MILLISECOND = "millisecond", } export interface ITimePickerProps extends IProps { From 562ceb9097583791a1c08acb0f539294331d7064 Mon Sep 17 00:00:00 2001 From: Gilad Gray Date: Mon, 11 Dec 2017 16:27:48 -0800 Subject: [PATCH 04/15] (some) table enums --- packages/table/src/common/renderMode.ts | 6 +-- packages/table/src/regions.ts | 58 +++++++++++-------------- 2 files changed, 29 insertions(+), 35 deletions(-) diff --git a/packages/table/src/common/renderMode.ts b/packages/table/src/common/renderMode.ts index a91870d3e1..7e83bd2b31 100644 --- a/packages/table/src/common/renderMode.ts +++ b/packages/table/src/common/renderMode.ts @@ -11,7 +11,7 @@ export enum RenderMode { * the UI, but it also introduces a noticeable scan-line rendering artifact * as successive batches of cells finish rendering. */ - BATCH, + BATCH = "batch", /** * Renders all cells synchronously on initial mount, then renders cells in @@ -19,12 +19,12 @@ export enum RenderMode { * remove visual rendering artifacts when the table is first rendered, * wihout slowing scrolling performance to a crawl. */ - BATCH_ON_UPDATE, + BATCH_ON_UPDATE = "batch-on-update", /** * Disables the batch-rendering behavior, rendering all cells synchronously * at once. This may result in degraded performance on large tables and/or * on tables with complex cells. */ - NONE, + NONE = "none", } diff --git a/packages/table/src/regions.ts b/packages/table/src/regions.ts index c589c880f7..dc0be154d8 100644 --- a/packages/table/src/regions.ts +++ b/packages/table/src/regions.ts @@ -17,22 +17,22 @@ export enum RegionCardinality { /** * A region that contains a finite rectangular group of table cells */ - CELLS, + CELLS = "cells", /** * A region that represents all cells within 1 or more rows. */ - FULL_ROWS, + FULL_ROWS = "full-rows", /** * A region that represents all cells within 1 or more columns. */ - FULL_COLUMNS, + FULL_COLUMNS = "full-columns", /** * A region that represents all cells in the table. */ - FULL_TABLE, + FULL_TABLE = "full-table", } /** @@ -53,24 +53,21 @@ export const SelectionModes = { ROWS_ONLY: [RegionCardinality.FULL_ROWS], }; -export type ColumnLoadingOption = "cells" | "column-header"; -export const ColumnLoadingOption = { - CELLS: "cells" as ColumnLoadingOption, - HEADER: "column-header" as ColumnLoadingOption, -}; +export enum ColumnLoadingOption { + CELLS = "cells", + HEADER = "column-header", +} -export type RowLoadingOption = "cells" | "row-header"; -export const RowLoadingOption = { - CELLS: "cells" as RowLoadingOption, - HEADER: "row-header" as RowLoadingOption, -}; +export enum RowLoadingOption { + CELLS = "cells", + HEADER = "row-header", +} -export type TableLoadingOption = ColumnLoadingOption | RowLoadingOption; -export const TableLoadingOption = { - CELLS: "cells" as TableLoadingOption, - COLUMN_HEADERS: ColumnLoadingOption.HEADER as TableLoadingOption, - ROW_HEADERS: RowLoadingOption.HEADER as TableLoadingOption, -}; +export enum TableLoadingOption { + CELLS = "cells", + COLUMN_HEADERS = "column-header", + ROW_HEADERS = "row-header", +} export interface IStyledRegionGroup { className?: string; @@ -112,29 +109,26 @@ export class Regions { * an unbounded interval. Therefore, an example of a region containing the * second and third columns would be: * - * { - * rows: null, - * cols: [1, 2] - * } + * ```js + * { rows: null, cols: [1, 2] } + * ``` * * In this case, this method would return `RegionCardinality.FULL_COLUMNS`. * * If both rows and columns are unbounded, then the region covers the * entire table. Therefore, a region like this: * - * { - * rows: null, - * cols: null - * } + * ```js + * { rows: null, cols: null } + * ``` * * will return `RegionCardinality.FULL_TABLE`. * * An example of a region containing a single cell in the table would be: * - * { - * rows: [5, 5], - * cols: [2, 2] - * } + * ```js + * { rows: [5, 5], cols: [2, 2] } + * ``` * * In this case, this method would return `RegionCardinality.CELLS`. */ From 062b90cd8cec19c0445e8749844d9301f2f67d79 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 12:10:45 -0800 Subject: [PATCH 05/15] More public enum stringifications --- packages/core/src/common/position.ts | 24 ++++++++-------- packages/datetime/src/common/months.ts | 28 ++++++++++--------- packages/datetime/src/timePicker.tsx | 12 ++++---- packages/table-dev-app/src/mutableTable.tsx | 12 ++++---- .../src/cell/formats/truncatedFormat.tsx | 8 +++--- packages/table/src/common/direction.ts | 8 +++--- .../table/src/quadrants/tableQuadrant.tsx | 12 ++++---- 7 files changed, 53 insertions(+), 51 deletions(-) diff --git a/packages/core/src/common/position.ts b/packages/core/src/common/position.ts index b2ad9a09bb..ba257f0b10 100644 --- a/packages/core/src/common/position.ts +++ b/packages/core/src/common/position.ts @@ -5,18 +5,18 @@ */ export enum Position { - TOP_LEFT, - TOP, - TOP_RIGHT, - RIGHT_TOP, - RIGHT, - RIGHT_BOTTOM, - BOTTOM_RIGHT, - BOTTOM, - BOTTOM_LEFT, - LEFT_BOTTOM, - LEFT, - LEFT_TOP, + TOP_LEFT = "top_left", + TOP = "top", + TOP_RIGHT = "top_right", + RIGHT_TOP = "right_top", + RIGHT = "right", + RIGHT_BOTTOM = "right_bottom", + BOTTOM_RIGHT = "bottom_right", + BOTTOM = "bottom", + BOTTOM_LEFT = "bottom_left", + LEFT_BOTTOM = "left_bottom", + LEFT = "left", + LEFT_TOP = "left_top", } export function isPositionHorizontal(position: Position) { diff --git a/packages/datetime/src/common/months.ts b/packages/datetime/src/common/months.ts index 0b57ec7eb9..2836657315 100644 --- a/packages/datetime/src/common/months.ts +++ b/packages/datetime/src/common/months.ts @@ -6,19 +6,21 @@ /** * Enumeration of calendar months. - * Note that the enum values are numbers (with January as `0`) so they can be easily compared to `date.getMonth()`. + * + * Note that the enum values are numbers (with January as `0`) so they can be + * easily compared to `date.getMonth()`. */ export const enum Months { - JANUARY, - FEBRUARY, - MARCH, - APRIL, - MAY, - JUNE, - JULY, - AUGUST, - SEPTEMBER, - OCTOBER, - NOVEMBER, - DECEMBER, + JANUARY = 0, + FEBRUARY = 1, + MARCH = 2, + APRIL = 3, + MAY = 4, + JUNE = 5, + JULY = 6, + AUGUST = 7, + SEPTEMBER = 8, + OCTOBER = 9, + NOVEMBER = 10, + DECEMBER = 11, } diff --git a/packages/datetime/src/timePicker.tsx b/packages/datetime/src/timePicker.tsx index 942ba730d9..92c0348026 100644 --- a/packages/datetime/src/timePicker.tsx +++ b/packages/datetime/src/timePicker.tsx @@ -382,10 +382,10 @@ export class TimePicker extends React.Component = { [TimeUnit.HOUR]: DEFAULT_MIN_HOUR, [TimeUnit.MINUTE]: DEFAULT_MIN_MINUTE, [TimeUnit.SECOND]: DEFAULT_MIN_SECOND, @@ -464,7 +464,7 @@ function minTime(unit: TimeUnit) { } function maxTime(unit: TimeUnit) { - const max: { [unit: number]: number } = { + const max: Record = { [TimeUnit.HOUR]: DEFAULT_MAX_HOUR, [TimeUnit.MINUTE]: DEFAULT_MAX_MINUTE, [TimeUnit.SECOND]: DEFAULT_MAX_SECOND, diff --git a/packages/table-dev-app/src/mutableTable.tsx b/packages/table-dev-app/src/mutableTable.tsx index 1c34893512..0b36f50958 100644 --- a/packages/table-dev-app/src/mutableTable.tsx +++ b/packages/table-dev-app/src/mutableTable.tsx @@ -45,15 +45,15 @@ import { LocalStore } from "./localStore"; import { SlowLayoutStack } from "./slowLayoutStack"; export enum FocusStyle { - TAB, - TAB_OR_CLICK, + TAB = "tab", + TAB_OR_CLICK = "tab_or_click", } export enum CellContent { - EMPTY, - CELL_NAMES, - LONG_TEXT, - LARGE_JSON, + EMPTY = "empty", + CELL_NAMES = "cell_names", + LONG_TEXT = "long_text", + LARGE_JSON = "large_json", } type IMutableStateUpdateCallback = ( diff --git a/packages/table/src/cell/formats/truncatedFormat.tsx b/packages/table/src/cell/formats/truncatedFormat.tsx index 57762159aa..221ec257a6 100644 --- a/packages/table/src/cell/formats/truncatedFormat.tsx +++ b/packages/table/src/cell/formats/truncatedFormat.tsx @@ -20,10 +20,10 @@ import { Locator } from "../../locator"; const CONTENT_DIV_WIDTH_DELTA = 25; export enum TruncatedPopoverMode { - ALWAYS, - NEVER, - WHEN_TRUNCATED, - WHEN_TRUNCATED_APPROX, + ALWAYS = "always", + NEVER = "never", + WHEN_TRUNCATED = "when_truncated", + WHEN_TRUNCATED_APPROX = "when_truncated_approx", } export interface ITrucatedFormateMeasureByApproximateOptions { diff --git a/packages/table/src/common/direction.ts b/packages/table/src/common/direction.ts index 932ee52a29..9c97ac90ef 100644 --- a/packages/table/src/common/direction.ts +++ b/packages/table/src/common/direction.ts @@ -5,8 +5,8 @@ */ export enum Direction { - UP, - DOWN, - LEFT, - RIGHT, + UP = "up", + DOWN = "down", + LEFT = "left", + RIGHT = "right", } diff --git a/packages/table/src/quadrants/tableQuadrant.tsx b/packages/table/src/quadrants/tableQuadrant.tsx index 31667904a8..91119e8559 100644 --- a/packages/table/src/quadrants/tableQuadrant.tsx +++ b/packages/table/src/quadrants/tableQuadrant.tsx @@ -16,23 +16,23 @@ export enum QuadrantType { /** * The main quadrant beneath any frozen rows or columns. */ - MAIN, + MAIN = "main", /** * The top quadrant, containing column headers and frozen rows. */ - TOP, + TOP = "top", /** * The left quadrant, containing row headers and frozen columns. */ - LEFT, + LEFT = "left", /** - * The top-left quadrant, containing the headers and cells common to both the frozen columns and - * frozen rows. + * The top-left quadrant, containing the headers and cells common to both + * the frozen columns and frozen rows. */ - TOP_LEFT, + TOP_LEFT = "top_left", } export interface ITableQuadrantProps extends IProps { From 1eb70d38a21754a0082c552c1fca7cfc59e92441 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 12:26:31 -0800 Subject: [PATCH 06/15] Fix toaster compilation --- packages/core/src/common/errors.ts | 1 - packages/core/src/components/toast/toaster.tsx | 18 +++++++----------- 2 files changed, 7 insertions(+), 12 deletions(-) diff --git a/packages/core/src/common/errors.ts b/packages/core/src/common/errors.ts index 6b016f9114..ba93b0ad32 100644 --- a/packages/core/src/common/errors.ts +++ b/packages/core/src/common/errors.ts @@ -75,7 +75,6 @@ export const TABS_WARN_DEPRECATED = " https://blueprintjs.com/#components.tabs.js"; export const TOASTER_WARN_INLINE = ns + ` Toaster.create() ignores inline prop as it always creates a new element.`; -export const TOASTER_WARN_LEFT_RIGHT = ns + ` Toaster does not support LEFT or RIGHT positions.`; export const DIALOG_WARN_NO_HEADER_ICON = ns + ` iconName is ignored if title is omitted.`; export const DIALOG_WARN_NO_HEADER_CLOSE_BUTTON = diff --git a/packages/core/src/components/toast/toaster.tsx b/packages/core/src/components/toast/toaster.tsx index 77036a1ff9..c6b159c0e4 100644 --- a/packages/core/src/components/toast/toaster.tsx +++ b/packages/core/src/components/toast/toaster.tsx @@ -10,7 +10,7 @@ import * as ReactDOM from "react-dom"; import { AbstractPureComponent } from "../../common/abstractPureComponent"; import * as Classes from "../../common/classes"; -import { TOASTER_WARN_INLINE, TOASTER_WARN_LEFT_RIGHT } from "../../common/errors"; +import { TOASTER_WARN_INLINE } from "../../common/errors"; import { ESCAPE } from "../../common/keys"; import { Position } from "../../common/position"; import { IProps } from "../../common/props"; @@ -66,11 +66,13 @@ export interface IToasterProps extends IProps { inline?: boolean; /** - * Position of `Toaster` within its container. Note that `LEFT` and `RIGHT` are disallowed - * because Toaster only supports the top and bottom edges. + * Position of `Toaster` within its container. + * + * Note that only `TOP` and `BOTTOM` are supported because Toaster only + * supports the top and bottom edge positioning. * @default Position.TOP */ - position?: Position; + position?: Position.TOP | Position.BOTTOM; } export interface IToasterState { @@ -163,12 +165,6 @@ export class Toaster extends AbstractPureComponent ); } - protected validateProps(props: IToasterProps) { - if (props.position === Position.LEFT || props.position === Position.RIGHT) { - console.warn(TOASTER_WARN_LEFT_RIGHT); - } - } - private renderToast(toast: IToastOptions) { return ; } @@ -179,7 +175,7 @@ export class Toaster extends AbstractPureComponent } private getPositionClasses() { - const positions = Position[this.props.position].split("_"); + const positions = this.props.position.split("_"); // NOTE that there is no -center class because that's the default style return positions.map(p => `${Classes.TOAST_CONTAINER}-${p.toLowerCase()}`); } From 77185da163f66069d6ce3c0582e779d6bfc13b1b Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:15:37 -0800 Subject: [PATCH 07/15] Just fix compilation for now --- packages/core/src/common/tetherUtils.ts | 8 ++++---- packages/table/src/quadrants/tableQuadrantStack.tsx | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/core/src/common/tetherUtils.ts b/packages/core/src/common/tetherUtils.ts index ef3d29934c..f847cd7964 100644 --- a/packages/core/src/common/tetherUtils.ts +++ b/packages/core/src/common/tetherUtils.ts @@ -54,8 +54,8 @@ export function createTetherOptions( } /** @internal */ -export function getTargetAttachment(position: Position) { - const attachments: { [p: number]: string } = { +export function getTargetAttachment(position: Position): string { + const attachments: Record = { [Position.TOP_LEFT]: "top left", [Position.TOP]: "top center", [Position.TOP_RIGHT]: "top right", @@ -73,8 +73,8 @@ export function getTargetAttachment(position: Position) { } /** @internal */ -export function getPopoverAttachment(position: Position) { - const attachments: { [p: number]: string } = { +export function getPopoverAttachment(position: Position): string { + const attachments: Record = { [Position.TOP_LEFT]: "bottom left", [Position.TOP]: "bottom center", [Position.TOP_RIGHT]: "bottom right", diff --git a/packages/table/src/quadrants/tableQuadrantStack.tsx b/packages/table/src/quadrants/tableQuadrantStack.tsx index c09aa24926..f56ff1811b 100644 --- a/packages/table/src/quadrants/tableQuadrantStack.tsx +++ b/packages/table/src/quadrants/tableQuadrantStack.tsx @@ -258,7 +258,7 @@ export class TableQuadrantStack extends AbstractComponent = { [QuadrantType.MAIN]: {}, [QuadrantType.TOP]: {}, [QuadrantType.LEFT]: {}, From 62531cc6b7f61a299a91d5d1d35220d56bfdc486 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:34:08 -0800 Subject: [PATCH 08/15] Fix test compilation, switch to dashes instead of underscores --- packages/core/src/common/position.ts | 16 ++++++++-------- packages/core/src/components/toast/toaster.tsx | 5 +++-- packages/core/test/popover/arrowsTests.ts | 12 ++++++------ packages/table/src/quadrants/tableQuadrant.tsx | 2 +- packages/table/test/loadingOptionsTests.tsx | 2 +- 5 files changed, 19 insertions(+), 18 deletions(-) diff --git a/packages/core/src/common/position.ts b/packages/core/src/common/position.ts index ba257f0b10..772a51a2e5 100644 --- a/packages/core/src/common/position.ts +++ b/packages/core/src/common/position.ts @@ -5,18 +5,18 @@ */ export enum Position { - TOP_LEFT = "top_left", + TOP_LEFT = "top-left", TOP = "top", - TOP_RIGHT = "top_right", - RIGHT_TOP = "right_top", + TOP_RIGHT = "top-right", + RIGHT_TOP = "right-top", RIGHT = "right", - RIGHT_BOTTOM = "right_bottom", - BOTTOM_RIGHT = "bottom_right", + RIGHT_BOTTOM = "right-bottom", + BOTTOM_RIGHT = "bottom-right", BOTTOM = "bottom", - BOTTOM_LEFT = "bottom_left", - LEFT_BOTTOM = "left_bottom", + BOTTOM_LEFT = "bottom-left", + LEFT_BOTTOM = "left-bottom", LEFT = "left", - LEFT_TOP = "left_top", + LEFT_TOP = "left-top", } export function isPositionHorizontal(position: Position) { diff --git a/packages/core/src/components/toast/toaster.tsx b/packages/core/src/components/toast/toaster.tsx index c6b159c0e4..f1a00ad131 100644 --- a/packages/core/src/components/toast/toaster.tsx +++ b/packages/core/src/components/toast/toaster.tsx @@ -72,7 +72,8 @@ export interface IToasterProps extends IProps { * supports the top and bottom edge positioning. * @default Position.TOP */ - position?: Position.TOP | Position.BOTTOM; + position?: Position.TOP | Position.TOP_LEFT | Position.TOP_RIGHT | + Position.BOTTOM | Position.BOTTOM_LEFT | Position.BOTTOM_RIGHT; } export interface IToasterState { @@ -175,7 +176,7 @@ export class Toaster extends AbstractPureComponent } private getPositionClasses() { - const positions = this.props.position.split("_"); + const positions = this.props.position.split("-"); // NOTE that there is no -center class because that's the default style return positions.map(p => `${Classes.TOAST_CONTAINER}-${p.toLowerCase()}`); } diff --git a/packages/core/test/popover/arrowsTests.ts b/packages/core/test/popover/arrowsTests.ts index 49c062c8fc..7e165df102 100644 --- a/packages/core/test/popover/arrowsTests.ts +++ b/packages/core/test/popover/arrowsTests.ts @@ -19,7 +19,7 @@ describe("Arrows", () => { const marginTop = Arrows.MIN_ARROW_SPACING - (dimensions.height - arrowSize) / 2; describe("getPopoverTransformOrigin", () => { - const origins: { [pos: number]: string } = { + const origins: Partial> = { [Position.TOP]: undefined, [Position.TOP_LEFT]: `${offsetX}px bottom`, [Position.TOP_RIGHT]: `calc(100% - ${offsetX}px) bottom`, @@ -29,16 +29,16 @@ describe("Arrows", () => { }; for (const key of Object.keys(origins)) { - const position: Position = +key; + const position = key as Position; const value: string = origins[position]; - it(`Position.${Position[position]} => ${value}`, () => { + it(`${position} => ${value}`, () => { assert.deepEqual(Arrows.getPopoverTransformOrigin(position, arrowSize, dimensions), value); }); } }); describe("getArrowPositionStyles", () => { - const styles: { [pos: number]: CSSProperties[] } = { + const styles: Partial> = { [Position.TOP_LEFT]: [{ left: offsetX }, { marginLeft: -0 }], [Position.TOP_RIGHT]: [{ right: offsetX }, { marginLeft: 0 }], [Position.BOTTOM_RIGHT]: [{ right: offsetX }, { marginLeft: 0 }], @@ -47,8 +47,8 @@ describe("Arrows", () => { }; for (const key of Object.keys(styles)) { - const position: Position = +key; - it(`Position.${Position[position]}`, () => { + const position = key as Position; + it(position, () => { const [expectedArrow, expectedContainer] = styles[position]; const { arrow, container } = Arrows.getArrowPositionStyles( position, diff --git a/packages/table/src/quadrants/tableQuadrant.tsx b/packages/table/src/quadrants/tableQuadrant.tsx index c614505dea..dfba1105ed 100644 --- a/packages/table/src/quadrants/tableQuadrant.tsx +++ b/packages/table/src/quadrants/tableQuadrant.tsx @@ -32,7 +32,7 @@ export enum QuadrantType { * The top-left quadrant, containing the headers and cells common to both * the frozen columns and frozen rows. */ - TOP_LEFT = "top_left", + TOP_LEFT = "top-left", } export interface ITableQuadrantProps extends IProps { diff --git a/packages/table/test/loadingOptionsTests.tsx b/packages/table/test/loadingOptionsTests.tsx index a8a84bee3d..a64ef52dbb 100644 --- a/packages/table/test/loadingOptionsTests.tsx +++ b/packages/table/test/loadingOptionsTests.tsx @@ -181,7 +181,7 @@ function testLoadingOptionOverrides( columnLoadingOptions != null ) { // cast is safe because cellType is guaranteed to not be TableLoadingOption.ROW_HEADERS - const loading = columnLoadingOptions.indexOf(cellType as ColumnLoadingOption) >= 0; + const loading = columnLoadingOptions.indexOf(cellType as any as ColumnLoadingOption) >= 0; expectCellLoading(cell, cellType, loading); } else if (tableLoadingOptions != null) { expectCellLoading(cell, cellType, tableLoadingOptions.indexOf(cellType) >= 0); From bd683bc683ce783f5b0e03b84331a755d60a3261 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:36:10 -0800 Subject: [PATCH 09/15] Switch to dashes instead of underscores for enum strings --- packages/table-dev-app/src/mutableTable.tsx | 8 ++++---- packages/table/src/cell/formats/truncatedFormat.tsx | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/table-dev-app/src/mutableTable.tsx b/packages/table-dev-app/src/mutableTable.tsx index e91ebcd5b1..5fd322d060 100644 --- a/packages/table-dev-app/src/mutableTable.tsx +++ b/packages/table-dev-app/src/mutableTable.tsx @@ -46,14 +46,14 @@ import { SlowLayoutStack } from "./slowLayoutStack"; export enum FocusStyle { TAB = "tab", - TAB_OR_CLICK = "tab_or_click", + TAB_OR_CLICK = "tab-or-click", } export enum CellContent { EMPTY = "empty", - CELL_NAMES = "cell_names", - LONG_TEXT = "long_text", - LARGE_JSON = "large_json", + CELL_NAMES = "cell-names", + LONG_TEXT = "long-text", + LARGE_JSON = "large-json", } type IMutableStateUpdateCallback = ( diff --git a/packages/table/src/cell/formats/truncatedFormat.tsx b/packages/table/src/cell/formats/truncatedFormat.tsx index 221ec257a6..7cc4f86241 100644 --- a/packages/table/src/cell/formats/truncatedFormat.tsx +++ b/packages/table/src/cell/formats/truncatedFormat.tsx @@ -22,8 +22,8 @@ const CONTENT_DIV_WIDTH_DELTA = 25; export enum TruncatedPopoverMode { ALWAYS = "always", NEVER = "never", - WHEN_TRUNCATED = "when_truncated", - WHEN_TRUNCATED_APPROX = "when_truncated_approx", + WHEN_TRUNCATED = "when-truncated", + WHEN_TRUNCATED_APPROX = "when-truncated-approx", } export interface ITrucatedFormateMeasureByApproximateOptions { From 2fc10c45fe8fb3b7c99234393c7283997d618880 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:40:41 -0800 Subject: [PATCH 10/15] lint --- packages/table/test/loadingOptionsTests.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/table/test/loadingOptionsTests.tsx b/packages/table/test/loadingOptionsTests.tsx index a64ef52dbb..bf78f7aa65 100644 --- a/packages/table/test/loadingOptionsTests.tsx +++ b/packages/table/test/loadingOptionsTests.tsx @@ -181,7 +181,7 @@ function testLoadingOptionOverrides( columnLoadingOptions != null ) { // cast is safe because cellType is guaranteed to not be TableLoadingOption.ROW_HEADERS - const loading = columnLoadingOptions.indexOf(cellType as any as ColumnLoadingOption) >= 0; + const loading = columnLoadingOptions.indexOf((cellType as any) as ColumnLoadingOption) >= 0; expectCellLoading(cell, cellType, loading); } else if (tableLoadingOptions != null) { expectCellLoading(cell, cellType, tableLoadingOptions.indexOf(cellType) >= 0); From 86e497c93398b7e864c6f1b5c9b5760cc516784c Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:53:01 -0800 Subject: [PATCH 11/15] Just kidding, use numbers for TimePickerPrecision --- packages/datetime/src/timePicker.tsx | 6 +++--- packages/table-dev-app/src/features.tsx | 10 +++++++++- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/datetime/src/timePicker.tsx b/packages/datetime/src/timePicker.tsx index 92c0348026..43a7317ca6 100644 --- a/packages/datetime/src/timePicker.tsx +++ b/packages/datetime/src/timePicker.tsx @@ -13,9 +13,9 @@ import * as DateUtils from "./common/dateUtils"; import * as Utils from "./common/utils"; export enum TimePickerPrecision { - MINUTE = "minute", - SECOND = "second", - MILLISECOND = "millisecond", + MINUTE = 0, + SECOND = 1, + MILLISECOND = 2, } export interface ITimePickerProps extends IProps { diff --git a/packages/table-dev-app/src/features.tsx b/packages/table-dev-app/src/features.tsx index d16f7267fd..352e64ee57 100644 --- a/packages/table-dev-app/src/features.tsx +++ b/packages/table-dev-app/src/features.tsx @@ -418,13 +418,21 @@ class AdjustableColumnsTable extends React.Component<{}, {}> { ReactDOM.render(, document.getElementById("table-cols")); +const intentRows: Intent[] = [ + Intent.NONE, + Intent.PRIMARY, + Intent.SUCCESS, + Intent.WARNING, + Intent.DANGER, +]; + ReactDOM.render( getTableComponent( 3, 7, { cellRenderer(rowIndex: number, columnIndex: number) { - return {Utils.toBase26Alpha(columnIndex) + (rowIndex + 1)}; + return {Utils.toBase26Alpha(columnIndex) + (rowIndex + 1)}; }, }, { From 53b2d2c525ede01dacaea1aa74db1498ce61e4d0 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Thu, 14 Dec 2017 16:59:44 -0800 Subject: [PATCH 12/15] lint --- packages/table-dev-app/src/features.tsx | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/packages/table-dev-app/src/features.tsx b/packages/table-dev-app/src/features.tsx index 352e64ee57..40d3a6a867 100644 --- a/packages/table-dev-app/src/features.tsx +++ b/packages/table-dev-app/src/features.tsx @@ -418,13 +418,7 @@ class AdjustableColumnsTable extends React.Component<{}, {}> { ReactDOM.render(, document.getElementById("table-cols")); -const intentRows: Intent[] = [ - Intent.NONE, - Intent.PRIMARY, - Intent.SUCCESS, - Intent.WARNING, - Intent.DANGER, -]; +const intentRows: Intent[] = [Intent.NONE, Intent.PRIMARY, Intent.SUCCESS, Intent.WARNING, Intent.DANGER]; ReactDOM.render( getTableComponent( From 9b042f144eb813839e19a321ff87c9be08283792 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Fri, 15 Dec 2017 10:55:56 -0800 Subject: [PATCH 13/15] lint-fix --- packages/core/src/components/toast/toaster.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/core/src/components/toast/toaster.tsx b/packages/core/src/components/toast/toaster.tsx index f1a00ad131..4a195d6666 100644 --- a/packages/core/src/components/toast/toaster.tsx +++ b/packages/core/src/components/toast/toaster.tsx @@ -72,8 +72,13 @@ export interface IToasterProps extends IProps { * supports the top and bottom edge positioning. * @default Position.TOP */ - position?: Position.TOP | Position.TOP_LEFT | Position.TOP_RIGHT | - Position.BOTTOM | Position.BOTTOM_LEFT | Position.BOTTOM_RIGHT; + position?: + | Position.TOP + | Position.TOP_LEFT + | Position.TOP_RIGHT + | Position.BOTTOM + | Position.BOTTOM_LEFT + | Position.BOTTOM_RIGHT; } export interface IToasterState { From bbbed6a2aaa4df57788e2f494131cff7e3ec1f92 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Fri, 15 Dec 2017 11:10:14 -0800 Subject: [PATCH 14/15] Fix docs examples --- .../docs-app/src/examples/core-examples/buttonsExample.tsx | 4 ++-- .../src/examples/core-examples/collapsibleListExample.tsx | 4 ++-- .../src/examples/core-examples/editableTextExample.tsx | 4 ++-- .../src/examples/core-examples/numericInputBasicExample.tsx | 4 ++-- .../docs-app/src/examples/core-examples/popover2Example.tsx | 2 +- .../docs-app/src/examples/core-examples/popoverExample.tsx | 2 +- .../docs-app/src/examples/core-examples/progressExample.tsx | 4 ++-- packages/docs-app/src/examples/core-examples/toastExample.tsx | 4 ++-- 8 files changed, 14 insertions(+), 14 deletions(-) diff --git a/packages/docs-app/src/examples/core-examples/buttonsExample.tsx b/packages/docs-app/src/examples/core-examples/buttonsExample.tsx index e8030b4cf1..338a7300d8 100644 --- a/packages/docs-app/src/examples/core-examples/buttonsExample.tsx +++ b/packages/docs-app/src/examples/core-examples/buttonsExample.tsx @@ -8,7 +8,7 @@ import * as classNames from "classnames"; import * as React from "react"; import { AnchorButton, Button, Classes, Intent, Switch } from "@blueprintjs/core"; -import { BaseExample, handleBooleanChange, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleBooleanChange, handleStringChange } from "@blueprintjs/docs"; import { IntentSelect } from "./common/intentSelect"; export interface IButtonsExampleState { @@ -36,7 +36,7 @@ export class ButtonsExample extends BaseExample { private handleLargeChange = handleBooleanChange(large => this.setState({ large })); private handleLoadingChange = handleBooleanChange(loading => this.setState({ loading })); private handleMinimalChange = handleBooleanChange(minimal => this.setState({ minimal })); - private handleIntentChange = handleNumberChange((intent: Intent) => this.setState({ intent })); + private handleIntentChange = handleStringChange((intent: Intent) => this.setState({ intent })); private wiggleTimeoutId: number; diff --git a/packages/docs-app/src/examples/core-examples/collapsibleListExample.tsx b/packages/docs-app/src/examples/core-examples/collapsibleListExample.tsx index 4579fab886..78402702fa 100644 --- a/packages/docs-app/src/examples/core-examples/collapsibleListExample.tsx +++ b/packages/docs-app/src/examples/core-examples/collapsibleListExample.tsx @@ -16,7 +16,7 @@ import { RadioGroup, Slider, } from "@blueprintjs/core"; -import { BaseExample, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleStringChange } from "@blueprintjs/docs"; export interface ICollapsibleListExampleState { collapseFrom?: CollapseFrom; @@ -34,7 +34,7 @@ export class CollapsibleListExample extends BaseExample this.setState({ collapseFrom })); + private handleChangeCollapse = handleStringChange((collapseFrom: CollapseFrom) => this.setState({ collapseFrom })); protected renderExample() { return ( diff --git a/packages/docs-app/src/examples/core-examples/editableTextExample.tsx b/packages/docs-app/src/examples/core-examples/editableTextExample.tsx index 2a0d336485..16cee3c3e4 100644 --- a/packages/docs-app/src/examples/core-examples/editableTextExample.tsx +++ b/packages/docs-app/src/examples/core-examples/editableTextExample.tsx @@ -8,7 +8,7 @@ import * as classNames from "classnames"; import * as React from "react"; import { Classes, EditableText, Intent, NumericInput, Switch } from "@blueprintjs/core"; -import { BaseExample, handleBooleanChange, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleBooleanChange, handleStringChange } from "@blueprintjs/docs"; import { IntentSelect } from "./common/intentSelect"; const INPUT_ID = "EditableTextExample-max-length"; @@ -28,7 +28,7 @@ export class EditableTextExample extends BaseExample selectAllOnFocus: false, }; - private handleIntentChange = handleNumberChange((intent: Intent) => this.setState({ intent })); + private handleIntentChange = handleStringChange((intent: Intent) => this.setState({ intent })); private toggleSelectAll = handleBooleanChange(selectAllOnFocus => this.setState({ selectAllOnFocus })); private toggleSwap = handleBooleanChange(confirmOnEnterKey => this.setState({ confirmOnEnterKey })); diff --git a/packages/docs-app/src/examples/core-examples/numericInputBasicExample.tsx b/packages/docs-app/src/examples/core-examples/numericInputBasicExample.tsx index 59e90589b6..9dd27f8d3d 100644 --- a/packages/docs-app/src/examples/core-examples/numericInputBasicExample.tsx +++ b/packages/docs-app/src/examples/core-examples/numericInputBasicExample.tsx @@ -7,7 +7,7 @@ import * as classNames from "classnames"; import * as React from "react"; import { Classes, Intent, NumericInput, Position, Switch } from "@blueprintjs/core"; -import { BaseExample, handleBooleanChange, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleBooleanChange, handleNumberChange, handleStringChange } from "@blueprintjs/docs"; import { IntentSelect } from "./common/intentSelect"; @@ -85,7 +85,7 @@ export class NumericInputBasicExample extends BaseExample this.setState({ maxValueIndex })); private handleMinValueChange = handleNumberChange(minValueIndex => this.setState({ minValueIndex })); - private handleIntentChange = handleNumberChange((intent: Intent) => this.setState({ intent })); + private handleIntentChange = handleStringChange((intent: Intent) => this.setState({ intent })); private handleButtonPositionChange = handleNumberChange(buttonPositionIndex => { this.setState({ buttonPositionIndex }); diff --git a/packages/docs-app/src/examples/core-examples/popover2Example.tsx b/packages/docs-app/src/examples/core-examples/popover2Example.tsx index 925655f658..2587a96f8a 100644 --- a/packages/docs-app/src/examples/core-examples/popover2Example.tsx +++ b/packages/docs-app/src/examples/core-examples/popover2Example.tsx @@ -74,7 +74,7 @@ export class Popover2Example extends BaseExample { protected className = "docs-popover2-example"; private handleExampleIndexChange = handleNumberChange(exampleIndex => this.setState({ exampleIndex })); - private handleInteractionChange = handleNumberChange(interactionKind => { + private handleInteractionChange = handleStringChange((interactionKind: PopoverInteractionKind) => { const hasBackdrop = this.state.hasBackdrop && interactionKind === PopoverInteractionKind.CLICK; this.setState({ interactionKind, hasBackdrop }); }); diff --git a/packages/docs-app/src/examples/core-examples/popoverExample.tsx b/packages/docs-app/src/examples/core-examples/popoverExample.tsx index 83fc8e5d5a..0ed8360219 100644 --- a/packages/docs-app/src/examples/core-examples/popoverExample.tsx +++ b/packages/docs-app/src/examples/core-examples/popoverExample.tsx @@ -88,7 +88,7 @@ export class PopoverExample extends BaseExample { this.setState({ tetherConstraints: JSON.parse(constraints) }); }); private handleExampleIndexChange = handleNumberChange(exampleIndex => this.setState({ exampleIndex })); - private handleInteractionChange = handleNumberChange(interactionKind => { + private handleInteractionChange = handleStringChange((interactionKind: PopoverInteractionKind) => { const isModal = this.state.isModal && interactionKind === PopoverInteractionKind.CLICK; this.setState({ interactionKind, isModal }); }); diff --git a/packages/docs-app/src/examples/core-examples/progressExample.tsx b/packages/docs-app/src/examples/core-examples/progressExample.tsx index 8bc0097103..6ed3cace67 100644 --- a/packages/docs-app/src/examples/core-examples/progressExample.tsx +++ b/packages/docs-app/src/examples/core-examples/progressExample.tsx @@ -7,7 +7,7 @@ import * as React from "react"; import { Intent, ProgressBar, Slider, Switch } from "@blueprintjs/core"; -import { BaseExample, handleBooleanChange, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleBooleanChange, handleStringChange } from "@blueprintjs/docs"; import { IntentSelect } from "./common/intentSelect"; export interface IProgressExampleState { @@ -26,7 +26,7 @@ export class ProgressExample extends BaseExample { protected className = "docs-progress-example"; private handleIndeterminateChange = handleBooleanChange(hasValue => this.setState({ hasValue })); - private handleModifierChange = handleNumberChange(intent => this.setState({ intent })); + private handleModifierChange = handleStringChange((intent: Intent) => this.setState({ intent })); protected renderExample() { const { hasValue, intent, value } = this.state; diff --git a/packages/docs-app/src/examples/core-examples/toastExample.tsx b/packages/docs-app/src/examples/core-examples/toastExample.tsx index b225a04f19..28ab643af5 100644 --- a/packages/docs-app/src/examples/core-examples/toastExample.tsx +++ b/packages/docs-app/src/examples/core-examples/toastExample.tsx @@ -18,7 +18,7 @@ import { Switch, Toaster, } from "@blueprintjs/core"; -import { BaseExample, handleBooleanChange, handleNumberChange } from "@blueprintjs/docs"; +import { BaseExample, handleBooleanChange, handleStringChange } from "@blueprintjs/docs"; type IToastDemo = IToastProps & { button: string }; @@ -88,7 +88,7 @@ export class ToastExample extends BaseExample { toaster: (ref: Toaster) => (this.toaster = ref), }; - private handlePositionChange = handleNumberChange(position => this.setState({ position })); + private handlePositionChange = handleStringChange((position: Position) => this.setState({ position })); private toggleAutoFocus = handleBooleanChange(autoFocus => this.setState({ autoFocus })); private toggleEscapeKey = handleBooleanChange(canEscapeKeyClear => this.setState({ canEscapeKeyClear })); From 9be4479798d02c1d968644511bd0fd24c98bfc48 Mon Sep 17 00:00:00 2001 From: Bill Dwyer Date: Fri, 15 Dec 2017 11:23:17 -0800 Subject: [PATCH 15/15] Fix more docs examples --- packages/core/src/components/toast/toaster.tsx | 15 ++++++++------- .../src/examples/core-examples/popoverExample.tsx | 2 +- .../src/examples/core-examples/toastExample.tsx | 3 ++- 3 files changed, 11 insertions(+), 9 deletions(-) diff --git a/packages/core/src/components/toast/toaster.tsx b/packages/core/src/components/toast/toaster.tsx index 4a195d6666..74bc2f8f60 100644 --- a/packages/core/src/components/toast/toaster.tsx +++ b/packages/core/src/components/toast/toaster.tsx @@ -19,6 +19,13 @@ import { Overlay } from "../overlay/overlay"; import { IToastProps, Toast } from "./toast"; export type IToastOptions = IToastProps & { key?: string }; +export type ToasterPosition = + | Position.TOP + | Position.TOP_LEFT + | Position.TOP_RIGHT + | Position.BOTTOM + | Position.BOTTOM_LEFT + | Position.BOTTOM_RIGHT; export interface IToaster { /** Show a new toast to the user. Returns the unique key of the new toast. */ @@ -72,13 +79,7 @@ export interface IToasterProps extends IProps { * supports the top and bottom edge positioning. * @default Position.TOP */ - position?: - | Position.TOP - | Position.TOP_LEFT - | Position.TOP_RIGHT - | Position.BOTTOM - | Position.BOTTOM_LEFT - | Position.BOTTOM_RIGHT; + position?: ToasterPosition; } export interface IToasterState { diff --git a/packages/docs-app/src/examples/core-examples/popoverExample.tsx b/packages/docs-app/src/examples/core-examples/popoverExample.tsx index 0ed8360219..3257f2935f 100644 --- a/packages/docs-app/src/examples/core-examples/popoverExample.tsx +++ b/packages/docs-app/src/examples/core-examples/popoverExample.tsx @@ -92,7 +92,7 @@ export class PopoverExample extends BaseExample { const isModal = this.state.isModal && interactionKind === PopoverInteractionKind.CLICK; this.setState({ interactionKind, isModal }); }); - private handlePositionChange = handleNumberChange(position => this.setState({ position })); + private handlePositionChange = handleStringChange((position: Position) => this.setState({ position })); private toggleArrows = handleBooleanChange(useSmartArrowPositioning => { this.setState({ useSmartArrowPositioning }); diff --git a/packages/docs-app/src/examples/core-examples/toastExample.tsx b/packages/docs-app/src/examples/core-examples/toastExample.tsx index 28ab643af5..f17793f14e 100644 --- a/packages/docs-app/src/examples/core-examples/toastExample.tsx +++ b/packages/docs-app/src/examples/core-examples/toastExample.tsx @@ -17,6 +17,7 @@ import { ProgressBar, Switch, Toaster, + ToasterPosition, } from "@blueprintjs/core"; import { BaseExample, handleBooleanChange, handleStringChange } from "@blueprintjs/docs"; @@ -88,7 +89,7 @@ export class ToastExample extends BaseExample { toaster: (ref: Toaster) => (this.toaster = ref), }; - private handlePositionChange = handleStringChange((position: Position) => this.setState({ position })); + private handlePositionChange = handleStringChange((position: ToasterPosition) => this.setState({ position })); private toggleAutoFocus = handleBooleanChange(autoFocus => this.setState({ autoFocus })); private toggleEscapeKey = handleBooleanChange(canEscapeKeyClear => this.setState({ canEscapeKeyClear }));