cozy-ui-plus 1.1.0

package/src/SquareAppIcon/__snapshots__/SquareAppIcon.spec.js.snap

@@ -0,0 +1,474 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SquareAppIcon component should render an app correctly with the app name 1`] = `
+<div
+  class="makeStyles-tileWrapper-37"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-40"
+    >
+      <span
+        class="MuiBadge-root-40 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-41 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-47"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-41 makeStyles-qualifier-39 MuiBadge-anchorOriginBottomRightRectangular-49 MuiBadge-invisible-62"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-32 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    Test
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render an app correctly with the given name 1`] = `
+<div
+  class="makeStyles-tileWrapper-6"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-9"
+    >
+      <span
+        class="MuiBadge-root-9 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-10 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-16"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-10 makeStyles-qualifier-8 MuiBadge-anchorOriginBottomRightRectangular-18 MuiBadge-invisible-31"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-1 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    modified
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render an app with the app slug if no name prop and app is a string 1`] = `
+<div
+  class="makeStyles-tileWrapper-68"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-71"
+    >
+      <span
+        class="MuiBadge-root-71 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-72 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-78"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-72 makeStyles-qualifier-70 MuiBadge-anchorOriginBottomRightRectangular-80 MuiBadge-invisible-93"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-63 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    testslug
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app in add state 1`] = `
+<div
+  class="makeStyles-tileWrapper-192"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-195"
+    >
+      <span
+        class="MuiBadge-root-195 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <svg
+            class="styles__icon___23x3R"
+            height="16"
+            style="fill: var(--primaryColor);"
+            viewBox="0 0 14 14"
+            width="16"
+          >
+            <path
+              d="M6 8H1a.968.968 0 01-.713-.287A.968.968 0 010 7c0-.283.096-.52.287-.713A.968.968 0 011 6h5V1c0-.283.096-.52.287-.713A.968.968 0 017 0c.283 0 .52.096.713.287A.975.975 0 018 1v5h5c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.713A.968.968 0 0113 8H8v5c0 .283-.096.52-.287.713A.967.967 0 017 14a.967.967 0 01-.713-.287A.968.968 0 016 13V8z"
+            />
+          </svg>
+        </div>
+        <span
+          class="MuiBadge-badge-196 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-202"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-196 makeStyles-qualifier-194 MuiBadge-anchorOriginBottomRightRectangular-204 MuiBadge-invisible-217"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-187 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  />
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app in error state 1`] = `
+<div
+  class="makeStyles-tileWrapper-161"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-164"
+    >
+      <span
+        class="MuiBadge-root-164 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-165 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-171 MuiBadge-colorError-168"
+        >
+          <svg
+            class="makeStyles-errorIcon-160 styles__icon___23x3R"
+            height="16"
+            viewBox="0 0 16 16"
+            width="16"
+          >
+            <path
+              d="M8 0C3.584 0 0 3.584 0 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm.8 12H7.2v-1.6h1.6V12zm0-3.2H7.2V4h1.6v4.8z"
+            />
+          </svg>
+        </span>
+      </span>
+      <span
+        class="MuiBadge-badge-165 makeStyles-qualifier-163 MuiBadge-anchorOriginBottomRightRectangular-173 MuiBadge-invisible-186"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-156 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    Test
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app in ghost state 1`] = `
+<div
+  class="makeStyles-tileWrapper-130"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-133"
+    >
+      <span
+        class="MuiBadge-root-133 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-ghost___2kj_s styles__SquareAppIcon-wrapper--light___AqjR- makeStyles-squareAppIconGhost-127"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-134 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-140"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-134 makeStyles-qualifier-132 MuiBadge-anchorOriginBottomRightRectangular-142 MuiBadge-invisible-155"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-125 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    Test
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app in maintenance state 1`] = `
+<div
+  class="makeStyles-tileWrapper-99"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-102"
+    >
+      <span
+        class="MuiBadge-root-102 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper-maintenance___1svWY styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <div
+            class="u-w-2 u-h-2"
+          >
+            <svg
+              class="styles__c-app-icon___2W1cp styles__c-app-icon-default___1Bus5 styles__icon___23x3R"
+              height="100%"
+              style="fill: var(--coolGrey);"
+              viewBox="0 0 15 16"
+              width="100%"
+            >
+              <path
+                d="M14.4 4L7.2 0 0 4v8l7.2 4 7.2-4V4zM7.2 1.832l4.728 2.624L9.52 5.792a3.213 3.213 0 00-4.64 0L2.472 4.456 7.2 1.832zm-.8 11.896l-4.8-2.664V5.808L4.104 7.2A3.193 3.193 0 006.4 11.096v2.632zM5.6 8c0-.88.72-1.6 1.6-1.6.88 0 1.6.72 1.6 1.6 0 .88-.72 1.6-1.6 1.6-.88 0-1.6-.72-1.6-1.6zM8 13.728v-2.624a3.193 3.193 0 002.4-3.096c0-.28-.032-.552-.104-.808L12.8 5.808v5.256L8 13.728z"
+              />
+            </svg>
+          </div>
+        </div>
+        <span
+          class="MuiBadge-badge-103 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-109"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-103 makeStyles-qualifier-101 MuiBadge-anchorOriginBottomRightRectangular-111 MuiBadge-invisible-124"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-94 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    Test
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app in shortcut state 1`] = `
+<div
+  class="makeStyles-tileWrapper-223"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-226"
+    >
+      <span
+        class="MuiBadge-root-226 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <h2
+          class="MuiTypography-root-249 makeStyles-letter-221 MuiTypography-h2-255 MuiTypography-colorTextPrimary-274 MuiTypography-alignCenter-265"
+        >
+          S
+        </h2>
+        <span
+          class="MuiBadge-badge-227 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-233"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-227 makeStyles-qualifier-225 MuiBadge-anchorOriginBottomRightRectangular-235"
+      >
+        <svg
+          class="styles__icon___23x3R"
+          height="10"
+          viewBox="0 0 16 16"
+          width="10"
+        >
+          <path
+            d="M14.222 14.222H1.778V1.778H8V0H1.778C.79 0 0 .8 0 1.778v12.444C0 15.2.791 16 1.778 16h12.444C15.2 16 16 15.2 16 14.222V8h-1.778v6.222zM9.778 0v1.778h3.19l-8.737 8.738 1.253 1.253 8.738-8.738v3.191H16V0H9.778z"
+          />
+        </svg>
+      </span>
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-218 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    shortcut
+  </h6>
+</div>
+`;
+
+exports[`SquareAppIcon component should render correctly an app with custom content 1`] = `
+<div
+  class="makeStyles-tileWrapper-315"
+  data-testid="square-app-icon"
+>
+  <div
+    class="TwakeTheme--light-normal u-dc"
+  >
+    <span
+      class="MuiBadge-root-318"
+    >
+      <span
+        class="MuiBadge-root-318 styles__SquareAppIcon-wrapper___3aoSx styles__SquareAppIcon-wrapper--light___AqjR- undefined"
+      >
+        <div
+          class="styles__SquareAppIcon-icon-container___AZ5_V styles__SquareAppIcon-icon-container-normal___2eLgM"
+        >
+          <div
+            class="styles__onEnd___1mc8z"
+          />
+          <svg
+            class="styles__icon___23x3R"
+            height="16"
+            viewBox="0 0 52 52"
+            width="16"
+          >
+            <path
+              d="M38.231 44H13.769C6.175 44 0 37.756 0 30.08c0-3.66 1.394-7.117 3.927-9.733 2.219-2.29 5.093-3.715 8.203-4.086a13.887 13.887 0 014.042-8.292A13.608 13.608 0 0125.801 4c3.62 0 7.04 1.407 9.629 3.968a13.897 13.897 0 014.038 8.25C46.482 16.853 52 22.828 52 30.082 52 37.756 45.82 44 38.23 44h.001zm-.163-3.001h.104c5.97 0 10.828-4.91 10.828-10.947 0-6.035-4.857-10.946-10.828-10.946h-.11c-.779 0-1.417-.627-1.435-1.417C36.492 11.794 31.637 7 25.803 7c-5.835 0-10.692 4.796-10.826 10.69a1.445 1.445 0 01-1.403 1.42C7.744 19.244 3 24.153 3 30.052 3 36.09 7.857 41 13.828 41h.088l.035-.002c.03 0 .062 0 .093.002h24.021l.003-.001zm-4.302-11.776c-.875-.585-.918-1.659-.92-1.706A.52.52 0 0032.32 27a.523.523 0 00-.506.536c.002.039.016.543.251 1.137a7.99 7.99 0 01-11.138.019 3.554 3.554 0 00.257-1.155.523.523 0 00-.503-.536.526.526 0 00-.528.515c0 .043-.042 1.121-.92 1.706a.536.536 0 00-.15.731.51.51 0 00.714.154c.225-.15.414-.322.572-.505a9.006 9.006 0 0012.251-.01c.16.184.35.36.582.515a.503.503 0 00.281.085.516.516 0 00.432-.24.537.537 0 00-.15-.731v.002z"
+              fill="#297EF2"
+              fill-rule="evenodd"
+            />
+          </svg>
+        </div>
+        <span
+          class="MuiBadge-badge-319 badgeSizeLarge MuiBadge-anchorOriginTopRightRectangular-325"
+        />
+      </span>
+      <span
+        class="MuiBadge-badge-319 makeStyles-qualifier-317 MuiBadge-anchorOriginBottomRightRectangular-327 MuiBadge-invisible-340"
+      />
+    </span>
+  </div>
+  <h6
+    class="MuiTypography-root makeStyles-name-310 u-spacellipsis MuiTypography-h6 MuiTypography-colorTextPrimary MuiTypography-alignCenter"
+  >
+    custom icon
+  </h6>
+</div>
+`;

package/src/SquareAppIcon/constants.json

@@ -0,0 +1,6 @@
+{
+  "iconSize": "4rem",
+  "iconPadding": "0.625rem",
+  "mobileIconSize": "4rem",
+  "mobileIconPadding": "0.625rem"
+}