@reuters-graphics/graphics-components 0.1.6 → 0.1.7--canary.99.331bdb0.0

package/dist/scss/tokens/layout/flex/_justify-content.scss

@@ -0,0 +1,48 @@
+.justify-normal {
+  justify-content: normal;
+}
+.justify-start {
+  justify-content: flex-start;
+}
+.justify-end {
+  justify-content: flex-end;
+}
+.justify-center {
+  justify-content: center;
+}
+.justify-between {
+  justify-content: space-between;
+}
+.justify-around {
+  justify-content: space-around;
+}
+.justify-evenly {
+  justify-content: space-evenly;
+}
+.justify-stretch {
+  justify-content: stretch;
+}
+.\!justify-normal {
+  justify-content: normal !important;
+}
+.\!justify-start {
+  justify-content: flex-start !important;
+}
+.\!justify-end {
+  justify-content: flex-end !important;
+}
+.\!justify-center {
+  justify-content: center !important;
+}
+.\!justify-between {
+  justify-content: space-between !important;
+}
+.\!justify-around {
+  justify-content: space-around !important;
+}
+.\!justify-evenly {
+  justify-content: space-evenly !important;
+}
+.\!justify-stretch {
+  justify-content: stretch !important;
+}

package/dist/scss/tokens/layout/flex/_justify-items.scss

@@ -0,0 +1,24 @@
+.justify-items-start {
+  justify-items: start;
+}
+.justify-items-end {
+  justify-items: end;
+}
+.justify-items-center {
+  justify-items: center;
+}
+.justify-items-stretch {
+  justify-items: stretch;
+}
+.\!justify-items-start {
+  justify-items: start !important;
+}
+.\!justify-items-end {
+  justify-items: end !important;
+}
+.\!justify-items-center {
+  justify-items: center !important;
+}
+.\!justify-items-stretch {
+  justify-items: stretch !important;
+}

package/dist/scss/tokens/layout/flex/_justify-self.scss

@@ -0,0 +1,30 @@
+.justify-self-auto {
+  justify-self: auto;
+}
+.justify-self-start {
+  justify-self: start;
+}
+.justify-self-end {
+  justify-self: end;
+}
+.justify-self-center {
+  justify-self: center;
+}
+.justify-self-stretch {
+  justify-self: stretch;
+}
+.\!justify-self-auto {
+  justify-self: auto !important;
+}
+.\!justify-self-start {
+  justify-self: start !important;
+}
+.\!justify-self-end {
+  justify-self: end !important;
+}
+.\!justify-self-center {
+  justify-self: center !important;
+}
+.\!justify-self-stretch {
+  justify-self: stretch !important;
+}

package/dist/scss/tokens/layout/flex/_main.scss

@@ -0,0 +1,11 @@
+@forward 'align-content';
+@forward 'align-items';
+@forward 'align-self';
+@forward 'flex-direction';
+@forward 'flex-grow';
+@forward 'flex-shrink';
+@forward 'flex-wrap';
+@forward 'flex';
+@forward 'justify-content';
+@forward 'justify-items';
+@forward 'justify-self';

package/dist/scss/tokens/sizing/_height.scss

