@sproutsocial/seeds-react-switch 1.0.1 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/index.js +10 -5
- package/dist/esm/index.js.map +1 -0
- package/dist/index.d.mts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +10 -5
- package/dist/index.js.map +1 -0
- package/package.json +14 -8
package/dist/esm/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// src/Switch.tsx
|
|
2
|
-
import
|
|
2
|
+
import "react";
|
|
3
3
|
import Icon from "@sproutsocial/seeds-react-icon";
|
|
4
4
|
|
|
5
5
|
// src/styles.ts
|
|
@@ -135,6 +135,7 @@ var StyledSwitchButton = styled.button`
|
|
|
135
135
|
`;
|
|
136
136
|
|
|
137
137
|
// src/Switch.tsx
|
|
138
|
+
import { jsx } from "react/jsx-runtime";
|
|
138
139
|
var Switch = ({
|
|
139
140
|
onClick,
|
|
140
141
|
loading = false,
|
|
@@ -147,7 +148,7 @@ var Switch = ({
|
|
|
147
148
|
onClick(e, !checked);
|
|
148
149
|
}
|
|
149
150
|
};
|
|
150
|
-
return /* @__PURE__ */
|
|
151
|
+
return /* @__PURE__ */ jsx(
|
|
151
152
|
StyledSwitchButton,
|
|
152
153
|
{
|
|
153
154
|
type: "button",
|
|
@@ -156,16 +157,20 @@ var Switch = ({
|
|
|
156
157
|
disabled,
|
|
157
158
|
onClick: handleClick,
|
|
158
159
|
className: loading ? "loading" : "",
|
|
159
|
-
...rest
|
|
160
|
-
|
|
161
|
-
|
|
160
|
+
...rest,
|
|
161
|
+
children: checked ? /* @__PURE__ */ jsx(Icon, { "aria-hidden": true, size: "mini", name: "check-solid" }) : null
|
|
162
|
+
}
|
|
162
163
|
);
|
|
163
164
|
};
|
|
164
165
|
var Switch_default = Switch;
|
|
165
166
|
|
|
167
|
+
// src/SwitchTypes.ts
|
|
168
|
+
import "react";
|
|
169
|
+
|
|
166
170
|
// src/index.ts
|
|
167
171
|
var src_default = Switch_default;
|
|
168
172
|
export {
|
|
169
173
|
Switch_default as Switch,
|
|
170
174
|
src_default as default
|
|
171
175
|
};
|
|
176
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/Switch.tsx","../../src/styles.ts","../../src/SwitchTypes.ts","../../src/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { StyledSwitchButton } from \"./styles\";\nimport type { TypeSwitchProps } from \"./SwitchTypes\";\n\n/**\n * @link https://seeds.sproutsocial.com/components/switch/\n *\n * Switch should always have an accessible label. Use aria-label, aria-labelledby or a `Label` component.\n * The accessible label should not change when the checked state changes.\n * The component uses role=\"switch\" and the `checked` prop will be used to set the aria-checked attribute.\n *\n * @see https://www.w3.org/WAI/ARIA/apg/patterns/switch/\n *\n * @example\n * <Switch checked={true} onClick={_onClick} aria-label=\"Switch Example\" />\n */\n\nconst Switch = ({\n onClick,\n loading = false,\n checked,\n disabled = false,\n ...rest\n}: TypeSwitchProps) => {\n const handleClick = (e: React.SyntheticEvent<HTMLButtonElement>) => {\n if (!disabled) {\n onClick(e, !checked);\n }\n };\n return (\n <StyledSwitchButton\n type=\"button\"\n role=\"switch\"\n aria-checked={checked}\n disabled={disabled}\n onClick={handleClick}\n className={loading ? \"loading\" : \"\"}\n {...rest}\n >\n {checked ? <Icon aria-hidden size=\"mini\" name=\"check-solid\" /> : null}\n </StyledSwitchButton>\n );\n};\n\nexport default Switch;\n","import styled, { keyframes } from \"styled-components\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport { color, layout, space } from \"styled-system\";\n\ninterface StyledSwitchButtonProps {\n qa?: object;\n}\n\nconst loadingKeyFrame = keyframes`\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledSwitchButton = styled.button<StyledSwitchButtonProps>`\n /* Base styles for Switch */\n position: relative;\n display: inline-flex;\n align-self: center;\n width: 40px;\n height: 24px;\n margin: 0;\n padding: ${({ theme }) => theme.space[100]} ${({ theme }) => theme.space[200]};\n vertical-align: middle;\n appearance: none;\n background-color: ${({ theme }) => theme.colors.form.background.base};\n border-radius: 16px;\n outline: none;\n cursor: pointer;\n transition: background-color ${({ theme }) => theme.duration.fast}\n ${({ theme }) => theme.easing.ease_inout};\n border: 1px solid ${({ theme }) => theme.colors.form.border.base};\n white-space: nowrap;\n overflow: hidden;\n\n /* Mixin for styled focus ring */\n &:focus {\n ${focusRing}\n }\n\n /* Base styles for circle element */\n &[aria-checked] {\n &::after {\n display: block;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n content: \"\";\n transition: transform ${({ theme }) => theme.duration.fast}\n ${({ theme }) => theme.easing.ease_inout};\n }\n &.loading {\n cursor: not-allowed;\n pointer-events: none;\n background-size: contain;\n background-color: ${({ theme }) => theme.colors.form.background.base};\n &::after {\n position: absolute;\n box-sizing: content-box;\n width: 8px;\n height: 8px;\n border-radius: ${({ theme }) => theme.radii.pill};\n border: 3px dotted ${({ theme }) => theme.colors.icon.base};\n background-color: transparent;\n animation: ${loadingKeyFrame} 2s linear infinite;\n }\n }\n }\n /* Checked State */\n &[aria-checked=\"true\"] {\n color: ${({ theme }) => theme.colors.text.body};\n text-align: left;\n border-color: ${({ theme }) => theme.colors.form.border.selected};\n background-color: ${({ theme }) => theme.colors.form.background.selected};\n .Icon {\n position: absolute;\n top: 50%;\n left: 4px;\n transform: translate(0, -50%);\n color: ${({ theme }) => theme.colors.icon.inverse};\n }\n &::after {\n background-color: ${({ theme }) => theme.colors.icon.inverse};\n opacity: 1;\n transform: translate(100%, 6%);\n }\n &.loading::after {\n top: 4px;\n right: 5px;\n }\n &:hover,\n &:focus {\n &::after {\n transform: translate(90%, 6%);\n }\n }\n }\n /* Unchecked State */\n &[aria-checked=\"false\"] {\n &::after {\n background-color: ${({ theme }) => theme.colors.icon.base};\n opacity: 0.64;\n transform: translate(0%, 6%);\n }\n &.loading::after {\n top: 4px;\n left: 5px;\n }\n &:hover,\n &:focus {\n &::after {\n transform: translate(10%, 6%);\n }\n }\n }\n\n /* Disabled State Styles */\n &:disabled {\n opacity: 0.4;\n pointer-events: none;\n cursor: not-allowed;\n &[aria-checked=\"true\"] {\n &:hover,\n &:focus {\n background-color: ${({ theme }) =>\n theme.colors.container.background.selected};\n }\n }\n }\n\n ${color}\n ${layout}\n ${space}\n`;\n","import * as React from \"react\";\nimport type { TypeStyledComponentsCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeColorSystemProps,\n TypeLayoutSystemProps,\n TypeSpaceSystemProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeSwitchProps\n extends Omit<React.ComponentPropsWithoutRef<\"button\">, \"color\" | \"onClick\">,\n TypeStyledComponentsCommonProps,\n TypeColorSystemProps,\n TypeLayoutSystemProps,\n TypeSpaceSystemProps {\n onClick: (\n e: React.SyntheticEvent<HTMLButtonElement>,\n checked: boolean\n ) => void;\n checked: boolean;\n loading?: boolean;\n disabled?: boolean;\n}\n","import Switch from \"./Switch\";\n\nexport default Switch;\nexport { Switch };\nexport * from \"./SwitchTypes\";\n"],"mappings":"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","names":[]}
|
package/dist/index.d.mts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
1
2
|
import * as React from 'react';
|
|
2
3
|
import { TypeStyledComponentsCommonProps, TypeColorSystemProps, TypeLayoutSystemProps, TypeSpaceSystemProps } from '@sproutsocial/seeds-react-system-props';
|
|
3
4
|
|
|
@@ -20,6 +21,6 @@ interface TypeSwitchProps extends Omit<React.ComponentPropsWithoutRef<"button">,
|
|
|
20
21
|
* @example
|
|
21
22
|
* <Switch checked={true} onClick={_onClick} aria-label="Switch Example" />
|
|
22
23
|
*/
|
|
23
|
-
declare const Switch: ({ onClick, loading, checked, disabled, ...rest }: TypeSwitchProps) =>
|
|
24
|
+
declare const Switch: ({ onClick, loading, checked, disabled, ...rest }: TypeSwitchProps) => react_jsx_runtime.JSX.Element;
|
|
24
25
|
|
|
25
26
|
export { Switch, type TypeSwitchProps, Switch as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
1
2
|
import * as React from 'react';
|
|
2
3
|
import { TypeStyledComponentsCommonProps, TypeColorSystemProps, TypeLayoutSystemProps, TypeSpaceSystemProps } from '@sproutsocial/seeds-react-system-props';
|
|
3
4
|
|
|
@@ -20,6 +21,6 @@ interface TypeSwitchProps extends Omit<React.ComponentPropsWithoutRef<"button">,
|
|
|
20
21
|
* @example
|
|
21
22
|
* <Switch checked={true} onClick={_onClick} aria-label="Switch Example" />
|
|
22
23
|
*/
|
|
23
|
-
declare const Switch: ({ onClick, loading, checked, disabled, ...rest }: TypeSwitchProps) =>
|
|
24
|
+
declare const Switch: ({ onClick, loading, checked, disabled, ...rest }: TypeSwitchProps) => react_jsx_runtime.JSX.Element;
|
|
24
25
|
|
|
25
26
|
export { Switch, type TypeSwitchProps, Switch as default };
|
package/dist/index.js
CHANGED
|
@@ -36,7 +36,7 @@ __export(src_exports, {
|
|
|
36
36
|
module.exports = __toCommonJS(src_exports);
|
|
37
37
|
|
|
38
38
|
// src/Switch.tsx
|
|
39
|
-
var React =
|
|
39
|
+
var React = require("react");
|
|
40
40
|
var import_seeds_react_icon = __toESM(require("@sproutsocial/seeds-react-icon"));
|
|
41
41
|
|
|
42
42
|
// src/styles.ts
|
|
@@ -172,6 +172,7 @@ var StyledSwitchButton = import_styled_components.default.button`
|
|
|
172
172
|
`;
|
|
173
173
|
|
|
174
174
|
// src/Switch.tsx
|
|
175
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
175
176
|
var Switch = ({
|
|
176
177
|
onClick,
|
|
177
178
|
loading = false,
|
|
@@ -184,7 +185,7 @@ var Switch = ({
|
|
|
184
185
|
onClick(e, !checked);
|
|
185
186
|
}
|
|
186
187
|
};
|
|
187
|
-
return /* @__PURE__ */
|
|
188
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
188
189
|
StyledSwitchButton,
|
|
189
190
|
{
|
|
190
191
|
type: "button",
|
|
@@ -193,16 +194,20 @@ var Switch = ({
|
|
|
193
194
|
disabled,
|
|
194
195
|
onClick: handleClick,
|
|
195
196
|
className: loading ? "loading" : "",
|
|
196
|
-
...rest
|
|
197
|
-
|
|
198
|
-
|
|
197
|
+
...rest,
|
|
198
|
+
children: checked ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_seeds_react_icon.default, { "aria-hidden": true, size: "mini", name: "check-solid" }) : null
|
|
199
|
+
}
|
|
199
200
|
);
|
|
200
201
|
};
|
|
201
202
|
var Switch_default = Switch;
|
|
202
203
|
|
|
204
|
+
// src/SwitchTypes.ts
|
|
205
|
+
var React2 = require("react");
|
|
206
|
+
|
|
203
207
|
// src/index.ts
|
|
204
208
|
var src_default = Switch_default;
|
|
205
209
|
// Annotate the CommonJS export names for ESM import in node:
|
|
206
210
|
0 && (module.exports = {
|
|
207
211
|
Switch
|
|
208
212
|
});
|
|
213
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/Switch.tsx","../src/styles.ts","../src/SwitchTypes.ts"],"sourcesContent":["import Switch from \"./Switch\";\n\nexport default Switch;\nexport { Switch };\nexport * from \"./SwitchTypes\";\n","import * as React from \"react\";\nimport Icon from \"@sproutsocial/seeds-react-icon\";\nimport { StyledSwitchButton } from \"./styles\";\nimport type { TypeSwitchProps } from \"./SwitchTypes\";\n\n/**\n * @link https://seeds.sproutsocial.com/components/switch/\n *\n * Switch should always have an accessible label. Use aria-label, aria-labelledby or a `Label` component.\n * The accessible label should not change when the checked state changes.\n * The component uses role=\"switch\" and the `checked` prop will be used to set the aria-checked attribute.\n *\n * @see https://www.w3.org/WAI/ARIA/apg/patterns/switch/\n *\n * @example\n * <Switch checked={true} onClick={_onClick} aria-label=\"Switch Example\" />\n */\n\nconst Switch = ({\n onClick,\n loading = false,\n checked,\n disabled = false,\n ...rest\n}: TypeSwitchProps) => {\n const handleClick = (e: React.SyntheticEvent<HTMLButtonElement>) => {\n if (!disabled) {\n onClick(e, !checked);\n }\n };\n return (\n <StyledSwitchButton\n type=\"button\"\n role=\"switch\"\n aria-checked={checked}\n disabled={disabled}\n onClick={handleClick}\n className={loading ? \"loading\" : \"\"}\n {...rest}\n >\n {checked ? <Icon aria-hidden size=\"mini\" name=\"check-solid\" /> : null}\n </StyledSwitchButton>\n );\n};\n\nexport default Switch;\n","import styled, { keyframes } from \"styled-components\";\nimport { focusRing } from \"@sproutsocial/seeds-react-mixins\";\nimport { color, layout, space } from \"styled-system\";\n\ninterface StyledSwitchButtonProps {\n qa?: object;\n}\n\nconst loadingKeyFrame = keyframes`\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n`;\n\nexport const StyledSwitchButton = styled.button<StyledSwitchButtonProps>`\n /* Base styles for Switch */\n position: relative;\n display: inline-flex;\n align-self: center;\n width: 40px;\n height: 24px;\n margin: 0;\n padding: ${({ theme }) => theme.space[100]} ${({ theme }) => theme.space[200]};\n vertical-align: middle;\n appearance: none;\n background-color: ${({ theme }) => theme.colors.form.background.base};\n border-radius: 16px;\n outline: none;\n cursor: pointer;\n transition: background-color ${({ theme }) => theme.duration.fast}\n ${({ theme }) => theme.easing.ease_inout};\n border: 1px solid ${({ theme }) => theme.colors.form.border.base};\n white-space: nowrap;\n overflow: hidden;\n\n /* Mixin for styled focus ring */\n &:focus {\n ${focusRing}\n }\n\n /* Base styles for circle element */\n &[aria-checked] {\n &::after {\n display: block;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n content: \"\";\n transition: transform ${({ theme }) => theme.duration.fast}\n ${({ theme }) => theme.easing.ease_inout};\n }\n &.loading {\n cursor: not-allowed;\n pointer-events: none;\n background-size: contain;\n background-color: ${({ theme }) => theme.colors.form.background.base};\n &::after {\n position: absolute;\n box-sizing: content-box;\n width: 8px;\n height: 8px;\n border-radius: ${({ theme }) => theme.radii.pill};\n border: 3px dotted ${({ theme }) => theme.colors.icon.base};\n background-color: transparent;\n animation: ${loadingKeyFrame} 2s linear infinite;\n }\n }\n }\n /* Checked State */\n &[aria-checked=\"true\"] {\n color: ${({ theme }) => theme.colors.text.body};\n text-align: left;\n border-color: ${({ theme }) => theme.colors.form.border.selected};\n background-color: ${({ theme }) => theme.colors.form.background.selected};\n .Icon {\n position: absolute;\n top: 50%;\n left: 4px;\n transform: translate(0, -50%);\n color: ${({ theme }) => theme.colors.icon.inverse};\n }\n &::after {\n background-color: ${({ theme }) => theme.colors.icon.inverse};\n opacity: 1;\n transform: translate(100%, 6%);\n }\n &.loading::after {\n top: 4px;\n right: 5px;\n }\n &:hover,\n &:focus {\n &::after {\n transform: translate(90%, 6%);\n }\n }\n }\n /* Unchecked State */\n &[aria-checked=\"false\"] {\n &::after {\n background-color: ${({ theme }) => theme.colors.icon.base};\n opacity: 0.64;\n transform: translate(0%, 6%);\n }\n &.loading::after {\n top: 4px;\n left: 5px;\n }\n &:hover,\n &:focus {\n &::after {\n transform: translate(10%, 6%);\n }\n }\n }\n\n /* Disabled State Styles */\n &:disabled {\n opacity: 0.4;\n pointer-events: none;\n cursor: not-allowed;\n &[aria-checked=\"true\"] {\n &:hover,\n &:focus {\n background-color: ${({ theme }) =>\n theme.colors.container.background.selected};\n }\n }\n }\n\n ${color}\n ${layout}\n ${space}\n`;\n","import * as React from \"react\";\nimport type { TypeStyledComponentsCommonProps } from \"@sproutsocial/seeds-react-system-props\";\nimport type {\n TypeColorSystemProps,\n TypeLayoutSystemProps,\n TypeSpaceSystemProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeSwitchProps\n extends Omit<React.ComponentPropsWithoutRef<\"button\">, \"color\" | \"onClick\">,\n TypeStyledComponentsCommonProps,\n TypeColorSystemProps,\n TypeLayoutSystemProps,\n TypeSpaceSystemProps {\n onClick: (\n e: React.SyntheticEvent<HTMLButtonElement>,\n checked: boolean\n ) => void;\n checked: boolean;\n loading?: boolean;\n disabled?: boolean;\n}\n"],"mappings":"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","names":["styled","Icon","React"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sproutsocial/seeds-react-switch",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Seeds React Switch",
|
|
5
5
|
"author": "Sprout Social, Inc.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -11,21 +11,27 @@
|
|
|
11
11
|
"dist"
|
|
12
12
|
],
|
|
13
13
|
"scripts": {
|
|
14
|
-
"build": "tsup"
|
|
14
|
+
"build": "tsup --dts",
|
|
15
|
+
"dev": "tsup --watch --dts",
|
|
16
|
+
"clean": "rm -rf .turbo dist",
|
|
17
|
+
"clean:modules": "rm -rf node_modules",
|
|
18
|
+
"typecheck": "tsc --noEmit"
|
|
15
19
|
},
|
|
16
20
|
"dependencies": {
|
|
17
21
|
"styled-system": "^5.1.5",
|
|
18
|
-
"@sproutsocial/seeds-react-mixins": "
|
|
19
|
-
"@sproutsocial/seeds-react-system-props": "
|
|
20
|
-
"@sproutsocial/seeds-react-icon": "
|
|
22
|
+
"@sproutsocial/seeds-react-mixins": "*",
|
|
23
|
+
"@sproutsocial/seeds-react-system-props": "*",
|
|
24
|
+
"@sproutsocial/seeds-react-icon": "*"
|
|
21
25
|
},
|
|
22
26
|
"devDependencies": {
|
|
23
|
-
"@types/react": "^
|
|
27
|
+
"@types/react": "^18.0.0",
|
|
24
28
|
"@types/styled-components": "^5.1.26",
|
|
25
29
|
"@sproutsocial/eslint-config-seeds": "*",
|
|
26
|
-
"react": "^
|
|
30
|
+
"react": "^18.0.0",
|
|
27
31
|
"styled-components": "^5.2.3",
|
|
28
|
-
"typescript": "^5.
|
|
32
|
+
"typescript": "^5.6.2",
|
|
33
|
+
"@sproutsocial/seeds-tsconfig": "*",
|
|
34
|
+
"tsup": "^8.0.2"
|
|
29
35
|
},
|
|
30
36
|
"peerDependencies": {
|
|
31
37
|
"styled-components": "^5.2.3"
|