@esri/calcite-design-tokens 3.2.0-next.2 → 3.2.0-next.4

package/dist/js/semantic.js

@@ -150,664 +150,6 @@ export default {
       },
     },
     "container-size": {
-      height: {
-        xxs: {
-          key: "{semantic.container-size.height.xxs}",
-          value: {
-            min: "0",
-            max: "154px",
-          },
-          type: "dimension",
-          description: "Small handheld devices and mini-windows",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "xxs",
-            value: {
-              min: "0",
-              max: "154px",
-            },
-            description: "Small handheld devices and mini-windows",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.xxs}",
-            name: "calcite-semantic-container-size-height-xxs",
-            path: ["semantic", "container-size", "height", "xxs"],
-            comment: "Small handheld devices and mini-windows",
-            names: {
-              scss: "$calcite-container-size-height-xxs",
-              css: "var(--calcite-container-size-height-xxs)",
-              js: "semantic.container-size.height.xxs",
-              docs: "semantic.container-size.height.xxs",
-              es6: "calciteContainerSizeHeightXxs",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "0",
-              max: "{core.container-size.154}",
-            },
-            type: "dimension",
-            description: "Small handheld devices and mini-windows",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.xxs}",
-          },
-          name: "Container Size Height Xxs",
-          path: ["semantic", "container-size", "height", "xxs"],
-          comment: "Small handheld devices and mini-windows",
-        },
-        xs: {
-          key: "{semantic.container-size.height.xs}",
-          value: {
-            min: "155px",
-            max: "328px",
-          },
-          type: "dimension",
-          description: "Handheld devices",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "xs",
-            value: {
-              min: "154px + 1",
-              max: "328px",
-            },
-            description: "Handheld devices",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.xs}",
-            name: "calcite-semantic-container-size-height-xs",
-            path: ["semantic", "container-size", "height", "xs"],
-            comment: "Handheld devices",
-            names: {
-              scss: "$calcite-container-size-height-xs",
-              css: "var(--calcite-container-size-height-xs)",
-              js: "semantic.container-size.height.xs",
-              docs: "semantic.container-size.height.xs",
-              es6: "calciteContainerSizeHeightXs",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.154} + 1",
-              max: "{core.container-size.328}",
-            },
-            type: "dimension",
-            description: "Handheld devices",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.xs}",
-          },
-          name: "Container Size Height Xs",
-          path: ["semantic", "container-size", "height", "xs"],
-          comment: "Handheld devices",
-        },
-        sm: {
-          key: "{semantic.container-size.height.sm}",
-          value: {
-            min: "329px",
-            max: "504px",
-          },
-          type: "dimension",
-          description: "Small tablets",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "sm",
-            value: {
-              min: "328px + 1",
-              max: "504px",
-            },
-            description: "Small tablets",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.sm}",
-            name: "calcite-semantic-container-size-height-sm",
-            path: ["semantic", "container-size", "height", "sm"],
-            comment: "Small tablets",
-            names: {
-              scss: "$calcite-container-size-height-sm",
-              css: "var(--calcite-container-size-height-sm)",
-              js: "semantic.container-size.height.sm",
-              docs: "semantic.container-size.height.sm",
-              es6: "calciteContainerSizeHeightSm",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.328} + 1",
-              max: "{core.container-size.504}",
-            },
-            type: "dimension",
-            description: "Small tablets",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.sm}",
-          },
-          name: "Container Size Height Sm",
-          path: ["semantic", "container-size", "height", "sm"],
-          comment: "Small tablets",
-        },
-        md: {
-          key: "{semantic.container-size.height.md}",
-          value: {
-            min: "505px",
-            max: "678px",
-          },
-          type: "dimension",
-          description: "Small laptops",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "md",
-            value: {
-              min: "504px + 1",
-              max: "678px",
-            },
-            description: "Small laptops",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.md}",
-            name: "calcite-semantic-container-size-height-md",
-            path: ["semantic", "container-size", "height", "md"],
-            comment: "Small laptops",
-            names: {
-              scss: "$calcite-container-size-height-md",
-              css: "var(--calcite-container-size-height-md)",
-              js: "semantic.container-size.height.md",
-              docs: "semantic.container-size.height.md",
-              es6: "calciteContainerSizeHeightMd",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.504} + 1",
-              max: "{core.container-size.678}",
-            },
-            type: "dimension",
-            description: "Small laptops",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.md}",
-          },
-          name: "Container Size Height Md",
-          path: ["semantic", "container-size", "height", "md"],
-          comment: "Small laptops",
-        },
-        lg: {
-          key: "{semantic.container-size.height.lg}",
-          value: {
-            min: "679px",
-            max: "854px",
-          },
-          type: "dimension",
-          description: "Large laptops and desktop computers",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "lg",
-            value: {
-              min: "678px + 1",
-              max: "854px",
-            },
-            description: "Large laptops and desktop computers",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.lg}",
-            name: "calcite-semantic-container-size-height-lg",
-            path: ["semantic", "container-size", "height", "lg"],
-            comment: "Large laptops and desktop computers",
-            names: {
-              scss: "$calcite-container-size-height-lg",
-              css: "var(--calcite-container-size-height-lg)",
-              js: "semantic.container-size.height.lg",
-              docs: "semantic.container-size.height.lg",
-              es6: "calciteContainerSizeHeightLg",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.678} + 1",
-              max: "{core.container-size.854}",
-            },
-            type: "dimension",
-            description: "Large laptops and desktop computers",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.lg}",
-          },
-          name: "Container Size Height Lg",
-          path: ["semantic", "container-size", "height", "lg"],
-          comment: "Large laptops and desktop computers",
-        },
-        xl: {
-          key: "{semantic.container-size.height.xl}",
-          value: {
-            min: "855px",
-          },
-          type: "dimension",
-          description: "Projectors and televisions",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "height",
-            subitem: "xl",
-            value: {
-              min: "854px + 1",
-            },
-            description: "Projectors and televisions",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.height.xl}",
-            name: "calcite-semantic-container-size-height-xl",
-            path: ["semantic", "container-size", "height", "xl"],
-            comment: "Projectors and televisions",
-            names: {
-              scss: "$calcite-container-size-height-xl",
-              css: "var(--calcite-container-size-height-xl)",
-              js: "semantic.container-size.height.xl",
-              docs: "semantic.container-size.height.xl",
-              es6: "calciteContainerSizeHeightXl",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.854} + 1",
-            },
-            type: "dimension",
-            description: "Projectors and televisions",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.height.xl}",
-          },
-          name: "Container Size Height Xl",
-          path: ["semantic", "container-size", "height", "xl"],
-          comment: "Projectors and televisions",
-        },
-      },
-      width: {
-        xxs: {
-          key: "{semantic.container-size.width.xxs}",
-          value: {
-            min: "0",
-            max: "320px",
-          },
-          type: "dimension",
-          description: "Small handheld devices and mini-windows",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "xxs",
-            value: {
-              min: "0",
-              max: "320px",
-            },
-            description: "Small handheld devices and mini-windows",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.xxs}",
-            name: "calcite-semantic-container-size-width-xxs",
-            path: ["semantic", "container-size", "width", "xxs"],
-            comment: "Small handheld devices and mini-windows",
-            names: {
-              scss: "$calcite-container-size-width-xxs",
-              css: "var(--calcite-container-size-width-xxs)",
-              js: "semantic.container-size.width.xxs",
-              docs: "semantic.container-size.width.xxs",
-              es6: "calciteContainerSizeWidthXxs",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "0",
-              max: "{core.container-size.320}",
-            },
-            type: "dimension",
-            description: "Small handheld devices and mini-windows",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.xxs}",
-          },
-          name: "Container Size Width Xxs",
-          path: ["semantic", "container-size", "width", "xxs"],
-          comment: "Small handheld devices and mini-windows",
-        },
-        xs: {
-          key: "{semantic.container-size.width.xs}",
-          value: {
-            min: "321px",
-            max: "476px",
-          },
-          type: "dimension",
-          description: "Handheld devices",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "xs",
-            value: {
-              min: "320px + 1",
-              max: "476px",
-            },
-            description: "Handheld devices",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.xs}",
-            name: "calcite-semantic-container-size-width-xs",
-            path: ["semantic", "container-size", "width", "xs"],
-            comment: "Handheld devices",
-            names: {
-              scss: "$calcite-container-size-width-xs",
-              css: "var(--calcite-container-size-width-xs)",
-              js: "semantic.container-size.width.xs",
-              docs: "semantic.container-size.width.xs",
-              es6: "calciteContainerSizeWidthXs",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.320} + 1",
-              max: "{core.container-size.476}",
-            },
-            type: "dimension",
-            description: "Handheld devices",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.xs}",
-          },
-          name: "Container Size Width Xs",
-          path: ["semantic", "container-size", "width", "xs"],
-          comment: "Handheld devices",
-        },
-        sm: {
-          key: "{semantic.container-size.width.sm}",
-          value: {
-            min: "477px",
-            max: "768px",
-          },
-          type: "dimension",
-          description: "Small tablets",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "sm",
-            value: {
-              min: "476px + 1",
-              max: "768px",
-            },
-            description: "Small tablets",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.sm}",
-            name: "calcite-semantic-container-size-width-sm",
-            path: ["semantic", "container-size", "width", "sm"],
-            comment: "Small tablets",
-            names: {
-              scss: "$calcite-container-size-width-sm",
-              css: "var(--calcite-container-size-width-sm)",
-              js: "semantic.container-size.width.sm",
-              docs: "semantic.container-size.width.sm",
-              es6: "calciteContainerSizeWidthSm",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.476} + 1",
-              max: "{core.container-size.768}",
-            },
-            type: "dimension",
-            description: "Small tablets",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.sm}",
-          },
-          name: "Container Size Width Sm",
-          path: ["semantic", "container-size", "width", "sm"],
-          comment: "Small tablets",
-        },
-        md: {
-          key: "{semantic.container-size.width.md}",
-          value: {
-            min: "769px",
-            max: "1152px",
-          },
-          type: "dimension",
-          description: "Small laptops",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "md",
-            value: {
-              min: "768px + 1",
-              max: "1152px",
-            },
-            description: "Small laptops",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.md}",
-            name: "calcite-semantic-container-size-width-md",
-            path: ["semantic", "container-size", "width", "md"],
-            comment: "Small laptops",
-            names: {
-              scss: "$calcite-container-size-width-md",
-              css: "var(--calcite-container-size-width-md)",
-              js: "semantic.container-size.width.md",
-              docs: "semantic.container-size.width.md",
-              es6: "calciteContainerSizeWidthMd",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.768} + 1",
-              max: "{core.container-size.1152}",
-            },
-            type: "dimension",
-            description: "Small laptops",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.md}",
-          },
-          name: "Container Size Width Md",
-          path: ["semantic", "container-size", "width", "md"],
-          comment: "Small laptops",
-        },
-        lg: {
-          key: "{semantic.container-size.width.lg}",
-          value: {
-            min: "1153px",
-            max: "1440px",
-          },
-          type: "dimension",
-          description: "Large laptops and desktop computers",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "lg",
-            value: {
-              min: "1152px + 1",
-              max: "1440px",
-            },
-            description: "Large laptops and desktop computers",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.lg}",
-            name: "calcite-semantic-container-size-width-lg",
-            path: ["semantic", "container-size", "width", "lg"],
-            comment: "Large laptops and desktop computers",
-            names: {
-              scss: "$calcite-container-size-width-lg",
-              css: "var(--calcite-container-size-width-lg)",
-              js: "semantic.container-size.width.lg",
-              docs: "semantic.container-size.width.lg",
-              es6: "calciteContainerSizeWidthLg",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.1152} + 1",
-              max: "{core.container-size.1440}",
-            },
-            type: "dimension",
-            description: "Large laptops and desktop computers",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.lg}",
-          },
-          name: "Container Size Width Lg",
-          path: ["semantic", "container-size", "width", "lg"],
-          comment: "Large laptops and desktop computers",
-        },
-        xl: {
-          key: "{semantic.container-size.width.xl}",
-          value: {
-            min: "1441px",
-          },
-          type: "dimension",
-          description: "Projectors and televisions",
-          attributes: {
-            category: "breakpoint",
-            type: "dimension",
-            item: "width",
-            subitem: "xl",
-            value: {
-              min: "1440px + 1",
-            },
-            description: "Projectors and televisions",
-            filePath: "src/tokens/semantic/container-size.json",
-            isSource: true,
-            key: "{semantic.container-size.width.xl}",
-            name: "calcite-semantic-container-size-width-xl",
-            path: ["semantic", "container-size", "width", "xl"],
-            comment: "Projectors and televisions",
-            names: {
-              scss: "$calcite-container-size-width-xl",
-              css: "var(--calcite-container-size-width-xl)",
-              js: "semantic.container-size.width.xl",
-              docs: "semantic.container-size.width.xl",
-              es6: "calciteContainerSizeWidthXl",
-            },
-            "calcite-schema": {
-              system: "calcite",
-              tier: "semantic",
-              type: "dimension",
-            },
-          },
-          filePath: "src/tokens/semantic/container-size.json",
-          isSource: true,
-          original: {
-            value: {
-              min: "{core.container-size.1440} + 1",
-            },
-            type: "dimension",
-            description: "Projectors and televisions",
-            attributes: {
-              category: "breakpoint",
-            },
-            key: "{semantic.container-size.width.xl}",
-          },
-          name: "Container Size Width Xl",
-          path: ["semantic", "container-size", "width", "xl"],
-          comment: "Projectors and televisions",
-        },
-      },
       margin: {
         key: "{semantic.container-size.margin}",
         value: "24px",

package/dist/scss/semantic.scss

@@ -2,8 +2,6 @@
 // Calcite Design System
 // Do not edit directly, this file was auto-generated.
 
-$calcite-container-size-height-xxs-min: 0; // Small handheld devices and mini-windows
-$calcite-container-size-width-xxs-min: 0; // Small handheld devices and mini-windows
 $calcite-border-width-none: 0;
 $calcite-border-width-sm: 1px;
 $calcite-border-width-md: 2px;
@@ -111,26 +109,6 @@ $calcite-z-index-overlay: 700;
 $calcite-z-index-modal: 800;
 $calcite-z-index-popup: 900;
 $calcite-z-index-tooltip: 901;
-$calcite-container-size-height-xxs-max: 154px; // Small handheld devices and mini-windows
-$calcite-container-size-height-xs-min: 155px; // Handheld devices
-$calcite-container-size-height-xs-max: 328px; // Handheld devices
-$calcite-container-size-height-sm-min: 329px; // Small tablets
-$calcite-container-size-height-sm-max: 504px; // Small tablets
-$calcite-container-size-height-md-min: 505px; // Small laptops
-$calcite-container-size-height-md-max: 678px; // Small laptops
-$calcite-container-size-height-lg-min: 679px; // Large laptops and desktop computers
-$calcite-container-size-height-lg-max: 854px; // Large laptops and desktop computers
-$calcite-container-size-height-xl-min: 855px; // Projectors and televisions
-$calcite-container-size-width-xxs-max: 320px; // Small handheld devices and mini-windows
-$calcite-container-size-width-xs-min: 321px; // Handheld devices
-$calcite-container-size-width-xs-max: 476px; // Handheld devices
-$calcite-container-size-width-sm-min: 477px; // Small tablets
-$calcite-container-size-width-sm-max: 768px; // Small tablets
-$calcite-container-size-width-md-min: 769px; // Small laptops
-$calcite-container-size-width-md-max: 1152px; // Small laptops
-$calcite-container-size-width-lg-min: 1153px; // Large laptops and desktop computers
-$calcite-container-size-width-lg-max: 1440px; // Large laptops and desktop computers
-$calcite-container-size-width-xl-min: 1441px; // Projectors and televisions
 $calcite-corner-radius: $calcite-corner-radius-none;
 $calcite-shadow-none: 0 0 0 0 rgba(0, 0, 0, 0);
 $calcite-shadow-sm: 0 2px 8px 0 rgba(0, 0, 0, 0.04), 0 4px 16px 0 rgba(0, 0, 0, 0.08);