@@ -0,0 +1,168 @@
+.h-full {
+  height: 100%;
+}
+.h-screen {
+  height: 100vh;
+}
+.h-1\/2 {
+  height: 50%;
+}
+.h-1\/3 {
+  height: 33.333333%;
+}
+.h-2\/3 {
+  height: 66.666667%;
+}
+.h-1\/4 {
+  height: 25%;
+}
+.h-2\/4 {
+  height: 50%;
+}
+.h-3\/4 {
+  height: 75%;
+}
+.h-1\/5 {
+  height: 20%;
+}
+.h-2\/5 {
+  height: 40%;
+}
+.h-3\/5 {
+  height: 60%;
+}
+.h-4\/5 {
+  height: 80%;
+}
+.h-1\/6 {
+  height: 16.666667%;
+}
+.h-2\/6 {
+  height: 33.333333%;
+}
+.h-3\/6 {
+  height: 50%;
+}
+.h-4\/6 {
+  height: 66.666667%;
+}
+.h-5\/6 {
+  height: 83.333333%;
+}
+.h-1\/12 {
+  height: 8.333333%;
+}
+.h-2\/12 {
+  height: 16.666667%;
+}
+.h-3\/12 {
+  height: 25%;
+}
+.h-4\/12 {
+  height: 33.333333%;
+}
+.h-5\/12 {
+  height: 41.666667%;
+}
+.h-6\/12 {
+  height: 50%;
+}
+.h-7\/12 {
+  height: 58.333333%;
+}
+.h-8\/12 {
+  height: 66.666667%;
+}
+.h-9\/12 {
+  height: 75%;
+}
+.h-10\/12 {
+  height: 83.333333%;
+}
+.h-11\/12 {
+  height: 91.666667%;
+}
+.\!h-full {
+  height: 100% !important;
+}
+.\!h-screen {
+  height: 100vh !important;
+}
+.\!h-1\/2 {
+  height: 50% !important;
+}
+.\!h-1\/3 {
+  height: 33.333333% !important;
+}
+.\!h-2\/3 {
+  height: 66.666667% !important;
+}
+.\!h-1\/4 {
+  height: 25% !important;
+}
+.\!h-2\/4 {
+  height: 50% !important;
+}
+.\!h-3\/4 {
+  height: 75% !important;
+}
+.\!h-1\/5 {
+  height: 20% !important;
+}
+.\!h-2\/5 {
+  height: 40% !important;
+}
+.\!h-3\/5 {
+  height: 60% !important;
+}
+.\!h-4\/5 {
+  height: 80% !important;
+}
+.\!h-1\/6 {
+  height: 16.666667% !important;
+}
+.\!h-2\/6 {
+  height: 33.333333% !important;
+}
+.\!h-3\/6 {
+  height: 50% !important;
+}
+.\!h-4\/6 {
+  height: 66.666667% !important;
+}
+.\!h-5\/6 {
+  height: 83.333333% !important;
+}
+.\!h-1\/12 {
+  height: 8.333333% !important;
+}
+.\!h-2\/12 {
+  height: 16.666667% !important;
+}
+.\!h-3\/12 {
+  height: 25% !important;
+}
+.\!h-4\/12 {
+  height: 33.333333% !important;
+}
+.\!h-5\/12 {
+  height: 41.666667% !important;
+}
+.\!h-6\/12 {
+  height: 50% !important;
+}
+.\!h-7\/12 {
+  height: 58.333333% !important;
+}
+.\!h-8\/12 {
+  height: 66.666667% !important;
+}
+.\!h-9\/12 {
+  height: 75% !important;
+}
+.\!h-10\/12 {
+  height: 83.333333% !important;
+}
+.\!h-11\/12 {
+  height: 91.666667% !important;
+}

package/dist/scss/tokens/sizing/_main.scss

@@ -0,0 +1,6 @@
+@forward 'height';
+@forward 'max-height';
+@forward 'max-width';
+@forward 'min-height';
+@forward 'min-width';
+@forward 'width';

package/dist/scss/tokens/sizing/_max-height.scss

@@ -0,0 +1,12 @@
+.max-h-full {
+  max-height: 100%;
+}
+.max-h-screen {
+  max-height: 100vh;
+}
+.\!max-h-full {
+  max-height: 100% !important;
+}
+.\!max-h-screen {
+  max-height: 100vh !important;
+}

package/dist/scss/tokens/sizing/_max-width.scss

@@ -0,0 +1,12 @@
+.max-w-full {
+  max-width: 100%;
+}
+.max-w-screen {
+  max-width: 100vw;
+}
+.\!max-w-full {
+  max-width: 100% !important;
+}
+.\!max-w-screen {
+  max-width: 100vw !important;
+}

package/dist/scss/tokens/sizing/_min-height.scss

@@ -0,0 +1,12 @@
+.min-h-full {
+  min-height: 100%;
+}
+.min-h-screen {
+  min-height: 100vh;
+}
+.\!min-h-full {
+  min-height: 100% !important;
+}
+.\!min-h-screen {
+  min-height: 100vh !important;
+}

