From 34d34c47ad0c4a09ac3ab6aae79785ed9c7d97b9 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Fri, 19 Jul 2024 12:24:36 -0700 Subject: [PATCH 01/12] chore: add messaging to deprecated components --- .../pick-list-group/pick-list-group.tsx | 7 ++ .../pick-list-item/pick-list-item.tsx | 7 ++ .../src/components/pick-list/pick-list.tsx | 7 ++ .../tile-select-group/tile-select-group.tsx | 7 ++ .../components/tile-select/tile-select.tsx | 7 ++ .../src/components/tip-group/tip-group.tsx | 7 ++ .../components/tip-manager/tip-manager.tsx | 7 ++ .../src/components/tip/tip.tsx | 7 ++ .../src/components/value-list/value-list.tsx | 7 ++ .../src/tests/setupTests.ts | 8 +- .../calcite-components/src/utils/config.ts | 8 ++ .../src/utils/focusTrapComponent.spec.ts | 2 +- .../src/utils/logger.spec.ts | 86 +++++++++++++++++++ .../calcite-components/src/utils/logger.ts | 84 ++++++++++++++++++ 14 files changed, 246 insertions(+), 5 deletions(-) create mode 100644 packages/calcite-components/src/utils/logger.spec.ts create mode 100644 packages/calcite-components/src/utils/logger.ts diff --git a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx index c76c1ea857a..4ba54fb8559 100644 --- a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx +++ b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx @@ -6,8 +6,15 @@ import { } from "../../utils/conditionalSlot"; import { getSlotted } from "../../utils/dom"; import { constrainHeadingLevel, Heading, HeadingLevel } from "../functional/Heading"; +import { logger } from "../../utils/logger"; import { CSS, SLOTS } from "./resources"; +logger.deprecated("component", { + name: "calcite-pick-list-item-group", + removalVersion: 3, + suggested: "calcite-list-item-group", +}); + /** * @deprecated Use the `calcite-list` component instead. * @slot - A slot for adding `calcite-pick-list-item` elements. diff --git a/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx b/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx index 92735917fec..6b11f53d9ca 100644 --- a/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx +++ b/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx @@ -38,9 +38,16 @@ import { updateMessages, } from "../../utils/t9n"; import { ICON_TYPES } from "../pick-list/resources"; +import { logger } from "../../utils/logger"; import { PickListItemMessages } from "./assets/pick-list-item/t9n"; import { CSS, ICONS, SLOTS } from "./resources"; +logger.deprecated("component", { + name: "calcite-pick-list", + removalVersion: 3, + suggested: "calcite-list", +}); + /** * @deprecated Use the `calcite-list` component instead. * @slot actions-end - A slot for adding `calcite-action`s or content to the end side of the component. diff --git a/packages/calcite-components/src/components/pick-list/pick-list.tsx b/packages/calcite-components/src/components/pick-list/pick-list.tsx index 5d9667c8d59..a9a3a64576a 100644 --- a/packages/calcite-components/src/components/pick-list/pick-list.tsx +++ b/packages/calcite-components/src/components/pick-list/pick-list.tsx @@ -25,6 +25,7 @@ import { import { createObserver } from "../../utils/observers"; import { HeadingLevel } from "../functional/Heading"; import type { ValueUnion } from "../types"; +import { logger } from "../../utils/logger"; import { ICON_TYPES } from "./resources"; import { calciteInternalListItemValueChangeHandler, @@ -50,6 +51,12 @@ import { } from "./shared-list-logic"; import List from "./shared-list-render"; +logger.deprecated("component", { + name: "calcite-pick-list-item", + removalVersion: 3, + suggested: "calcite-list-item", +}); + /** * @deprecated Use the `calcite-list` component instead. * @slot - A slot for adding `calcite-pick-list-item` or `calcite-pick-list-group` elements. Items are displayed as a vertical list. diff --git a/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx b/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx index 6ca4f1e3540..5a30578b46a 100644 --- a/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx +++ b/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx @@ -6,8 +6,15 @@ import { InteractiveContainer, updateHostInteraction, } from "../../utils/interactive"; +import { logger } from "../../utils/logger"; import { TileSelectGroupLayout } from "./interfaces"; +logger.deprecated("component", { + name: "calcite-tile-select-group", + removalVersion: 4, + suggested: ["calcite-tile", "calcite-tile-group"], +}); + /** * @deprecated Use the `calcite-tile-group` component instead. * @slot - A slot for adding `calcite-tile-select` elements. diff --git a/packages/calcite-components/src/components/tile-select/tile-select.tsx b/packages/calcite-components/src/components/tile-select/tile-select.tsx index f4501318f28..fe5c84a6c6b 100644 --- a/packages/calcite-components/src/components/tile-select/tile-select.tsx +++ b/packages/calcite-components/src/components/tile-select/tile-select.tsx @@ -27,9 +27,16 @@ import { } from "../../utils/loadable"; import { Alignment, Width } from "../interfaces"; import { IconName } from "../icon/interfaces"; +import { logger } from "../../utils/logger"; import { TileSelectType } from "./interfaces"; import { CSS } from "./resources"; +logger.deprecated("component", { + name: "calcite-tile-select", + removalVersion: 4, + suggested: ["calcite-tile", "calcite-tile-group"], +}); + /** * @deprecated Use the `calcite-tile` component instead. * @slot - A slot for adding custom content. diff --git a/packages/calcite-components/src/components/tip-group/tip-group.tsx b/packages/calcite-components/src/components/tip-group/tip-group.tsx index 9c785a339c4..7e41e9f5764 100644 --- a/packages/calcite-components/src/components/tip-group/tip-group.tsx +++ b/packages/calcite-components/src/components/tip-group/tip-group.tsx @@ -1,4 +1,11 @@ import { Component, h, Prop, VNode } from "@stencil/core"; +import { logger } from "../../utils/logger"; + +logger.deprecated("component", { + name: "calcite-tip-group", + removalVersion: 4, + suggested: ["calcite-carousel", "calcite-carousel-item"], +}); /** * @deprecated Use the `calcite-carousel` and `calcite-carousel-item` components instead. diff --git a/packages/calcite-components/src/components/tip-manager/tip-manager.tsx b/packages/calcite-components/src/components/tip-manager/tip-manager.tsx index 6df1efea907..c22d0d3281f 100644 --- a/packages/calcite-components/src/components/tip-manager/tip-manager.tsx +++ b/packages/calcite-components/src/components/tip-manager/tip-manager.tsx @@ -20,9 +20,16 @@ import { updateMessages, } from "../../utils/t9n"; import { Heading, HeadingLevel } from "../functional/Heading"; +import { logger } from "../../utils/logger"; import { TipManagerMessages } from "./assets/tip-manager/t9n"; import { CSS, ICONS } from "./resources"; +logger.deprecated("component", { + name: "calcite-tip-manager", + removalVersion: 4, + suggested: "calcite-carousel", +}); + /** * @deprecated Use the `calcite-carousel` and `calcite-carousel-item` components instead. * @slot - A slot for adding `calcite-tip`s. diff --git a/packages/calcite-components/src/components/tip/tip.tsx b/packages/calcite-components/src/components/tip/tip.tsx index e952d422709..aead393cc21 100644 --- a/packages/calcite-components/src/components/tip/tip.tsx +++ b/packages/calcite-components/src/components/tip/tip.tsx @@ -25,9 +25,16 @@ import { updateMessages, } from "../../utils/t9n"; import { constrainHeadingLevel, Heading, HeadingLevel } from "../functional/Heading"; +import { logger } from "../../utils/logger"; import { TipMessages } from "./assets/tip/t9n"; import { CSS, ICONS, SLOTS } from "./resources"; +logger.deprecated("component", { + name: "calcite-tip", + removalVersion: 4, + suggested: ["calcite-card", "calcite-notice", "calcite-panel", "calcite-tile"], +}); + /** * @deprecated Use the `calcite-card`, `calcite-notice`, `calcite-panel`, or `calcite-tile` component instead. * @slot - A slot for adding text and a hyperlink. diff --git a/packages/calcite-components/src/components/value-list/value-list.tsx b/packages/calcite-components/src/components/value-list/value-list.tsx index 75041334b4d..95946f57d26 100644 --- a/packages/calcite-components/src/components/value-list/value-list.tsx +++ b/packages/calcite-components/src/components/value-list/value-list.tsx @@ -65,10 +65,17 @@ import { SortableComponent, } from "../../utils/sortableComponent"; import { focusElement } from "../../utils/dom"; +import { logger } from "../../utils/logger"; import { ValueListMessages } from "./assets/value-list/t9n"; import { CSS, ICON_TYPES } from "./resources"; import { getHandleAndItemElement, getScreenReaderText } from "./utils"; +logger.deprecated("component", { + name: "calcite-value-list", + removalVersion: 3, + suggested: "calcite-list", +}); + /** * @deprecated Use the `calcite-list` component instead. * @slot - A slot for adding `calcite-value-list-item` elements. List items are displayed as a vertical list. diff --git a/packages/calcite-components/src/tests/setupTests.ts b/packages/calcite-components/src/tests/setupTests.ts index cf9ae4f3c09..92e1ca31348 100644 --- a/packages/calcite-components/src/tests/setupTests.ts +++ b/packages/calcite-components/src/tests/setupTests.ts @@ -1,14 +1,14 @@ let globalError: jest.SpyInstance; -let globalLog: jest.SpyInstance; +let globalInfo: jest.SpyInstance; beforeAll(() => { globalError = jest.spyOn(global.console, "error"); - globalLog = jest.spyOn(global.console, "info").mockImplementation(() => null); + globalInfo = jest.spyOn(global.console, "info").mockImplementation(() => null); }); beforeEach(() => { globalError.mockClear(); - globalLog.mockClear(); + globalInfo.mockClear(); }); // eslint-disable-next-line jest/no-standalone-expect @@ -16,5 +16,5 @@ afterEach(() => expect(globalError).not.toHaveBeenCalled()); afterAll(() => { globalError.mockRestore(); - globalLog.mockRestore(); + globalInfo.mockRestore(); }); diff --git a/packages/calcite-components/src/utils/config.ts b/packages/calcite-components/src/utils/config.ts index 988a5250a0d..7f04c69a503 100644 --- a/packages/calcite-components/src/utils/config.ts +++ b/packages/calcite-components/src/utils/config.ts @@ -3,6 +3,7 @@ */ import { FocusTrap } from "./focusTrapComponent"; +import { LogLevel } from "./logger"; export interface CalciteConfig { /** @@ -14,6 +15,11 @@ export interface CalciteConfig { */ focusTrapStack: FocusTrap[]; + /** + * Defines the global log level to use when logging messages. + */ + logLevel: LogLevel; + /** * Contains the version of the Calcite components. * @@ -26,6 +32,8 @@ const existingConfig: CalciteConfig = globalThis["calciteConfig"]; export const focusTrapStack: FocusTrap[] = existingConfig?.focusTrapStack || []; +export const logLevel: LogLevel = existingConfig?.logLevel || "info"; + // the following placeholders are replaced by the build const version = "__CALCITE_VERSION__"; const buildDate = "__CALCITE_BUILD_DATE__"; diff --git a/packages/calcite-components/src/utils/focusTrapComponent.spec.ts b/packages/calcite-components/src/utils/focusTrapComponent.spec.ts index f98958b408f..b440d91b421 100644 --- a/packages/calcite-components/src/utils/focusTrapComponent.spec.ts +++ b/packages/calcite-components/src/utils/focusTrapComponent.spec.ts @@ -72,7 +72,7 @@ describe("focusTrapComponent", () => { window = win as any as Window & typeof globalThis; globalThis.MutationObserver = window.MutationObserver; // needed for focus-trap - type TestGlobal = GlobalTestProps<{ calciteConfig: CalciteConfig }>; + type TestGlobal = GlobalTestProps<{ calciteConfig: Pick }>; (globalThis as TestGlobal).calciteConfig = { focusTrapStack: customFocusTrapStack, diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts new file mode 100644 index 00000000000..c20715cca4f --- /dev/null +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -0,0 +1,86 @@ +import { loggedDeprecations, logger } from "./logger"; + +describe("logger", () => { + describe("deprecated", () => { + let spy: jest.SpyInstance; + + beforeEach(() => { + spy = jest.spyOn(console, "warn").mockImplementation(() => {}); + loggedDeprecations.clear(); + }); + + afterEach(() => { + spy.mockRestore(); + }); + + it("helps log planned deprecations", () => { + const options = { + name: "calcite-foo", + removalVersion: 3, + }; + + logger.deprecated("component", options); + + expect(spy).toHaveBeenCalled(); + expect(spy.mock.calls[0][2]).toMatch( + `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}.`, + ); + }); + + it("helps log future deprecations", () => { + const options = { + name: "calcite-foo", + removalVersion: "future" as const, + }; + + logger.deprecated("component", options); + + expect(spy).toHaveBeenCalled(); + expect(spy.mock.calls[0][2]).toMatch( + `[${options.name}] component is deprecated and will be removed in a future version.`, + ); + }); + + it("shows deprecation suggestions (single)", () => { + const options = { + name: "calcite-foo", + removalVersion: 3, + suggested: "calcite-bar", + }; + + logger.deprecated("component", options); + + expect(spy).toHaveBeenCalled(); + expect(spy.mock.calls[0][2]).toMatch( + `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested}" instead.`, + ); + }); + + it("shows deprecation suggestions (multiple)", () => { + const options = { + name: "calcite-foo", + removalVersion: 3, + suggested: ["calcite-bar", "calcite-baz"], + }; + + logger.deprecated("component", options); + + expect(spy).toHaveBeenCalled(); + expect(spy.mock.calls[0][2]).toMatch( + `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested.join(`" or "`)}" instead.`, + ); + }); + + it("logs once per component", () => { + const options = { + name: "calcite-foo", + removalVersion: 3, + }; + + logger.deprecated("component", options); + logger.deprecated("component", options); + + expect(spy).toHaveBeenCalledTimes(1); + }); + }); +}); diff --git a/packages/calcite-components/src/utils/logger.ts b/packages/calcite-components/src/utils/logger.ts new file mode 100644 index 00000000000..349488daad7 --- /dev/null +++ b/packages/calcite-components/src/utils/logger.ts @@ -0,0 +1,84 @@ +import { logLevel } from "./config"; + +export type LogLevel = "debug" | "info" | "warn" | "error" | "trace"; + +type Message = string; +type MajorVersion = number; + +type DeprecatedContext = "component" | "property" | "method" | "event" | "slot"; +type DeprecatedParams = { + name: string; + suggested?: string | string[]; + component?: string; + removalVersion: MajorVersion | "future"; +}; + +/** + * Exported for testing purposes only + */ +export const loggedDeprecations = new Set(); + +const logLevels = { + debug: 1, + info: 2, + warn: 4, + error: 8, +} as const; + +function willLog(level: LogLevel): boolean { + return logLevels[level] >= logLevels[logLevel]; +} + +function forwardToConsole(level: LogLevel, ...data: any[]): void { + if (!willLog(level)) { + return; + } + + const badgeTemplate = "%ccalcite"; + const badgeStyle = "background: #007AC2; color: #fff; border-radius: 4px;padding: 2px 4px;"; + + console[level].call(this, badgeTemplate, badgeStyle, ...data); +} + +let listFormatter: Intl.ListFormat; + +export const logger = { + debug: (message: Message) => forwardToConsole("debug", message), + info: (message: Message) => forwardToConsole("info", message), + warn: (message: Message) => forwardToConsole("warn", message), + error: (message: Message) => forwardToConsole("error", message), + trace: (message: Message) => forwardToConsole("trace", message), + + deprecated, +} as const; + +/** + * Logs a deprecation warning to the console. + * + * @param context the context in which the deprecation is occurring + * @param params the deprecation details + */ +function deprecated(context: Exclude, params: DeprecatedParams): void; +function deprecated(context: "component", params: Omit): void; +function deprecated( + context: DeprecatedContext, + { component, name, suggested, removalVersion }: DeprecatedParams, +): void { + const key = `${context}:${context === "component" ? "" : component}${name}`; + + if (loggedDeprecations.has(key)) { + return; + } + + loggedDeprecations.add(key); + + const multiSuggestions = Array.isArray(suggested); + + if (multiSuggestions && !listFormatter) { + listFormatter = new Intl.ListFormat("en", { style: "long", type: "disjunction" }); + } + + const message = `[${name}] ${context} is deprecated and will be removed in ${removalVersion === "future" ? `a future version` : `v${removalVersion}`}.${suggested ? ` Use ${multiSuggestions ? listFormatter.format(suggested.map((suggestion) => `"${suggestion}"`)) : `"${suggested}"`} instead.` : ""}`; + + forwardToConsole("warn", message); +} From 5c01c4134180d174a31e85fd38b608579c3fff65 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 16:35:27 -0700 Subject: [PATCH 02/12] add default config log level test --- packages/calcite-components/src/utils/config.spec.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/calcite-components/src/utils/config.spec.ts b/packages/calcite-components/src/utils/config.spec.ts index 8b43721e749..a3917c5079a 100644 --- a/packages/calcite-components/src/utils/config.spec.ts +++ b/packages/calcite-components/src/utils/config.spec.ts @@ -13,6 +13,7 @@ describe("config", () => { it("has defaults", async () => { config = await loadConfig(); expect(config.focusTrapStack).toHaveLength(0); + expect(config.logLevel).toBe("info"); }); it("allows custom configuration", async () => { From bc45b281efd4502fefb43006b274ad918969bda8 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 16:36:31 -0700 Subject: [PATCH 03/12] add `none` and `trace` levels along with tests --- .../src/utils/logger.spec.ts | 129 +++++++++++++++--- .../calcite-components/src/utils/logger.ts | 4 +- 2 files changed, 112 insertions(+), 21 deletions(-) diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index c20715cca4f..f6d8cc78e75 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -1,18 +1,40 @@ -import { loggedDeprecations, logger } from "./logger"; +import { LogLevel } from "./logger"; describe("logger", () => { - describe("deprecated", () => { - let spy: jest.SpyInstance; - - beforeEach(() => { - spy = jest.spyOn(console, "warn").mockImplementation(() => {}); - loggedDeprecations.clear(); - }); + type LoggerModule = typeof import("./logger"); + + let loggerModule: LoggerModule; + let logger: LoggerModule["logger"]; + + let debugSpy: jest.SpyInstance; + let errorSpy: jest.SpyInstance; + let infoSpy: jest.SpyInstance; + let traceSpy: jest.SpyInstance; + let warnSpy: jest.SpyInstance; + + beforeEach(async () => { + const noop = () => { + /* intentional noop */ + }; + + debugSpy = jest.spyOn(console, "debug").mockImplementation(noop); + errorSpy = jest.spyOn(console, "error").mockImplementation(noop); + infoSpy = jest.spyOn(console, "info").mockImplementation(noop); + traceSpy = jest.spyOn(console, "trace").mockImplementation(noop); + warnSpy = jest.spyOn(console, "warn").mockImplementation(noop); + + jest.resetModules(); + loggerModule = await import("./logger"); + logger = loggerModule.logger; + loggerModule.loggedDeprecations.clear(); + }); - afterEach(() => { - spy.mockRestore(); - }); + afterEach(() => { + jest.restoreAllMocks(); + delete (globalThis as TestGlobal).calciteConfig; + }); + describe("deprecated", () => { it("helps log planned deprecations", () => { const options = { name: "calcite-foo", @@ -21,8 +43,8 @@ describe("logger", () => { logger.deprecated("component", options); - expect(spy).toHaveBeenCalled(); - expect(spy.mock.calls[0][2]).toMatch( + expect(warnSpy).toHaveBeenCalled(); + expect(warnSpy.mock.calls[0][2]).toMatch( `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}.`, ); }); @@ -35,8 +57,8 @@ describe("logger", () => { logger.deprecated("component", options); - expect(spy).toHaveBeenCalled(); - expect(spy.mock.calls[0][2]).toMatch( + expect(warnSpy).toHaveBeenCalled(); + expect(warnSpy.mock.calls[0][2]).toMatch( `[${options.name}] component is deprecated and will be removed in a future version.`, ); }); @@ -50,8 +72,8 @@ describe("logger", () => { logger.deprecated("component", options); - expect(spy).toHaveBeenCalled(); - expect(spy.mock.calls[0][2]).toMatch( + expect(warnSpy).toHaveBeenCalled(); + expect(warnSpy.mock.calls[0][2]).toMatch( `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested}" instead.`, ); }); @@ -65,8 +87,8 @@ describe("logger", () => { logger.deprecated("component", options); - expect(spy).toHaveBeenCalled(); - expect(spy.mock.calls[0][2]).toMatch( + expect(warnSpy).toHaveBeenCalled(); + expect(warnSpy.mock.calls[0][2]).toMatch( `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested.join(`" or "`)}" instead.`, ); }); @@ -80,7 +102,74 @@ describe("logger", () => { logger.deprecated("component", options); logger.deprecated("component", options); - expect(spy).toHaveBeenCalledTimes(1); + expect(warnSpy).toHaveBeenCalledTimes(1); + }); + }); + + describe("logLevel", () => { + function messageAllLevels(): void { + const levels = ["debug", "info", "warn", "error", "trace"] as const; + + levels.forEach((level) => logger[level]("message")); + } + + async function setLogLevel(level: LogLevel): Promise { + jest.resetModules(); + + (globalThis as TestGlobal).calciteConfig = { + logLevel: level, + }; + + loggerModule = await import("./logger"); + logger = loggerModule.logger; + } + + it("logs all messages when set to lowest level", async () => { + await setLogLevel("trace"); + + messageAllLevels(); + + expect(errorSpy).toHaveBeenCalledTimes(1); + expect(infoSpy).toHaveBeenCalledTimes(1); + expect(warnSpy).toHaveBeenCalledTimes(1); + expect(debugSpy).toHaveBeenCalledTimes(1); + expect(traceSpy).toHaveBeenCalledTimes(1); + }); + + it("logs only error messages when set to highest level", async () => { + await setLogLevel("error"); + + messageAllLevels(); + + expect(errorSpy).toHaveBeenCalledTimes(1); + expect(infoSpy).toHaveBeenCalledTimes(0); + expect(warnSpy).toHaveBeenCalledTimes(0); + expect(debugSpy).toHaveBeenCalledTimes(0); + expect(traceSpy).toHaveBeenCalledTimes(0); + }); + + it("logs info messages and above when set to default level", async () => { + await setLogLevel("info"); + + messageAllLevels(); + + expect(errorSpy).toHaveBeenCalledTimes(1); + expect(infoSpy).toHaveBeenCalledTimes(1); + expect(warnSpy).toHaveBeenCalledTimes(1); + expect(debugSpy).toHaveBeenCalledTimes(0); + expect(traceSpy).toHaveBeenCalledTimes(0); + }); + + it("logs no messages when set to `off`", async () => { + await setLogLevel("off"); + + messageAllLevels(); + + expect(debugSpy).toHaveBeenCalledTimes(0); + expect(errorSpy).toHaveBeenCalledTimes(0); + expect(infoSpy).toHaveBeenCalledTimes(0); + expect(traceSpy).toHaveBeenCalledTimes(0); + expect(warnSpy).toHaveBeenCalledTimes(0); }); }); }); diff --git a/packages/calcite-components/src/utils/logger.ts b/packages/calcite-components/src/utils/logger.ts index 349488daad7..e0a8f975897 100644 --- a/packages/calcite-components/src/utils/logger.ts +++ b/packages/calcite-components/src/utils/logger.ts @@ -1,6 +1,6 @@ import { logLevel } from "./config"; -export type LogLevel = "debug" | "info" | "warn" | "error" | "trace"; +export type LogLevel = "debug" | "info" | "warn" | "error" | "trace" | "off"; type Message = string; type MajorVersion = number; @@ -19,10 +19,12 @@ type DeprecatedParams = { export const loggedDeprecations = new Set(); const logLevels = { + trace: 0, debug: 1, info: 2, warn: 4, error: 8, + off: 10, } as const; function willLog(level: LogLevel): boolean { From 43f26ead0f254e20a6a40aadc9e327e643bf6297 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:16:00 -0700 Subject: [PATCH 04/12] tidy up --- packages/calcite-components/src/utils/logger.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/calcite-components/src/utils/logger.ts b/packages/calcite-components/src/utils/logger.ts index e0a8f975897..ff04f8c2e83 100644 --- a/packages/calcite-components/src/utils/logger.ts +++ b/packages/calcite-components/src/utils/logger.ts @@ -37,7 +37,7 @@ function forwardToConsole(level: LogLevel, ...data: any[]): void { } const badgeTemplate = "%ccalcite"; - const badgeStyle = "background: #007AC2; color: #fff; border-radius: 4px;padding: 2px 4px;"; + const badgeStyle = "background: #007AC2; color: #fff; border-radius: 4px; padding: 2px 4px;"; console[level].call(this, badgeTemplate, badgeStyle, ...data); } From 164241bba49035860ab59af4c836185105874845 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:18:14 -0700 Subject: [PATCH 05/12] drop namespace from deprecation messages --- .../src/components/pick-list-group/pick-list-group.tsx | 4 ++-- .../src/components/pick-list-item/pick-list-item.tsx | 4 ++-- .../calcite-components/src/components/pick-list/pick-list.tsx | 4 ++-- .../src/components/tile-select-group/tile-select-group.tsx | 4 ++-- .../src/components/tile-select/tile-select.tsx | 4 ++-- .../calcite-components/src/components/tip-group/tip-group.tsx | 4 ++-- .../src/components/tip-manager/tip-manager.tsx | 4 ++-- packages/calcite-components/src/components/tip/tip.tsx | 4 ++-- .../src/components/value-list/value-list.tsx | 4 ++-- 9 files changed, 18 insertions(+), 18 deletions(-) diff --git a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx index 4ba54fb8559..666382c8f0b 100644 --- a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx +++ b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx @@ -10,9 +10,9 @@ import { logger } from "../../utils/logger"; import { CSS, SLOTS } from "./resources"; logger.deprecated("component", { - name: "calcite-pick-list-item-group", + name: "pick-list-item-group", removalVersion: 3, - suggested: "calcite-list-item-group", + suggested: "list-item-group", }); /** diff --git a/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx b/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx index 6b11f53d9ca..b7a2b342fdf 100644 --- a/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx +++ b/packages/calcite-components/src/components/pick-list-item/pick-list-item.tsx @@ -43,9 +43,9 @@ import { PickListItemMessages } from "./assets/pick-list-item/t9n"; import { CSS, ICONS, SLOTS } from "./resources"; logger.deprecated("component", { - name: "calcite-pick-list", + name: "pick-list", removalVersion: 3, - suggested: "calcite-list", + suggested: "list", }); /** diff --git a/packages/calcite-components/src/components/pick-list/pick-list.tsx b/packages/calcite-components/src/components/pick-list/pick-list.tsx index a9a3a64576a..7c29fa7d8e8 100644 --- a/packages/calcite-components/src/components/pick-list/pick-list.tsx +++ b/packages/calcite-components/src/components/pick-list/pick-list.tsx @@ -52,9 +52,9 @@ import { import List from "./shared-list-render"; logger.deprecated("component", { - name: "calcite-pick-list-item", + name: "pick-list-item", removalVersion: 3, - suggested: "calcite-list-item", + suggested: "list-item", }); /** diff --git a/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx b/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx index 5a30578b46a..6140b4b779d 100644 --- a/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx +++ b/packages/calcite-components/src/components/tile-select-group/tile-select-group.tsx @@ -10,9 +10,9 @@ import { logger } from "../../utils/logger"; import { TileSelectGroupLayout } from "./interfaces"; logger.deprecated("component", { - name: "calcite-tile-select-group", + name: "tile-select-group", removalVersion: 4, - suggested: ["calcite-tile", "calcite-tile-group"], + suggested: ["tile", "tile-group"], }); /** diff --git a/packages/calcite-components/src/components/tile-select/tile-select.tsx b/packages/calcite-components/src/components/tile-select/tile-select.tsx index fe5c84a6c6b..3caa80856a5 100644 --- a/packages/calcite-components/src/components/tile-select/tile-select.tsx +++ b/packages/calcite-components/src/components/tile-select/tile-select.tsx @@ -32,9 +32,9 @@ import { TileSelectType } from "./interfaces"; import { CSS } from "./resources"; logger.deprecated("component", { - name: "calcite-tile-select", + name: "tile-select", removalVersion: 4, - suggested: ["calcite-tile", "calcite-tile-group"], + suggested: ["tile", "tile-group"], }); /** diff --git a/packages/calcite-components/src/components/tip-group/tip-group.tsx b/packages/calcite-components/src/components/tip-group/tip-group.tsx index 7e41e9f5764..886b10ba657 100644 --- a/packages/calcite-components/src/components/tip-group/tip-group.tsx +++ b/packages/calcite-components/src/components/tip-group/tip-group.tsx @@ -2,9 +2,9 @@ import { Component, h, Prop, VNode } from "@stencil/core"; import { logger } from "../../utils/logger"; logger.deprecated("component", { - name: "calcite-tip-group", + name: "tip-group", removalVersion: 4, - suggested: ["calcite-carousel", "calcite-carousel-item"], + suggested: ["carousel", "carousel-item"], }); /** diff --git a/packages/calcite-components/src/components/tip-manager/tip-manager.tsx b/packages/calcite-components/src/components/tip-manager/tip-manager.tsx index c22d0d3281f..5da31cb5c96 100644 --- a/packages/calcite-components/src/components/tip-manager/tip-manager.tsx +++ b/packages/calcite-components/src/components/tip-manager/tip-manager.tsx @@ -25,9 +25,9 @@ import { TipManagerMessages } from "./assets/tip-manager/t9n"; import { CSS, ICONS } from "./resources"; logger.deprecated("component", { - name: "calcite-tip-manager", + name: "tip-manager", removalVersion: 4, - suggested: "calcite-carousel", + suggested: "carousel", }); /** diff --git a/packages/calcite-components/src/components/tip/tip.tsx b/packages/calcite-components/src/components/tip/tip.tsx index aead393cc21..7a9398cf589 100644 --- a/packages/calcite-components/src/components/tip/tip.tsx +++ b/packages/calcite-components/src/components/tip/tip.tsx @@ -30,9 +30,9 @@ import { TipMessages } from "./assets/tip/t9n"; import { CSS, ICONS, SLOTS } from "./resources"; logger.deprecated("component", { - name: "calcite-tip", + name: "tip", removalVersion: 4, - suggested: ["calcite-card", "calcite-notice", "calcite-panel", "calcite-tile"], + suggested: ["card", "notice", "panel", "tile"], }); /** diff --git a/packages/calcite-components/src/components/value-list/value-list.tsx b/packages/calcite-components/src/components/value-list/value-list.tsx index 95946f57d26..7b3240cced6 100644 --- a/packages/calcite-components/src/components/value-list/value-list.tsx +++ b/packages/calcite-components/src/components/value-list/value-list.tsx @@ -71,9 +71,9 @@ import { CSS, ICON_TYPES } from "./resources"; import { getHandleAndItemElement, getScreenReaderText } from "./utils"; logger.deprecated("component", { - name: "calcite-value-list", + name: "value-list", removalVersion: 3, - suggested: "calcite-list", + suggested: "list", }); /** From a92ed9825e39433bc8a8b03df3c4c33d1c0e0628 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:27:39 -0700 Subject: [PATCH 06/12] enforce no-namespace via type --- packages/calcite-components/src/utils/logger.ts | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/packages/calcite-components/src/utils/logger.ts b/packages/calcite-components/src/utils/logger.ts index ff04f8c2e83..59b277c72f1 100644 --- a/packages/calcite-components/src/utils/logger.ts +++ b/packages/calcite-components/src/utils/logger.ts @@ -1,3 +1,4 @@ +import type { JSX } from "../components"; import { logLevel } from "./config"; export type LogLevel = "debug" | "info" | "warn" | "error" | "trace" | "off"; @@ -6,6 +7,7 @@ type Message = string; type MajorVersion = number; type DeprecatedContext = "component" | "property" | "method" | "event" | "slot"; + type DeprecatedParams = { name: string; suggested?: string | string[]; @@ -13,6 +15,12 @@ type DeprecatedParams = { removalVersion: MajorVersion | "future"; }; +type SimpleComponentName = T extends `calcite-${infer Name}` ? Name : T; + +type ComponentDeprecatedParams = Omit & { + name: SimpleComponentName; +}; + /** * Exported for testing purposes only */ @@ -61,10 +69,10 @@ export const logger = { * @param params the deprecation details */ function deprecated(context: Exclude, params: DeprecatedParams): void; -function deprecated(context: "component", params: Omit): void; +function deprecated(context: "component", params: ComponentDeprecatedParams): void; function deprecated( context: DeprecatedContext, - { component, name, suggested, removalVersion }: DeprecatedParams, + { component, name, suggested, removalVersion }: DeprecatedParams | ComponentDeprecatedParams, ): void { const key = `${context}:${context === "component" ? "" : component}${name}`; From 87ecd7f3016f445c1c6085c8e2d5dd68c4e4c0f0 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:53:35 -0700 Subject: [PATCH 07/12] fix incorrect component name argument --- .../src/components/pick-list-group/pick-list-group.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx index 666382c8f0b..bd0181bbfc3 100644 --- a/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx +++ b/packages/calcite-components/src/components/pick-list-group/pick-list-group.tsx @@ -10,7 +10,7 @@ import { logger } from "../../utils/logger"; import { CSS, SLOTS } from "./resources"; logger.deprecated("component", { - name: "pick-list-item-group", + name: "pick-list-group", removalVersion: 3, suggested: "list-item-group", }); From 108f13ad851fead1178f24e043e986fe3cd29dca Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:53:51 -0700 Subject: [PATCH 08/12] add missing TestGlobal type --- packages/calcite-components/src/utils/logger.spec.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index f6d8cc78e75..035af1e98aa 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -1,4 +1,6 @@ +import { GlobalTestProps } from "../tests/utils"; import { LogLevel } from "./logger"; +import { CalciteConfig } from "./config"; describe("logger", () => { type LoggerModule = typeof import("./logger"); @@ -31,7 +33,6 @@ describe("logger", () => { afterEach(() => { jest.restoreAllMocks(); - delete (globalThis as TestGlobal).calciteConfig; }); describe("deprecated", () => { @@ -107,6 +108,8 @@ describe("logger", () => { }); describe("logLevel", () => { + type TestGlobal = GlobalTestProps<{ calciteConfig: Pick }>; + function messageAllLevels(): void { const levels = ["debug", "info", "warn", "error", "trace"] as const; @@ -124,6 +127,10 @@ describe("logger", () => { logger = loggerModule.logger; } + afterEach(() => { + delete (globalThis as TestGlobal).calciteConfig; + }); + it("logs all messages when set to lowest level", async () => { await setLogLevel("trace"); From 343c32f9f7196fa5fb93fa436fe34e795c10dd0b Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 17:59:57 -0700 Subject: [PATCH 09/12] update spec test params --- .../calcite-components/src/components.d.ts | 98 +++++++++++++++++++ .../src/utils/logger.spec.ts | 36 +++---- 2 files changed, 116 insertions(+), 18 deletions(-) diff --git a/packages/calcite-components/src/components.d.ts b/packages/calcite-components/src/components.d.ts index 7a7c23f9af6..e7bbf26472e 100644 --- a/packages/calcite-components/src/components.d.ts +++ b/packages/calcite-components/src/components.d.ts @@ -9,87 +9,185 @@ import { Alignment, Appearance, CollapseDirection, FlipContext, IconType, Kind, import { RequestedItem } from "./components/accordion/interfaces"; import { IconName } from "./components/icon/interfaces"; import { RequestedItem as RequestedItem1 } from "./components/accordion-item/interfaces"; +import { ActionMessages } from "./components/action/assets/action/t9n"; import { FlipPlacement, LogicalPlacement, MenuPlacement, OverlayPositioning, ReferenceElement } from "./utils/floating-ui"; +import { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n"; import { Columns } from "./components/action-group/interfaces"; +import { ActionGroupMessages } from "./components/action-group/assets/action-group/t9n"; +import { ActionPadMessages } from "./components/action-pad/assets/action-pad/t9n"; import { AlertDuration, Sync } from "./components/alert/interfaces"; import { NumberingSystem } from "./utils/locale"; +import { AlertMessages } from "./components/alert/assets/alert/t9n"; import { HeadingLevel } from "./components/functional/Heading"; +import { BlockMessages } from "./components/block/assets/block/t9n"; import { BlockSectionToggleDisplay } from "./components/block-section/interfaces"; +import { BlockSectionMessages } from "./components/block-section/assets/block-section/t9n"; import { ButtonAlignment, DropdownIconType } from "./components/button/interfaces"; +import { ButtonMessages } from "./components/button/assets/button/t9n"; +import { CardMessages } from "./components/card/assets/card/t9n"; import { ArrowType, AutoplayType } from "./components/carousel/interfaces"; +import { CarouselMessages } from "./components/carousel/assets/carousel/t9n"; import { MutableValidityState } from "./utils/form"; +import { ChipMessages } from "./components/chip/assets/chip/t9n"; import { ColorValue, InternalColor } from "./components/color-picker/interfaces"; import { Format } from "./components/color-picker/utils"; +import { ColorPickerMessages } from "./components/color-picker/assets/color-picker/t9n"; import { ComboboxChildElement, SelectionDisplay } from "./components/combobox/interfaces"; +import { ComboboxMessages } from "./components/combobox/assets/combobox/t9n"; +import { DatePickerMessages } from "./components/date-picker/assets/date-picker/t9n"; import { DateLocaleData } from "./components/date-picker/utils"; import { HoverRange } from "./utils/date"; import { RequestedItem as RequestedItem2 } from "./components/dropdown-group/interfaces"; import { ItemKeyboardEvent } from "./components/dropdown/interfaces"; +import { FilterMessages } from "./components/filter/assets/filter/t9n"; import { FlowItemLikeElement } from "./components/flow/interfaces"; +import { FlowItemMessages } from "./components/flow-item/assets/flow-item/t9n"; import { ColorStop, DataSeries } from "./components/graph/interfaces"; +import { HandleMessages } from "./components/handle/assets/handle/t9n"; import { HandleChange, HandleNudge } from "./components/handle/interfaces"; +import { InlineEditableMessages } from "./components/inline-editable/assets/inline-editable/t9n"; import { InputPlacement } from "./components/input/interfaces"; +import { InputMessages } from "./components/input/assets/input/t9n"; +import { InputDatePickerMessages } from "./components/input-date-picker/assets/input-date-picker/t9n"; +import { InputNumberMessages } from "./components/input-number/assets/input-number/t9n"; +import { InputTextMessages } from "./components/input-text/assets/input-text/t9n"; +import { InputTimePickerMessages } from "./components/input-time-picker/assets/input-time-picker/t9n"; +import { TimePickerMessages } from "./components/time-picker/assets/time-picker/t9n"; +import { InputTimeZoneMessages } from "./components/input-time-zone/assets/input-time-zone/t9n"; import { OffsetStyle, TimeZoneMode } from "./components/input-time-zone/interfaces"; import { ListDragDetail } from "./components/list/interfaces"; import { ItemData } from "./components/list-item/interfaces"; +import { ListMessages } from "./components/list/assets/list/t9n"; import { SelectionAppearance } from "./components/list/resources"; +import { ListItemMessages } from "./components/list-item/assets/list-item/t9n"; +import { MenuMessages } from "./components/menu/assets/menu/t9n"; +import { MenuItemMessages } from "./components/menu-item/assets/menu-item/t9n"; import { MenuItemCustomEvent } from "./components/menu-item/interfaces"; import { MeterFillType, MeterLabelType } from "./components/meter/interfaces"; +import { ModalMessages } from "./components/modal/assets/modal/t9n"; +import { NoticeMessages } from "./components/notice/assets/notice/t9n"; +import { PaginationMessages } from "./components/pagination/assets/pagination/t9n"; +import { PanelMessages } from "./components/panel/assets/panel/t9n"; import { ItemData as ItemData1, ListFocusId } from "./components/pick-list/shared-list-logic"; import { ICON_TYPES } from "./components/pick-list/resources"; +import { PickListItemMessages } from "./components/pick-list-item/assets/pick-list-item/t9n"; +import { PopoverMessages } from "./components/popover/assets/popover/t9n"; +import { RatingMessages } from "./components/rating/assets/rating/t9n"; +import { ScrimMessages } from "./components/scrim/assets/scrim/t9n"; import { DisplayMode } from "./components/sheet/interfaces"; import { DisplayMode as DisplayMode1 } from "./components/shell-panel/interfaces"; +import { ShellPanelMessages } from "./components/shell-panel/assets/shell-panel/t9n"; import { DragDetail } from "./utils/sortableComponent"; import { StepperItemChangeEventDetail, StepperItemEventDetail, StepperItemKeyEventDetail, StepperLayout } from "./components/stepper/interfaces"; +import { StepperMessages } from "./components/stepper/assets/stepper/t9n"; +import { StepperItemMessages } from "./components/stepper-item/assets/stepper-item/t9n"; import { TabID, TabLayout, TabPosition } from "./components/tabs/interfaces"; +import { TabNavMessages } from "./components/tab-nav/assets/tab-nav/t9n"; import { TabChangeEventDetail, TabCloseEventDetail } from "./components/tab/interfaces"; +import { TabTitleMessages } from "./components/tab-title/assets/tab-title/t9n"; import { RowType, TableInteractionMode, TableLayout, TableRowFocusEvent, TableSelectionDisplay } from "./components/table/interfaces"; +import { TableMessages } from "./components/table/assets/table/t9n"; +import { TableCellMessages } from "./components/table-cell/assets/table-cell/t9n"; +import { TableHeaderMessages } from "./components/table-header/assets/table-header/t9n"; +import { TextAreaMessages } from "./components/text-area/assets/text-area/t9n"; import { TileSelectType } from "./components/tile-select/interfaces"; import { TileSelectGroupLayout } from "./components/tile-select-group/interfaces"; +import { TipMessages } from "./components/tip/assets/tip/t9n"; +import { TipManagerMessages } from "./components/tip-manager/assets/tip-manager/t9n"; import { TreeItemSelectDetail } from "./components/tree-item/interfaces"; +import { ValueListMessages } from "./components/value-list/assets/value-list/t9n"; import { ListItemAndHandle } from "./components/value-list-item/interfaces"; export { Alignment, Appearance, CollapseDirection, FlipContext, IconType, Kind, Layout, LogicalFlowPosition, Position, Scale, SelectionAppearance as SelectionAppearance1, SelectionMode, Status, Width } from "./components/interfaces"; export { RequestedItem } from "./components/accordion/interfaces"; export { IconName } from "./components/icon/interfaces"; export { RequestedItem as RequestedItem1 } from "./components/accordion-item/interfaces"; +export { ActionMessages } from "./components/action/assets/action/t9n"; export { FlipPlacement, LogicalPlacement, MenuPlacement, OverlayPositioning, ReferenceElement } from "./utils/floating-ui"; +export { ActionBarMessages } from "./components/action-bar/assets/action-bar/t9n"; export { Columns } from "./components/action-group/interfaces"; +export { ActionGroupMessages } from "./components/action-group/assets/action-group/t9n"; +export { ActionPadMessages } from "./components/action-pad/assets/action-pad/t9n"; export { AlertDuration, Sync } from "./components/alert/interfaces"; export { NumberingSystem } from "./utils/locale"; +export { AlertMessages } from "./components/alert/assets/alert/t9n"; export { HeadingLevel } from "./components/functional/Heading"; +export { BlockMessages } from "./components/block/assets/block/t9n"; export { BlockSectionToggleDisplay } from "./components/block-section/interfaces"; +export { BlockSectionMessages } from "./components/block-section/assets/block-section/t9n"; export { ButtonAlignment, DropdownIconType } from "./components/button/interfaces"; +export { ButtonMessages } from "./components/button/assets/button/t9n"; +export { CardMessages } from "./components/card/assets/card/t9n"; export { ArrowType, AutoplayType } from "./components/carousel/interfaces"; +export { CarouselMessages } from "./components/carousel/assets/carousel/t9n"; export { MutableValidityState } from "./utils/form"; +export { ChipMessages } from "./components/chip/assets/chip/t9n"; export { ColorValue, InternalColor } from "./components/color-picker/interfaces"; export { Format } from "./components/color-picker/utils"; +export { ColorPickerMessages } from "./components/color-picker/assets/color-picker/t9n"; export { ComboboxChildElement, SelectionDisplay } from "./components/combobox/interfaces"; +export { ComboboxMessages } from "./components/combobox/assets/combobox/t9n"; +export { DatePickerMessages } from "./components/date-picker/assets/date-picker/t9n"; export { DateLocaleData } from "./components/date-picker/utils"; export { HoverRange } from "./utils/date"; export { RequestedItem as RequestedItem2 } from "./components/dropdown-group/interfaces"; export { ItemKeyboardEvent } from "./components/dropdown/interfaces"; +export { FilterMessages } from "./components/filter/assets/filter/t9n"; export { FlowItemLikeElement } from "./components/flow/interfaces"; +export { FlowItemMessages } from "./components/flow-item/assets/flow-item/t9n"; export { ColorStop, DataSeries } from "./components/graph/interfaces"; +export { HandleMessages } from "./components/handle/assets/handle/t9n"; export { HandleChange, HandleNudge } from "./components/handle/interfaces"; +export { InlineEditableMessages } from "./components/inline-editable/assets/inline-editable/t9n"; export { InputPlacement } from "./components/input/interfaces"; +export { InputMessages } from "./components/input/assets/input/t9n"; +export { InputDatePickerMessages } from "./components/input-date-picker/assets/input-date-picker/t9n"; +export { InputNumberMessages } from "./components/input-number/assets/input-number/t9n"; +export { InputTextMessages } from "./components/input-text/assets/input-text/t9n"; +export { InputTimePickerMessages } from "./components/input-time-picker/assets/input-time-picker/t9n"; +export { TimePickerMessages } from "./components/time-picker/assets/time-picker/t9n"; +export { InputTimeZoneMessages } from "./components/input-time-zone/assets/input-time-zone/t9n"; export { OffsetStyle, TimeZoneMode } from "./components/input-time-zone/interfaces"; export { ListDragDetail } from "./components/list/interfaces"; export { ItemData } from "./components/list-item/interfaces"; +export { ListMessages } from "./components/list/assets/list/t9n"; export { SelectionAppearance } from "./components/list/resources"; +export { ListItemMessages } from "./components/list-item/assets/list-item/t9n"; +export { MenuMessages } from "./components/menu/assets/menu/t9n"; +export { MenuItemMessages } from "./components/menu-item/assets/menu-item/t9n"; export { MenuItemCustomEvent } from "./components/menu-item/interfaces"; export { MeterFillType, MeterLabelType } from "./components/meter/interfaces"; +export { ModalMessages } from "./components/modal/assets/modal/t9n"; +export { NoticeMessages } from "./components/notice/assets/notice/t9n"; +export { PaginationMessages } from "./components/pagination/assets/pagination/t9n"; +export { PanelMessages } from "./components/panel/assets/panel/t9n"; export { ItemData as ItemData1, ListFocusId } from "./components/pick-list/shared-list-logic"; export { ICON_TYPES } from "./components/pick-list/resources"; +export { PickListItemMessages } from "./components/pick-list-item/assets/pick-list-item/t9n"; +export { PopoverMessages } from "./components/popover/assets/popover/t9n"; +export { RatingMessages } from "./components/rating/assets/rating/t9n"; +export { ScrimMessages } from "./components/scrim/assets/scrim/t9n"; export { DisplayMode } from "./components/sheet/interfaces"; export { DisplayMode as DisplayMode1 } from "./components/shell-panel/interfaces"; +export { ShellPanelMessages } from "./components/shell-panel/assets/shell-panel/t9n"; export { DragDetail } from "./utils/sortableComponent"; export { StepperItemChangeEventDetail, StepperItemEventDetail, StepperItemKeyEventDetail, StepperLayout } from "./components/stepper/interfaces"; +export { StepperMessages } from "./components/stepper/assets/stepper/t9n"; +export { StepperItemMessages } from "./components/stepper-item/assets/stepper-item/t9n"; export { TabID, TabLayout, TabPosition } from "./components/tabs/interfaces"; +export { TabNavMessages } from "./components/tab-nav/assets/tab-nav/t9n"; export { TabChangeEventDetail, TabCloseEventDetail } from "./components/tab/interfaces"; +export { TabTitleMessages } from "./components/tab-title/assets/tab-title/t9n"; export { RowType, TableInteractionMode, TableLayout, TableRowFocusEvent, TableSelectionDisplay } from "./components/table/interfaces"; +export { TableMessages } from "./components/table/assets/table/t9n"; +export { TableCellMessages } from "./components/table-cell/assets/table-cell/t9n"; +export { TableHeaderMessages } from "./components/table-header/assets/table-header/t9n"; +export { TextAreaMessages } from "./components/text-area/assets/text-area/t9n"; export { TileSelectType } from "./components/tile-select/interfaces"; export { TileSelectGroupLayout } from "./components/tile-select-group/interfaces"; +export { TipMessages } from "./components/tip/assets/tip/t9n"; +export { TipManagerMessages } from "./components/tip-manager/assets/tip-manager/t9n"; export { TreeItemSelectDetail } from "./components/tree-item/interfaces"; +export { ValueListMessages } from "./components/value-list/assets/value-list/t9n"; export { ListItemAndHandle } from "./components/value-list-item/interfaces"; export namespace Components { interface CalciteAccordion { diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index 035af1e98aa..ef6ad9be6f2 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -37,24 +37,24 @@ describe("logger", () => { describe("deprecated", () => { it("helps log planned deprecations", () => { - const options = { + const params = { name: "calcite-foo", removalVersion: 3, - }; + } as const; - logger.deprecated("component", options); + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( - `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}.`, + `[${params.name}] component is deprecated and will be removed in v${params.removalVersion}.`, ); }); it("helps log future deprecations", () => { const options = { name: "calcite-foo", - removalVersion: "future" as const, - }; + removalVersion: "future", + } as const; logger.deprecated("component", options); @@ -65,43 +65,43 @@ describe("logger", () => { }); it("shows deprecation suggestions (single)", () => { - const options = { + const params = { name: "calcite-foo", removalVersion: 3, suggested: "calcite-bar", - }; + } as const; - logger.deprecated("component", options); + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( - `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested}" instead.`, + `[${params.name}] component is deprecated and will be removed in v${params.removalVersion}. Use "${params.suggested}" instead.`, ); }); it("shows deprecation suggestions (multiple)", () => { - const options = { + const params = { name: "calcite-foo", removalVersion: 3, suggested: ["calcite-bar", "calcite-baz"], - }; + } as const; - logger.deprecated("component", options); + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( - `[${options.name}] component is deprecated and will be removed in v${options.removalVersion}. Use "${options.suggested.join(`" or "`)}" instead.`, + `[${params.name}] component is deprecated and will be removed in v${params.removalVersion}. Use "${params.suggested.join(`" or "`)}" instead.`, ); }); it("logs once per component", () => { - const options = { + const params = { name: "calcite-foo", removalVersion: 3, - }; + } as const; - logger.deprecated("component", options); - logger.deprecated("component", options); + logger.deprecated("component", params); + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalledTimes(1); }); From 50656e57b019c709be2c35a47e59f259882a8f09 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 18:06:06 -0700 Subject: [PATCH 10/12] fix spec types --- .../calcite-components/src/utils/logger.spec.ts | 14 ++++++++------ packages/calcite-components/src/utils/logger.ts | 2 +- 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index ef6ad9be6f2..3ef192e556e 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -36,13 +36,15 @@ describe("logger", () => { }); describe("deprecated", () => { + const context = "component"; + it("helps log planned deprecations", () => { const params = { name: "calcite-foo", removalVersion: 3, } as const; - logger.deprecated("component", params); + logger.deprecated(context, params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -56,7 +58,7 @@ describe("logger", () => { removalVersion: "future", } as const; - logger.deprecated("component", options); + logger.deprecated(context, options); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -71,7 +73,7 @@ describe("logger", () => { suggested: "calcite-bar", } as const; - logger.deprecated("component", params); + logger.deprecated(context, params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -86,7 +88,7 @@ describe("logger", () => { suggested: ["calcite-bar", "calcite-baz"], } as const; - logger.deprecated("component", params); + logger.deprecated(context, params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -100,8 +102,8 @@ describe("logger", () => { removalVersion: 3, } as const; - logger.deprecated("component", params); - logger.deprecated("component", params); + logger.deprecated(context, params); + logger.deprecated(context, params); expect(warnSpy).toHaveBeenCalledTimes(1); }); diff --git a/packages/calcite-components/src/utils/logger.ts b/packages/calcite-components/src/utils/logger.ts index 59b277c72f1..e287b890a0c 100644 --- a/packages/calcite-components/src/utils/logger.ts +++ b/packages/calcite-components/src/utils/logger.ts @@ -69,7 +69,7 @@ export const logger = { * @param params the deprecation details */ function deprecated(context: Exclude, params: DeprecatedParams): void; -function deprecated(context: "component", params: ComponentDeprecatedParams): void; +function deprecated(context: Extract, params: ComponentDeprecatedParams): void; function deprecated( context: DeprecatedContext, { component, name, suggested, removalVersion }: DeprecatedParams | ComponentDeprecatedParams, From f1981297af4d1dbbffe70071aed843a111d84893 Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 18:14:01 -0700 Subject: [PATCH 11/12] expect TS errors for fake names --- .../src/utils/logger.spec.ts | 44 ++++++++++--------- 1 file changed, 24 insertions(+), 20 deletions(-) diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index 3ef192e556e..26802e83e72 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -36,15 +36,14 @@ describe("logger", () => { }); describe("deprecated", () => { - const context = "component"; - it("helps log planned deprecations", () => { const params = { - name: "calcite-foo", + // @ts-expect-error -- using fake component name + name: "foo", removalVersion: 3, - } as const; + }; - logger.deprecated(context, params); + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -54,11 +53,12 @@ describe("logger", () => { it("helps log future deprecations", () => { const options = { - name: "calcite-foo", + name: "foo", removalVersion: "future", - } as const; + }; - logger.deprecated(context, options); + // @ts-expect-error -- using fake component names + logger.deprecated("component", options); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -68,12 +68,13 @@ describe("logger", () => { it("shows deprecation suggestions (single)", () => { const params = { - name: "calcite-foo", + name: "foo", removalVersion: 3, - suggested: "calcite-bar", - } as const; + suggested: "bar", + }; - logger.deprecated(context, params); + // @ts-expect-error -- using fake component names + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -83,12 +84,13 @@ describe("logger", () => { it("shows deprecation suggestions (multiple)", () => { const params = { - name: "calcite-foo", + name: "foo", removalVersion: 3, - suggested: ["calcite-bar", "calcite-baz"], - } as const; + suggested: ["bar", "baz"], + }; - logger.deprecated(context, params); + // @ts-expect-error -- using fake component names + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled(); expect(warnSpy.mock.calls[0][2]).toMatch( @@ -98,12 +100,14 @@ describe("logger", () => { it("logs once per component", () => { const params = { - name: "calcite-foo", + name: "foo", removalVersion: 3, - } as const; + }; - logger.deprecated(context, params); - logger.deprecated(context, params); + // @ts-expect-error -- using fake component names + logger.deprecated("component", params); + // @ts-expect-error -- using fake component names + logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalledTimes(1); }); From 6122f11e47c812db483ca810b86e9b94e7067dbe Mon Sep 17 00:00:00 2001 From: JC Franco Date: Mon, 22 Jul 2024 18:17:58 -0700 Subject: [PATCH 12/12] move misplaced ts-expect-error line --- packages/calcite-components/src/utils/logger.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/calcite-components/src/utils/logger.spec.ts b/packages/calcite-components/src/utils/logger.spec.ts index 26802e83e72..6c755979834 100644 --- a/packages/calcite-components/src/utils/logger.spec.ts +++ b/packages/calcite-components/src/utils/logger.spec.ts @@ -38,11 +38,11 @@ describe("logger", () => { describe("deprecated", () => { it("helps log planned deprecations", () => { const params = { - // @ts-expect-error -- using fake component name name: "foo", removalVersion: 3, }; + // @ts-expect-error -- using fake component names logger.deprecated("component", params); expect(warnSpy).toHaveBeenCalled();