@elliemae/ds-pagination 2.2.0 → 2.3.0-alpha.3

package/esm/styled.js

@@ -1,34 +1,84 @@
-import Grid from '@elliemae/ds-grid';
-import { DSButtonV2 } from '@elliemae/ds-button';
-import styled from 'styled-components';
-import { typography, space } from '@xstyled/styled-components';
-
-const sizeToCss = size => typeof size === 'number' && !Number.isNaN(size) ? "".concat(size, "px") : size;
-
-const styledFocusCss = _ref => {
-  let {
-    theme
-  } = _ref;
-  return "\n&:after {\n  display: block;\n  content: ' ';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border: 2px solid ".concat(theme.colors.brand[700], ";\n  pointer-events: none;\n  z-index: 7;\n}");
+import * as React from "react";
+import { Grid } from "@elliemae/ds-grid";
+import { DSButtonV2 } from "@elliemae/ds-button";
+import styled from "styled-components";
+import { space, typography } from "@xstyled/styled-components";
+const sizeToCss = (size) => typeof size === "number" && !Number.isNaN(size) ? `${size}px` : size;
+const styledFocusCss = ({ theme }) => `
+&:after {
+  display: block;
+  content: ' ';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border: 2px solid ${theme.colors.brand[700]};
+  pointer-events: none;
+  z-index: 7;
+}`;
+const PaginationContainer = styled(Grid)`
+  padding: 0 ${(props) => props.theme.space.xs};
+  height: 42px;
+  width: ${(props) => sizeToCss(props.width) || "100%"};
+  max-width: 100%;
+  align-items: center;
+  box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);
+`;
+const PaginationWrapper = styled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0 32px;
+`;
+const PaginationSeparator = styled(Grid)`
+  background-color: ${(props) => props.theme.colors.neutral[300]};
+  width: 1px;
+  height: ${(props) => props.height || "30px"};
+`;
+const PaginationBoldText = styled.span`
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  ${typography}
+  ${space}
+  position: relative;
+`;
+const PaginationDropdownButton = styled(DSButtonV2)`
+  height: 42px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  padding-left: 16px;
+  padding-right: 16px;
+  grid-gap: 8px;
+  font-size: 13px;
+  color: ${(props) => props.theme.colors.neutral[700]};
+  cursor: pointer;
+  border-radius: 0;
+  font-weight: ${(props) => props.theme.fontWeights.regular};
+  :focus {
+    ${styledFocusCss}
+  }
+`;
+const PreviousNextPageButton = styled(DSButtonV2)`
+  height: 42px;
+  display: grid;
+  place-items: center;
+  position: relative;
+  padding-left: 8px;
+  padding-right: 8px;
+  border-radius: 0;
+  cursor: ${(props) => props.disabled ? "not-allowed" : "pointer"};
+  :focus {
+    ${styledFocusCss}
+  }
+`;
+export {
+  PaginationBoldText,
+  PaginationContainer,
+  PaginationDropdownButton,
+  PaginationSeparator,
+  PaginationWrapper,
+  PreviousNextPageButton
 };
-
-const PaginationContainer = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-mxz59e-0"
-})(["padding:0 ", ";height:42px;width:", ";max-width:100%;align-items:center;box-shadow:0 -1px 3px 0 rgba(0,0,0,0.5);"], props => props.theme.space.xs, props => sizeToCss(props.width) || '100%');
-const PaginationWrapper = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-mxz59e-1"
-})(["display:flex;justify-content:center;align-items:center;margin:0 32px;"]);
-const PaginationSeparator = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-mxz59e-2"
-})(["background-color:", ";width:1px;height:", ";"], props => props.theme.colors.neutral[300], props => props.height || '30px');
-const PaginationBoldText = /*#__PURE__*/styled.span.withConfig({
-  componentId: "sc-mxz59e-3"
-})(["font-weight:", ";", " ", " position:relative;"], props => props.theme.fontWeights.semibold, typography, space);
-const PaginationDropdownButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
-  componentId: "sc-mxz59e-4"
-})(["height:42px;display:flex;justify-content:center;align-items:center;position:relative;padding-left:16px;padding-right:16px;grid-gap:8px;font-size:13px;color:", ";cursor:pointer;border-radius:0;font-weight:", ";:focus{", "}"], props => props.theme.colors.neutral[700], props => props.theme.fontWeights.regular, styledFocusCss);
-const PreviousNextPageButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
-  componentId: "sc-mxz59e-5"
-})(["height:42px;display:grid;place-items:center;position:relative;padding-left:8px;padding-right:8px;border-radius:0;cursor:", ";:focus{", "}"], props => props.disabled ? 'not-allowed' : 'pointer', styledFocusCss);
-
-export { PaginationBoldText, PaginationContainer, PaginationDropdownButton, PaginationSeparator, PaginationWrapper, PreviousNextPageButton };
+//# sourceMappingURL=styled.js.map

package/esm/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport styled from 'styled-components';\nimport { space, typography, TypographyProps } from '@xstyled/styled-components';\n\nconst sizeToCss = (size) => (typeof size === 'number' && !Number.isNaN(size) ? `${size}px` : size);\n\nconst styledFocusCss = ({ theme }) => `\n&:after {\n  display: block;\n  content: ' ';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border: 2px solid ${theme.colors.brand[700]};\n  pointer-events: none;\n  z-index: 7;\n}`;\n\nexport const PaginationContainer = styled(Grid)`\n  padding: 0 ${(props) => props.theme.space.xs};\n  height: 42px;\n  width: ${(props) => sizeToCss(props.width) || '100%'};\n  max-width: 100%;\n  align-items: center;\n  box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, 0.5);\n`;\n\nexport const PaginationWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0 32px;\n`;\n\nexport const PaginationSeparator = styled(Grid)`\n  background-color: ${(props) => props.theme.colors.neutral[300]};\n  width: 1px;\n  height: ${(props) => props.height || '30px'};\n`;\n\nexport const PaginationBoldText = styled.span<TypographyProps>`\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  ${typography}\n  ${space}\n  position: relative;\n`;\n\nexport const PaginationDropdownButton = styled(DSButtonV2)`\n  height: 42px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  padding-left: 16px;\n  padding-right: 16px;\n  grid-gap: 8px;\n  font-size: 13px;\n  color: ${(props) => props.theme.colors.neutral[700]};\n  cursor: pointer;\n  border-radius: 0;\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  :focus {\n    ${styledFocusCss}\n  }\n`;\n\nexport const PreviousNextPageButton = styled(DSButtonV2)`\n  height: 42px;\n  display: grid;\n  place-items: center;\n  position: relative;\n  padding-left: 8px;\n  padding-right: 8px;\n  border-radius: 0;\n  cursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n  :focus {\n    ${styledFocusCss}\n  }\n`;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,YAAY,CAAC,SAAU,OAAO,SAAS,YAAY,CAAC,OAAO,MAAM,QAAQ,GAAG,WAAW;AAE7F,MAAM,iBAAiB,CAAC,EAAE,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAShB,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAKlC,MAAM,sBAAsB,OAAO;AAAA,eAC3B,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,WAEjC,CAAC,UAAU,UAAU,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAMzC,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOjC,MAAM,sBAAsB,OAAO;AAAA,sBACpB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,YAEhD,CAAC,UAAU,MAAM,UAAU;AAAA;AAGhC,MAAM,qBAAqB,OAAO;AAAA,iBACxB,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,IAChD;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,2BAA2B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAUpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,iBAGhC,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,MAE9C;AAAA;AAAA;AAIC,MAAM,yBAAyB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAQjC,CAAC,UAAW,MAAM,WAAW,gBAAgB;AAAA;AAAA,MAEnD;AAAA;AAAA;",
+  "names": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-pagination",
-  "version": "2.2.0",
+  "version": "2.3.0-alpha.3",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Pagination",
   "module": "./esm/index.js",
@@ -72,12 +72,12 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.2.0",
-    "@elliemae/ds-dropdownmenu": "2.2.0",
-    "@elliemae/ds-grid": "2.2.0",
-    "@elliemae/ds-icons": "2.2.0",
-    "@elliemae/ds-props-helpers": "2.2.0",
-    "@elliemae/ds-utilities": "2.2.0",
+    "@elliemae/ds-button": "2.3.0-alpha.3",
+    "@elliemae/ds-dropdownmenu": "2.3.0-alpha.3",
+    "@elliemae/ds-grid": "2.3.0-alpha.3",
+    "@elliemae/ds-icons": "2.3.0-alpha.3",
+    "@elliemae/ds-props-helpers": "2.3.0-alpha.3",
+    "@elliemae/ds-utilities": "2.3.0-alpha.3",
     "memoize-one": "~5.1.1",
     "react-desc": "~4.1.3"
   },