package/dist/scss/tokens/sizing/_min-width.scss

@@ -0,0 +1,6 @@
+.min-w-full {
+  min-width: 100%;
+}
+.\!min-w-full {
+  min-width: 100% !important;
+}

package/dist/scss/tokens/sizing/_width.scss

@@ -0,0 +1,176 @@
+.w-full {
+  width: 100%;
+}
+.w-full-fluid {
+  width: calc(100% + 30px);
+  margin-left: -15px !important;
+}
+.w-screen {
+  width: 100vw;
+}
+.w-1\/2 {
+  width: 50%;
+}
+.w-1\/3 {
+  width: 33.333333%;
+}
+.w-2\/3 {
+  width: 66.666667%;
+}
+.w-1\/4 {
+  width: 25%;
+}
+.w-2\/4 {
+  width: 50%;
+}
+.w-3\/4 {
+  width: 75%;
+}
+.w-1\/5 {
+  width: 20%;
+}
+.w-2\/5 {
+  width: 40%;
+}
+.w-3\/5 {
+  width: 60%;
+}
+.w-4\/5 {
+  width: 80%;
+}
+.w-1\/6 {
+  width: 16.666667%;
+}
+.w-2\/6 {
+  width: 33.333333%;
+}
+.w-3\/6 {
+  width: 50%;
+}
+.w-4\/6 {
+  width: 66.666667%;
+}
+.w-5\/6 {
+  width: 83.333333%;
+}
+.w-1\/12 {
+  width: 8.333333%;
+}
+.w-2\/12 {
+  width: 16.666667%;
+}
+.w-3\/12 {
+  width: 25%;
+}
+.w-4\/12 {
+  width: 33.333333%;
+}
+.w-5\/12 {
+  width: 41.666667%;
+}
+.w-6\/12 {
+  width: 50%;
+}
+.w-7\/12 {
+  width: 58.333333%;
+}
+.w-8\/12 {
+  width: 66.666667%;
+}
+.w-9\/12 {
+  width: 75%;
+}
+.w-10\/12 {
+  width: 83.333333%;
+}
+.w-11\/12 {
+  width: 91.666667%;
+}
+.\!w-full {
+  width: 100% !important;
+}
+.\!w-full-fluid {
+  width: calc(100% + 30px) !important;
+  margin-left: -15px !important;
+}
+.\!w-screen {
+  width: 100vw !important;
+}
+.\!w-1\/2 {
+  width: 50% !important;
+}
+.\!w-1\/3 {
+  width: 33.333333% !important;
+}
+.\!w-2\/3 {
+  width: 66.666667% !important;
+}
+.\!w-1\/4 {
+  width: 25% !important;
+}
+.\!w-2\/4 {
+  width: 50% !important;
+}
+.\!w-3\/4 {
+  width: 75% !important;
+}
+.\!w-1\/5 {
+  width: 20% !important;
+}
+.\!w-2\/5 {
+  width: 40% !important;
+}
+.\!w-3\/5 {
+  width: 60% !important;
+}
+.\!w-4\/5 {
+  width: 80% !important;
+}
+.\!w-1\/6 {
+  width: 16.666667% !important;
+}
+.\!w-2\/6 {
+  width: 33.333333% !important;
+}
+.\!w-3\/6 {
+  width: 50% !important;
+}
+.\!w-4\/6 {
+  width: 66.666667% !important;
+}
+.\!w-5\/6 {
+  width: 83.333333% !important;
+}
+.\!w-1\/12 {
+  width: 8.333333% !important;
+}
+.\!w-2\/12 {
+  width: 16.666667% !important;
+}
+.\!w-3\/12 {
+  width: 25% !important;
+}
+.\!w-4\/12 {
+  width: 33.333333% !important;
+}
+.\!w-5\/12 {
+  width: 41.666667% !important;
+}
+.\!w-6\/12 {
+  width: 50% !important;
+}
+.\!w-7\/12 {
+  width: 58.333333% !important;
+}
+.\!w-8\/12 {
+  width: 66.666667% !important;
+}
+.\!w-9\/12 {
+  width: 75% !important;
+}
+.\!w-10\/12 {
+  width: 83.333333% !important;
+}
+.\!w-11\/12 {
+  width: 91.666667% !important;
+}

