@layerfi/components 0.1.128-alpha.2 → 0.1.129-alpha

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css CHANGED
@@ -3247,6 +3247,10 @@
3247
3247
  border-radius: var(--spacing-sm);
3248
3248
  box-shadow: 0 4px 12px 0 var(--base-transparent-8), 0 2px 4px 0 var(--base-transparent-6), 0 0 0 1px var(--base-transparent-4);
3249
3249
  background: var(--color-base-0);
3250
+ }
3251
+ .Layer__card--reset {
3252
+ border: 1px solid var(--color-base-200);
3253
+ box-shadow: none;
3250
3254
  }.Layer__hover-menu {
3251
3255
  position: relative;
3252
3256
  display: flex;
@@ -3789,10 +3793,7 @@
3789
3793
  }
3790
3794
  .Layer__MobileSelectionDrawerList__Check[data-selected=true] {
3791
3795
  visibility: visible;
3792
- }.Layer__MobileSelectionDrawerWithTrigger {
3793
- padding-inline: var(--spacing-sm);
3794
- }
3795
- .Layer__MobileSelectionDrawerWithTrigger .Layer__SearchField {
3796
+ }.Layer__MobileSelectionDrawerWithTrigger .Layer__SearchField {
3796
3797
  inline-size: 100%;
3797
3798
  }
3798
3799
  .Layer__MobileSelectionDrawerWithTrigger .Layer__MobileListItem {
@@ -5225,117 +5226,70 @@
5225
5226
  grid-template-columns: 16rem minmax(auto, 24rem);
5226
5227
  }.Layer__TaxBanner {
5227
5228
  max-width: 1406px;
5228
- }.Layer__ExpandableCard {
5229
- border-radius: 0;
5230
- border: none;
5231
- box-shadow: none;
5232
- }
5233
- .Layer__ExpandableCard:not(:first-child) {
5234
- border-top: 1px solid var(--color-base-300);
5235
- }
5236
- .Layer__ExpandableCard__Header {
5237
- all: unset;
5238
- box-sizing: border-box;
5239
- display: block;
5240
- width: 100%;
5241
- padding: var(--spacing-md);
5242
- cursor: pointer;
5243
- }
5244
- .Layer__ExpandableCard__Content {
5245
- padding-block-end: var(--spacing-md);
5246
- padding-inline: var(--spacing-md);
5247
5229
  }.Layer__ResponsiveDetailView {
5248
5230
  container-type: inline-size;
5249
- }.Layer__TaxTable {
5250
- width: 100%;
5251
- table-layout: fixed;
5252
- }
5253
- .Layer__TaxTable__Header {
5254
- display: none;
5255
- }
5256
- .Layer__TaxTable .Layer__UI__Table-Row {
5257
- display: grid;
5258
- grid-template-columns: minmax(6rem, 60%) minmax(4rem, 40%);
5259
- }
5260
- .Layer__TaxTable .Layer__UI__Table-Row--mobile {
5261
- height: auto;
5262
- }
5263
- .Layer__TaxTable .Layer__UI__Table-Cell:nth-child(2) {
5264
- justify-content: flex-end;
5265
- text-align: right;
5266
- }
5267
-
5268
- .Layer__UI__Table-Row.Layer__TaxTable__Row--nested {
5269
- background-color: var(--color-base-50);
5270
- }
5271
- .Layer__UI__Table-Row.Layer__TaxTable__Row--nested .Layer__UI__Table-Cell:first-child {
5272
- padding-left: var(--spacing-lg);
5231
+ }.Layer__TaxSummaryCard--mobile {
5232
+ border-block-start: 1px solid var(--color-base-200);
5273
5233
  }
