* collect tailwind styles from the `libs/vault/*`
- Some unique styles were not showing in storybook
* initial add of carousel component
* initial add of carousel stories
* move carousel button to a standalone component for organization
* add key manager for carousel buttons
* add tab panel role to slide component
* make carousel slide focusable when it does not contain focusable elements
* add aria live to carousel slides
* add labels for carousel slide buttons
* emit slide change event
* move icons to carousel-icons folder
* add barrel file for carousel
* move protected properties
* remove underscore
* allow differing heights of carousel slides
* update interactive styles for the carousel icons
* allow for focus styled on carousel buttons
* fix tests
* fix imports
* add method to render each slide and get the height of the tallest slide
- This avoids consumers having to pass in a height.
- The height of the tallest slide is needed because it will stop the carousel from jumping around as the user scrolls.
* add comment to content property
* remove rem calculation
* 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.
* remove private/protected/lifecycle fields from Storybook docs table
* move theme override decorator into util method
* implement base drawer component
* update bit-layout to be drawer container
* create drawer helper components
* expose new APIs to DS barrel file
* write docs
* update docs; add role input
* use host directive instead of service
* clean up logic a tad
* add start slot to story
* update docs
* Apply suggestions from code review
Co-authored-by: Victoria League <vleague@bitwarden.com>
* update docs
* Update libs/components/src/drawer/drawer.mdx
Co-authored-by: Victoria League <vleague@bitwarden.com>
* update docs / stories
* add non text element to drawer
---------
Co-authored-by: Victoria League <vleague@bitwarden.com>
* [deps] SM: Update typescript-eslint monorepo to v8
---------
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Hinton <hinton@users.noreply.github.com>
Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>
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
* move vault headings to their own component
* update aria-label to bind to the data attribute
* move vault headings to the vault-v2 folder
* integrate disclosure trigger to hide vault filters
* remove built in margin on search component
- spacing will be managed by the parent component
* add event emitter so consuming components can know when disclosure status has changed
* add filter badge when filters are selected and the filters are hidden
* persist filter visibility state to disk
* add supporting text for the filter button
* remove extra file
* only read from stored state on component launch.
- I noticed delays when trying to use stored state as the source of truth
* use two-way data binding for change event
* update vault headers to use two way data binds from disclosure component
- also adjust consuming changes
* add border thickness
* add ticket to the FIXME
* move number of filters observable into service
* move state coordination into filter service
* only expose state and update methods from filter service
* simplify observables to avoid needed state lifecycle methods
* remove comment
* fix test imports
* update badge colors
---------
Co-authored-by: Matt Bishop <mbishop@bitwarden.com>
* [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>
* Added sorting to vault, name, permission and group
Added default sorting
* Fixed import
* reverted test on template
* Only add sorting functionality to admin console
* changed code order
* Fixed leftover test for sortingn
* Fixed reference
* sort permissions by ascending order
* Fixed bug where a collection had multiple groups and sorting alphbatically didn't happen correctly all the time
* Fixed bug whne creating a new cipher item
* Introduced fnFactory to create a sort function with direction provided
* Used new sort function to make collections always remain at the top and ciphers below
* extracted logic to always sort collections at the top
Added similar sorting to sortBygroup
* removed org vault check
* remove unused service
* Sort only collections
* Got rid of sortFn factory in favour of passing the direction as an optional parameter
* Removed tenary
* get cipher permissions
* Use all collections to filter collection ids
* Fixed ascending and descending issues
* Added functionality to default sort in descending order
* default sort permissions in descending order
* Refactored setActive to not pass direction as a paramater
This creates a new component called bit-table-scroll as it's a breaking change in how tables works. We could probably conditionally support both behaviors in the existing table component if we desire.
Rather than iterating the rows in the consuming component, we now need to define a row definition, bitRowDef which provides access to the rows data through angular let- syntax. This allows the table component to own the behaviour which is needed in order to use the cdkVirtualFor directive which must be inside the cdk-virtual-scroll-viewport component.
* Add Icon documentation
* Add 7th bullet
* Icon docs - add context on how to go from hex values to appropriate tailwind classes.
* 7th bullet needs bold to look right
* Add color icon per suggestion
* increase z-index `cdk-drag-preview` so it displays on top of modals/dialogs when draggable elements are within them
* update comment overlay z-index and add ticket number
* update comment
