first implementation of tamagui mobile pages
This commit is contained in:
354
.tamagui/tamaguistacks-components.config.cjs
Normal file
354
.tamagui/tamaguistacks-components.config.cjs
Normal file
@@ -0,0 +1,354 @@
|
||||
var __create = Object.create;
|
||||
var __defProp = Object.defineProperty;
|
||||
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
||||
var __getOwnPropNames = Object.getOwnPropertyNames;
|
||||
var __getProtoOf = Object.getPrototypeOf;
|
||||
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
||||
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
||||
var __export = (target, all) => {
|
||||
for (var name in all)
|
||||
__defProp(target, name, { get: all[name], enumerable: true });
|
||||
};
|
||||
var __copyProps = (to, from, except, desc) => {
|
||||
if (from && typeof from === "object" || typeof from === "function") {
|
||||
for (let key of __getOwnPropNames(from))
|
||||
if (!__hasOwnProp.call(to, key) && key !== except)
|
||||
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
||||
}
|
||||
return to;
|
||||
};
|
||||
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
||||
// If the importer is in node compatibility mode or this is not an ESM
|
||||
// file that has been converted to a CommonJS file using a Babel-
|
||||
// compatible transform (i.e. "__esModule" has not been set), then set
|
||||
// "default" to the CommonJS "module.exports" for node compatibility.
|
||||
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
||||
mod
|
||||
));
|
||||
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/index.mjs
|
||||
var esm_exports = {};
|
||||
__export(esm_exports, {
|
||||
ButtonNestingContext: () => ButtonNestingContext,
|
||||
SizableStack: () => SizableStack,
|
||||
ThemeableStack: () => ThemeableStack,
|
||||
XStack: () => XStack,
|
||||
YStack: () => YStack,
|
||||
ZStack: () => ZStack,
|
||||
fullscreenStyle: () => fullscreenStyle,
|
||||
themeableVariants: () => themeableVariants
|
||||
});
|
||||
module.exports = __toCommonJS(esm_exports);
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/Stacks.mjs
|
||||
var import_core2 = require("@tamagui/core");
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/getElevation.mjs
|
||||
var import_core = require("@tamagui/core");
|
||||
var getElevation = /* @__PURE__ */ __name((size, extras) => {
|
||||
if (!size) return;
|
||||
const {
|
||||
tokens
|
||||
} = extras, token = tokens.size[size], sizeNum = (0, import_core.isVariable)(token) ? +token.val : size;
|
||||
return getSizedElevation(sizeNum, extras);
|
||||
}, "getElevation");
|
||||
var getSizedElevation = /* @__PURE__ */ __name((val, {
|
||||
theme,
|
||||
tokens
|
||||
}) => {
|
||||
let num = 0;
|
||||
if (val === true) {
|
||||
const val2 = (0, import_core.getVariableValue)(tokens.size.true);
|
||||
typeof val2 == "number" ? num = val2 : num = 10;
|
||||
} else num = +val;
|
||||
if (num === 0) return;
|
||||
const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)];
|
||||
return {
|
||||
shadowColor: theme.shadowColor,
|
||||
shadowRadius,
|
||||
shadowOffset: {
|
||||
height,
|
||||
width: 0
|
||||
},
|
||||
...import_core.isAndroid ? {
|
||||
elevationAndroid: 2 * height
|
||||
} : {}
|
||||
};
|
||||
}, "getSizedElevation");
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/Stacks.mjs
|
||||
var fullscreenStyle = {
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0
|
||||
};
|
||||
var getInset = /* @__PURE__ */ __name((val) => val && typeof val == "object" ? val : {
|
||||
top: val,
|
||||
left: val,
|
||||
bottom: val,
|
||||
right: val
|
||||
}, "getInset");
|
||||
var variants = {
|
||||
fullscreen: {
|
||||
true: fullscreenStyle
|
||||
},
|
||||
elevation: {
|
||||
"...size": getElevation,
|
||||
":number": getElevation
|
||||
},
|
||||
inset: getInset
|
||||
};
|
||||
var YStack = (0, import_core2.styled)(import_core2.View, {
|
||||
flexDirection: "column",
|
||||
variants
|
||||
});
|
||||
YStack.displayName = "YStack";
|
||||
var XStack = (0, import_core2.styled)(import_core2.View, {
|
||||
flexDirection: "row",
|
||||
variants
|
||||
});
|
||||
XStack.displayName = "XStack";
|
||||
var ZStack = (0, import_core2.styled)(YStack, {
|
||||
position: "relative"
|
||||
}, {
|
||||
neverFlatten: true,
|
||||
isZStack: true
|
||||
});
|
||||
ZStack.displayName = "ZStack";
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/SizableStack.mjs
|
||||
var import_core3 = require("@tamagui/core");
|
||||
|
||||
// node_modules/@tamagui/get-token/dist/esm/index.mjs
|
||||
var import_web = require("@tamagui/core");
|
||||
var defaultOptions = {
|
||||
shift: 0,
|
||||
bounds: [0]
|
||||
};
|
||||
var getSpace = /* @__PURE__ */ __name((space, options) => getTokenRelative("space", space, options), "getSpace");
|
||||
var cacheVariables = {};
|
||||
var cacheWholeVariables = {};
|
||||
var cacheKeys = {};
|
||||
var cacheWholeKeys = {};
|
||||
var stepTokenUpOrDown = /* @__PURE__ */ __name((type, current, options = defaultOptions) => {
|
||||
const tokens = (0, import_web.getTokens)({
|
||||
prefixed: true
|
||||
})[type];
|
||||
if (!(type in cacheVariables)) {
|
||||
cacheKeys[type] = [], cacheVariables[type] = [], cacheWholeKeys[type] = [], cacheWholeVariables[type] = [];
|
||||
const sorted = Object.keys(tokens).map((k) => tokens[k]).sort((a, b) => a.val - b.val);
|
||||
for (const token of sorted) cacheKeys[type].push(token.key), cacheVariables[type].push(token);
|
||||
const sortedExcludingHalfSteps = sorted.filter((x) => !x.key.endsWith(".5"));
|
||||
for (const token of sortedExcludingHalfSteps) cacheWholeKeys[type].push(token.key), cacheWholeVariables[type].push(token);
|
||||
}
|
||||
const isString = typeof current == "string", tokensOrdered = (options.excludeHalfSteps ? isString ? cacheWholeKeys : cacheWholeVariables : isString ? cacheKeys : cacheVariables)[type], min = options.bounds?.[0] ?? 0, max = options.bounds?.[1] ?? tokensOrdered.length - 1, currentIndex = tokensOrdered.indexOf(current);
|
||||
let shift = options.shift || 0;
|
||||
shift && (current === "$true" || (0, import_web.isVariable)(current) && current.name === "true") && (shift += shift > 0 ? 1 : -1);
|
||||
const index = Math.min(max, Math.max(min, currentIndex + shift)), found = tokensOrdered[index];
|
||||
return (typeof found == "string" ? tokens[found] : found) || tokens.$true;
|
||||
}, "stepTokenUpOrDown");
|
||||
var getTokenRelative = stepTokenUpOrDown;
|
||||
|
||||
// node_modules/@tamagui/get-button-sized/dist/esm/index.mjs
|
||||
var getButtonSized = /* @__PURE__ */ __name((val, {
|
||||
tokens,
|
||||
props
|
||||
}) => {
|
||||
if (!val || props.circular) return;
|
||||
if (typeof val == "number") return {
|
||||
paddingHorizontal: val * 0.25,
|
||||
height: val,
|
||||
borderRadius: props.circular ? 1e5 : val * 0.2
|
||||
};
|
||||
const xSize = getSpace(val), radiusToken = tokens.radius[val] ?? tokens.radius.$true;
|
||||
return {
|
||||
paddingHorizontal: xSize,
|
||||
height: val,
|
||||
borderRadius: props.circular ? 1e5 : radiusToken
|
||||
};
|
||||
}, "getButtonSized");
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/variants.mjs
|
||||
var elevate = {
|
||||
true: /* @__PURE__ */ __name((_, extras) => getElevation(extras.props.size, extras), "true")
|
||||
};
|
||||
var bordered = /* @__PURE__ */ __name((val, {
|
||||
props
|
||||
}) => ({
|
||||
// TODO size it with size in '...size'
|
||||
borderWidth: typeof val == "number" ? val : 1,
|
||||
borderColor: "$borderColor",
|
||||
...props.hoverTheme && {
|
||||
hoverStyle: {
|
||||
borderColor: "$borderColorHover"
|
||||
}
|
||||
},
|
||||
...props.pressTheme && {
|
||||
pressStyle: {
|
||||
borderColor: "$borderColorPress"
|
||||
}
|
||||
},
|
||||
...props.focusTheme && {
|
||||
focusStyle: {
|
||||
borderColor: "$borderColorFocus"
|
||||
}
|
||||
}
|
||||
}), "bordered");
|
||||
var padded = {
|
||||
true: /* @__PURE__ */ __name((_, extras) => {
|
||||
const {
|
||||
tokens,
|
||||
props
|
||||
} = extras;
|
||||
return {
|
||||
padding: tokens.space[props.size] || tokens.space.$true
|
||||
};
|
||||
}, "true")
|
||||
};
|
||||
var radiused = {
|
||||
true: /* @__PURE__ */ __name((_, extras) => {
|
||||
const {
|
||||
tokens,
|
||||
props
|
||||
} = extras;
|
||||
return {
|
||||
borderRadius: tokens.radius[props.size] || tokens.radius.$true
|
||||
};
|
||||
}, "true")
|
||||
};
|
||||
var circularStyle = {
|
||||
borderRadius: 1e5,
|
||||
padding: 0
|
||||
};
|
||||
var circular = {
|
||||
true: /* @__PURE__ */ __name((_, {
|
||||
props,
|
||||
tokens
|
||||
}) => {
|
||||
if (!("size" in props)) return circularStyle;
|
||||
const size = typeof props.size == "number" ? props.size : tokens.size[props.size];
|
||||
return {
|
||||
...circularStyle,
|
||||
width: size,
|
||||
height: size,
|
||||
maxWidth: size,
|
||||
maxHeight: size,
|
||||
minWidth: size,
|
||||
minHeight: size
|
||||
};
|
||||
}, "true")
|
||||
};
|
||||
var hoverTheme = {
|
||||
true: {
|
||||
hoverStyle: {
|
||||
backgroundColor: "$backgroundHover",
|
||||
borderColor: "$borderColorHover"
|
||||
}
|
||||
},
|
||||
false: {}
|
||||
};
|
||||
var pressTheme = {
|
||||
true: {
|
||||
cursor: "pointer",
|
||||
pressStyle: {
|
||||
backgroundColor: "$backgroundPress",
|
||||
borderColor: "$borderColorPress"
|
||||
}
|
||||
},
|
||||
false: {}
|
||||
};
|
||||
var focusTheme = {
|
||||
true: {
|
||||
focusStyle: {
|
||||
backgroundColor: "$backgroundFocus",
|
||||
borderColor: "$borderColorFocus"
|
||||
}
|
||||
},
|
||||
false: {}
|
||||
};
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/SizableStack.mjs
|
||||
var SizableStack = (0, import_core3.styled)(XStack, {
|
||||
name: "SizableStack",
|
||||
variants: {
|
||||
unstyled: {
|
||||
true: {
|
||||
hoverTheme: false,
|
||||
pressTheme: false,
|
||||
focusTheme: false,
|
||||
elevate: false,
|
||||
bordered: false
|
||||
}
|
||||
},
|
||||
hoverTheme,
|
||||
pressTheme,
|
||||
focusTheme,
|
||||
circular,
|
||||
elevate,
|
||||
bordered,
|
||||
size: {
|
||||
"...size": /* @__PURE__ */ __name((val, extras) => getButtonSized(val, extras), "...size")
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/ThemeableStack.mjs
|
||||
var import_core4 = require("@tamagui/core");
|
||||
var chromelessStyle = {
|
||||
backgroundColor: "transparent",
|
||||
borderColor: "transparent",
|
||||
shadowColor: "transparent",
|
||||
hoverStyle: {
|
||||
borderColor: "transparent"
|
||||
}
|
||||
};
|
||||
var themeableVariants = {
|
||||
backgrounded: {
|
||||
true: {
|
||||
backgroundColor: "$background"
|
||||
}
|
||||
},
|
||||
radiused,
|
||||
hoverTheme,
|
||||
pressTheme,
|
||||
focusTheme,
|
||||
circular,
|
||||
padded,
|
||||
elevate,
|
||||
bordered,
|
||||
transparent: {
|
||||
true: {
|
||||
backgroundColor: "transparent"
|
||||
}
|
||||
},
|
||||
chromeless: {
|
||||
true: chromelessStyle,
|
||||
all: {
|
||||
...chromelessStyle,
|
||||
hoverStyle: chromelessStyle,
|
||||
pressStyle: chromelessStyle,
|
||||
focusStyle: chromelessStyle
|
||||
}
|
||||
}
|
||||
};
|
||||
var ThemeableStack = (0, import_core4.styled)(YStack, {
|
||||
variants: themeableVariants
|
||||
});
|
||||
|
||||
// node_modules/@tamagui/stacks/dist/esm/NestingContext.mjs
|
||||
var import_react = __toESM(require("react"), 1);
|
||||
var ButtonNestingContext = import_react.default.createContext(false);
|
||||
// Annotate the CommonJS export names for ESM import in node:
|
||||
0 && (module.exports = {
|
||||
ButtonNestingContext,
|
||||
SizableStack,
|
||||
ThemeableStack,
|
||||
XStack,
|
||||
YStack,
|
||||
ZStack,
|
||||
fullscreenStyle,
|
||||
themeableVariants
|
||||
});
|
||||
Reference in New Issue
Block a user