5274
- .Layer__UI__Table-Row.Layer__TaxTable__Row--empty {
5275
- height: var(--spacing-md);
5276
- }
5277
- .Layer__UI__Table-Row.Layer__TaxTable__Row--section-total {
5278
- border-bottom: 1px solid var(--color-border);
5279
- }
5280
- .Layer__UI__Table-Row.Layer__TaxTable__Row--total {
5281
- border-top: 2px solid var(--color-border);
5282
- }.Layer__TaxDetailsExpandableCardHeading {
5283
- width: 100%;
5234
+ @media (width > 760px) {
5235
+ .Layer__TaxSummaryCard--mobile {
5236
+ border: none;
5237
+ }
5284
5238
  }
5285
5239
 
5286
- .Layer__TaxDetailsExpandableCardHeading > .Layer__Span.Layer__MoneySpan {
5287
- height: fit-content;
5288
- margin-block: auto;
5240
+ .Layer__TaxSummaryCard__MobileToggleWrapper {
5241
+ margin-top: var(--spacing-md);
5289
5242
  }.Layer__TaxSummaryCard {
5243
+ display: grid;
5244
+ grid-template-columns: 20% 40% 40%;
5290
5245
  width: 100%;
5291
5246
  border-block-end: 1px solid var(--color-base-200);
5292
5247
  }
5293
- .Layer__TaxSummaryCard__Overview {
5294
- min-width: 200px;
5248
+ .Layer__TaxSummaryCard__Cell {
5249
+ position: relative;
5295
5250
  padding: var(--spacing-lg);
5296
- border-inline-end: 1px solid var(--color-base-200);
5297
5251
  }
5298
- .Layer__TaxSummaryCard__Breakdown {
5299
- flex: 1;
5300
- padding: var(--spacing-lg);
5301
- padding-block-end: var(--spacing-xl);
5252
+ .Layer__TaxSummaryCard__Cell--header {
5253
+ border-block-end: 1px solid var(--color-base-200);
5302
5254
  }
5303
- .Layer__TaxSummaryCard__Grid {
5304
- display: grid;
5305
- grid-template-columns: repeat(5, auto);
5306
- row-gap: var(--spacing-3xs);
5307
- column-gap: var(--spacing-md);
5308
- align-items: baseline;
5309
- width: fit-content;
5255
+ .Layer__TaxSummaryCard__Cell--bordered {
5256
+ border-inline-start: 1px solid var(--color-base-200);
5310
5257
  }
5311
- .Layer__TaxSummaryCard__Grid > .Layer__Span {
5312
- text-align: right;
5258
+ .Layer__TaxSummaryCard__OperatorIconAnchor {
5259
+ position: absolute;
5260
+ z-index: 1;
5261
+ top: 50%;
5262
+ left: 0;
5263
+ display: inline-flex;
5264
+ align-items: center;
5265
+ justify-content: center;
5266
+ background-color: var(--color-base-0);
5267
+ transform: translate(-50%, -50%);
5313
5268
  }
5314
- .Layer__TaxSummaryCard__Grid--mobile {
5315
- grid-template-columns: 1fr auto 1fr auto 1fr;
5316
- column-gap: var(--spacing-sm);
5317
- width: 100%;
5269
+ .Layer__TaxSummaryCard__OperatorCircle {
5270
+ display: inline-flex;
5271
+ align-items: center;
5272
+ justify-content: center;
5273
+ color: var(--color-base-500);
5318
5274
  }
5319
- .Layer__TaxSummaryCard__SectionGroup {
5320
- display: contents;
5275
+ .Layer__TaxSummaryCard__Equation {
5276
+ flex-wrap: wrap;
5321
5277
  }
5322
- .Layer__TaxSummaryCard__SectionGroup > .Layer__Span:first-child {
5323
- grid-column: 1/-1;
5324
- text-align: left;
5278
+ .Layer__TaxSummaryCard__AmountWithLabel {
5279
+ min-width: 0;
5325
5280
  }
5326
- .Layer__TaxSummaryCard__SectionGroup:not(:first-child) > .Layer__Span:first-child {
5327
- padding-block-start: var(--spacing-md);
5328
- margin-block-start: var(--spacing-3xs);
5329
- border-block-start: 1px solid var(--color-base-100);
5281
+ .Layer__TaxSummaryCard__Operator {
5282
+ align-self: center;
5330
5283
  }
5331
5284
  .Layer__TaxSummaryCard--mobile {
5332
5285
  width: 100%;
5333
5286
  }
5334
- .Layer__TaxSummaryCard__OverviewCard {
5287
+ .Layer__TaxSummaryCard__MobileCard {
5335
5288
  padding: var(--spacing-lg);
5336
5289
  }
5337
- .Layer__TaxSummaryCard__BreakdownCard {
5338
- padding: var(--spacing-lg);
5290
+ .Layer__TaxSummaryCard__MobileSections {
5291
+ padding-block-start: var(--spacing-sm);
5292
+ border-block-start: 1px solid var(--color-base-200);
5339
5293
  }.Layer__FullYearProjectionComboBox__Container {
5340
5294
  inline-size: 11rem;
5341
5295
  max-inline-size: 11rem;
@@ -5349,15 +5303,52 @@
5349
5303
  .Layer__TaxEstimatesHeader__ComboBoxContainer {
5350
5304
  width: 100%;
5351
5305
  }
5352
- }.Layer__TaxDetails--mobile .Layer__TaxSummaryCard--mobile > .Layer__card,
5353
- .Layer__TaxDetails--mobile .Layer__TaxDetails__ExpandableCardsWrapper {
5354
- border: 1px solid var(--color-base-200);
5355
- box-shadow: none;
5306
+ }.Layer__UI__Table__TaxDetails {
5307
+ width: 100%;
5308
+ }
5309
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-TableHeader {
5310
+ display: none;
5311
+ }
5312
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-Row,
5313
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-TableHeader > tr {
5314
+ display: grid;
5315
+ grid-template-columns: minmax(0, 1fr) minmax(4rem, 8rem);
5316
+ }
5317
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-Row[data-depth="0"] .Layer__Span,
5318
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-TableHeader > tr[data-depth="0"] .Layer__Span {
5319
+ font-size: var(--text-lg);
5320
+ font-weight: var(--font-weight-bold);
5321
+ }
5322
+ @media (width <= 500px) {
5323
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-Row[data-depth="0"] .Layer__Span,
5324
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-TableHeader > tr[data-depth="0"] .Layer__Span {
5325
+ font-size: var(--text-md);
5326
+ }
5327
+ }
5328
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-Column__TaxDetails--Amount,
5329
+ .Layer__UI__Table__TaxDetails .Layer__UI__Table-Cell__TaxDetails--Amount {
5330
+ justify-content: flex-end;
5331
+ text-align: right;
5356
5332
  }
5357
5333
 
5358
5334
  .Layer__TaxDetails__ExpandableCardsWrapper {
5359
5335
  overflow: hidden;
5360
5336
  border-radius: var(--spacing-sm);
5337
+ }
5338
+
5339
+ @media (width >= 760px) {
5340
+ .Layer__TaxDetails .Layer__card {
5341
+ border-radius: 0;
5342
+ }
5343
+ .Layer__TaxDetails__ExpandableCardsWrapper {
5344
+ border-radius: 0;
5345
+ }
5346
+ }.Layer__TaxDetails__Operator {
5347
+ display: inline-flex;
5348
+ align-items: center;
5349
+ align-self: stretch;
5350
+ padding-inline-end: var(--spacing-md);
5351
+ border-inline-end: 1px solid var(--color-base-500);
5361
5352
  }.Layer__SummaryCard__ContainerHeader {
5362
5353
  box-sizing: border-box;
5363
5354
  border-bottom: 1px solid var(--color-base-300);
@@ -5626,6 +5617,25 @@
5626
5617
  }
5627
5618
  .Layer__UI__Table__TaxPaymentsTable .Layer__DataTable__EmptyState__Row {
5628
5619
  background-color: var(--color-base-0);
5620
+ }.Layer__ExpandableCard {
5621
+ border-radius: 0;
5622
+ border: none;
5623
+ box-shadow: none;
5624
+ }
5625
+ .Layer__ExpandableCard:not(:first-child) {
5626
+ border-top: 1px solid var(--color-base-300);
5627
+ }
5628
+ .Layer__ExpandableCard__Header {
5629
+ all: unset;
5630
+ box-sizing: border-box;
5631
+ display: block;
5632
+ width: 100%;
5633
+ padding: var(--spacing-md);
5634
+ cursor: pointer;
5635
+ }
5636
+ .Layer__ExpandableCard__Content {
5637
+ padding-block-end: var(--spacing-md);
5638
+ padding-inline: var(--spacing-md);
5629
5639
  }.Layer__TimeTrackingServicesDrawer {
5630
5640
  box-sizing: border-box;
5631
5641
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@layerfi/components",
3
- "version": "0.1.128-alpha.2",
3
+ "version": "0.1.129-alpha",
4
4
  "description": "Layer React Components",
5
5
  "main": "dist/cjs/index.cjs",
6
6
  "module": "dist/esm/index.mjs",
@@ -124,4 +124,4 @@
124
124
  "uuid": "^11.1.0",
125
125
  "zustand": "^5.0.4"
126
126
  }
127
- }
127
+ }