package/dist/scss/tokens/spacers/_fluid-margin.scss

@@ -0,0 +1,68 @@
+@use 'mixins/fluid-margin' as *;
+
+$fluid-margin-placeholder-levels: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9;
+
+@each $level, $value in $fluid-margin-placeholder-levels {
+  .fm-#{$level} {
+    @extend %fm-#{$level};
+  }
+  .fmt-#{$level} {
+    @extend %fmt-#{$level};
+  }
+  .fmr-#{$level} {
+    @extend %fmr-#{$level};
+  }
+  .fmb-#{$level} {
+    @extend %fmb-#{$level};
+  }
+  .fml-#{$level} {
+    @extend %fml-#{$level};
+  }
+  .fmx-#{$level} {
+    @extend %fmx-#{$level};
+  }
+  .fmy-#{$level} {
+    @extend %fmy-#{$level};
+  }
+
+  .\!fm-#{$level} {
+    @extend %\!fm-#{$level};
+  }
+  .\!fmt-#{$level} {
+    @extend %\!fmt-#{$level};
+  }
+  .\!fmr-#{$level} {
+    @extend %\!fmr-#{$level};
+  }
+  .\!fmb-#{$level} {
+    @extend %\!fmb-#{$level};
+  }
+  .\!fml-#{$level} {
+    @extend %\!fml-#{$level};
+  }
+  .\!fmx-#{$level} {
+    @extend %\!fmx-#{$level};
+  }
+  .\!fmy-#{$level} {
+    @extend %\!fmy-#{$level};
+  }
+}
+
+.fm-auto {
+  @extend %fm-auto;
+}
+.fmx-auto {
+  @extend %fmx-auto;
+}
+.fmy-auto {
+  @extend %fmy-auto;
+}
+.\!fm-auto {
+  @extend %\!fm-auto;
+}
+.\!fmx-auto {
+  @extend %\!fmx-auto;
+}
+.\!fmy-auto {
+  @extend %\!fmy-auto;
+}

package/dist/scss/tokens/spacers/_fluid-padding.scss

@@ -0,0 +1,49 @@
+@use 'mixins/fluid-padding' as *;
+
+$fluid-padding-placeholder-levels: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9;
+
+@each $level, $value in $fluid-padding-placeholder-levels {
+  .fp-#{$level} {
+    @extend %fp-#{$level};
+  }
+  .fpt-#{$level} {
+    @extend %fpt-#{$level};
+  }
+  .fpr-#{$level} {
+    @extend %fpr-#{$level};
+  }
+  .fpb-#{$level} {
+    @extend %fpb-#{$level};
+  }
+  .fpl-#{$level} {
+    @extend %fpl-#{$level};
+  }
+  .fpx-#{$level} {
+    @extend %fpx-#{$level};
+  }
+  .fpy-#{$level} {
+    @extend %fpy-#{$level};
+  }
+
+  .\!fp-#{$level} {
+    @extend %\!fp-#{$level};
+  }
+  .\!fpt-#{$level} {
+    @extend %\!fpt-#{$level};
+  }
+  .\!fpr-#{$level} {
+    @extend %\!fpr-#{$level};
+  }
+  .\!fpb-#{$level} {
+    @extend %\!fpb-#{$level};
+  }
+  .\!fpl-#{$level} {
+    @extend %\!fpl-#{$level};
+  }
+  .\!fpx-#{$level} {
+    @extend %\!fpx-#{$level};
+  }
+  .\!fpy-#{$level} {
+    @extend %\!fpy-#{$level};
+  }
+}

package/dist/scss/tokens/spacers/_main.scss

@@ -0,0 +1,4 @@
+@forward 'fluid-margin';
+@forward 'fluid-padding';
+@forward 'margin';
+@forward 'padding';