Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@spectrum-css/pagination

Package Overview
Dependencies
Maintainers
0
Versions
164
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@spectrum-css/pagination - npm Package Compare versions

Comparing version 9.0.0-s2-foundations.12 to 9.0.0-s2-foundations.13

metadata/metadata.json

27

CHANGELOG.md
# 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 @@

18

package.json
{
"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

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc