@planningcenter/tapestry 3.0.0-rc.4 → 3.0.0-rc.5

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.
Files changed (13) hide show
  1. package/dist/index.css +24 -0
  2. package/dist/index.css.map +1 -1
  3. package/dist/reactRender.css +103 -79
  4. package/dist/reactRender.css.map +1 -1
  5. package/dist/reactRenderLegacy.css +103 -79
  6. package/dist/reactRenderLegacy.css.map +1 -1
  7. package/dist/tokens-deprecated.css +24 -0
  8. package/dist/tokens-deprecated.css.map +1 -1
  9. package/dist/tokens-deprecated.d.ts +2 -0
  10. package/dist/tokens-deprecated.d.ts.map +1 -1
  11. package/dist/unstable.css +24 -0
  12. package/dist/unstable.css.map +1 -1
  13. package/package.json +2 -2
package/dist/reactRender.css CHANGED
@@ -637,6 +637,87 @@
637
637
  --t-shadow-overflow-color:hsla(0, 0%, 0%, 0.6);
638
638
  }
639
639
 
640
+ :root{
641
+ --t-border-size-default:var(--t-border-width);
642
+ --t-border-size-thick:var(--t-border-width-thick);
643
+ --t-font-weight-semi-bold:var(--t-font-weight-semibold);
644
+ --t-icon-color-status-neutral-dark:var(--t-icon-color-status-neutral-bold);
645
+ --t-icon-color-status-info-secondary:var(--t-icon-color-status-info);
646
+ --t-fill-color-status-neutral-solid:var(--t-fill-color-status-neutral);
647
+ --t-fill-color-status-info-solid:var(--t-fill-color-status-info);
648
+ --t-fill-color-status-success-solid:var(--t-fill-color-status-success);
649
+ --t-fill-color-status-warning-solid:var(--t-fill-color-status-warning);
650
+ --t-fill-color-status-error-solid:var(--t-fill-color-status-error);
651
+ --t-fill-color-alert-info:hsl(204, 94%, 49%);
652
+ --t-fill-color-alert-success:hsl(122, 60%, 41%);
653
+ --t-fill-color-alert-warning:hsl(43, 96%, 58%);
654
+ --t-fill-color-alert-error:hsl(4, 77%, 59%);
655
+ --t-fill-color-button-neutral-ghost-disabled-solid:hsl(0, 0%, 98%);
656
+ --t-fill-color-button-neutral-outline-dim-default:var(--t-fill-color-button-neutral-outline);
657
+ --t-fill-color-button-neutral-outline-dim-hover:var(--t-fill-color-button-neutral-outline-hover);
658
+ --t-fill-color-button-neutral-outline-dim-active:var(--t-fill-color-button-neutral-outline-active);
659
+ --t-fill-color-button-neutral-outline-dim-disabled:var(--t-fill-color-button-neutral-outline-disabled);
660
+ --t-fill-color-button-neutral-outline-dim-disabled-solid:hsl(0, 0%, 98%);
661
+ --t-fill-color-button-interaction-outline-dim-default:var(--t-fill-color-button-interaction-outline);
662
+ --t-fill-color-button-interaction-outline-dim-hover:var(--t-fill-color-button-interaction-outline-hover);
663
+ --t-fill-color-button-interaction-outline-dim-active:var(--t-fill-color-button-interaction-outline-active);
664
+ --t-fill-color-button-interaction-outline-dim-disabled:var(--t-fill-color-button-interaction-outline-disabled);
665
+ --t-fill-color-button-create-solid-default:hsl(96, 57%, 33%);
666
+ --t-fill-color-button-create-solid-hover:hsl(97, 57%, 28%);
667
+ --t-fill-color-button-create-solid-active:hsl(97, 57%, 23%);
668
+ --t-fill-color-button-create-solid-disabled:hsl(0, 0%, 81%);
669
+ --t-fill-color-button-create-ghost-default:hsla(0, 0%, 100%, 0);
670
+ --t-fill-color-button-create-ghost-hover:hsl(96, 60%, 95%);
671
+ --t-fill-color-button-create-ghost-active:hsl(97, 57%, 90%);
672
+ --t-fill-color-button-create-ghost-disabled:hsla(0, 0%, 100%, 0);
673
+ --t-fill-color-button-delete-outline-dim-default:var(--t-fill-color-button-delete-outline);
674
+ --t-fill-color-button-delete-outline-dim-hover:var(--t-fill-color-button-delete-outline-hover);
675
+ --t-fill-color-button-delete-outline-dim-active:var(--t-fill-color-button-delete-outline-active);
676
+ --t-fill-color-button-delete-outline-dim-disabled:var(--t-fill-color-button-delete-outline-disabled);
677
+ --t-border-color-default-base:var(--t-border-color);
678
+ --t-border-color-default-dark:var(--t-border-color-dark);
679
+ --t-border-color-default-darker:var(--t-border-color-darker);
680
+ --t-border-color-default-darkest:var(--t-border-color-darkest);
681
+ --t-border-color-default-dim:var(--t-border-color-dim);
682
+ --t-border-color-default-disabled:var(--t-border-color-disabled);
683
+ --t-border-color-default-white:var(--t-border-color-white);
684
+ --t-border-radius-default:var(--t-border-radius);
685
+ --t-border-width-default:var(--t-border-width);
686
+ --t-fill-color-button-delete-ghost-default:var(--t-fill-color-button-delete-ghost);
687
+ --t-fill-color-button-delete-outline-default:var(--t-fill-color-button-delete-outline);
688
+ --t-fill-color-button-delete-solid-default:var(--t-fill-color-button-delete-solid);
689
+ --t-fill-color-button-interaction-ghost-default:var(--t-fill-color-button-interaction-ghost);
690
+ --t-fill-color-button-interaction-outline-default:var(--t-fill-color-button-interaction-outline);
691
+ --t-fill-color-button-interaction-solid-default:var(--t-fill-color-button-interaction-solid);
692
+ --t-fill-color-button-neutral-ghost-default:var(--t-fill-color-button-neutral-ghost);
693
+ --t-fill-color-button-neutral-outline-default:var(--t-fill-color-button-neutral-outline);
694
+ --t-fill-color-button-neutral-responsive-header-default:var(--t-fill-color-button-neutral-responsive-header);
695
+ --t-fill-color-button-neutral-solid-default:var(--t-fill-color-button-neutral-solid);
696
+ --t-fill-color-button-pill-default:var(--t-fill-color-button-pill);
697
+ --t-fill-color-control-primary:var(--t-fill-color-control);
698
+ --t-fill-color-interaction-default:var(--t-fill-color-interaction);
699
+ --t-fill-color-product-staff-base:var(--t-fill-color-product-staff);
700
+ --t-fill-color-status-error-primary:var(--t-fill-color-status-error);
701
+ --t-fill-color-tooltip-primary:var(--t-fill-color-tooltip);
702
+ --t-icon-color-default-dim:var(--t-icon-color-dim);
703
+ --t-icon-color-default-disabled:var(--t-icon-color-disabled);
704
+ --t-icon-color-default-inverted:var(--t-icon-color-inverted);
705
+ --t-icon-color-default-primary:var(--t-icon-color);
706
+ --t-icon-color-default-secondary:var(--t-icon-color-secondary);
707
+ --t-icon-color-status-error-primary:var(--t-icon-color-status-error);
708
+ --t-icon-color-status-info-primary:var(--t-icon-color-status-info);
709
+ --t-icon-color-status-neutral-primary:var(--t-icon-color-status-neutral);
710
+ --t-icon-color-status-success-primary:var(--t-icon-color-status-success);
711
+ --t-icon-color-status-warning-primary:var(--t-icon-color-status-warning);
712
+ --t-text-color-default-disabled:var(--t-text-color-disabled);
713
+ --t-text-color-default-headline:var(--t-text-color-headline);
714
+ --t-text-color-default-inverted:var(--t-text-color-inverted);
715
+ --t-text-color-default-placeholder:var(--t-text-color-placeholder);
716
+ --t-text-color-default-primary:var(--t-text-color);
717
+ --t-text-color-default-secondary:var(--t-text-color-secondary);
718
+ --t-text-color-interaction-primary:var(--t-text-color-interaction);
719
+ }
720
+
640
721
  @media (prefers-color-scheme: dark){
641
722
  :root[data-color-mode="system"]{
642
723
  color-scheme:dark;
@@ -862,85 +943,28 @@
862
943
  }
863
944
  }
