@spectrum-css/pagination
Advanced tools
Comparing version 9.0.0-s2-foundations.12 to 9.0.0-s2-foundations.13
# Change Log | ||
## 9.0.0-s2-foundations.13 | ||
### Major Changes | ||
- [#2786](https://github.com/adobe/spectrum-css/pull/2786) [`11a0032`](https://github.com/adobe/spectrum-css/commit/11a00323addbf28b9430d27d9cbc5f30bc851b65) Thanks [@pfulton](https://github.com/pfulton)! - Bug fixes to S1 & Express theming across all components | ||
### Patch Changes | ||
- Updated dependencies [[`11a0032`](https://github.com/adobe/spectrum-css/commit/11a00323addbf28b9430d27d9cbc5f30bc851b65)]: | ||
- @spectrum-css/actionbutton@7.0.0-s2-foundations.18 | ||
- @spectrum-css/textfield@8.0.0-s2-foundations.14 | ||
- @spectrum-css/button@14.0.0-s2-foundations.15 | ||
- @spectrum-css/icon@8.0.0-s2-foundations.15 | ||
- @spectrum-css/tokens@15.0.0-s2-foundations.21 | ||
## 9.0.0-s2-foundations.12 | ||
@@ -200,2 +215,14 @@ | ||
## 8.1.2 | ||
### Patch Changes | ||
- [#3045](https://github.com/adobe/spectrum-css/pull/3045) [`5d6e03f`](https://github.com/adobe/spectrum-css/commit/5d6e03f30891f9171f1a600b06d534ee85719277) Thanks [@castastrophe](https://github.com/castastrophe)! - Improve changeset suggestions by using exports instead of files in component packages | ||
- Updated dependencies [[`5d6e03f`](https://github.com/adobe/spectrum-css/commit/5d6e03f30891f9171f1a600b06d534ee85719277)]: | ||
- @spectrum-css/actionbutton@6.1.2 | ||
- @spectrum-css/textfield@7.2.1 | ||
- @spectrum-css/button@13.1.2 | ||
- @spectrum-css/icon@7.1.3 | ||
## 8.1.1 | ||
@@ -202,0 +229,0 @@ |
{ | ||
"name": "@spectrum-css/pagination", | ||
"version": "9.0.0-s2-foundations.12", | ||
"version": "9.0.0-s2-foundations.13", | ||
"description": "The Spectrum CSS Pagination component", | ||
@@ -16,3 +16,12 @@ "license": "Apache-2.0", | ||
}, | ||
"main": "dist/index.css", | ||
"exports": { | ||
".": "./dist/index.css", | ||
"./CHANGELOG.md": "./CHANGELOG.md", | ||
"./index-*.css": "./dist/index-*.css", | ||
"./index.css": "./dist/index.css", | ||
"./metadata.json": "./metadata/metadata.json", | ||
"./metadata/*": "./metadata/*", | ||
"./package.json": "./package.json", | ||
"./stories/*": "./stories/*" | ||
}, | ||
"files": [ | ||
@@ -22,5 +31,6 @@ "dist/*", | ||
"package.json", | ||
"stories/template.js", | ||
"metadata/mods.md" | ||
"stories/*", | ||
"metadata/*" | ||
], | ||
"main": "dist/index.css", | ||
"peerDependencies": { | ||
@@ -27,0 +37,0 @@ "@spectrum-css/actionbutton": ">=6", |
@@ -7,7 +7,7 @@ import { Template as ActionButton } from "@spectrum-css/actionbutton/stories/template.js"; | ||
import { repeat } from "lit/directives/repeat.js"; | ||
import { styleMap } from "lit/directives/style-map.js"; | ||
import "../index.css"; | ||
import "../themes/spectrum.css"; | ||
/* Must be imported last */ | ||
import "../themes/express.css"; | ||
import "../themes/spectrum.css"; | ||
@@ -19,38 +19,36 @@ export const Template = ({ | ||
variant, | ||
items, | ||
items | ||
} = {}, context = {}) => { | ||
if (variant === "explicit") { | ||
return html` | ||
<nav | ||
class=${classMap({ | ||
[rootClass]: true, | ||
[`${rootClass}--explicit`]: true, | ||
...customClasses.reduce((a, c) => ({ ...a, [c]: true }), {}), | ||
})} | ||
> | ||
${ActionButton({ | ||
size, | ||
isQuiet: true, | ||
iconSet: "ui", | ||
iconName: "ChevronLeft", | ||
customClasses: [`${rootClass}-prevButton`], | ||
}, context)} | ||
${Textfield({ | ||
size, | ||
value: "1", | ||
customClasses: [`${rootClass}-textfield`], | ||
}, context)} | ||
<span class="${rootClass}-counter">of 89 pages</span> | ||
${ActionButton({ | ||
size, | ||
isQuiet: true, | ||
iconSet: "ui", | ||
iconName: "ChevronRight", | ||
customClasses: [`${rootClass}-nextButton`], | ||
}, context)} | ||
</nav> | ||
`; | ||
} | ||
const explicitVariant = html` | ||
<nav | ||
class=${classMap({ | ||
[rootClass]: true, | ||
[`${rootClass}--explicit`]: true, | ||
...customClasses.reduce((a, c) => ({ ...a, [c]: true }), {}), | ||
})} | ||
> | ||
${ActionButton({ | ||
size, | ||
isQuiet: true, | ||
iconSet: "ui", | ||
iconName: "ChevronLeft", | ||
customClasses: [`${rootClass}-prevButton`], | ||
}, context)} | ||
${Textfield({ | ||
size, | ||
value: "1", | ||
customClasses: [`${rootClass}-textfield`], | ||
}, context)} | ||
<span class="${rootClass}-counter">of 89 pages</span> | ||
${ActionButton({ | ||
size, | ||
isQuiet: true, | ||
iconSet: "ui", | ||
iconName: "ChevronRight", | ||
customClasses: [`${rootClass}-nextButton`], | ||
}, context)} | ||
</nav> | ||
`; | ||
return html` | ||
const listingVariant = html` | ||
<nav | ||
@@ -95,27 +93,8 @@ class=${classMap({ | ||
`; | ||
}; | ||
export const PaginationGroup = (args, context) => { | ||
return html` | ||
<div style=${styleMap({ | ||
"display": window.isChromatic() ? "none" : undefined, | ||
})}> | ||
${Template(args, context)} | ||
</div> | ||
<div style=${styleMap({ | ||
"display": window.isChromatic() ? "flex" : "none", | ||
"flex-direction": "column", | ||
"gap": "32px", | ||
})}> | ||
${Template(args, context)} | ||
${Template({ | ||
...args, | ||
variant: "explicit", | ||
}, context)} | ||
${Template({ | ||
...args, | ||
variant: "button", | ||
}, context)} | ||
</div> | ||
`; | ||
if (variant === "explicit") { | ||
return explicitVariant; | ||
} | ||
return listingVariant; | ||
}; |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
71592
16
422