* 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
* Throw error if appA11yTitle is null in icon button
* Add required label input
* Fix icon button errors in CL components and storeis
* fix popover aria-label errors
* remove commented code
* add labels to icon buttons in browser
* add labels to icon buttons in web
* add labels to icon buttons in license
* add labels to icon buttons in send
* add labels to icon buttons in angular
* fix missing pipe error
* fix sso icon button missed in error
* update labels in vault
* add section expand button label
* Adding labels to icon buttons
* Add lint rule to not allow icon buttons without label input
* rename util file
* trigger updates on title change
* update eslint rule name and folder
* add edit collection label to vault headers
* fix web header story label
* add show/hide summary labels
* update summary message
* fix breadcrumbs label message
* fix JSDoc to use correct input
* remove commented code
* use label as aria-label always. Remove init function
* add moreBreadcrumbs translation message to other apps
* add @bitwarden/team-ui-foundation as code owner for component eslint rules
* switch title to const variable
* add jsdoc comment on what the label input is used for
* [PM-22415] Tax ID notifications for Organizations and Providers (#15996)
* [NO LOGIC] Rename BillableEntity to BitwardenSubscriber
This helps us maintain paraody with server where we call this choice type ISubscriber. I chose BitwardenSubscriber to avoid overlap with RxJS
* [NO LOGIC] Move subscriber-billing.client to clients folder
* [NO LOGIC] Move organization warnings under organization folder
* Move getWarnings from OrganizationBillingApiService to new OrganizationBillingClient
I'd like us to move away from stashing so much in libs and utilizing the JsLibServicesModule when it's not necessary to do so. These are invocations used exclusively by the Web Vault and, until that changes, they should be treated as such
* Refactor OrganizationWarningsService
There was a case added to the Inactive Subscription warning for a free trial, but free trials do not represent inactive subscriptions so this was semantically incorrect. This creates another method that pulls the free trial warning and shows a dialog asking the user to subscribe if they're on one.
* Implement Tax ID Warnings throughout Admin Console and Provider Portal
* Fix linting error
* Jimmy's feedback
* remove duplicate messages keys
* revert changes to popover stories
* add back dupe myItems key for now as it was already here
* fix directive type errors
* remove variable left in error from merge conflict
* revert unintentional change to reports layout
* add back reports change
---------
Co-authored-by: Alex Morask <144709477+amorask-bitwarden@users.noreply.github.com>
This PR migrates `libs/components` to use strict TypeScript.
- Remove `@ts-strict-ignore` from each file in `libs/components` and resolved any new compilation errors
- Converted ViewChild and ContentChild decorators to use the new signal-based queries using the [Angular signal queries migration](https://angular.dev/reference/migrations/signal-queries)
- Made view/content children `required` where appropriate, eliminating the need for additional null checking. This helped simplify the strict migration.
---
Co-authored-by: Vicki League <vleague@bitwarden.com>
* 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>
* adding validation stories
* add one story for all validations
* fix form field story import
* move validation docs
* fix maxValue default value
* add play function to submit form
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
The component library currently uses classes to determine fvw target, default content and main content. This replaces them with data attributes which avoids the css class linter from detecting them as invalid classes.
* [CL-571] Update icons to new fileset and metaphors (#14163)
* [CL-518] Convert icons docs to stories (#14299)
* [CL-574] Update inline autofill icons (#14379)
---------
Co-authored-by: William Martin <contact@willmartian.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
Extract core functionality from `libs/angular` to allow teams to depend on `libs/ui-common` instead.
Moves the following functionality to `ui-common`.
- `I18nPipe`. `libs/angular` still has an old copy but `components` depends on the new variant from `ui-common`.
- `safeProvider`, `SafeProvider` and `SafeInjectionToken`. `libs/angular`re-exports these to avoid needing to update all consumers.
Update all libs to use explicit dependencies rather than relying on tsconfig.libs.json. This allows us to more easily understand the dependencies between libs and prevent users from accidentally adding new dependencies.
We still use tsconfig.libs (now renamed tsconfig.spec) for tests.
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>
* match API of new CL FormField component
* remove readonly border for additional options component
* remove readonly border for last autofill option
* remove readonly border for last custom-field form field
* remove readonly border for when collection,org or folder is available
* add `ReadOnlyCipherCardComponent` to handle readonly border
* remove readonly border for the last identity form field
* remove readonly border for the last card form field
* remove readonly border for the last login form field
* remove unneeded true value
* 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>
Enables one of the recommended rules of @angular-eslint. Since this rule was fairly trivial to fix and has no QA effects it seemed reasonable to migrate all code.
* Converted add-edit send component dialog into a bit-dialog
* Updated Send AddEdit text fields to Component Library
* Migrated Share and Options fields to ComponentLibrary on SendAddEdit
* Migrated footer buttons to ComponentLibrary on SendAddEdit
* Updated web's SendAddEdit component file fields
* Replaced file upload with component library
* Changed SendAddEdit to use Reactive Forms on web
* Changed browser SendAddEdit to use ReactiveForms
* Update SendAddEdit on desktop to use ReactiveForms
* Added AppA11yTitle to button on web SendAddEdit
* Initial efflux-dates web change to ComponentLibrary
* Corrected delete button to check if it is in EditMode on SendAddEdit
* Using BitLink on options button
* Corrected typo on send add edit desktop
* Replaced efflux-dates with datetime-local input on SendAddEdit web, browser and desktop
* Removed efflux dates
* Added firefox custom date popout message on DeletionDate to SendAddEdit browser component
* moved desktop's new send data reload from send to SendAddEdit component
* removing unnecessary attributes and spans from Send AddEdit web
* removed redundant try catch from add edit and unnecessary parameter from close
* Added type for date select options
* Removed unnecessary classes and swapped bootstrap classes by corresponding tailwind classes
* Removed unnecessary code
* Added file as required field
Submit only closes popup on success
* Added pre validations at start of submit
* PM-3668 removed expiration date from required
* PM-3671 not defaulting maximum access count to 0
* PM-3669 Copying the link from link method
* Removed required tag from html and added to formgroup
* PM-3679 Checking if is not EditMode before validating if FormGroup file value is set
* PM-3691 Moved error validation to web component as browser and desktop need to show popup error
* PM-3696 - Disabling hide email when it is unset and has policy to not allow hiding
* PM-3694 - Properly setting default value for dates on Desktop when changing from an existing send
* Disabling hidden required fields
* [PM-3800] Clearing password on new send
* Rename service-factory folder
* Move cryptographic service factories
* Move crypto models
* Move crypto services
* Move domain base class
* Platform code owners
* Move desktop log services
* Move log files
* Establish component library ownership
* Move background listeners
* Move background background
* Move localization to Platform
* Move browser alarms to Platform
* Move browser state to Platform
* Move CLI state to Platform
* Move Desktop native concerns to Platform
* Move flag and misc to Platform
* Lint fixes
* Move electron state to platform
* Move web state to Platform
* Move lib state to Platform
* Fix broken tests
* Rename interface to idiomatic TS
* `npm run prettier` 🤖
* Resolve review feedback
* Set platform as owners of web core and shared
* Expand moved services
* Fix test types
---------
Co-authored-by: Hinton <hinton@users.noreply.github.com>
* Add trim validator to SM dialogs
* Swap to creating a generic component
* Swap to BitValidators.trimValidator
* Fix storybook
* update validator to auto trim whitespace
* update storybook copy
* fix copy
* update trim validator to run on submit
* add validator to project name in secret dialog; update secret name validation to on submit
---------
Co-authored-by: William Martin <contact@willmartian.com>