From 34c836226a984640ae45cfb0e58c1b333b7fff51 Mon Sep 17 00:00:00 2001 From: Edward Faulkner Date: Thu, 9 Jul 2026 23:47:01 -0400 Subject: [PATCH 1/3] Consume boxel-ui directly This removes the build step in boxel-ui. To keep the public import paths simple despite the constraint that package.json exports can't do extension search, I opted to make all the publicly importable modules use `.gts` extension. Since it's a superset of `.ts` there's no harm in using it even in a file that has no templates. The way the exports rules are written, an import ending in an explicit `.css` will map to `.css`, and anything else will get an implied `.gts`. The test-app needed to gain basic infrastructure for glimmer-scoped-css- and ember-concurrency, since those are no longer compiled away in boxel-ui's own build. This is consistent with the support that host already has anyway. This PR keeps the build scripts but makes them into no-ops, since they're touched by a lot of the CI infrastructure. A followup PR can eliminate them. Also, the rollup dependencies and config in boxel-ui could get eliminated after this PR lands. --- packages/boxel-ui/addon/package.json | 13 +++++-------- .../addon/src/{components.ts => components.gts} | 3 --- .../boxel-ui/addon/src/components/alert/index.gts | 2 +- .../addon/src/components/basic-fitted/usage.gts | 2 +- .../boxel-ui/addon/src/components/button/index.gts | 2 +- .../addon/src/components/card-header/index.gts | 2 +- .../addon/src/components/color-palette/index.gts | 2 +- .../addon/src/components/container/index.gts | 2 +- .../addon/src/components/filter-list/index.gts | 2 +- .../src/components/fitted-card-container/index.gts | 2 +- .../src/components/fitted-card-container/usage.gts | 2 +- .../addon/src/components/fitted-card/index.gts | 2 +- .../src/components/fitted-card/usage-preview.gts | 2 +- .../addon/src/components/fitted-card/usage.gts | 2 +- .../grid-container/grid-item-container/index.gts | 2 +- .../addon/src/components/grid-container/index.gts | 2 +- .../addon/src/components/grid-container/usage.gts | 2 +- .../addon/src/components/icon-button/usage.gts | 2 +- .../boxel-ui/addon/src/components/kanban/card.gts | 2 +- .../components/kanban/column-config-sidebar-row.gts | 2 +- .../addon/src/components/kanban/plane-inner.gts | 2 +- .../boxel-ui/addon/src/components/kanban/plane.gts | 2 +- .../boxel-ui/addon/src/components/kanban/usage.gts | 2 +- .../boxel-ui/addon/src/components/label/index.gts | 2 +- .../addon/src/components/multi-select/index.gts | 2 +- .../addon/src/components/multi-select/trigger.gts | 2 +- .../picker/before-options-with-search.gts | 2 +- .../addon/src/components/picker/option-row.gts | 2 +- .../addon/src/components/picker/trigger-labeled.gts | 2 +- .../boxel-ui/addon/src/components/pill/index.gts | 2 +- .../boxel-ui/addon/src/components/pill/usage.gts | 2 +- .../addon/src/components/progress-radial/index.gts | 2 +- .../addon/src/components/radio-input/item.gts | 2 +- .../src/components/resizable-panel-group/usage.gts | 2 +- .../addon/src/components/select/trigger.gts | 2 +- .../boxel-ui/addon/src/components/select/usage.gts | 2 +- .../boxel-ui/addon/src/components/swatch/index.gts | 2 +- .../boxel-ui/addon/src/components/switch/index.gts | 2 +- .../addon/src/components/tag-list/usage.gts | 2 +- .../boxel-ui/addon/src/components/tooltip/usage.gts | 2 +- .../boxel-ui/addon/src/{helpers.ts => helpers.gts} | 0 .../addon/src/{modifiers.ts => modifiers.gts} | 0 packages/boxel-ui/addon/src/{usage.ts => usage.gts} | 0 packages/boxel-ui/test-app/babel.config.mjs | 6 +++++- packages/boxel-ui/test-app/package.json | 2 ++ packages/boxel-ui/test-app/vite.config.mjs | 3 ++- pnpm-lock.yaml | 6 ++++++ 47 files changed, 58 insertions(+), 51 deletions(-) rename packages/boxel-ui/addon/src/{components.ts => components.gts} (97%) rename packages/boxel-ui/addon/src/{helpers.ts => helpers.gts} (100%) rename packages/boxel-ui/addon/src/{modifiers.ts => modifiers.gts} (100%) rename packages/boxel-ui/addon/src/{usage.ts => usage.gts} (100%) diff --git a/packages/boxel-ui/addon/package.json b/packages/boxel-ui/addon/package.json index 0694b3d9746..211399207a7 100644 --- a/packages/boxel-ui/addon/package.json +++ b/packages/boxel-ui/addon/package.json @@ -13,9 +13,9 @@ "test": "tests" }, "scripts": { - "build": "concurrently \"pnpm:build:*\" --names \"build:\"", - "build:js": "rollup --config", - "build:types": "ember-tsc --declaration --emitDeclarationOnly --noEmit false", + "build": "echo 'noop'", + "build:js": "echo 'noop'", + "build:types": "echo 'noop'", "lint": "concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\"", "lint:fix": "concurrently \"pnpm:lint:*:fix\" --names \"fix:\"", "lint:hbs": "ember-template-lint .", @@ -124,11 +124,8 @@ "version": 2 }, "exports": { - "./*": { - "types": "./declarations/*.d.ts", - "default": "./dist/*.js" - }, - "./styles/*.css": "./dist/styles/*.css", + "./*.css": "./src/*.css", + "./*": "./src/*.gts", "./addon-main.js": "./addon-main.cjs" }, "files": [ diff --git a/packages/boxel-ui/addon/src/components.ts b/packages/boxel-ui/addon/src/components.gts similarity index 97% rename from packages/boxel-ui/addon/src/components.ts rename to packages/boxel-ui/addon/src/components.gts index 75a1914ede4..8a9e1d2a539 100644 --- a/packages/boxel-ui/addon/src/components.ts +++ b/packages/boxel-ui/addon/src/components.gts @@ -4,7 +4,6 @@ import Alert from './components/alert/index.gts'; import Avatar from './components/avatar/index.gts'; import BasicFitted from './components/basic-fitted/index.gts'; import Button from './components/button/index.gts'; -import BoxelButton from './components/button/index.gts'; import CardContainer from './components/card-container/index.gts'; import CardHeader from './components/card-header/index.gts'; import CircleSpinner from './components/circle-spinner/index.gts'; @@ -35,7 +34,6 @@ import FittedCard, { import FittedCardContainer from './components/fitted-card-container/index.gts'; import GridContainer from './components/grid-container/index.gts'; import BoxelHeader from './components/header/index.gts'; -import Header from './components/header/index.gts'; import IconButton from './components/icon-button/index.gts'; import BoxelInput, { type InputBottomTreatment as BoxelInputBottomTreatment, @@ -61,7 +59,6 @@ import Label from './components/label/index.gts'; import LoadingIndicator from './components/loading-indicator/index.gts'; import Menu from './components/menu/index.gts'; import BoxelMessage from './components/message/index.gts'; -import Message from './components/message/index.gts'; import Modal from './components/modal/index.gts'; import BoxelMultiSelect, { BoxelMultiSelectBasic, diff --git a/packages/boxel-ui/addon/src/components/alert/index.gts b/packages/boxel-ui/addon/src/components/alert/index.gts index b31151bf938..76c902c1812 100644 --- a/packages/boxel-ui/addon/src/components/alert/index.gts +++ b/packages/boxel-ui/addon/src/components/alert/index.gts @@ -3,7 +3,7 @@ import { hash } from '@ember/helper'; import { on } from '@ember/modifier'; import type { ComponentLike } from '@glint/template'; -import { cn, eq } from '../../helpers.ts'; +import { cn, eq } from '../../helpers.gts'; import { FailureBordered, Warning } from '../../icons.gts'; import Button, { type BoxelButtonKind } from '../button/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/basic-fitted/usage.gts b/packages/boxel-ui/addon/src/components/basic-fitted/usage.gts index ea404e1078d..69c07a65916 100644 --- a/packages/boxel-ui/addon/src/components/basic-fitted/usage.gts +++ b/packages/boxel-ui/addon/src/components/basic-fitted/usage.gts @@ -4,7 +4,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import FreestyleUsage from 'ember-freestyle/components/freestyle/usage'; -import { FITTED_FORMATS } from '../../helpers.ts'; +import { FITTED_FORMATS } from '../../helpers.gts'; import type { Icon } from '../../icons.ts'; import CardContainer from '../card-container/index.gts'; import { diff --git a/packages/boxel-ui/addon/src/components/button/index.gts b/packages/boxel-ui/addon/src/components/button/index.gts index c6bc8d7b022..8b804a1111a 100644 --- a/packages/boxel-ui/addon/src/components/button/index.gts +++ b/packages/boxel-ui/addon/src/components/button/index.gts @@ -2,7 +2,7 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; import { array, concat, hash } from '@ember/helper'; import { LinkTo } from '@ember/routing'; -import { cn, eq, not, or, sanitizeHtml } from '../../helpers.ts'; +import { cn, eq, not, or, sanitizeHtml } from '../../helpers.gts'; import LoadingIndicator from '../loading-indicator/index.gts'; export type BoxelButtonKind = diff --git a/packages/boxel-ui/addon/src/components/card-header/index.gts b/packages/boxel-ui/addon/src/components/card-header/index.gts index 1ed1dc1ad3f..6646514fddd 100644 --- a/packages/boxel-ui/addon/src/components/card-header/index.gts +++ b/packages/boxel-ui/addon/src/components/card-header/index.gts @@ -1,5 +1,5 @@ import Maximize from '@cardstack/boxel-icons/maximize'; -import type { MenuDivider } from '@cardstack/boxel-ui/helpers.ts'; +import type { MenuDivider } from '@cardstack/boxel-u./helpers.gts'; import { on } from '@ember/modifier'; import Component from '@glimmer/component'; import type { ComponentLike } from '@glint/template'; diff --git a/packages/boxel-ui/addon/src/components/color-palette/index.gts b/packages/boxel-ui/addon/src/components/color-palette/index.gts index 72a14fb2cb4..e90a3b85415 100644 --- a/packages/boxel-ui/addon/src/components/color-palette/index.gts +++ b/packages/boxel-ui/addon/src/components/color-palette/index.gts @@ -3,7 +3,7 @@ import { on } from '@ember/modifier'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; -import { cn, cssVar, eq } from '../../helpers.ts'; +import { cn, cssVar, eq } from '../../helpers.gts'; import ColorPicker from '../color-picker/index.gts'; import IconButton from '../icon-button/index.gts'; import Tooltip from '../tooltip/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/container/index.gts b/packages/boxel-ui/addon/src/components/container/index.gts index 87baa93b83f..f49c435316f 100644 --- a/packages/boxel-ui/addon/src/components/container/index.gts +++ b/packages/boxel-ui/addon/src/components/container/index.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { cn, element, eq } from '../../helpers.ts'; +import { cn, element, eq } from '../../helpers.gts'; export type BoxelContainerDisplayOption = | 'default' diff --git a/packages/boxel-ui/addon/src/components/filter-list/index.gts b/packages/boxel-ui/addon/src/components/filter-list/index.gts index 6debe515f77..f4998541346 100644 --- a/packages/boxel-ui/addon/src/components/filter-list/index.gts +++ b/packages/boxel-ui/addon/src/components/filter-list/index.gts @@ -5,7 +5,7 @@ import { htmlSafe } from '@ember/template'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; -import { cn } from '../../helpers.ts'; +import { cn } from '../../helpers.gts'; import DropdownArrow from '../../icons/dropdown-arrow-down.gts'; import type { Icon } from '../../icons/types.ts'; import Button from '../button/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/fitted-card-container/index.gts b/packages/boxel-ui/addon/src/components/fitted-card-container/index.gts index 49fbf64a3fc..3b797ff6812 100644 --- a/packages/boxel-ui/addon/src/components/fitted-card-container/index.gts +++ b/packages/boxel-ui/addon/src/components/fitted-card-container/index.gts @@ -6,7 +6,7 @@ import { fittedFormatById, fittedFormatIds, sanitizeHtmlSafe, -} from '../../helpers.ts'; +} from '../../helpers.gts'; interface Signature { Args: { diff --git a/packages/boxel-ui/addon/src/components/fitted-card-container/usage.gts b/packages/boxel-ui/addon/src/components/fitted-card-container/usage.gts index c0e67f8583b..8eae892e4ac 100644 --- a/packages/boxel-ui/addon/src/components/fitted-card-container/usage.gts +++ b/packages/boxel-ui/addon/src/components/fitted-card-container/usage.gts @@ -7,7 +7,7 @@ import { type FittedFormatId, fittedFormatById, fittedFormatIds, -} from '../../helpers.ts'; +} from '../../helpers.gts'; import CardContainer from '../card-container/index.gts'; import GridContainer from '../grid-container/index.gts'; import FittedCardContainer from './index.gts'; diff --git a/packages/boxel-ui/addon/src/components/fitted-card/index.gts b/packages/boxel-ui/addon/src/components/fitted-card/index.gts index e954f0fc0c4..749748cb981 100644 --- a/packages/boxel-ui/addon/src/components/fitted-card/index.gts +++ b/packages/boxel-ui/addon/src/components/fitted-card/index.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { element } from '../../helpers.ts'; +import { element } from '../../helpers.gts'; /** * FittedCard — generic responsive card layout for the fitted format. diff --git a/packages/boxel-ui/addon/src/components/fitted-card/usage-preview.gts b/packages/boxel-ui/addon/src/components/fitted-card/usage-preview.gts index 98bb7e40d1f..45f90fab8e6 100644 --- a/packages/boxel-ui/addon/src/components/fitted-card/usage-preview.gts +++ b/packages/boxel-ui/addon/src/components/fitted-card/usage-preview.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { type FittedFormatSpec, cn, gt, gte } from '../../helpers.ts'; +import { type FittedFormatSpec, cn, gt, gte } from '../../helpers.gts'; import CopyButton from '../copy-button/index.gts'; export type Spec = Partial & { diff --git a/packages/boxel-ui/addon/src/components/fitted-card/usage.gts b/packages/boxel-ui/addon/src/components/fitted-card/usage.gts index 2ddb871b790..7c68360a374 100644 --- a/packages/boxel-ui/addon/src/components/fitted-card/usage.gts +++ b/packages/boxel-ui/addon/src/components/fitted-card/usage.gts @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import FreestyleUsage from 'ember-freestyle/components/freestyle/usage'; -import { FITTED_FORMATS } from '../../helpers.ts'; +import { FITTED_FORMATS } from '../../helpers.gts'; import CardContainer from '../card-container/index.gts'; import FittedCardContainer from '../fitted-card-container/index.gts'; import BoxelInput from '../input/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/grid-container/grid-item-container/index.gts b/packages/boxel-ui/addon/src/components/grid-container/grid-item-container/index.gts index 213f10db908..90aaab943a2 100644 --- a/packages/boxel-ui/addon/src/components/grid-container/grid-item-container/index.gts +++ b/packages/boxel-ui/addon/src/components/grid-container/grid-item-container/index.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { type FittedFormatId } from '../../../helpers.ts'; +import { type FittedFormatId } from '../../../helpers.gts'; import FittedCardContainer from '../../fitted-card-container/index.gts'; export interface GridItemContainerSignature { diff --git a/packages/boxel-ui/addon/src/components/grid-container/index.gts b/packages/boxel-ui/addon/src/components/grid-container/index.gts index 96d80a6c6bb..27c908c249b 100644 --- a/packages/boxel-ui/addon/src/components/grid-container/index.gts +++ b/packages/boxel-ui/addon/src/components/grid-container/index.gts @@ -7,7 +7,7 @@ import { fittedFormatById, fittedFormatIds, sanitizeHtmlSafe, -} from '../../helpers.ts'; +} from '../../helpers.gts'; import GridItemContainer, { type GridItemContainerSignature, } from './grid-item-container/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/grid-container/usage.gts b/packages/boxel-ui/addon/src/components/grid-container/usage.gts index 27c688b9687..481fc356e66 100644 --- a/packages/boxel-ui/addon/src/components/grid-container/usage.gts +++ b/packages/boxel-ui/addon/src/components/grid-container/usage.gts @@ -7,7 +7,7 @@ import { type FittedFormatId, fittedFormatById, fittedFormatIds, -} from '../../helpers.ts'; +} from '../../helpers.gts'; import CardContainer from '../card-container/index.gts'; import BoxelGridContainer from './index.gts'; diff --git a/packages/boxel-ui/addon/src/components/icon-button/usage.gts b/packages/boxel-ui/addon/src/components/icon-button/usage.gts index 503fe3ff25d..2c27f33d706 100644 --- a/packages/boxel-ui/addon/src/components/icon-button/usage.gts +++ b/packages/boxel-ui/addon/src/components/icon-button/usage.gts @@ -5,7 +5,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import FreestyleUsage from 'ember-freestyle/components/freestyle/usage'; -import { cn, eq } from '../../helpers.ts'; +import { cn, eq } from '../../helpers.gts'; import { ALL_ICON_COMPONENTS } from '../../icons.gts'; import IconPlus from '../../icons/icon-plus.gts'; import type { Icon } from '../../icons/types.ts'; diff --git a/packages/boxel-ui/addon/src/components/kanban/card.gts b/packages/boxel-ui/addon/src/components/kanban/card.gts index 7ff73d2222c..90d2b8c295b 100644 --- a/packages/boxel-ui/addon/src/components/kanban/card.gts +++ b/packages/boxel-ui/addon/src/components/kanban/card.gts @@ -2,7 +2,7 @@ import { cn } from '@cardstack/boxel-ui/helpers'; import type { TemplateOnlyComponent } from '@ember/component/template-only'; import type { SafeString } from '@ember/template'; -import type { FittedFormatId } from '../../helpers.ts'; +import type { FittedFormatId } from '../../helpers.gts'; import FittedCardContainer from '../fitted-card-container/index.gts'; import type { KanbanPlacement } from './engine.ts'; diff --git a/packages/boxel-ui/addon/src/components/kanban/column-config-sidebar-row.gts b/packages/boxel-ui/addon/src/components/kanban/column-config-sidebar-row.gts index d8a8b22dd52..0f0a3331a9c 100644 --- a/packages/boxel-ui/addon/src/components/kanban/column-config-sidebar-row.gts +++ b/packages/boxel-ui/addon/src/components/kanban/column-config-sidebar-row.gts @@ -6,7 +6,7 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; import { fn } from '@ember/helper'; import { on } from '@ember/modifier'; -import { bool, cn, cssVar } from '../../helpers.ts'; +import { bool, cn, cssVar } from '../../helpers.gts'; import ContextButton from '../context-button/index.gts'; import FieldContainer from '../field-container/index.gts'; import IconButton from '../icon-button/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/kanban/plane-inner.gts b/packages/boxel-ui/addon/src/components/kanban/plane-inner.gts index 5a3939b179f..cc713034299 100644 --- a/packages/boxel-ui/addon/src/components/kanban/plane-inner.gts +++ b/packages/boxel-ui/addon/src/components/kanban/plane-inner.gts @@ -12,7 +12,7 @@ import { on } from '@ember/modifier'; import type { SafeString } from '@ember/template'; import Component from '@glimmer/component'; -import type { FittedFormatId } from '../../helpers.ts'; +import type { FittedFormatId } from '../../helpers.gts'; import { KanbanCard } from './card.gts'; import { KanbanColumnHeader } from './column-header.gts'; import type { KanbanDragManager } from './drag.gts'; diff --git a/packages/boxel-ui/addon/src/components/kanban/plane.gts b/packages/boxel-ui/addon/src/components/kanban/plane.gts index eb1d42a686b..92e829bae61 100644 --- a/packages/boxel-ui/addon/src/components/kanban/plane.gts +++ b/packages/boxel-ui/addon/src/components/kanban/plane.gts @@ -4,7 +4,7 @@ import { registerDestructor } from '@ember/destroyable'; import type Owner from '@ember/owner'; import Component from '@glimmer/component'; -import type { FittedFormatId } from '../../helpers.ts'; +import type { FittedFormatId } from '../../helpers.gts'; import { type KanbanDragManagerArgs, KanbanDragManager } from './drag.gts'; import { type KanbanColumnConfig, type KanbanPlacement } from './engine.ts'; import { KanbanPlaneInner } from './plane-inner.gts'; diff --git a/packages/boxel-ui/addon/src/components/kanban/usage.gts b/packages/boxel-ui/addon/src/components/kanban/usage.gts index f6c75650193..697efa2ccfe 100644 --- a/packages/boxel-ui/addon/src/components/kanban/usage.gts +++ b/packages/boxel-ui/addon/src/components/kanban/usage.gts @@ -4,7 +4,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import FreestyleUsage from 'ember-freestyle/components/freestyle/usage'; -import { type FittedFormatId, cn, fittedFormatById } from '../../helpers.ts'; +import { type FittedFormatId, cn, fittedFormatById } from '../../helpers.gts'; import { Card as CardIcon, Grid3x3 as GridIcon, diff --git a/packages/boxel-ui/addon/src/components/label/index.gts b/packages/boxel-ui/addon/src/components/label/index.gts index d0145627cc3..871dbf6edcb 100644 --- a/packages/boxel-ui/addon/src/components/label/index.gts +++ b/packages/boxel-ui/addon/src/components/label/index.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { cn, element, eq } from '../../helpers.ts'; +import { cn, element, eq } from '../../helpers.gts'; interface Signature { Args: { diff --git a/packages/boxel-ui/addon/src/components/multi-select/index.gts b/packages/boxel-ui/addon/src/components/multi-select/index.gts index 0a699222b79..01a0f5dc52d 100644 --- a/packages/boxel-ui/addon/src/components/multi-select/index.gts +++ b/packages/boxel-ui/addon/src/components/multi-select/index.gts @@ -9,7 +9,7 @@ import type { import PowerSelect from 'ember-power-select/components/power-select'; import BeforeOptions from 'ember-power-select/components/power-select/before-options'; -import { cn, not } from '../../helpers.ts'; +import { cn, not } from '../../helpers.gts'; import { BoxelAfterOptionsComponent } from './after-options.gts'; import BoxelSelectedItem, { type SelectedItemSignature, diff --git a/packages/boxel-ui/addon/src/components/multi-select/trigger.gts b/packages/boxel-ui/addon/src/components/multi-select/trigger.gts index 7aeb800e16f..8fd9089068d 100644 --- a/packages/boxel-ui/addon/src/components/multi-select/trigger.gts +++ b/packages/boxel-ui/addon/src/components/multi-select/trigger.gts @@ -4,7 +4,7 @@ import Component from '@glimmer/component'; import type { ComponentLike } from '@glint/template'; import type { Select } from 'ember-power-select/components/power-select'; -import { cn } from '../../helpers.ts'; +import { cn } from '../../helpers.gts'; import CaretDown from '../../icons/caret-down.gts'; import IconX from '../../icons/icon-x.gts'; import Pill from '../pill/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/picker/before-options-with-search.gts b/packages/boxel-ui/addon/src/components/picker/before-options-with-search.gts index 9ba3560659a..f9fbecd9799 100644 --- a/packages/boxel-ui/addon/src/components/picker/before-options-with-search.gts +++ b/packages/boxel-ui/addon/src/components/picker/before-options-with-search.gts @@ -6,7 +6,7 @@ import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import type { Select } from 'ember-power-select/components/power-select'; -import { eq } from '../../helpers.ts'; +import { eq } from '../../helpers.gts'; import BoxelInput from '../input/index.gts'; import type { PickerOption } from './index.gts'; import PickerOptionRow from './option-row.gts'; diff --git a/packages/boxel-ui/addon/src/components/picker/option-row.gts b/packages/boxel-ui/addon/src/components/picker/option-row.gts index 54b1d8a05d4..40b2fcfc253 100644 --- a/packages/boxel-ui/addon/src/components/picker/option-row.gts +++ b/packages/boxel-ui/addon/src/components/picker/option-row.gts @@ -3,7 +3,7 @@ import { action } from '@ember/object'; import Component from '@glimmer/component'; import type { Select } from 'ember-power-select/components/power-select'; -import { cn, sanitizeHtmlSafe } from '../../helpers.ts'; +import { cn, sanitizeHtmlSafe } from '../../helpers.gts'; import CheckMark from '../../icons/check-mark.gts'; import SelectAll from '../../icons/select-all.gts'; import type { Icon } from '../../icons/types.ts'; diff --git a/packages/boxel-ui/addon/src/components/picker/trigger-labeled.gts b/packages/boxel-ui/addon/src/components/picker/trigger-labeled.gts index b385a6d66a0..f6ff11ee0ff 100644 --- a/packages/boxel-ui/addon/src/components/picker/trigger-labeled.gts +++ b/packages/boxel-ui/addon/src/components/picker/trigger-labeled.gts @@ -4,7 +4,7 @@ import Component from '@glimmer/component'; import type { ComponentLike } from '@glint/template'; import type { Select } from 'ember-power-select/components/power-select'; -import { cn } from '../../helpers.ts'; +import { cn } from '../../helpers.gts'; import { not } from '../../helpers/truth-helpers.ts'; import CaretDown from '../../icons/caret-down.gts'; import Pill from '../pill/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/pill/index.gts b/packages/boxel-ui/addon/src/components/pill/index.gts index 04fcc816d18..b6a855338a7 100644 --- a/packages/boxel-ui/addon/src/components/pill/index.gts +++ b/packages/boxel-ui/addon/src/components/pill/index.gts @@ -2,7 +2,7 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; import { concat } from '@ember/helper'; import { hash } from '@ember/helper'; -import { and, bool, cn, element, eq, not } from '../../helpers.ts'; +import { and, bool, cn, element, eq, not } from '../../helpers.gts'; import { getContrastColor } from '../../helpers/contrast-color.ts'; import cssVar from '../../helpers/css-var.ts'; import type { BoxelButtonSize } from '../button/index.gts'; diff --git a/packages/boxel-ui/addon/src/components/pill/usage.gts b/packages/boxel-ui/addon/src/components/pill/usage.gts index 31c67b89ad7..1209325d621 100644 --- a/packages/boxel-ui/addon/src/components/pill/usage.gts +++ b/packages/boxel-ui/addon/src/components/pill/usage.gts @@ -8,7 +8,7 @@ import { cssVariable, } from 'ember-freestyle/decorators/css-variable'; -import { cssVar } from '../../helpers.ts'; +import { cssVar } from '../../helpers.gts'; import { IconPlus } from '../../icons.gts'; import { type BoxelButtonSize, buttonSizeOptions } from '../button/index.gts'; import Pill, { diff --git a/packages/boxel-ui/addon/src/components/progress-radial/index.gts b/packages/boxel-ui/addon/src/components/progress-radial/index.gts index b2fc144975a..f38de8d140c 100644 --- a/packages/boxel-ui/addon/src/components/progress-radial/index.gts +++ b/packages/boxel-ui/addon/src/components/progress-radial/index.gts @@ -1,7 +1,7 @@ import { htmlSafe } from '@ember/template'; import Component from '@glimmer/component'; -import { cssVar } from '../../helpers.ts'; +import { cssVar } from '../../helpers.gts'; interface Signature { Args: { diff --git a/packages/boxel-ui/addon/src/components/radio-input/item.gts b/packages/boxel-ui/addon/src/components/radio-input/item.gts index fb894a2c1df..27e034bc5c0 100644 --- a/packages/boxel-ui/addon/src/components/radio-input/item.gts +++ b/packages/boxel-ui/addon/src/components/radio-input/item.gts @@ -2,7 +2,7 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; import { concat } from '@ember/helper'; import { on } from '@ember/modifier'; -import { cn, not } from '../../helpers.ts'; +import { cn, not } from '../../helpers.gts'; import cssVar from '../../helpers/css-var.ts'; export interface Signature { diff --git a/packages/boxel-ui/addon/src/components/resizable-panel-group/usage.gts b/packages/boxel-ui/addon/src/components/resizable-panel-group/usage.gts index 2fdda5f7a28..456ab331f65 100644 --- a/packages/boxel-ui/addon/src/components/resizable-panel-group/usage.gts +++ b/packages/boxel-ui/addon/src/components/resizable-panel-group/usage.gts @@ -7,7 +7,7 @@ import { cssVariable, } from 'ember-freestyle/decorators/css-variable'; -import { not } from '../../helpers.ts'; +import { not } from '../../helpers.gts'; import cssVar from '../../helpers/css-var.ts'; import ResizablePanelGroup from './index.gts'; diff --git a/packages/boxel-ui/addon/src/components/select/trigger.gts b/packages/boxel-ui/addon/src/components/select/trigger.gts index 60a44f426bb..f99069391e8 100644 --- a/packages/boxel-ui/addon/src/components/select/trigger.gts +++ b/packages/boxel-ui/addon/src/components/select/trigger.gts @@ -1,7 +1,7 @@ import Component from '@glimmer/component'; import type { Select } from 'ember-power-select/components/power-select'; -import { cn } from '../../helpers.ts'; +import { cn } from '../../helpers.gts'; import { not } from '../../helpers/truth-helpers.ts'; import CaretDown from '../../icons/caret-down.gts'; diff --git a/packages/boxel-ui/addon/src/components/select/usage.gts b/packages/boxel-ui/addon/src/components/select/usage.gts index 499216848c9..c10eaf3b56d 100644 --- a/packages/boxel-ui/addon/src/components/select/usage.gts +++ b/packages/boxel-ui/addon/src/components/select/usage.gts @@ -11,7 +11,7 @@ import { cssVariable, } from 'ember-freestyle/decorators/css-variable'; -import { cssVar } from '../../helpers.ts'; +import { cssVar } from '../../helpers.gts'; import BoxelField from '../field-container/index.gts'; import BoxelSelect from './index.gts'; diff --git a/packages/boxel-ui/addon/src/components/swatch/index.gts b/packages/boxel-ui/addon/src/components/swatch/index.gts index e30d8ec5f2a..c156191570f 100644 --- a/packages/boxel-ui/addon/src/components/swatch/index.gts +++ b/packages/boxel-ui/addon/src/components/swatch/index.gts @@ -1,6 +1,6 @@ import type { TemplateOnlyComponent } from '@ember/component/template-only'; -import { cn, cssVar, eq, not } from '../../helpers.ts'; +import { cn, cssVar, eq, not } from '../../helpers.gts'; interface Signature { Args: { diff --git a/packages/boxel-ui/addon/src/components/switch/index.gts b/packages/boxel-ui/addon/src/components/switch/index.gts index c7aa2e921dd..5c0375cf844 100644 --- a/packages/boxel-ui/addon/src/components/switch/index.gts +++ b/packages/boxel-ui/addon/src/components/switch/index.gts @@ -1,7 +1,7 @@ import { on } from '@ember/modifier'; import Component from '@glimmer/component'; -import { cn } from '../../helpers.ts'; +import { cn } from '../../helpers.gts'; interface SwitchSiganture { Args: SwitchArgs; diff --git a/packages/boxel-ui/addon/src/components/tag-list/usage.gts b/packages/boxel-ui/addon/src/components/tag-list/usage.gts index cc22a00b07c..1b66e9ac299 100644 --- a/packages/boxel-ui/addon/src/components/tag-list/usage.gts +++ b/packages/boxel-ui/addon/src/components/tag-list/usage.gts @@ -6,7 +6,7 @@ import { cssVariable, } from 'ember-freestyle/decorators/css-variable'; -import { cssVar } from '../../helpers.ts'; +import { cssVar } from '../../helpers.gts'; import TagList, { type TagItem } from './index.gts'; export default class TagListUsage extends Component { diff --git a/packages/boxel-ui/addon/src/components/tooltip/usage.gts b/packages/boxel-ui/addon/src/components/tooltip/usage.gts index 073f7a558f6..9ce9f1a8c2b 100644 --- a/packages/boxel-ui/addon/src/components/tooltip/usage.gts +++ b/packages/boxel-ui/addon/src/components/tooltip/usage.gts @@ -10,7 +10,7 @@ import { cssVariable, } from 'ember-freestyle/decorators/css-variable'; -import { cssVar } from '../../helpers.ts'; +import { cssVar } from '../../helpers.gts'; import BoxelButton from '../button/index.gts'; import BoxelTooltip, { type TooltipThemeVariant, diff --git a/packages/boxel-ui/addon/src/helpers.ts b/packages/boxel-ui/addon/src/helpers.gts similarity index 100% rename from packages/boxel-ui/addon/src/helpers.ts rename to packages/boxel-ui/addon/src/helpers.gts diff --git a/packages/boxel-ui/addon/src/modifiers.ts b/packages/boxel-ui/addon/src/modifiers.gts similarity index 100% rename from packages/boxel-ui/addon/src/modifiers.ts rename to packages/boxel-ui/addon/src/modifiers.gts diff --git a/packages/boxel-ui/addon/src/usage.ts b/packages/boxel-ui/addon/src/usage.gts similarity index 100% rename from packages/boxel-ui/addon/src/usage.ts rename to packages/boxel-ui/addon/src/usage.gts diff --git a/packages/boxel-ui/test-app/babel.config.mjs b/packages/boxel-ui/test-app/babel.config.mjs index 17c37887af4..b503c0ddb5f 100644 --- a/packages/boxel-ui/test-app/babel.config.mjs +++ b/packages/boxel-ui/test-app/babel.config.mjs @@ -15,6 +15,7 @@ export default { allowDeclareFields: true, }, ], + 'ember-concurrency/async-arrow-task-transform', [ 'babel-plugin-ember-template-compilation', { @@ -23,7 +24,10 @@ export default { 'ember-cli-htmlbars-inline-precompile', 'htmlbars-inline-precompile', ], - transforms: [...templateCompatSupport()], + transforms: [ + ...templateCompatSupport(), + 'glimmer-scoped-css/ast-transform', + ], }, ], [ diff --git a/packages/boxel-ui/test-app/package.json b/packages/boxel-ui/test-app/package.json index ceaab74ca71..74cc0123e7a 100644 --- a/packages/boxel-ui/test-app/package.json +++ b/packages/boxel-ui/test-app/package.json @@ -69,6 +69,7 @@ "ember-cli-deploy-smart-compress": "^2.0.0", "ember-cli-deprecation-workflow": "^3.0.2", "ember-cli-htmlbars": "^6.3.0", + "ember-concurrency": "catalog:", "ember-css-url": "^1.0.0", "ember-freestyle": "catalog:", "ember-load-initializers": "^3.0.0", @@ -88,6 +89,7 @@ "eslint-plugin-n": "catalog:", "eslint-plugin-prettier": "catalog:", "eslint-plugin-qunit": "catalog:", + "glimmer-scoped-css": "catalog:", "prettier": "catalog:", "prettier-plugin-ember-template-tag": "catalog:", "qunit": "catalog:", diff --git a/packages/boxel-ui/test-app/vite.config.mjs b/packages/boxel-ui/test-app/vite.config.mjs index 219253dbea9..b0ddc197c36 100644 --- a/packages/boxel-ui/test-app/vite.config.mjs +++ b/packages/boxel-ui/test-app/vite.config.mjs @@ -1,12 +1,13 @@ import { defineConfig } from 'vite'; import { extensions, classicEmberSupport, ember } from '@embroider/vite'; import { babel } from '@rollup/plugin-babel'; +import { scopedCSS } from 'glimmer-scoped-css/rollup'; export default defineConfig({ plugins: [ + scopedCSS(), classicEmberSupport(), ember(), - // extra plugins here babel({ babelHelpers: 'runtime', extensions, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index e9934eb5e3f..aa5eac14026 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1596,6 +1596,9 @@ importers: ember-cli-htmlbars: specifier: ^6.3.0 version: 6.3.0 + ember-concurrency: + specifier: 'catalog:' + version: 5.2.0(@babel/core@7.29.7)(@glint/template@1.7.7) ember-css-url: specifier: ^1.0.0 version: 1.0.0(patch_hash=0e5253a008cc7bf02424d786e7a8fb2397bc48962f3cd1443f2c0fdd8200c96d) @@ -1653,6 +1656,9 @@ importers: eslint-plugin-qunit: specifier: 'catalog:' version: 8.2.6(eslint@8.57.1) + glimmer-scoped-css: + specifier: 'catalog:' + version: 0.8.1 prettier: specifier: 'catalog:' version: 3.8.4 From 51033ae7facd3eb2146785a0def6880b45dcdd9c Mon Sep 17 00:00:00 2001 From: Edward Faulkner Date: Fri, 10 Jul 2026 15:27:28 -0400 Subject: [PATCH 2/3] typeo fix --- packages/boxel-ui/addon/src/components/card-header/index.gts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/boxel-ui/addon/src/components/card-header/index.gts b/packages/boxel-ui/addon/src/components/card-header/index.gts index 6646514fddd..cda6d0a8eb3 100644 --- a/packages/boxel-ui/addon/src/components/card-header/index.gts +++ b/packages/boxel-ui/addon/src/components/card-header/index.gts @@ -1,5 +1,5 @@ import Maximize from '@cardstack/boxel-icons/maximize'; -import type { MenuDivider } from '@cardstack/boxel-u./helpers.gts'; +import type { MenuDivider } from '@cardstack/boxel-ui/helpers'; import { on } from '@ember/modifier'; import Component from '@glimmer/component'; import type { ComponentLike } from '@glint/template'; From f3d57a3530509169f772e7146c67e1fbca4a1af0 Mon Sep 17 00:00:00 2001 From: Edward Faulkner Date: Fri, 10 Jul 2026 15:29:25 -0400 Subject: [PATCH 3/3] husky broke these --- packages/boxel-ui/addon/src/components.gts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/boxel-ui/addon/src/components.gts b/packages/boxel-ui/addon/src/components.gts index 8a9e1d2a539..75a1914ede4 100644 --- a/packages/boxel-ui/addon/src/components.gts +++ b/packages/boxel-ui/addon/src/components.gts @@ -4,6 +4,7 @@ import Alert from './components/alert/index.gts'; import Avatar from './components/avatar/index.gts'; import BasicFitted from './components/basic-fitted/index.gts'; import Button from './components/button/index.gts'; +import BoxelButton from './components/button/index.gts'; import CardContainer from './components/card-container/index.gts'; import CardHeader from './components/card-header/index.gts'; import CircleSpinner from './components/circle-spinner/index.gts'; @@ -34,6 +35,7 @@ import FittedCard, { import FittedCardContainer from './components/fitted-card-container/index.gts'; import GridContainer from './components/grid-container/index.gts'; import BoxelHeader from './components/header/index.gts'; +import Header from './components/header/index.gts'; import IconButton from './components/icon-button/index.gts'; import BoxelInput, { type InputBottomTreatment as BoxelInputBottomTreatment, @@ -59,6 +61,7 @@ import Label from './components/label/index.gts'; import LoadingIndicator from './components/loading-indicator/index.gts'; import Menu from './components/menu/index.gts'; import BoxelMessage from './components/message/index.gts'; +import Message from './components/message/index.gts'; import Modal from './components/modal/index.gts'; import BoxelMultiSelect, { BoxelMultiSelectBasic,