* Use aria-disabled for button disabled state
* remove import from testing story
* use aria-disabled attr on bitLink button
* remove unnecessary story attrs
* remove disabled attr if on button element
* create caprture click util
* use caprture click util and fix tests
* fix lint errors
* fix event type
* combine click capture and attr modification
* fix lint error. Commit spec changes left out of last commit in error
* inject element ref
* move aria-disabled styles to common
* move disabled logic into util
* fix broken async actions stories
* fix broken tests asserting disabled attr
* have test check for string true vlalue
* fix Signal type
* fix form-field story import
* remove injector left in error
* aria-disable icon buttons
* update form component css selector to look for aria-disabled buttons
* use correct types. pass nativeElement directly
* add JSDoc comment for util function
* WIP
* WIP
* inject service in directive
* remove console log
* remove disabled attr left in error
* update comments
* remove unnecessary logic
* remove :disabled psuedo selector as its apparently not needed
* fix event type
* coerce disabled attr to boolean
* remove duplicate style concat left by conflict resolution
* add back buttonStyles default
* move reactive logic back to helper
* add test to ensure menu button doesn't open when trigger is disabled
* remove menu toggle to fix tests
* remove disabled menu story
* Fix usage of bitLink in verify email component
* Update varaible name
* no longer pass destroyRef
* Use aria-disabled for button disabled state
* remove import from testing story
* use aria-disabled attr on bitLink button
* remove unnecessary story attrs
* remove disabled attr if on button element
* create caprture click util
* use caprture click util and fix tests
* fix lint errors
* fix event type
* combine click capture and attr modification
* fix lint error. Commit spec changes left out of last commit in error
* inject element ref
* move aria-disabled styles to common
* move disabled logic into util
* fix broken async actions stories
* fix broken tests asserting disabled attr
* have test check for string true vlalue
* fix Signal type
* fix form-field story import
* remove injector left in error
* aria-disable icon buttons
* update form component css selector to look for aria-disabled buttons
* use correct types. pass nativeElement directly
* add JSDoc comment for util function
---------
Co-authored-by: Will Martin <contact@willmartian.com>
Upgrade Angular to v19 using the update guide.
- Add `standalone: false` to any missed component in stories or tests.
- Update jest.config to follow the new best practices.
* update usage of margin-right with margin-inline-end
* update usage of margin-left with margin-inline-start
* update usage of paddiing-right with padding-inline-end
* update usage of paddiing-left with padding-inline-start
* update usage of radius to use logical properties
* rearrange button docs
* Enhance avatar docs
* Enhance badge docs
* Enhance banner docs
* add util to format args for snippets
* update banner snippets
* WIP
* bind boolean args so they work correctly in Storybook
* simplify button stories
* Update callout docs
* use title component for checkbox docs
* use title and description component for chip select docs
* update color password story docs
* update disclosure docs
* add import to icon docs
* updated icon-button docs
* update link docs
* Update prgress docs
* updated search field docs
* remove html type definitions
* add import for progress
* updated toast docs
* remove example from docs. format args for snippet
* Update badges docs
* handle array arg values correctly
* Update badges list docs
* fix dupe key error from taost story
* remove unnecessary typeof check
* remove banner usage example
* add breadcrumbs import statement and jsdoc
* add color password import statement
* fixing type mismaches
* fix typos
* Add missing generics to format function
* fix typo
* update callout icon spacing to match Figma
* add back max width container
* adds small button size variant
* makes small icon button same size as small button
* testing small button for extension header
* remove extension changes
* update popout layout story
* revert change to small icon button padding
* add whitespace to see if error resolves
* default buttonType to primary
* default buttonType to secondary
* add comment around why nonNullButtonSize value exists
* add comment to property about using the non null version
* Update apps/browser/src/platform/popup/layout/popup-layout.stories.ts
Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com>
* updated input syntax when using static values
* remove nonNull value coersion
* allow changing of size input in Story
---------
Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com>
* Update Figma links
updated existing Figma links to point to the new file and added Figma links to components missing them
* Added last missing Figma links
Fixing some low hanging fruits for moving CL to strict typescript.
This primarily removes the types from args since TS infers them differently. We previously needed them since storybook would use any for args but now provides proper typings
* Use typescript-strict-plugin to iteratively turn on strict
* Add strict testing to pipeline
Can be executed locally through either `npm run test:types` for full type checking including spec files, or `npx tsc-strict` for only tsconfig.json included files.
* turn on strict for scripts directory
* Use plugin for all tsconfigs in monorepo
vscode is capable of executing tsc with plugins, but uses the most relevant tsconfig to do so. If the plugin is not a part of that config, it is skipped and developers get no feedback of strict compile time issues. These updates remedy that at the cost of slightly more complex removal of the plugin when the time comes.
* remove plugin from configs that extend one that already has it
* Update workspace settings to honor strict plugin
* Apply strict-plugin to native message test runner
* Update vscode workspace to use root tsc version
* `./node_modules/.bin/update-strict-comments` 🤖
This is a one-time operation. All future files should adhere to strict type checking.
* Add fixme to `ts-strict-ignore` comments
* `update-strict-comments` 🤖
repeated for new merge files
* [CL-245] Update palette to new light and dark theme colors (#8633)
* [CL-245] Add new color swatches to storybook (#8697)
* [CL-238] update typography (#8997)
* [CL-230] [CL-296] Update button styles (#9345)
* [CL-237] Update menu styles for extension refresh (#9525)
* [CL-267] Add 100-level color variants and update primary-600 (#9550)
* [CL-286] Update badge to use focus-visible instead of focus (#9551)
* [CL-250] Update badge styles for extension refresh (#9572)
* [CL-234] callout style refresh (#9920)
* [CL-233] Update form field styles (#9776)
* [CL-239][CL-251][CL-342] dialog style refresh (#10096)
* [CL-239] simple dialog style refresh
* [CL-342] fix text overflow in dialog; add story
* [CL-244] readonly fields (#10164)
* [CL-352] Fix Angular errors related to form element changes (#10211)
* [CL-273] Update styles for checkbox and form control (#10146)
* [CL-274] Update styling for radio button (#10333)
* [CL-338] Remove extra space in item content when end slot is empty (#10350)
* [CL-377] Fix extension style conflict for input background (#10351)
* [CL-271] Update styles for toggle (#10377)
* [CL-381] Update spacing around form elements (#10432)
* [CL-229] Update icon button styles (#10405)
* [CL-380] Remove hover state from disabled form fields (#10639)
* [CL-405] Allow toggle group input to be full width (#10658)
* [CL-389] Exclude end slot label content from truncation (#10508)
* [CL-383] Remove manual focus when password toggle is clicked (#10749)
* [CL-278][CL-391] misc bit-item style fixes (#10758)
* [CL-391] use pointer cursor on hover when link or button
* [CL-210] Change base font size from 14px to 16px (#10779)
* [CL-291] Finalize styling for chip select (#10771)
* [CL-257] update banner component styles (#10766)
* [CL-443] Fix sizing issues (#10893)
* [CL-445] Fix small sizing and spacing issues (#10962)
* [CL-382] Reduce element shifting on readonly hover (#10956)
* [CL-396] Update theme colors to new hexes (#10968)
* [CL-395] Remove text headers color (#10997)
* [CL-404] Switch to primary-600 for all focus indicators (#11015)
* [CL-397] Remove primary-500 (#11036)
* [CL-447] Ensure DM Sans displays correctly at all font weights (#11041)
* [CL-448] Scrollbar Styles (#11111)
* CL-252/update toast (#10996)
* [CL-275] Update link styles (#11174)
* [CL-446] Update hover state for unselected chip selects (#11172)
* [CL-454] Improve color a11y for toast and banner interactive elements (#11200)
* [CL-457] Center input text for select and multiselect (#11239)
* [CL-455] Do not use responsive margin for sections in dialogs or extension (#11243)
* [CL-459] Fix chip behavior when opening menu while item is selected (#11227)
* [CL-388] Update vertical nav colors for new palette (#11226)
* scope styled scrollbar to only select elements (#11247)
* edit radio buttons to be block inputs and update spacing (#11291)
* [CL-453] Fix multiselect chip spacing and truncation (#11300)
* [PM-11131] Prevent duplicated sr labels on form field icon buttons (#11383)
* [CL-303] Prevent chip menu from running offscreen (#11348)
* [CL-476] Fix DM Sans font on Windows (#11409)
* implements scrollbar styles for firefox/chrome and safari (#11447)
* [CL-472] Fix search background color in extension (#11466)
* [CL-481] Style updates for bit-item, bit-card, and primary-100 (#11473)
* [CL-478] Remove underline on hover for most components (#11477)
* [CL-477] Remove focus styles for readonly input (#11510)
* [CL-487] Fix vault items virtual scroll height (#11581)
* [PM-8625] Increase popup width (#11686)
* [CL-494] Wrap long words in toggle group (#11659)
* [CL-13820] Add class to remove link underline (#11762)
* [CL-435] Prevent Windows extension from shifting (#11851)
* [CL-503] Add notification color variables (#11802)
* [PM-14043] Update size of toggle group label to fit more content (#11881)
* [CL-498] Set chip menu width minimum to chip select width (#11905)
---------
Co-authored-by: Will Martin <contact@willmartian.com>
Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com>
Co-authored-by: Nick Krantz <125900171+nick-livefront@users.noreply.github.com>
Co-authored-by: Merissa Weinstein <merissa.k.weinstein@gmail.com>
Co-authored-by: Danielle Flinn <43477473+danielleflinn@users.noreply.github.com>
* add component import examples
* component library story html formatting/cleanup nits
* Update libs/components/src/dialog/dialog/dialog.mdx
Co-authored-by: Will Martin <contact@willmartian.com>
* Update libs/components/src/badge/badge.mdx
Co-authored-by: Will Martin <contact@willmartian.com>
* Update libs/components/src/dialog/simple-dialog/simple-dialog.mdx
Co-authored-by: Will Martin <contact@willmartian.com>
---------
Co-authored-by: Will Martin <contact@willmartian.com>
* [CL-58] feat: add support for modyfing button types from directives
* [CL-58] feat: set button type secondary when used as prefix/suffix
* [CL-58] chore: add example using suffix to async actions story
* [CL-58] feat: update story with examples
* [CL-58] feat: allow buttons to have their style unset
* [CL-58] feat: move all styling into prefix/suffix
* [CL-58] fix: static content prefix/suffix
* [CL-58] fix: add missing bitFormButton to bitAction
* [CL-58] fix: disabled opacity not overriding correctly
* [CL-58] feat: change hover color to muted
* [CL-58] feat: replace undefined with unstyled
* [CL-58] fix: focus borders on input and prefix/suffix
* [CL-58] feat: update production code to use icon button correctly
* [CL-58] refactor: move out button type to common place
* [CL-58] fix: buttons not migrated correctly
* [CL-58] feat: use icon button in password toggle
* [CL-58] fix: remove button icon stories
* [SM-358] Migrate password toggles (#4129)
* [CL-58] fix: missing i18n service in story
* [CL-58] fix: missing bitIconButton directive in export comp
Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com>
Co-authored-by: Thomas Rittson <trittson@bitwarden.com>
* [EC-457] feat: initial version of icon button
* [EC-457] feat: modify template and start adding inputs
* [EC-457] feat: implement all styles
* [EC-457] chore: cleanup
* [EC-457] feat: fix hover styles after discussions
* [EC-457] feat: add focus ring workaround
* [EC-457] chore: refactor stories a bit
* [EC-457] fix: button style attr name reserved word collision
* [EC-356] feat: match padding with figma
* [EC-457] feat: use icon button in banner
* [EC-457] chore: cleanup css classes
* [EC-457] feat: improve aria
* [EC-457] feat: use icon button in dialog
* [EC-457] fix: make focus and hover styles independent
* [EC-457] fix: remove primary 500 border
* [EC-457] chore: cleanup
* [EC-457] chore: move css class to common list
* [EC-457] fix: use focus-visible
* [EC-457] chore: expand on workaround fix
* [EC-457] fix: default sizing
* [EC-457] fix: align trash icon right
* [EC-457] fix: add missing aria labels
* [EC-457] fix: add i18n service to banner tests
* [EC-457] chore: rename size `default` to `button`
* [EC-457] feat: double padding
* [EC-457] feat: simplify sizes - update default
* [EC-457] fix: revert selector fix - gonna create separate pr
* [EC-457] chore: remove superfluous dependencies
* [EC-457] fix: remove non-working onClose handler
Removing this storybook action because we already test it as part of the dialog service stories.
It requries mocking the dialogRef to capture the close function which makes this story more complex
but adds very little value as we already test it elsewhere.
* Create base jest.config file
* Fix various tests that were broken
* Add maxWorkers to jest config
* Undo change to testEnvironment
* Enable tsconfig.spec.json