864
945
 
865
- :root{
866
- --t-border-size-default:var(--t-border-width);
867
- --t-border-size-thick:var(--t-border-width-thick);
868
- --t-font-weight-semi-bold:var(--t-font-weight-semibold);
869
- --t-icon-color-status-neutral-dark:var(--t-icon-color-status-neutral-bold);
870
- --t-icon-color-status-info-secondary:var(--t-icon-color-status-info);
871
- --t-fill-color-status-neutral-solid:var(--t-fill-color-status-neutral);
872
- --t-fill-color-status-info-solid:var(--t-fill-color-status-info);
873
- --t-fill-color-status-success-solid:var(--t-fill-color-status-success);
874
- --t-fill-color-status-warning-solid:var(--t-fill-color-status-warning);
875
- --t-fill-color-status-error-solid:var(--t-fill-color-status-error);
876
- --t-fill-color-alert-info:hsl(204, 94%, 49%);
877
- --t-fill-color-alert-success:hsl(122, 60%, 41%);
878
- --t-fill-color-alert-warning:hsl(43, 96%, 58%);
879
- --t-fill-color-alert-error:hsl(4, 77%, 59%);
880
- --t-fill-color-button-neutral-ghost-disabled-solid:hsl(0, 0%, 98%);
881
- --t-fill-color-button-neutral-outline-dim-default:var(--t-fill-color-button-neutral-outline);
882
- --t-fill-color-button-neutral-outline-dim-hover:var(--t-fill-color-button-neutral-outline-hover);
883
- --t-fill-color-button-neutral-outline-dim-active:var(--t-fill-color-button-neutral-outline-active);
884
- --t-fill-color-button-neutral-outline-dim-disabled:var(--t-fill-color-button-neutral-outline-disabled);
885
- --t-fill-color-button-neutral-outline-dim-disabled-solid:hsl(0, 0%, 98%);
886
- --t-fill-color-button-interaction-outline-dim-default:var(--t-fill-color-button-interaction-outline);
887
- --t-fill-color-button-interaction-outline-dim-hover:var(--t-fill-color-button-interaction-outline-hover);
888
- --t-fill-color-button-interaction-outline-dim-active:var(--t-fill-color-button-interaction-outline-active);
889
- --t-fill-color-button-interaction-outline-dim-disabled:var(--t-fill-color-button-interaction-outline-disabled);
890
- --t-fill-color-button-create-solid-default:hsl(96, 57%, 33%);
891
- --t-fill-color-button-create-solid-hover:hsl(97, 57%, 28%);
892
- --t-fill-color-button-create-solid-active:hsl(97, 57%, 23%);
893
- --t-fill-color-button-create-solid-disabled:hsl(0, 0%, 81%);
894
- --t-fill-color-button-create-ghost-default:hsla(0, 0%, 100%, 0);
895
- --t-fill-color-button-create-ghost-hover:hsl(96, 60%, 95%);
896
- --t-fill-color-button-create-ghost-active:hsl(97, 57%, 90%);
897
- --t-fill-color-button-create-ghost-disabled:hsla(0, 0%, 100%, 0);
898
- --t-fill-color-button-delete-outline-dim-default:var(--t-fill-color-button-delete-outline);
899
- --t-fill-color-button-delete-outline-dim-hover:var(--t-fill-color-button-delete-outline-hover);
900
- --t-fill-color-button-delete-outline-dim-active:var(--t-fill-color-button-delete-outline-active);
901
- --t-fill-color-button-delete-outline-dim-disabled:var(--t-fill-color-button-delete-outline-disabled);
902
- --t-border-color-default-base:var(--t-border-color);
903
- --t-border-color-default-dark:var(--t-border-color-dark);
904
- --t-border-color-default-darker:var(--t-border-color-darker);
905
- --t-border-color-default-darkest:var(--t-border-color-darkest);
906
- --t-border-color-default-dim:var(--t-border-color-dim);
907
- --t-border-color-default-disabled:var(--t-border-color-disabled);
908
- --t-border-color-default-white:var(--t-border-color-white);
909
- --t-border-radius-default:var(--t-border-radius);
910
- --t-border-width-default:var(--t-border-width);
911
- --t-fill-color-button-delete-ghost-default:var(--t-fill-color-button-delete-ghost);
912
- --t-fill-color-button-delete-outline-default:var(--t-fill-color-button-delete-outline);
913
- --t-fill-color-button-delete-solid-default:var(--t-fill-color-button-delete-solid);
914
- --t-fill-color-button-interaction-ghost-default:var(--t-fill-color-button-interaction-ghost);
915
- --t-fill-color-button-interaction-outline-default:var(--t-fill-color-button-interaction-outline);
916
- --t-fill-color-button-interaction-solid-default:var(--t-fill-color-button-interaction-solid);
917
- --t-fill-color-button-neutral-ghost-default:var(--t-fill-color-button-neutral-ghost);
918
- --t-fill-color-button-neutral-outline-default:var(--t-fill-color-button-neutral-outline);
919
- --t-fill-color-button-neutral-responsive-header-default:var(--t-fill-color-button-neutral-responsive-header);
920
- --t-fill-color-button-neutral-solid-default:var(--t-fill-color-button-neutral-solid);
921
- --t-fill-color-button-pill-default:var(--t-fill-color-button-pill);
922
- --t-fill-color-control-primary:var(--t-fill-color-control);
923
- --t-fill-color-interaction-default:var(--t-fill-color-interaction);
924
- --t-fill-color-product-staff-base:var(--t-fill-color-product-staff);
925
- --t-fill-color-status-error-primary:var(--t-fill-color-status-error);
926
- --t-fill-color-tooltip-primary:var(--t-fill-color-tooltip);
927
- --t-icon-color-default-dim:var(--t-icon-color-dim);
928
- --t-icon-color-default-disabled:var(--t-icon-color-disabled);
929
- --t-icon-color-default-inverted:var(--t-icon-color-inverted);
930
- --t-icon-color-default-primary:var(--t-icon-color);
931
- --t-icon-color-default-secondary:var(--t-icon-color-secondary);
932
- --t-icon-color-status-error-primary:var(--t-icon-color-status-error);
933
- --t-icon-color-status-info-primary:var(--t-icon-color-status-info);
934
- --t-icon-color-status-neutral-primary:var(--t-icon-color-status-neutral);
935
- --t-icon-color-status-success-primary:var(--t-icon-color-status-success);
936
- --t-icon-color-status-warning-primary:var(--t-icon-color-status-warning);
937
- --t-text-color-default-disabled:var(--t-text-color-disabled);
938
- --t-text-color-default-headline:var(--t-text-color-headline);
939
- --t-text-color-default-inverted:var(--t-text-color-inverted);
940
- --t-text-color-default-placeholder:var(--t-text-color-placeholder);
941
- --t-text-color-default-primary:var(--t-text-color);
942
- --t-text-color-default-secondary:var(--t-text-color-secondary);
943
- --t-text-color-interaction-primary:var(--t-text-color-interaction);
946
+ :root[data-color-mode="dark"]{
947
+ --t-fill-color-button-neutral-ghost-disabled-solid:hsl(0, 0%, 100%);
948
+ --t-fill-color-button-neutral-outline-dim-disabled-solid:hsl(0, 0%, 100%);
949
+ --t-fill-color-button-create-solid-default:hsl(0, 0%, 25%);
950
+ --t-fill-color-button-create-solid-hover:hsl(0, 0%, 25%);
951
+ --t-fill-color-button-create-solid-active:hsl(0, 0%, 25%);
952
+ --t-fill-color-button-create-solid-disabled:hsl(0, 0%, 25%);
953
+ --t-fill-color-button-create-ghost-hover:hsla(0, 0%, 100%, 0);
954
+ --t-fill-color-button-create-ghost-active:hsla(0, 0%, 100%, 0);
955
+ }
956
+
957
+ @media (prefers-color-scheme: dark){
958
+ :root[data-color-mode="system"]{
959
+ --t-fill-color-button-neutral-ghost-disabled-solid:hsl(0, 0%, 100%);
960
+ --t-fill-color-button-neutral-outline-dim-disabled-solid:hsl(0, 0%, 100%);
961
+ --t-fill-color-button-create-solid-default:hsl(0, 0%, 25%);
962
+ --t-fill-color-button-create-solid-hover:hsl(0, 0%, 25%);
963
+ --t-fill-color-button-create-solid-active:hsl(0, 0%, 25%);
964
+ --t-fill-color-button-create-solid-disabled:hsl(0, 0%, 25%);
965
+ --t-fill-color-button-create-ghost-hover:hsla(0, 0%, 100%, 0);
966
+ --t-fill-color-button-create-ghost-active:hsla(0, 0%, 100%, 0);
967
+ }
944
968
  }
945
969
 
946
970
  @layer t-critical{